.main-width[data-v-438e2df5]{height:400px;width:400px}ul[data-v-438e2df5]{list-style:none;text-align:center;width:100%}li[data-v-438e2df5]{display:inline-block}ul a[data-v-438e2df5]{color:#000;float:left;height:400px;overflow:hidden;position:relative;text-decoration:none;width:100%}ul a img[data-v-438e2df5]{transition:filter .3s ease,padding .3s ease}ul a img[data-v-438e2df5],ul a:hover img[data-v-438e2df5]{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}ul a:hover img[data-v-438e2df5]{--tw-grayscale:grayscale(0%)}ul a:focus strong[data-v-438e2df5]{animation:down-438e2df5 .3s ease forwards}b[data-v-438e2df5]{cursor:pointer;display:block;height:400px;position:absolute;transform:rotate(45deg);width:100%;z-index:2}b[data-v-438e2df5]:first-of-type{left:0;top:-75%}b[data-v-438e2df5]:nth-of-type(2){bottom:-75%;left:0}b[data-v-438e2df5]:nth-of-type(3){left:-75%;top:0}b[data-v-438e2df5]:nth-of-type(4){right:-75%;top:0}b[data-v-438e2df5]:hover{inset:0;transform:rotate(0);z-index:3}strong[data-v-438e2df5]{background:#fff;display:table;height:360px;margin:20px;opacity:0;position:absolute;top:0;transition:all .5s ease;width:360px}strong span[data-v-438e2df5]{align-items:center;color:#000;display:flex;height:100%;justify-content:center;padding:20px;width:100%}b:first-of-type:hover~strong[data-v-438e2df5]{animation:down-438e2df5 .3s ease forwards}@keyframes down-438e2df5{0%{transform:translateY(-400px)}to{opacity:1;transform:translateY(0)}}b:nth-of-type(2):hover~strong[data-v-438e2df5]{animation:up-438e2df5 .3s ease forwards}@keyframes up-438e2df5{0%{transform:translateY(400px)}to{opacity:1;transform:translateY(0)}}b:nth-of-type(3):hover~strong[data-v-438e2df5]{animation:left-438e2df5 .3s ease forwards;top:0}@keyframes left-438e2df5{0%{transform:translate(-400px)}to{opacity:1;transform:translate(0)}}b:nth-of-type(4):hover~strong[data-v-438e2df5]{animation:right-438e2df5 .3s ease forwards;left:auto;right:0;top:0}@keyframes right-438e2df5{0%{transform:translate(400px)}to{opacity:1;transform:translate(0)}}@media screen and (max-width:440px){.main-width[data-v-438e2df5]{width:320px}.main-width[data-v-438e2df5],b[data-v-438e2df5],ul a[data-v-438e2df5]{height:320px}strong[data-v-438e2df5]{height:280px;width:280px}}@media screen and (max-width:360px){.main-width[data-v-438e2df5]{width:280px}.main-width[data-v-438e2df5],b[data-v-438e2df5],ul a[data-v-438e2df5]{height:280px}strong[data-v-438e2df5]{height:240px;width:240px}}