#root{margin:0 auto;text-align:center}#main-wrapper{padding-top:50px}.sub-wrapper{display:flex;gap:1rem}#footer{margin-bottom:1rem}#contact-text{width:35%;margin:auto;text-align:center}.icons-container{margin-top:2rem}.icons-container i{margin:1rem}@media (max-width: 600px){#contact-text{width:90%}}#introduction{display:flex;justify-content:space-around;margin-bottom:15rem}.text-wrapper{max-width:30%;margin-top:4.5rem}@media (max-width: 600px){#introduction{flex-direction:column;align-items:center}.text-wrapper{max-width:90%;margin-top:1rem}}#header{position:fixed;top:0;width:100%;background-color:#000000e6;z-index:2}.container{display:flex;justify-content:space-between;margin:0 .85rem;height:50px;align-items:center}.nav-elements ul{display:flex;gap:1rem;list-style:none;justify-content:space-between}.menu-icon{display:none}.navlink{cursor:pointer}@media (max-width: 600px){.nav-main{font-size:16px}.menu-icon{display:block;cursor:pointer;width:32px;height:32px}.menu-icon svg{display:block;width:32px;height:32px;left:auto}.nav-elements{width:0;overflow:hidden;position:absolute;top:50px;right:0;background-color:#000000e6;font-size:22px}.nav-elements.visible{width:150px}.nav-elements ul{flex-direction:column}.nav-elements ul li{margin-right:unset}}#display-container{width:80%;z-index:1}#project-display{background:radial-gradient(circle,rgba(0,0,0,.5),rgba(83,83,83,.5));box-shadow:0 0 50px 15px #535353}.section-container{display:flex;gap:2rem;height:40rem}#display-names-container{border-bottom:1px solid white;height:10%;width:100%}#displayed-project{display:flex;justify-content:space-between;align-items:start;margin:8rem 1rem auto;gap:.5rem}.arrow-left,.arrow-right{display:block;border-right:2px solid white;border-bottom:2px solid white;height:15rem;width:15rem;margin:auto;cursor:pointer}.arrow-left:hover,.arrow-right:hover{box-shadow:15px 5px 15px -15px #fff,5px 15px 15px -15px #fff,-15px -5px 15px -15px #fff inset,-5px -15px 15px -15px #fff inset}.arrow-left{transform:rotate(135deg);margin-right:-7rem;margin-left:4.5rem}.arrow-right{transform:rotate(-45deg);margin-left:-7rem;margin-right:4.5rem}.selected{background-color:gray;box-shadow:0 0 40px 15px #fff}img{max-width:600px;max-height:400px;margin:auto}#github-link i{height:20px;width:20px}@media (max-width: 600px){img{max-width:100%}#display-container{height:fit-content}#displayed-project{flex-direction:column;margin:0}.arrow-left,.arrow-right{display:none}.section-container{height:max-content;justify-content:center;padding-bottom:1rem}}@media (max-width: 1300px){#displayed-project{flex-wrap:wrap}#display-container{width:90%;margin:auto}.arrow-left,.arrow-right{display:none}}@keyframes spin-clockwise{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes spin-counter-clockwise{0%{transform:rotate(0)}to{transform:rotate(-360deg)}}#background-main{position:fixed;z-index:-1;width:100vw;height:100vh;background:radial-gradient(circle,rgb(138,137,137),rgb(83,83,83))}#background-main svg{width:100%;height:100%;position:fixed;left:0;opacity:.1}circle{transform-origin:50% 50%}.circle1{animation:spin-clockwise 10s linear;animation-iteration-count:infinite}.circle2{animation:spin-counter-clockwise 12s linear;animation-iteration-count:infinite}.circle3{animation:spin-clockwise 15s linear;animation-iteration-count:infinite}:root{font-family:Open Sans,Arial,sans-serif;line-height:1.5;font-weight:400;font-size:22px;color-scheme:light dark;color:#ffffffde;background-color:#242424;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;-webkit-text-size-adjust:100%}body{margin:0;min-width:320px;min-height:100vh}h1,h2{font-family:League Spartan}h1{font-size:100px}section{padding-top:2rem;margin-bottom:8rem}p{text-align:start}button{background-color:#535353;color:#fff;cursor:pointer;border-color:gray rgb(66,65,65) rgb(66,65,65) gray}button:hover{background-color:gray}@media (max-width: 600px){h1{font-size:50px}}@keyframes slide-in-left{0%{transform:translate(-200%)}to{transform:translate(0);visibility:visible}}@keyframes fade-in{0%{opacity:0}to{opacity:100}}.anim-slide-in-left{animation:slide-in-left .8s ease-out forwards;visibility:hidden}.anim-fade-in{animation:fade-in .8s forwards;opacity:0}.anim-fade-in-finished{opacity:1}.anim-delay-short{animation-delay:.2s}.anim-delay-medium{animation-delay:.4s}