html,body{width:100%;height:100%;margin:0;padding:0;overflow-x:hidden}*{font-family:Arial,Helvetica,sans-serif;margin:0;padding:0;-webkit-user-select:none;user-select:none;box-sizing:border-box}.main-html{position:absolute;top:0;left:0;display:flex;flex-direction:column;z-index:2;width:100%}.wrapper{position:fixed;top:0;width:100vw;height:100%;z-index:1}.nav-menu{position:fixed;top:5px;right:5px;display:flex;flex-direction:column;padding:1rem;background-color:#fff;border:3px solid black;border-radius:5px}.mobile-nav-menu,.hamburger{display:none}.nav-menu li{list-style:none;margin-left:0}header{position:absolute;top:0px;left:0px;box-sizing:border-box;display:flex;flex-direction:column;width:100%;height:160px;background:rgb(255,255,255,10%);color:#000;justify-content:center}.header-name{margin-left:.5rem}header h1{font-size:3rem;margin-left:.3rem}header h2{font-size:1.65rem;margin-left:-2px;background:none}.welcome{display:flex;flex-direction:column;height:100vh;align-items:center;justify-content:center}.about-me,.tech-skills-section{height:100vh;display:flex;flex-direction:column;align-items:center}.projects{height:170vh;display:flex;flex-direction:column;align-items:center}.contact{height:100vh;display:flex;flex-direction:column;align-items:center}.playground{height:140vh;display:flex;flex-direction:column;align-items:center}.about-me-article{display:flex;justify-content:center;width:100%;margin-top:1rem;gap:1rem}.about-me-card{display:flex;flex-direction:column;gap:.5rem;padding:1rem;width:30%;background-color:#e4f8ffe5;border:1px solid black;border-radius:5px}.profile-image{width:300px;border-radius:50%;z-index:2}.tech-skills-article{display:flex;flex-wrap:wrap;justify-content:center;width:70%;margin-top:1rem;gap:1rem}.tech-skill-card-section{display:flex;flex-direction:row;align-items:center;gap:1rem}.tech-skill-card{display:flex;flex-direction:column;padding:.5rem;width:7rem;height:6rem;align-items:center;justify-content:space-evenly;background-color:#e4f8ffe5;border:1px solid black;border-radius:5px}.tech-and-image{display:flex;flex-direction:column;align-items:center;background-color:#fff;padding:5px;margin-bottom:3px;border-radius:5px}.tech-skill-card img{width:3rem;height:3rem;object-fit:contain;border-radius:5px}.tech-skill-card:hover{background-color:#ff69b4}.project-card-article{display:flex;flex-direction:column;align-items:center;width:100%;height:fit-content;margin-top:1rem}.project-card-div{display:flex;flex-direction:column;justify-content:center;gap:.5rem;padding:1rem;width:70%;background-color:#e4f8ffe5;border:1px solid black;border-radius:5px}.project-card-div p{padding:.5rem}.project-card-div img{width:100%;border:1px solid black;border-radius:5px}.projects-nav{display:inline-flex;font-size:1rem;padding:1rem;margin-top:1rem;width:70%;background-color:#e4f8ffe5;border:2px solid black;border-radius:5px;justify-content:space-evenly}.projects-nav-link{padding:.2rem}.projects-nav-link-active{font-size:1rem;padding:.2rem;background-color:#ff69b4;border-radius:5px}.projects-nav-link:hover{background-color:#ff69b4;padding:.2rem;cursor:pointer;border-radius:5px}.project-tech-stack ul{display:flex;justify-content:space-evenly;gap:.5rem;font-size:.8rem;list-style:none;margin-top:1rem;border:1px solid black;background-color:#e4f8ff66;padding:.5rem;border-radius:5px}.desc{display:flex;align-items:center}.description{display:flex;flex-direction:column;padding:.4rem .4rem 1rem;width:100%;background-color:#e4f8ffe5;border-radius:5px}.description p{margin-top:0;padding:.1rem}.github-link{display:flex;justify-content:space-evenly;gap:1rem;margin-top:1rem}.contact-and-socials{display:flex;justify-content:center;gap:1rem}.form-wrapper{display:flex;justify-content:center}.send-success{color:#ff69b4;background-color:#000;padding:.5rem;border-radius:5px;text-align:center}.send-failure{background-color:#ff69b4;color:#000;padding:.5rem;border-radius:5px;text-align:center}.contact-form{margin-top:1rem;display:flex;flex-direction:column;gap:.5rem;border:2px solid black;padding:1rem;width:30rem;border-radius:5px;background-color:#e4f8ffe5}.contact-form button{padding:.5rem;margin:.5rem 0;border:2px solid black;border-radius:5px}.contact-form button:hover{background-color:#ff69b4;border:2px solid black;border-radius:5px}.input{font-size:1.2rem}.input:focus{outline:none;border:2px solid hotpink}.socials{margin-top:1rem;display:flex;flex-direction:column;gap:.5rem;border:2px solid black;padding:1rem;border-radius:5px;background-color:#e4f8ffe5}.icons{display:flex;flex-direction:column;justify-content:center;align-items:center}.icon-link:hover{-webkit-filter:invert(100%);border-radius:5px}.playground-title{margin-top:1rem;background-color:#ff69b4;padding:.3rem;border-radius:5px}.playground-article{display:flex;flex-wrap:wrap;justify-content:center;width:65%;margin-top:1rem;gap:1rem}.playground-card{padding:.7rem;background-color:#e4f8ffe5;border:1px solid black;border-radius:5px}.playground-card img{width:5rem;height:5rem}.playground-article-aframe{display:flex;flex-wrap:wrap;justify-content:center;width:75%;margin-top:1rem;gap:1rem}.playground-card-aframe{padding:.7rem;background-color:#e4f8ffe5;border:1px solid black;border-radius:5px;text-align:center}.playground-card-aframe img{width:10rem;height:8rem}.playground-card-aframe:hover,.playground-card:hover{background-color:#ff69b4}.long-line-div{border:2px solid black;width:80%}.span{background-color:#fff}.spanpink{background-color:#ff69b4}.welcome h1{font-size:15rem;color:#ff69b4;text-shadow:5px 7px black}.welcome h2{font-size:5rem}h2{font-size:4rem;display:inline;background-color:#ff69b4;padding-left:.5rem;padding-right:.5rem;padding-top:.1rem;border-radius:5px}h3{font-size:1rem;display:inline;text-align:center;background-color:#ff69b4;padding:.5rem;border-radius:5px;text-decoration:underline}h4{font-weight:800}a{text-decoration:none;color:#000}.link{cursor:pointer}.p-link{display:inline;background-color:#ff69b4;padding:.5rem;font-size:.8rem;border-radius:5px}.p-link:hover{background-color:#fff;color:#000;padding:.5rem;border-radius:5px}.link:hover{background-color:#ff69b4;cursor:pointer}.spacer{min-height:73px}.loading-wrapper{background-color:#fff;position:relative;top:0;left:0;width:100vw;height:100vh;z-index:3;display:flex;align-items:center;justify-content:center}.loading-div{display:flex;flex-direction:column;align-items:center;justify-content:center}@media only screen and (max-width: 700px){*{box-sizing:border-box}html,body{width:100%;height:100%;margin:0;padding:0;overflow-x:hidden;background-color:#fff}main{display:flex;justify-content:center;width:100vw;height:2000px}.main-html{width:100vw}.wrapper{position:fixed;top:0px;left:0px;width:100vw}.nav-menu{display:none}.hamburger{display:block;position:fixed;top:5px;right:5px;cursor:pointer;width:2rem;height:2rem;background-color:#fff;border:1px solid black}@keyframes slideIn{0%{right:0px;opacity:0}to{right:6px;opacity:1}}.mobile-nav-menu{display:flex;position:fixed;top:38px;right:6px;font-size:1rem;padding:1rem;background-color:#fff;border-radius:5px;z-index:1;animation:slideIn .5s}.mobile-nav-menu li{list-style:none;margin-left:0}header{box-sizing:border-box;display:flex;flex-direction:column;width:100%;height:45px;background:rgb(255,255,255,10%);color:#000}header h1{font-size:1.3rem;margin-left:5px;margin-bottom:-2px}header h2{font-size:.72rem;margin-left:-3px}.welcome{display:flex;flex-direction:column;height:100vh;justify-content:center}.about-me{height:140vh;display:flex;flex-direction:column;align-items:center}.about-me-article{display:flex;flex-direction:column;justify-content:center;width:100%;margin-top:1rem}.about-me-card{display:flex;flex-direction:column;align-self:center;padding:1rem;width:90%;background-color:#e4f8ffe5;border:1px solid black;border-radius:5px}.profile-image{margin-left:15%;width:70%;border-radius:50%}.tech-skills-section{height:100vh;display:flex;flex-direction:column;align-items:center}.projects{height:150vh;display:flex;flex-direction:column;align-items:center}.contact{height:100vh;display:flex;flex-direction:column;align-items:center}.contact-and-socials{display:flex;justify-content:center;align-self:center;width:90%}.form-wrapper{display:flex;justify-content:center}.playground{height:190vh;display:flex;flex-direction:column;align-items:center}.projects-nav{display:flex;flex-wrap:nowrap;justify-content:left;padding:.7rem .5rem;margin-top:1rem;width:90%;gap:.4rem;background-color:#e4f8ffe5;border:2px solid black;border-radius:5px;align-items:center;overflow-y:hidden;overflow-x:scroll;white-space:nowrap}.projects-nav-link{font-size:1rem}.project-card-div{display:flex;flex-direction:column;width:90%;padding:.5rem;background-color:#e4f8ffe5;border:1px solid black;border-radius:5px}.playground-title{margin-top:1rem;background-color:#ff69b4;padding:.3rem;border-radius:5px}.playground-article{display:flex;flex-wrap:wrap;justify-content:center;width:98%;margin-top:1rem;gap:1rem}.playground-card{padding:.5rem;background-color:#e4f8ffe5;border:1px solid black;border-radius:5px}.playground-card img{width:5rem;height:5rem}.playground-article-aframe{display:flex;flex-wrap:wrap;justify-content:center;width:75%;margin-top:1rem;gap:1rem}.playground-card-aframe{padding:.7rem;background-color:#e4f8ffe5;border:1px solid black;border-radius:5px;text-align:center}.playground-card-aframe img{width:9rem;height:7rem}.playground-card-aframe:hover{background-color:#ff69b4}.tech-skills-article{width:85%}.tech-skill-card{display:flex;flex-direction:column;padding:.3rem;width:5.5rem;height:5.5rem;align-items:center;justify-content:space-evenly;background-color:#e4f8ffe5;border:1px solid black;border-radius:5px;font-size:.7rem}.spacer{min-height:30px}.welcome h1{font-size:6rem}.welcome h2{font-size:4rem}h2{font-size:2rem;display:inline}a{text-decoration:none;color:#000;font-size:.7rem}.link{cursor:pointer}.p-link{display:block;background-color:#ff69b4;color:#000;font-size:.7rem;padding:.2rem;border-radius:5px}.p-link:hover{background-color:#fff}.link:hover{background-color:#ff69b4;cursor:pointer}.project-tech-stack ul{display:flex;justify-content:space-evenly;gap:.3rem;font-size:.7rem;list-style:none;margin-top:1rem;border:1px solid black;background-color:#e4f8ff66;padding:.5rem;border-radius:5px}.contact-and-socials{display:flex;flex-direction:column;gap:1rem}.contact-form,.socials{width:100%}.icons{flex-direction:row;justify-content:space-evenly}.long-line-div{border:2px solid black;width:93%}}@media screen and (orientation: landscape) and (min-device-width: 319px) and (max-device-width: 700px){.welcome{display:flex;flex-direction:column;height:100vh;align-items:center;justify-content:center}.about-me{height:150vh;display:flex;flex-direction:column;align-items:center}.about-me-article{display:flex;flex-direction:row;justify-content:center;width:100%;margin-top:1rem}.about-me-card{display:flex;flex-direction:column;gap:.5rem;padding:1rem;width:60%;background-color:#e4f8ffe5;border:1px solid black;border-radius:5px}.about-me-card p{font-size:.7rem}.profile-image{margin-left:5%;width:150px}.tech-skills-section{height:200vh;display:flex;flex-direction:column;align-items:center}.projects{height:270vh;display:flex;flex-direction:column;align-items:center}.projects-nav p,.description p{font-size:.8rem}.contact{height:220vh;display:flex;flex-direction:column;align-items:center}.contact-and-socials{width:80%}.playground{height:160vh;display:flex;flex-direction:column;align-items:center}}.controls{position:absolute;bottom:0;left:0;display:flex;flex-direction:row;justify-content:center;align-items:center;gap:.5rem;z-index:1;padding:1rem;background-color:#000;border:2px solid rgb(255,255,255);border-radius:5px;width:100%;height:100px}.btn{padding:.3rem;background-color:#000;color:#fff;border:1px solid white;border-radius:5px}.btn:hover{cursor:pointer;background-color:#ff69b4}.info{padding:1rem;color:#fff;font-size:.8rem}