.menu-main{position:fixed;top:0;left:0;width:100dvw;z-index:2;font-weight:500;font-size:1rem;pointer-events:none;letter-spacing:1px;mix-blend-mode:difference}.menu-item{height:25px;cursor:pointer;pointer-events:auto;position:fixed;display:flex;align-items:center;transition:transform .5s cubic-bezier(.37,.08,.17,1.47),margin-left .5s cubic-bezier(.37,.08,.17,1.47),font-size .5s cubic-bezier(.37,.08,.17,1.47)}.menu-item:hover{color:var(--font-color-hover)}.menu-item-as-title{font-size:2vw;color:var(--font-color-hover);margin-left:20px}.menu-item-about{transform:translate3d(2rem,-100px,0)!important}.menu-scenes .menu-item:nth-child(1){transform:translate3d(2rem,25px,0)}.menu-scenes .menu-item:nth-child(2){transform:translate3d(2rem,50px,0)}.menu-scenes .menu-item:nth-child(3){transform:translate3d(2rem,75px,0)}.menu-scenes .menu-item:nth-child(4){transform:translate3d(2rem,100px,0)}#menu-about{transform:translate3d(94vw,25px,0)}#menu-hide{transform:translate3d(83vw,25px,0);width:15vw;text-align:right;display:block}#menu-about.menu-about-hidden{transform:translate3d(83vw,-25px,0)}@media (max-width : 780px){.menu-main{font-size:1rem}.menu-scenes>.menu-item:nth-child(1){transform:translate3d(.5rem,.5rem,0)}.menu-scenes .menu-item:nth-child(2){transform:translate3d(.5rem,2rem,0)}.menu-scenes .menu-item:nth-child(3){transform:translate3d(.5rem,3.5rem,0)}.menu-scenes .menu-item:nth-child(4){transform:translate3d(.5rem,5rem,0)}#menu-about{transform:translate3d(83vw,.5rem,0)}.menu-item-about{transform:translate3d(.5rem,-2rem,0)!important}#menu-about.menu-about-hidden{transform:translate3d(83vw,-2rem,0)}.menu-item-as-title{font-size:5.5vw;color:var(--font-color-hover);margin-left:20px}}.canvas{width:100vw;height:var(--app-height);transform-style:preserve-3d;position:relative;top:0;left:0;pointer-events:none;perspective:500px}.container3d{width:var(--app-width);height:var(--app-height);position:relative;top:0;display:flex;justify-content:center;align-items:center;transform-style:preserve-3d;transition:transform var(--time) ease;pointer-events:none}.scene{width:var(--app-width);height:var(--app-height);position:absolute;transform-style:preserve-3d;display:flex;justify-content:center;align-items:center;align-content:center}.project-iframe-container{height:100dvh;position:absolute;right:5vw;bottom:0;transition:width var(--time) ease;animation:appear var(--time) ease}iframe{width:100%;height:100%;background-color:#fff;pointer-events:auto}.project-iframe-show-page{width:90vw}.project-iframe-show-info{width:50vw}@media (max-width: 780px){.project-iframe-container{height:95dvh;height:93dvh;width:100dvh;right:0;bottom:0;transition:bottom var(--time) ease}.project-iframe-show-page{width:100vw}.project-iframe-show-info{width:100vw;bottom:-30dvh}}@keyframes appear{0%{opacity:0}to{opacity:1}}.project{width:var(--app-width);height:var(--app-height);transform-style:preserve-3d;position:absolute;cursor:none;pointer-events:none;background-color:#fff}.project--empty{cursor:none;pointer-events:none}.project-miniature{width:var(--app-width);height:var(--app-height);position:absolute;top:0;left:0;background-position:center;background-size:cover;background-repeat:no-repeat;pointer-events:auto;cursor:pointer}.miniature-hidden{visibility:hidden}.miniature-appear{animation:appear var(--time) ease}.miniature-disappear{animation:disappear var(--time) forwards}@keyframes disappear{0%{opacity:1;visibility:visible}to{opacity:0;visibility:hidden}}.project-menu{position:absolute;width:100vw;height:100dvh;display:flex;justify-content:space-between;color:var(--font-color-project);transition:margin-top 1s ease}.project-menu-container-btn{width:5vw;display:flex;justify-content:center;align-items:baseline;pointer-events:none}.project-menu-container-btn>button{border-style:none;background:none;color:var(--font-color-project);margin-top:.5rem;pointer-events:auto;cursor:pointer;font-weight:300;font-size:1rem;font-weight:500;letter-spacing:2px;transform:translateY(-5dvh);animation:projectMenuBtnAppear var(--time) ease var(--time) forwards}@media (max-width: 780px){.project-menu-container-btn{width:15vw}.project-menu-container-btn>button{width:20vw;height:5dvh;font-size:.8rem}}@keyframes projectMenuBtnAppear{0%{transform:translateY(-5dvh);opacity:0}to{transform:translateY(0);opacity:1}}.project-info{height:var(--app-height);width:90vw;position:absolute;right:5vw;top:0;display:flex;flex-direction:column;justify-content:center;align-items:end;gap:1rem;font-size:.8rem;font-weight:300;padding:1rem;color:var(--font-color-project)}.project-info>*{width:35vw;opacity:0}.project-info h3{font-weight:500;color:#000}.project-info ul{list-style:none;display:flex;gap:1rem}.project-info a{pointer-events:auto}.project-info i{margin-left:1rem;color:#000}.project-info-ini{opacity:0}.project-info-show-page>*:nth-child(1){animation:moveToRight 1s ease both}.project-info-show-page>*:nth-child(2){animation:moveToRight 1s ease .2s both}.project-info-show-page>*:nth-child(3){animation:moveToRight 1s ease .4s both}.project-info-show-info>*:nth-child(1){animation:moveToLeft 1s ease forwards}.project-info-show-info>*:nth-child(2){animation:moveToLeft 1s ease .2s forwards}.project-info-show-info>*:nth-child(3){animation:moveToLeft 1s ease .4s forwards}@media (max-width: 780px){.project-info{height:95dvh;width:96vw;top:5dvh;right:2vw;display:flex;justify-content:flex-start;align-items:start}.project-info>*{width:100%;opacity:0}.project-info-show-page>*:nth-child(1){animation:moveDown 1s ease .4s both}.project-info-show-page>*:nth-child(2){animation:moveDown 1s ease .2s both}.project-info-show-page>*:nth-child(3){animation:moveDown 1s ease both}.project-info-show-info>*:nth-child(1){animation:moveUp 1s ease both}.project-info-show-info>*:nth-child(2){animation:moveUp 1s ease .3s both}.project-info-show-info>*:nth-child(3){animation:moveUp 1s ease .5s both}}@keyframes moveToLeft{0%{transform:translate(0);opacity:0}to{transform:translate(-51vw);opacity:1}}@keyframes moveToRight{0%{transform:translate(-51vw);opacity:1}to{transform:translate(0);opacity:0}}@keyframes moveUp{0%{transform:translateY(50dvh);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes moveDown{0%{transform:translateY(0);opacity:1}to{transform:translateY(50dvh);opacity:0}}.project-gallery{width:100vw;position:absolute;right:0vw;height:95dvh;top:5dvh;pointer-events:auto;cursor:auto;transition:padding-left 1s ease,width 1s ease;transform-style:preserve-3d;perspective:100px;scrollbar-width:none;-ms-overflow-style:none;color:var(--font-color-project)}.project-gallery::-webkit-scrollbar{display:none}.gallery-img-container{width:50vw;height:100%;display:flex;align-items:center;transform-style:preserve-3d}.gallery-img{width:25vw;transform-style:preserve-3d;opacity:0;filter:grayscale(100%);transition:filter 1s ease,top 1s ease,left 1s ease,transform 1s ease;cursor:zoom-in}.gallery-img:hover{filter:grayscale(0%)}.project-img-appear{animation:projectImgAppear var(--time) ease forwards}.project-gallery-show-gallery{padding-left:0;overflow:auto}.project-gallery-show-info{padding-left:50vw;overflow:hidden}@keyframes projectImgAppear{0%{opacity:0}to{opacity:1}}.headline{width:100vw;position:fixed;bottom:0;left:0;text-align:center;font-size:11vw;letter-spacing:2px;font-weight:500;height:fit-content;cursor:pointer;opacity:1;transform:scale(1) translateY(0);display:flex;align-items:center;justify-content:center;mix-blend-mode:difference;transform-origin:bottom center;transition:transform 1s ease,bottom 1s ease}.headline-small{transform:scale(.35) translateY(0)}.headline-as-title{transform:scale(.525) translateY(-150dvh)}.headline-hidden{bottom:-100%}@media (max-width: 780px){.headline{font-size:10vw}.headline-as-title{transform:scale(.85) translateY(-100dvh)}}.about{width:var(--app-width);height:var(--app-heght);position:fixed;top:100dvh;font-size:1.2rem;transition:top .8s ease;padding-top:25dvh}.about-container{max-width:50vw;height:100%;margin:auto;display:flex;flex-direction:column;justify-content:center;gap:30px}.about-active{top:0}.email i{margin-left:10px}.about-links{width:100%;display:flex;gap:50px}.about-links a{display:flex;flex-direction:column;align-items:center}.about-links i{font-size:3rem}.about-liks span{font-size:1rem;font-weight:300}#btn-copy span{font-family:var(--main-font-family);font-weight:200}.about-active .about-container>*:nth-child(1){animation:1s moveUp 0s ease both}.about-active .about-container>*:nth-child(2){animation:1s moveUp .25s ease both}.about-active .about-container>*:nth-child(3){animation:1s moveUp .5s ease both}.about-active .about-container>*:nth-child(4){animation:1s moveUp .7s ease both}.about-active .about-container>*:nth-child(5){animation:1s moveUp .85s ease both}.about-active .about-container>*:nth-child(6){animation:1s moveUp .95s ease both}.about-active .about-container>*:nth-child(7){animation:1s moveUp 1.15s ease both}.about-active .about-links>*:nth-child(2){animation:1s moveUp 1.35s ease both}.about-active .about-links>*:nth-child(3){animation:1s moveUp 1.45s ease both}.about-active .about-container>*:nth-child(8){animation:1s moveUp 1.55s ease both}.selectable{-webkit-user-select:text!important;user-select:text!important}footer{margin-top:1rem;font-size:.8rem}@media (max-width: 780px){.about{font-size:.8rem;padding-top:10dvh;height:100dvh;font-weight:300;letter-spacing:1px;line-height:1.2rem}.about-container{max-width:80vw;height:100%;display:flex;flex-direction:column;justify-content:center;gap:2dvh}.about-links{gap:20px}.about-links a i{font-size:2rem}.about-links a span{font-size:.6rem;font-weight:300}footer{font-size:.5rem}}*{margin:0;padding:0;box-sizing:border-box;-webkit-user-select:none;user-select:none}:root{--global-background: black;--project-background: rgb(235, 235, 235);--font-color-canvas: rgb(255, 255, 255);--font-color-project: black;--font-color-hover: rgb(142, 142, 142);--app-height: 100vh;--app-width: 100vw;--time: 1s;--main-font-family: "Poppins", sans-serif }html,body{height:var(--app-height);width:var(--app-width);display:flex;justify-content:center;align-items:center;-webkit-user-select:none;user-select:none;overflow:hidden;background:var(--global-background);color:var(--font-color-canvas);font-family:Poppins,sans-serif}button{font-family:Poppins,sans-serif}html,body,.canvas{touch-action:auto;overscroll-behavior:auto}a{color:var(--font-color-canvas);text-decoration:none}ul{list-style:none}
