.home{height:100vh;width:100vw;background:#fcf6f4}.herobox-container{background:linear-gradient(to right,#000 50%,#fcf6f4 50%)}.home h2,.home h3{position:fixed;font-family:Karla,sans-serif;font-weight:500;width:fit-content;color:#000}.about-link{left:30vw;bottom:3vh;cursor:pointer}.my-skill-link{left:68vw;bottom:3vh;cursor:pointer}.project-link{rotate:-90deg;top:44vh;cursor:pointer}.resume-link{rotate:-90deg;top:24vh;cursor:pointer}.hi-link{top:5vh;right:7vh;cursor:pointer}.about-link:hover,.hi-link:hover,.my-skill-link:hover,.project-link:hover,.resume-link:hover{transform:scale(1.1)}.resumeabout{filter:brightness(0) invert(1)}@media (max-width: 800px){.home h2,.home h3{position:fixed;font-family:Karla,sans-serif;font-weight:500;width:fit-content;color:#000;font-size:20px}.herobox-container{background:linear-gradient(to bottom,#000 50%,#fcf6f4 50%)}.project-link{top:42vh}}@media (max-width:500px){.home h2,.home h3{font-size:15px}}.wheel{width:fit-content;position:fixed;top:35%;left:42%;cursor:pointer}.wheelanimate{transform:scale(1);animation:tobottom 1s ease-in 1 forwards}.removeanimate{transform:scale(.8);animation:totop 1s ease-in 1 forwards}@keyframes tobottom{0%{top:35%;left:42%;transform:scale(1)}to{top:75vh;left:84vw;transform:scale(.8)}}@keyframes totop{0%{top:75vh;left:84vw;transform:scale(.8)}to{top:35%;left:42%;transform:scale(1)}}.wheel-container{display:flex;flex-direction:column;align-items:center;gap:1rem;background:transparent;border:none}.hide-span{display:none}.yinyang-bottom{transform:scale(.5)}.yinyang{position:relative;background:#fff;height:200px;border-color:#000;border-style:solid;width:100px;border-width:4px 100px 4px 4px;border-radius:50%;animation:roll 1500s infinite}.yinyang:before{content:"";position:absolute;top:0;left:50%;background:#fff;border:36px solid #000;border-radius:50%;width:28px;height:28px}.yinyang:after{content:"";position:absolute;top:50%;left:50%;background:#000;border:36px solid #fff;border-radius:50%;width:28px;height:28px}@keyframes roll{0%{transform:rotate(360000deg)}to{transform:rotate(0)}}@media (max-width:800px){.wheel-container{transform:scale(.7)}.wheelanimate{transform:scale(1);animation:tobottom 1s ease-in 1 forwards}@keyframes tobottom{0%{top:35%;left:42%;transform:scale(1)}to{top:75vh;left:80vw;transform:scale(.4)}}}@media (max-width:500px){.wheel{position:fixed;top:35%;left:25%}@keyframes tobottom{0%{top:35%;left:32%;transform:scale(1)}to{top:74vh;left:63vw;transform:scale(.3)}}}@media (max-width:420px){.wheel-container{transform:scale(.5)}span.wheel-container{font-size:2.5rem!important}}.navbar{padding-top:6vh;display:flex;padding:1.5rem 3rem 1rem;align-items:center;margin-right:6vw}.fade-out{opacity:0}.navbarAbout{padding-top:6vh;display:flex;padding:1.5rem 3rem 1rem;align-items:center;filter:brightness(0) invert(1)}.logo-text{font-family:Pacifico,cursive;font-weight:bolder;font-size:4vh}.back-btn{height:fit-content;margin:0 auto;background:transparent;padding:.25rem;border-radius:50%;border:1px solid black;transition:opacity 1s ease;cursor:pointer}.back-btn:hover{box-shadow:0 2px 20px 5px #000000a8}.social-links-container{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1rem;position:fixed;bottom:0vh;left:2.2vw;cursor:pointer}.socialmediaAbout{filter:brightness(0) invert(1)}.social-links-container img{height:5vh}.social-links-container hr{height:20vh;border:1px solid black}@media (max-width:500px){.social-links-container{transform:scale(.8);bottom:-3vh}}.herobox{margin:11vh 17.4vw;height:55vh;width:65vw;border:2px solid;border-image:linear-gradient(to right,#fffefe 50%,#000 50%);border-image-slice:1;animation:herobox 2s ease 1;overflow:hidden}@keyframes herobox{0%{margin:35vh 17.4vw;height:1vh}to{margin:11vh 17.4vw;height:55vh}}@keyframes hero-img-in{0%{width:2%;height:auto}to{width:32%;height:auto}}.herobox-left{width:50%}.herobox-left-content{height:50vh;font-size:calc(1rem + 1.5vw);color:#fcf6f4;padding:2rem 3rem;cursor:crosshair;display:flex;flex-direction:column;justify-content:space-around;gap:2rem}.herobox-left-content h1{font-family:Source Sans Pro,sans-serif;margin-bottom:4vh}.herobox-left-content h3{font-family:Karla,sans-serif;font-weight:500;color:#fff;margin-bottom:20vh}.herobox-left-content h6{color:#fcf6f499;font-size:calc(.5rem + 1.5vw);font-weight:300}.herobox-right img{position:absolute;bottom:25vh;left:65%;transform:translate(-50%);width:32%;height:auto;animation:hero-img-in 3s ease 1}@media (max-width:500px){.herobox{margin:9.5vh 17.4vw;height:55vh;width:65vw;display:flex;flex-direction:column;border-image:linear-gradient(to bottom,#fffefe 50%,#000 50%);border-image-slice:1}.herobox-left-content{height:10vh;padding:1rem 2rem;cursor:crosshair;display:flex}.herobox-left{width:100%;height:50%}.herobox-left-content h1{font-family:Source Sans Pro,sans-serif;margin-bottom:1vh;font-size:1.5rem}.herobox-left-content h3{margin-bottom:-1.7rem;font-size:1.2rem}.herobox-left-content h6{font-size:.9rem}.herobox-right img{position:absolute;bottom:25vh;left:52%;transform:translate(-50%);width:40%;height:auto;animation:hero-img-in 3s ease 1}}.projects{height:100vh;width:100vw;background:#000;overflow-x:hidden}.projects-work,.projects-swipe{position:fixed;top:10%;right:20%;color:#fcf6f433;font-size:calc(4rem + 5vw);font-family:Source Sans Pro,sans-serif}.projects-swipe{top:80%;right:5%}.projects{animation:slideLeftToRight 1s ease forwards;transform:translate(-100%)}@keyframes slideLeftToRight{0%{transform:translate(-100%)}to{transform:translate(0)}}.project-card-container{display:flex;width:100%;overflow-x:scroll;gap:4rem;padding:6rem 7rem;box-sizing:border-box}.card{width:16rem;height:40vh;background-color:#fcf6f4;color:#000;padding:1.5rem 2rem;border-radius:0 50px;border:1px solid rgb(0,0,0);transition:all .2s ease 0s;position:relative;transition:transform ease 1.5s}.card-front-content{padding:0rem 1.3rem;margin-top:-3rem}.card-front{display:flex;flex-direction:column;justify-content:space-around;align-items:center;width:16rem;height:40vh}.card:hover{background-color:#000;border:1px solid rgb(252,246,244);transform:rotateY(180deg);border-radius:50px 0}.card:hover .card-front{display:none}.card:hover .card-back{display:flex}.card-front-heading{font-size:calc(1em + .5vw);font-family:Source Sans Pro,sans-serif;line-height:1.15}.card-back{display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:#000;display:none;transform:rotateY(180deg)}.card-back img{padding-top:2vh;height:17vh;width:auto}.card-back-content{height:8vh;width:19vw;margin:3vh 1vw;font-size:calc(.8em + .3vw);font-family:Source Sans Pro,sans-serif;color:#fff;margin-bottom:1vh;border-top:1px solid white;padding-top:1vh}.card-back-btn-container{height:7vh;width:19vw;display:flex;justify-content:space-between;align-items:center}.card-back-btn-container img{filter:brightness(0) invert(1);height:8vh;margin-bottom:3vh;cursor:pointer}.card-back-btn-container img:hover{transform:scale(1.2)}.card-back-visit{height:7vh;width:10vw;border-radius:0 0 0 50px;cursor:pointer}.card-back-visit:hover{transform:scale(1.1);background-color:#fff}@media (max-width:500px){.card-back-content{height:8vh;width:50vw}.card-back-btn-container{height:7vh;width:55vw;gap:40px;margin-left:-1rem}.card-back-visit{height:7vh;width:40vw}.card{transform:scale(.8)}}.about{height:100vh;width:100vw;background:#000}.about{animation:slideUp 1s ease forwards;transform:translateY(100%)}.about-content{border:2px solid rgb(252,246,244);color:#fcf6f4;padding:3vh 3vw;width:50vw;height:60vh;line-height:1.5;display:flex;flex-direction:column;justify-content:center;align-items:center;font-size:calc(.3rem + 1vw);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);position:absolute;left:calc(5rem + 5vw);top:10rem;font-family:Ubuntu Mono,monospace;font-style:italic}.man-img{position:absolute;top:10%;right:5%;animation:4s ease 0s infinite normal none running man-move;width:20vw}.man-img img{width:100%;height:auto}@keyframes man-move{0%{transform:translateY(-10px)}50%{transform:translateY(15px) translate(15px)}to{transform:translateY(-10px)}}@media (max-width:1024px){.about-content{padding:1vh 3vw}}@media (max-width:500px){.aboutabout{filter:brightness(1) invert(0)}.about-content{padding:2vh 3vw;height:49vh;font-size:calc(.3rem + 1vw);top:15rem}}@media (max-width:420px){.about-content{left:15vw;width:70vw;font-size:.61rem}}.myskill{height:100vh;width:100vw;background:#fcf6f4}.myskill{animation:slideUp 1s ease forwards;transform:translateY(100%)}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.skill-text-background{position:fixed;top:80%;right:24%;color:#0003;font-size:calc(5rem + 5vw);font-family:Source Sans Pro,sans-serif}.main-skill-container{display:flex;justify-content:center;align-items:center;gap:8vw;font-family:Ubuntu Mono,monospace;margin-top:4vh;margin-left:2vw;line-height:1.5;font-size:1.1rem}.main-skill-container h2{font-size:calc(1em + 1vw)}.left-skill-container{display:flex;flex-direction:column;justify-content:center;gap:2rem;border:2px solid black;width:27vw;height:60vh;padding:2.7vw;font-size:calc(.5em +3vw)}.left-skill-container:hover,.right-skill-container:hover{background:#000000ca;color:#fff}.first-left-skill-p{font-size:calc(.5em + 1vw);padding:.5rem 0px;font-size:1.1rem}.right-skill-container{display:flex;flex-direction:column;justify-content:center;gap:2rem;border:2px solid black;width:27vw;height:60vh;padding:2.7vw;margin-top:3}.right-skill-container h2{margin-top:-3rem;margin-bottom:1rem}.first-right-skill-p{font-size:calc(.5em + 1vw);font-size:1.1rem}@media (max-width:500px){.myskill{display:flex;flex-direction:column}.main-skill-container{padding-top:14rem;margin:0;flex-direction:column;height:calc(100vh - 9rem);overflow-y:scroll}.left-skill-container{gap:0px;width:49vw;height:50vh;padding:2.7vw 6vw;font-size:1rem;padding-bottom:3rem;margin-top:3rem}.right-skill-container{gap:0px;width:49vw;height:50vh;padding:2.7vw 6vw;font-size:1rem;margin-bottom:3rem}.right-skill-container h2,.right-skill-container p{margin:0;margin-bottom:1rem}.skill-right-second-heading{margin-top:1rem}}*::-webkit-scrollbar{display:none}.app{height:100vh;width:100vw}*{margin:0;padding:0}
