@font-face{font-family:"Lexend";font-weight:100;font-display:swap;src:url("/fonts/lexend/Thin.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:"Lexend";font-weight:200;font-display:swap;src:url("/fonts/lexend/ExtraLight.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:"Lexend";font-weight:300;font-display:swap;src:url("/fonts/lexend/Light.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:"Lexend";font-weight:400;font-display:swap;src:url("/fonts/lexend/Regular.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:"Lexend";font-weight:500;font-display:swap;src:url("/fonts/lexend/Medium.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:"Lexend";font-weight:600;font-display:swap;src:url("/fonts/lexend/SemiBold.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:"Lexend";font-weight:700;font-display:swap;src:url("/fonts/lexend/Bold.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:"Lexend";font-weight:800;font-display:swap;src:url("/fonts/lexend/ExtraBold.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:"Lexend";font-weight:900;font-display:swap;src:url("/fonts/lexend/Black.woff2") format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{color-scheme:light dark;--background-color: light-dark(#fff, #151718);--primary-text-color: light-dark(#151718, #eee)}.light{color-scheme:light}.dark{color-scheme:dark}.flex{display:flex}.flex-left,.flex-center,flex-right{gap:.5em}body{margin:0;font-family:Lexend;font-size:1rem;color:var(--primary-text-color);background-color:var(--background-color);min-height:100svh;display:grid;grid-template-columns:1fr min(47rem,90%) 1fr;grid-template-rows:auto 1fr auto;grid-row-gap:.625rem}body>*{grid-column:2}.buttons-container>a{image-rendering:pixelated;text-decoration:none;display:inline-block;height:33px}.buttons-container>a>img{transition:transform .15s ease-out;pointer-events:none}.buttons-container>a:hover>img,.buttons-container>a:active>img{transform:scale(2.5)}hr.wavy{margin:2em 0;height:6px;background-color:var(--primary-text-color);--_g: #0000 calc(99% - 2px), #000 calc(101% - 2px) 99%, #0000 101%;mask:radial-gradient(9.4852813742px at left 50% bottom calc(-1 * 6px), var(--_g)) calc(50% - 2 * 6px) calc(50% - 6px / 2 - 2px / 2)/calc(4 * 6px) calc(6px + 2px) repeat-x,radial-gradient(9.4852813742px at left 50% top calc(-1 * 6px), var(--_g)) 50% calc(50% + 6px / 2 + 2px / 2)/calc(4 * 6px) calc(6px + 2px) repeat-x}hr.wavy.small{margin:.6em 0}#nav-bar{display:flex;align-items:center;justify-content:center;justify-content:space-between}a.button{display:flex;flex-direction:column;justify-content:center;align-items:center;cursor:pointer;padding:0;width:6em;height:6em;position:relative;text-decoration:none}a.button::before{content:"";position:absolute;width:100%;height:100%;top:0;left:0;background-position:center;background-size:100%;background-repeat:no-repeat;transition:transform .2s;pointer-events:none}a.button>svg{width:35%;height:35%;transition:transform .2s}a.button:hover>svg{transform:scale(1.2)}a.button:hover>.btn-title{margin-top:0;opacity:1}a.button:active>svg{transform:scale(1)}a.button:visited{color:var(--primary-text-color)}a.button>.btn-title{transition:margin-top .2s,opacity .2s;color:var(--primary-text-color);font-size:.8em;outline:0;margin-top:-1.5em;opacity:0}a.button:nth-child(1):hover::before{transform:rotate(45deg)}a.button:nth-child(1)::before,a.button:nth-child(1):active::before{background-image:url("/buttons/square2.svg");transform:rotate(0deg)}a.button:nth-child(2):hover::before{transform:rotate(405deg)}a.button:nth-child(2)::before,a.button:nth-child(2):active::before{background-image:url("/buttons/square3.svg");transform:rotate(360deg)}a.button:nth-child(3):hover::before{transform:rotate(45deg)}a.button:nth-child(3)::before,a.button:nth-child(3):active::before{background-image:url("/buttons/square0.svg");transform:rotate(0deg)}a.button:nth-child(4):hover::before{transform:rotate(45deg)}a.button:nth-child(4)::before,a.button:nth-child(4):active::before{background-image:url("/buttons/square6.svg");transform:rotate(0deg)}a.button:nth-child(5):hover::before{transform:rotate(315deg)}a.button:nth-child(5)::before,a.button:nth-child(5):active::before{background-image:url("/buttons/square3.svg");transform:rotate(270deg)}a.button:nth-child(6):hover::before{transform:rotate(225deg)}a.button:nth-child(6)::before,a.button:nth-child(6):active::before{background-image:url("/buttons/square2.svg");transform:rotate(180deg)}a.button:nth-child(7):hover::before{transform:rotate(45deg)}a.button:nth-child(7)::before,a.button:nth-child(7):active::before{background-image:url("/buttons/square9.svg");transform:rotate(0deg)}a.button:nth-child(8):hover::before{transform:rotate(225deg)}a.button:nth-child(8)::before,a.button:nth-child(8):active::before{background-image:url("/buttons/square9.svg");transform:rotate(180deg)}a.button:nth-child(9):hover::before{transform:rotate(135deg)}a.button:nth-child(9)::before,a.button:nth-child(9):active::before{background-image:url("/buttons/square3.svg");transform:rotate(90deg)}a.button:nth-child(10):hover::before{transform:rotate(405deg)}a.button:nth-child(10)::before,a.button:nth-child(10):active::before{background-image:url("/buttons/square9.svg");transform:rotate(360deg)}.display{display:grid;grid-template-columns:repeat(auto-fill, minmax(12.2em, 1fr));grid-row-gap:1.5em}.display>.elem{width:13em;height:18em;box-sizing:border-box;padding:1.4em 1.4em;position:relative}.display>.elem::before{content:"";position:absolute;width:100%;height:100%;top:0;left:0;background-position:center;background-size:100%;background-repeat:no-repeat;transition:transform .2s;pointer-events:none}.display>.elem:hover{transform:scale(1.05);transition:transform .2s ease-out}.display>.elem>img{width:100%;height:auto}.display>.elem>header{font-weight:bold;font-size:1.2rem;text-align:center}.display>.elem:nth-child(1)::before,.display>.elem:nth-child(1):active::before{background-image:url("/rectangle/rect6.svg");transform:rotate(0deg)}.display>.elem:nth-child(2)::before,.display>.elem:nth-child(2):active::before{background-image:url("/rectangle/rect0.svg");transform:rotate(180deg)}.display>.elem:nth-child(3)::before,.display>.elem:nth-child(3):active::before{background-image:url("/rectangle/rect8.svg");transform:rotate(0deg)}.display>.elem:nth-child(4)::before,.display>.elem:nth-child(4):active::before{background-image:url("/rectangle/rect9.svg");transform:rotate(0deg)}.display>.elem:nth-child(5)::before,.display>.elem:nth-child(5):active::before{background-image:url("/rectangle/rect7.svg");transform:rotate(180deg)}.display>.elem:nth-child(6)::before,.display>.elem:nth-child(6):active::before{background-image:url("/rectangle/rect8.svg");transform:rotate(0deg)}.display>.elem:nth-child(7)::before,.display>.elem:nth-child(7):active::before{background-image:url("/rectangle/rect2.svg");transform:rotate(0deg)}.display>.elem:nth-child(8)::before,.display>.elem:nth-child(8):active::before{background-image:url("/rectangle/rect2.svg");transform:rotate(360deg)}.display>.elem:nth-child(9)::before,.display>.elem:nth-child(9):active::before{background-image:url("/rectangle/rect6.svg");transform:rotate(360deg)}.display>.elem:nth-child(10)::before,.display>.elem:nth-child(10):active::before{background-image:url("/rectangle/rect5.svg");transform:rotate(180deg)}