html,body{overflow:hidden;display:flex;width:100vw;height:100vh;justify-content:center;align-items:center;background-color:#ae9176}.webgl{position:fixed;top:0;left:0;outline:none;width:100vw;height:100vh}#orientation-screen{opacity:0;visibility:hidden;transition:opacity .5s ease,visibility .5s ease;pointer-events:none;display:flex;flex-direction:column;z-index:20000;position:fixed;top:0;left:0;width:100%;height:100%;background-color:#ece294;justify-content:center;align-items:center;text-align:center}#orientation-screen.show{opacity:1;visibility:visible;pointer-events:auto}.rotate-device{padding:20px;max-width:70%}#device-warning{display:none;z-index:20000;position:fixed;top:0;left:0;width:100%;height:100%;background-color:#ece294;justify-content:center;align-items:center;text-align:center}.warning-text{font-size:25px;color:#fff;text-align:center;font-family:Arial,sans-serif;font-weight:700;padding:20px;text-shadow:-2px -2px 0 black,2px -2px 0 black,-2px 2px 0 black,2px 2px 0 black,-2px 0px 0 black,2px 0px 0 black,0px -2px 0 black,0px 2px 0 black}.warning-hint-text{position:fixed;color:#fff;bottom:10%;left:50%;transform:translate(-50%);text-align:center;font-size:10px;background-color:#0000004a;padding:12px 24px;border-radius:5px;box-shadow:0 4px 8px #0000001a;font-family:Arial,sans-serif;opacity:.7;transition:opacity .3s ease,transform .3s ease}.overlay{background:#fff;width:55%;max-height:60%;padding:20px;border-radius:10px;text-align:center;position:relative;border:3px solid #000000;align-items:center;display:none;flex-direction:column}.overlay-content{width:100%;max-height:100%;overflow-y:auto}.close-btn{position:absolute;top:20px;right:20px;font-size:40px;cursor:pointer;color:#000;z-index:10;width:40px;height:40px;background:#fff;transition:all .3s ease-in-out;border:2px solid #000000;font-weight:bolder;display:flex;align-items:center;justify-content:center;text-align:center}.close-btn:hover{background:#ff4d4d;color:#fff;border-color:#ff4d4d;transform:scale(1.1);box-shadow:0 6px 12px #ff4d4d66}.overlay-content img{width:100%;height:auto;border-radius:5px}#projectTitle{padding-top:10px}.skills{margin-top:10px}.skill-tag{display:inline-block;background:#505e6d;color:#fff;padding:5px 10px;border-radius:5px;font-size:14px;margin:5px}.overlay-content p{font-size:20px;margin-top:5px;text-align:center;color:#000;padding:10px;width:90%}.source-code{width:3em!important;height:auto;transition:all .2s ease-in-out}.source-code:hover{transform:scale(1.1)}.arrow-scroll{position:relative;height:4em;transition:opacity 1s ease,visibility 1s ease}.arrow{border:solid #000000;border-width:0 4px 4px 0;display:inline-block;padding:10px;position:absolute;top:0;left:50%;transform:translate(-50%) rotate(45deg)}.arrow:nth-child(2){animation:arrow1 1.5s ease-in-out infinite}.arrow:nth-child(3){animation:arrow2 1.5s ease-in-out infinite}@keyframes arrow1{to{opacity:0;top:100%}}@keyframes arrow2{to{opacity:0;top:50%}}.arrow-scroll.hidden{opacity:0;visibility:hidden}.gallery-wrapper{background:#000;width:60%;height:60%;padding:10px;border-radius:10px;text-align:center;position:relative;border:3px solid #ffffff;display:none;color:#fff;flex-direction:column}.gallery-content{overflow-y:auto;max-height:100%}.gallery-wrapper a{color:#fff}.grid-item{margin-bottom:10px;width:calc(33.333% - 10px);transition:all .3s ease-in-out}.grid-item:hover{transform:scale(1.05)}.modal{display:none;position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000c;z-index:2000;align-items:center;justify-content:center}.modal-content{max-width:90%;max-height:90%;box-shadow:0 0 10px #00000080}.nav-btn{position:absolute;top:50%;transform:translateY(-50%);font-size:60px;color:#fff;padding:10px;cursor:pointer;border-radius:30%;-webkit-user-select:none;user-select:none;font-weight:bolder}#prevBtn{left:5%}#nextBtn{right:5%}.back-button{display:none;position:fixed;top:4vw;left:5vh;width:10vw;height:4vw;cursor:pointer;background-color:#fff;border:6px solid rgb(107,92,76);justify-content:center;align-items:center;text-align:center;color:#6b5c4c;font-size:2em;font-weight:700;transition:all .3s ease-in-out;z-index:1001;box-shadow:0 10px 15px #0003;border-radius:.75em}.back-button:hover{transform:scale(1.1);border:6px solid rgb(244,117,113)}.back-arrow{transform:scaleX(1.2);display:inline-block}.switch{position:fixed;right:9vw;top:10vh;width:4vw;height:4vw;background-color:#fff;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;border:6px solid rgb(107,92,76);transition:all .3s ease-in-out;z-index:1001;box-shadow:0 10px 15px #0003}.switch:hover{transform:scale(1.1)}.switch svg{width:50%}.switch svg path{fill:#6b5c4c}#switch-checkbox:checked+.switch{box-shadow:0 0 1px #97f3ff inset,0 0 2px #97f3ff inset,0 0 10px #97f3ff inset,0 0 40px #97f3ff,0 0 100px #97f3ff,0 0 5px #97f3ff;border:4px solid rgb(255,255,255);background-color:#92b4b8}#switch-checkbox:checked+.switch svg{filter:drop-shadow(0px 0px 5px rgb(151,243,255))}#switch-checkbox:checked+.switch svg path{fill:#fff}.toggleSwitch{position:fixed;right:3vw;top:10vh;width:4vw;height:4vw;background-color:#fff;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;border:6px solid rgb(107,92,76);transition:all .3s ease-in-out;z-index:1001;box-shadow:0 10px 15px #0003;overflow:hidden}#speakerCheckboxInput{display:none}.bell{width:50%}.bell path{fill:#6b5c4c}.speaker{width:100%;height:100%;display:flex;align-items:center;justify-content:center;z-index:1002;transition-duration:.3s}.speaker svg{width:50%}.mute-speaker{position:absolute;width:100%;height:100%;display:flex;align-items:center;justify-content:center;opacity:0;z-index:3;transition-duration:.3s}.mute-speaker svg{width:50%}#speakerCheckboxInput:checked+.toggleSwitch .speaker{opacity:0;transition-duration:.3s}#speakerCheckboxInput:checked+.toggleSwitch .mute-speaker{opacity:1;transition-duration:.3s}#speakerCheckboxInput:active+.toggleSwitch{transform:scale(.7)}#speakerCheckboxInput:hover+.toggleSwitch{transform:scale(1.1)}#loading-spinner{width:100vw;height:100vh;background-color:#000c;z-index:1500;display:none;align-items:center;align-content:center;justify-content:center}.newtons-cradle{--uib-size: 80px;--uib-speed: 1s;--uib-color: #ffffff;position:relative;display:flex;align-items:center;justify-content:center;width:var(--uib-size);height:var(--uib-size)}.newtons-cradle__dot{position:relative;display:flex;align-items:center;height:100%;width:25%;transform-origin:center top}.newtons-cradle__dot:after{content:"";display:block;width:100%;height:25%;border-radius:50%;background-color:var(--uib-color)}.newtons-cradle__dot:first-child{animation:swing var(--uib-speed) linear infinite}.newtons-cradle__dot:last-child{animation:swing2 var(--uib-speed) linear infinite}@keyframes swing{0%{transform:rotate(0);animation-timing-function:ease-out}25%{transform:rotate(70deg);animation-timing-function:ease-in}50%{transform:rotate(0);animation-timing-function:linear}}@keyframes swing2{0%{transform:rotate(0);animation-timing-function:linear}50%{transform:rotate(0);animation-timing-function:ease-out}75%{transform:rotate(-70deg);animation-timing-function:ease-in}}.loading-screen{display:flex;justify-content:center;align-items:center;position:fixed;width:100vw;height:100vh;z-index:10000;flex-direction:column;background-color:#ece294}.loading-text{font-size:35px;margin-bottom:20px;color:#fff;text-align:center;font-family:Arial,sans-serif;font-weight:700;text-shadow:-4px -4px 0 black,4px -4px 0 black,-4px 4px 0 black,4px 4px 0 black,-4px 0px 0 black,4px 0px 0 black,0px -4px 0 black,0px 4px 0 black}.hint-text{position:fixed;color:#fff;bottom:5%;left:50%;transform:translate(-50%);text-align:center;font-size:15px;background-color:#0000004a;padding:12px 24px;border-radius:10px;box-shadow:0 4px 8px #0000001a;font-family:Arial,sans-serif;opacity:.7;transition:opacity .3s ease,transform .3s ease}.blobs{width:500px;height:500px;position:absolute;overflow:hidden;border-radius:100px;transform-style:preserve-3d;margin-bottom:10px;padding:20px}.blobs .blob-center{transform-style:preserve-3d;position:absolute;background:#fff;top:50%;left:50%;width:30px;height:30px;transform-origin:left top;transform:scale(.9) translate(-50%,-50%);animation:blob-grow_2 linear 3.4s infinite;border-radius:50%;box-shadow:0 -10px 40px -5px #000}.blob{position:absolute;background:#fff;top:50%;left:50%;width:30px;height:30px;border-radius:50%;animation:blobs_2 ease-out 3.4s infinite;transform:scale(.9) translate(-50%,-50%);transform-origin:center top;opacity:0}.blob:nth-child(1){-webkit-animation-delay:.2s;animation-delay:.2s}.blob:nth-child(2){-webkit-animation-delay:.4s;animation-delay:.4s}.blob:nth-child(3){-webkit-animation-delay:.6s;animation-delay:.6s}.blob:nth-child(4){-webkit-animation-delay:.8s;animation-delay:.8s}.blob:nth-child(5){-webkit-animation-delay:1s;animation-delay:1s}@keyframes blobs_2{0%{opacity:0;transform:scale(0) translate(calc(-330px - 50%),-50%)}1%{opacity:1}35%,65%{opacity:1;transform:scale(.9) translate(-50%,-50%)}99%{opacity:1}to{opacity:0;transform:scale(0) translate(calc(330px - 50%),-50%)}}@keyframes blob-grow_2{0%,39%{transform:scale(0) translate(-50%,-50%)}40%,42%{transform:scaleY(.9) translate(-50%,-50%)}43%,44%{transform:scale(1.2,1.1) translate(-50%,-50%)}45%,46%{transform:scale(1.3,1.2) translate(-50%,-50%)}47%,48%{transform:scale(1.4,1.3) translate(-50%,-50%)}52%{transform:scale(1.5,1.4) translate(-50%,-50%)}54%{transform:scale(1.7,1.6) translate(-50%,-50%)}58%{transform:scale(1.8,1.7) translate(-50%,-50%)}68%,70%{transform:scale(1.7,1.5) translate(-50%,-50%)}78%{transform:scale(1.6,1.4) translate(-50%,-50%)}80%,81%{transform:scale(1.5,1.4) translate(-50%,-50%)}82%,83%{transform:scale(1.4,1.3) translate(-50%,-50%)}84%,85%{transform:scale(1.3,1.2) translate(-50%,-50%)}86%,87%{transform:scale(1.2,1.1) translate(-50%,-50%)}90%,91%{transform:scaleY(.9) translate(-50%,-50%)}92%,to{transform:scale(0) translate(-50%,-50%)}}#enter-button{--button_radius: .75em;--button_color: #e8e8e8;--button_outline_color: #000000;font-size:30px;font-weight:700;border:none;cursor:pointer;border-radius:var(--button_radius);background:var(--button_outline_color);display:flex;justify-content:center;align-items:center;display:none;opacity:0;transition:opacity .7s ease-in}#enter-button.show{display:block;opacity:1}.button_top{display:block;box-sizing:border-box;border:2px solid var(--button_outline_color);border-radius:var(--button_radius);padding:.75em 1.5em;background:var(--button_color);color:var(--button_outline_color);transform:translateY(-.2em);transition:transform .1s ease}button:hover .button_top{transform:translateY(-.33em)}button:active .button_top{transform:translateY(0)}#creditScreen{visibility:hidden;opacity:0;position:fixed;display:flex;top:0;left:0;width:100%;height:100%;background-color:transparent;justify-content:center;align-items:center;text-align:center;z-index:10000}#creditScreen.active{visibility:visible;animation:fadeInZoom .5s forwards}#creditScreen.hidden{animation:fadeOutZoom .5s forwards}.credit-content{position:relative;width:50%;height:50%;display:flex;flex-direction:column;justify-content:center;align-items:center;background:#f1f1f1;background-image:linear-gradient(90deg,transparent 50px,#ffb4b8 50px,#ffb4b8 52px,transparent 52px),linear-gradient(#e1e1e1 .1em,transparent .1em);background-size:100% calc(100%/11);box-shadow:0 12px 24px #0006}.credit-close-btn{position:absolute;top:-20px;right:-20px;background-color:#fc979c;color:#fff;border-radius:20%;width:40px;height:40px;cursor:pointer;font-size:30px;box-shadow:0 4px 8px #0003;transition:transform .2s;border:none}.credit-close-btn:hover{transform:scale(1.1);transform:rotate(90deg)}.credit-item{display:flex;justify-content:space-between;align-items:center;width:100%;height:calc(100%/11);margin:0;padding:0 10px}.title,.name{font-family:Indie Flower,cursive;flex:1;text-align:center;font-size:100%;white-space:nowrap;font-weight:700;transform:translateY(50%)}@keyframes fadeInZoom{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}@keyframes fadeOutZoom{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.6)}}