body{width:98.5vw;height:340vh;animation-name:changeColor3;animation-duration:.01s;animation-delay:1.3s;animation-fill-mode:forwards;overflow-x:hidden}@keyframes changeColor3{to{background:linear-gradient(to bottom,#000021 .5%,#12a4ff 99.5%)}}@media screen and (max-width: 720px){body{height:420vh;display:flex;flex-direction:column;align-items:center}}.aboutme-main-container{width:99%;height:60vh;position:relative;display:flex;align-items:center}.aboutme-info-cont{width:100%;height:100%;padding-top:15px;display:flex;flex-direction:column;align-items:center}.aboutme-more-info-title{font-size:30px;margin:10px;color:#af0;font-family:Fira Code,monospace;border-radius:30%;overflow:hidden;opacity:0;animation-name:moreInfoAnime;animation-duration:1s;animation-fill-mode:forwards;animation-timeline:view();animation-range:entry 20% cover 75vh}.aboutme-more-info{width:85%;height:50%;font-size:15px;font-family:Fira Code,monospace;color:#af0;background-color:#0000;border:none;line-height:30px;margin-bottom:30px;outline:none;opacity:0;animation-name:moreInfoAnime;animation-duration:1s;animation-fill-mode:forwards;animation-timeline:view();animation-range:entry 20% cover 75vh}.aboutme-more-info2{width:85%;height:50%;font-size:15px;font-family:Fira Code,monospace;color:#af0;background-color:#0000;outline:none;border:none;line-height:30px;margin-bottom:30px;opacity:0;animation-name:moreInfoAnime;animation-duration:1s;animation-fill-mode:forwards;animation-timeline:view();animation-range:entry 20% cover 75vh}@keyframes moreInfoAnime{0%{opacity:0}to{opacity:1}}.aboutme-title-cont{width:57.5%;height:100%;display:flex;flex-direction:column;align-items:center}.aboutmeCard-title{font-size:70px;margin:0;height:20%;width:fit-content;padding-left:3%;padding-right:3%;display:flex;align-items:flex-start;justify-content:flex-start;color:#af0;font-family:Fira Code,monospace;animation-name:changeColor2;animation-duration:1s;animation-fill-mode:forwards;animation-timeline:view();animation-range:entry 20% cover 75vh;white-space:nowrap}.aboutme-contact-info-cont{width:100%;height:80%;display:flex;flex-direction:column;align-items:center}.aboutme-contact-info{margin:0 0 7px 12.5px;font-size:22px;text-align:center;color:#af0;font-family:Fira Code,monospace}.aboutme-contact-info2{margin:0 0 7px 12.5px;font-size:13px;color:#af0;font-family:Fira Code,monospace}.aboutme-contact-info3{margin:0 0 20px 12.5px;font-size:13px;color:#af0;font-family:Fira Code,monospace}@media screen and (max-width: 1030px){.aboutme-main-container{flex-direction:column;height:200vh}.aboutmeCard-title{font-size:65px;height:fit-content}.aboutme-more-info,.aboutme-more-info2{text-align:center}}.card-main-container{height:100%;width:100%;margin:0;padding:0;animation-name:projectIntro;animation-duration:3s;animation-fill-mode:forwards}@keyframes projectIntro{0%{opacity:0}95%{opacity:0}to{opacity:1}}.card-main-container:hover{cursor:pointer}.screenshot{width:100%;height:100%;border-radius:15px;box-shadow:0 -5px 10px #000000a0}.screenshot:hover{cursor:pointer;scale:1.01}@media screen and (max-width: 1030px){.card-main-container{width:65%;height:50vh;margin-right:0;z-index:9}}@media screen and (max-width: 700px){.card-main-container{width:100%;height:50vh;margin-right:0;z-index:9}}.card2-main-container{height:90%;width:100%;animation-name:projectIntro;animation-duration:3s;animation-fill-mode:forwards;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:15px}.screenshot2{position:relative;top:0;width:100%;height:100%;border-radius:15px;margin:0}.screenshot2:hover{cursor:pointer;scale:1.01}.down-btn{position:relative;top:90%;width:30px;height:30px;z-index:9999;opacity:60%;margin:0}@media screen and (max-width: 1030px){.card2-main-container{position:relative;width:100%;height:50vh;margin-right:0;z-index:999}}@media screen and (max-width: 700px){.card2-main-container{position:relative;width:100%;height:50vh;margin-right:0;z-index:999}.screenshot2{height:60%}}.footer-main-container{width:98.5%;height:8.5vh;position:absolute;top:63vh;display:flex;align-items:center;justify-content:center}.footer-info{font-size:17px;text-align:center;color:#af0}@media screen and (max-width: 720px){.footer-main-container{display:none}}.heroCard-main-container{position:relative;height:70vh;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;background-color:#7fffd400}.stars,.stars2,.stars3{position:absolute;width:5px;height:5px;background:#fff;border-radius:50%;top:0;left:0;animation:twinkle 2s infinite ease-in-out alternate}.stars2{box-shadow:60px 650px #fff,150px 80px #fff,260px 550px #fff,410px 140px #fff,520px 660px #fff,700px 330px #fff,860px 150px #fff,940px 700px #fff,1040px 400px #fff,1200px 250px #fff;animation-duration:3s;animation-delay:1s}.stars3{box-shadow:80px 100px #fff,200px 700px #fff,340px 300px #fff,460px 170px #fff,580px 350px #fff,720px 650px #fff,880px 260px #fff,1020px 400px #fff,1180px 600px #fff,1320px 720px #fff;animation-duration:5s;animation-delay:5s}@keyframes twinkle{0%{opacity:1}to{opacity:.1}}.shooting-star{position:absolute;top:-10px;left:-100px;width:2px;height:100px;background:linear-gradient(45deg,#fff,#fff0);opacity:0;border-radius:50%;transform:rotate(45deg);animation:shoot 8s infinite;animation-delay:10s}.shooting-star2{position:absolute;top:-10px;left:-100px;width:2px;height:100px;background:linear-gradient(45deg,#fff,#fff0);opacity:0;border-radius:50%;transform:rotate(45deg);animation:shoot 8s infinite;animation-delay:25s}@keyframes shoot{0%{opacity:0;transform:translate(0) rotate(-60deg)}10%{opacity:1}20%{opacity:1;transform:translate(1100px,650px) rotate(-60deg)}to{opacity:0;transform:translate(1100px,650px) rotate(-60deg)}}.page-title{text-align:center;font-size:80px;opacity:0%;margin:0;font-family:Fira Code,monospace;color:#af0;animation-name:titleShow;animation-duration:2s;animation-delay:1.5s;animation-fill-mode:forwards}@keyframes titleShow{0%{font-size:50px;opacity:100%;text-align:center}45%{transform:rotateY(180deg)}to{font-size:80px;opacity:100%;text-align:center;margin-bottom:0;transform:rotateX(360deg)}}.intro-text{text-align:center;width:90%;opacity:0%;margin-top:7.5px;color:#af0;font-size:18px;font-weight:400;font-family:Fira Code,monospace;animation-name:introTextShow;animation-duration:2s;animation-delay:2.5s;animation-fill-mode:forwards}@keyframes introTextShow{0%{opacity:0%}to{opacity:100%}}.heroCard-text{text-align:center;width:90%;opacity:0%;color:#af0;font-size:18px;font-family:Fira Code,monospace;animation-name:heroTextShow;animation-delay:3s;animation-duration:2s;animation-fill-mode:forwards}@keyframes heroTextShow{0%{opacity:0%}to{opacity:100%}}.foreground-orb{position:absolute;width:20px;height:20px;background:radial-gradient(circle,#a6ff00e6,#fff0);border-radius:50%;animation:float 12s infinite ease-in-out;mix-blend-mode:screen}.foreground-orb:nth-child(1){top:40%;left:20%;width:15px;height:15px;animation-delay:0s}.foreground-orb:nth-child(2){top:60%;left:70%;width:25px;height:25px;animation-delay:3s}.foreground-orb:nth-child(3){top:20%;left:50%;width:10px;height:10px;animation-delay:6s}@keyframes float{0%{transform:translate(0) scale(1);opacity:.9}50%{transform:translate(40px,-30px) scale(1.2);opacity:.6}to{transform:translate(0) scale(1);opacity:.9}}.foreground-layer{position:absolute;inset:0;margin-top:30%;height:30%;pointer-events:none}@media screen and (max-width: 1030px){.foreground-layer{margin-top:80%}}.navbar-main-container{width:98%;height:60px;opacity:0;padding-left:20px;padding-right:10px;display:flex;align-items:center;justify-content:center;background-color:#010170;box-shadow:0 2.5px 10px #ffffff29;position:absolute;top:0;left:0;z-index:9999;animation-name:navIntro;animation-duration:3.5s;animation-delay:1.5s;animation-fill-mode:forwards}@keyframes navIntro{0%{opacity:0}to{opacity:1;height:60px}}.logo{font-size:22.5px;margin:0;color:#aaff00ad}@media screen and (max-width: 720px){.navbar-main-container{width:95%}}.skillsCard-main-container{width:98.5%;height:60vh;display:flex;flex-direction:column;align-items:flex-start}.skillCard-title-cont{width:95%;height:25%}.skillCard-title{font-size:80px;margin:0;height:100%;padding-left:3%;display:flex;align-items:center;justify-content:flex-start;color:#af0;font-family:Fira Code,monospace;animation-name:changeColor2;animation-duration:1s;animation-fill-mode:forwards;animation-timeline:view();animation-range:entry 20% cover 75vh}.skillCard-skills-cont{width:99%;height:75%;padding-top:5px;padding-bottom:20px;display:grid;grid-template-columns:repeat(4,2fr);row-gap:25%;overflow-x:scroll}.iconCard-conts{width:100px;height:100px;background-color:#0022ff47;display:flex;align-items:center;justify-content:center;margin-left:35%;border-radius:50%;padding:15px;animation-name:skillsanimate;animation-duration:10s;animation-iteration-count:infinite;transition:ease-out;border:2px solid yellow}.iconCard-conts:hover{scale:1.05;cursor:pointer;box-shadow:0 0 10px #af0}.skills-icons{width:100%;height:100%;border:none;border-radius:50%;padding:5px;z-index:9999}.skills-icons:hover{cursor:pointer}.skills-stats-cont{border-radius:5px;width:24.5vw;height:25%;position:absolute;z-index:9999;margin-left:3%;padding:5px;display:flex;flex-direction:column;align-items:center;background-color:#00659496}.skills-stats-title{margin:15px 0 0;font-size:20px;font-weight:700;color:#84c600}.skills-stats{font-size:20px;font-weight:700;color:#84c600}@keyframes skillsanimate{0%{opacity:1}25%{opacity:0}to{opacity:1}}@media screen and (max-width: 1030px){.skillsCard-main-container{overflow-y:hidden}.iconCard-conts{margin-left:15%}}@media screen and (max-width: 720px){.skillsCard-main-container{overflow-y:hidden}.skillCard-skills-cont{grid-template-columns:repeat(2,2fr)}.iconCard-conts{margin-left:25%}}.me-page-container{height:fit-content;display:flex;flex-direction:column;align-items:center}.me-section1-cont{width:98.5%;height:70vh;position:absolute;top:9vh;display:flex;flex-direction:column;align-items:center;justify-content:center}.me-section2-cont{width:98.5%;height:55vh;position:absolute;top:85vh;display:flex;align-items:center;gap:2%}.me-section2-left-cont{width:49%;height:95%;display:flex;align-items:center;overflow-y:scroll}.me-section2-right-cont{width:49%;height:95%;display:flex;flex-direction:column;align-items:center;overflow-y:scroll;gap:5%}.me-section3-cont{width:98.5%;height:55vh;position:absolute;top:146vh}.me-section4-cont{width:98.5%;height:55vh;position:absolute;top:212.5vh;display:flex;flex-direction:column;align-items:center}.me-section5-cont{width:98.5%;height:55vh;position:absolute;top:287vh;display:flex;align-items:center}.bottom-cont-left-cont{width:50%;height:100%;display:flex;align-items:center;justify-content:center}.avater-speech{position:absolute;left:3.5%;margin-bottom:10%;border-radius:10px;width:20%;height:30%;text-align:center;display:flex;align-items:center;justify-content:center;font-size:20px;font-family:Fira Code,monospace;color:#aaff00c8;background-color:#ffffff2a;padding:7.5px;-webkit-backdrop-filter:blur(2.5px);backdrop-filter:blur(2.5px);box-shadow:0 0 10px #af0;animation-name:speech;animation-duration:1s;animation-fill-mode:forwards;animation-timeline:view();animation-range:entry 20% cover 75vh}@keyframes speech{0%{opacity:0}to{opacity:1}}.avatar{width:60%;height:80%}.bottom-cont-right-cont{width:50%;height:100%;display:flex;align-items:center;justify-content:center}.comment-form{border-radius:10px;width:90%;height:90%;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#aaff00c8;background-color:#010d5e37;-webkit-backdrop-filter:blur(2.5px);backdrop-filter:blur(2.5px);box-shadow:0 0 10px #af0}.comment-inputs{width:60%;height:30px;outline:none;border:none;border-radius:5px;margin:5px;text-align:center;font-size:17.5px;color:#aaff00c8;background-color:#0621d25b}.comment-inputs::placeholder{color:#aaff009c}.comment-inputs:hover{scale:1.025;color:#aaff00e0;background-color:#0177c660}.comment{width:65%;height:20%;margin-top:5px;text-align:center;font-size:17.5px;outline:none;border:none;border-radius:5px;color:#aaff00c8;background-color:#0621d25b}.comment::placeholder{color:#aaff009c}.comment-btn{width:35%;height:25px;margin-top:10px;border:none;border-radius:5px;font-size:15px;color:#ffffff4f;background-color:#019bc641}.comment-btn:hover{scale:1.025;color:#fff;background-color:#02aedd64;cursor:pointer}@media screen and (max-width: 1030px){.me-section4-cont{height:105vh}.me-section5-cont{height:105vh;top:340vh;flex-direction:column}.me-section1-cont,.me-section2-cont{overflow-x:hidden}.me-section3-cont{overflow:hidden}.me-section4-cont{overflow-x:hidden}.me-section5-cont{overflow-x:hidden;top:312vh}.bottom-cont-left-cont,.bottom-cont-right-cont{width:100%}.me-section2-right-cont{overflow-x:hidden}}.caseStudies-page-container{width:99vw;display:flex;flex-direction:column;align-items:center}.home-icon{width:37.5px;height:37.5px;position:absolute;top:10vh;left:10px;z-index:9999;animation-name:homeIcon;animation-duration:3.5s;animation-fill-mode:forwards}.home-icon:hover{scale:1.025;cursor:pointer}@keyframes homeIcon{0%{opacity:0}to{opacity:1}}.caseStudiesCards1{position:relative;margin-top:62.5px;width:100%;height:75vh;display:flex;align-items:center}.card1-title-cont{width:32.5%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}.project-card-title{margin:0 0 10px;font-size:17.5px;font-family:Fira Code,monospace;color:#af0;animation-name:moreInfoAnime;animation-duration:1s;animation-fill-mode:forwards;animation-timeline:view();animation-range:entry 20% cover 75vh}.project-title{font-size:70px;font-family:Fira Code,monospace;margin:0;width:fit-content;color:#af0;animation-name:moreInfoAnime;animation-duration:1s;animation-fill-mode:forwards;animation-timeline:view();animation-range:entry 20% cover 75vh}.project-sub-title{margin:10px 0 15%;font-size:17.5px;font-family:Fira Code,monospace;color:#af0;animation-name:moreInfoAnime;animation-duration:1s;animation-fill-mode:forwards;animation-timeline:view();animation-range:entry 20% cover 75vh}.card1-info-cont{width:73.5%;height:100%;display:flex;align-items:center;justify-content:center}.project-summary{font-size:20px;width:82.5%;text-align:center;line-height:35px;font-family:Fira Code,monospace;color:#af0}.caseStudiesCards2{width:100%;height:fit-content;display:flex;align-items:center}.card2-title-cont{padding:1%;width:22.5%;height:96%;display:flex;flex-direction:column;align-items:center;justify-content:center}.card2-title{margin:0;width:90%;text-align:center;font-size:30px;font-weight:700;font-family:Fira Code,monospace;color:#af0;animation-name:moreInfoAnime;animation-duration:1s;animation-fill-mode:forwards;animation-timeline:view();animation-range:entry 20% cover 75vh}.card2-sub-title{margin:30px 0 0;width:90%;text-align:center;font-size:18px;font-family:Fira Code,monospace;color:#af0;animation-name:moreInfoAnime;animation-duration:1s;animation-fill-mode:forwards;animation-timeline:view();animation-range:entry 20% cover 75vh}.card2-info-cont{width:70%;height:100%;display:flex;align-items:center;justify-content:center}.card2-info-text{font-size:20px;width:87.5%;text-align:center;line-height:35px;font-family:Fira Code,monospace;color:#af0;animation-name:moreInfoAnime;animation-duration:1s;animation-fill-mode:forwards;animation-timeline:view();animation-range:entry 20% cover 75vh}.caseStudiesCards3{width:100%;height:58vh;margin-top:50px;display:flex;align-items:center;overflow-y:scroll}.card3-info-left{width:50%;height:100%;display:flex;flex-direction:column;align-items:center}.project-key-features-list{list-style:none;padding:0;margin:20px 0 0;width:90%}.project-key-features{margin-bottom:10px;text-align:center;font-size:20px;font-family:Fira Code,monospace;color:#af0;animation-name:moreInfoAnime;animation-duration:1s;animation-fill-mode:forwards;animation-timeline:view();animation-range:entry 20% cover 75vh}.card3-info-right{border-radius:5px;width:50%;height:48vh;display:flex;flex-direction:column;align-items:center;background-color:#ffffff20;overflow-x:scroll}.project-stack{width:50%;height:50%;margin:10px;border:none;border-radius:10px}.caseStudiesCards4{width:100%;height:55vh;margin-top:6%;display:flex;align-items:center;justify-content:space-between;gap:1%}.card4-process-cont,.card4-challenges-cont,.card4-lessons-cont{width:32%;height:100%;display:flex;flex-direction:column;align-items:center;overflow-x:auto}.card4-info-text{width:90%;height:72.5%;text-align:center;font-size:20px;font-family:Fira Code,monospace;color:#af0;overflow-x:auto}.caseStudiesCards5{width:100%;height:fit-content;display:flex;align-items:center}.card5-screenshots-cont{width:30%;height:23vh;display:flex;flex-direction:column;align-items:center;justify-content:center}.card5-improvements-cont{width:70%;height:23vh;display:flex;align-items:center;justify-content:center}.card5-title{margin:0;font-size:60px;color:#af0}.card5-sub-title{font-size:20px;font-weight:700;margin:0;color:#af0}.card5-info-text{margin:0;font-size:20px;width:95%;text-align:center;font-family:Fira Code,monospace;color:#af0}@media screen and (max-width: 1030px){.caseStudiesCards1{flex-direction:column}.card1-title-cont{width:50%;height:40%;margin-top:5%;display:flex;flex-direction:column;align-items:center;padding-bottom:0}.project-title{padding-left:0}.project-sub-title{margin-bottom:0}.card1-info-cont{width:100%;height:60%;margin-top:0;overflow-x:scroll}.project-summary{font-size:17px;width:90%;text-align:center;line-height:35px;font-family:Fira Code,monospace;color:#af0;padding-top:0}.caseStudiesCards2{flex-direction:column-reverse}.card2-title-cont{width:100%;height:40%;margin-top:5%;display:flex;flex-direction:column;align-items:center;padding-bottom:0}.card2-info-cont{width:95%}.caseStudiesCards3{overflow-x:auto;height:40vh}.card3-info-left{height:40vh}.card5-screenshots-cont{width:95%}.card5-improvements-cont{width:95%;height:70%}.caseStudiesCards5{flex-direction:column;height:70vh}.caseStudiesCards1{height:105vh;overflow:hidden}}.intro-main-container{position:fixed;z-index:9999;top:40%;left:50%;background-color:#af0;display:flex;align-items:center;justify-content:center;animation-name:intro;animation-duration:1.3s;animation-fill-mode:forwards}.intro-logo{font-size:30px;color:#00000098}@keyframes intro{0%{width:125px;height:125px}50%{width:75px;height:75px}95%{transform:rotate(360deg);border-radius:50%;width:75px;height:75px}to{width:75px;height:75px;transform:rotate(360deg);border-radius:50%;display:none}}@media screen and (max-width: 1030px){.intro-main-container{left:42.5%}}.vanilla-page-container{width:98.8vw;display:flex;flex-direction:column;align-items:center}.vanilla-card1-cont{width:100%;height:65vh;margin-top:4%;background-image:url(/vanilla-backgrnd.jpg);background-position:center;background-size:cover;display:flex;flex-direction:column;align-items:center;justify-content:center}.project-title2{margin:0;font-size:80px;color:#af0;animation-name:titleShow2;animation-duration:3.5s;animation-delay:1.5s;animation-fill-mode:forwards}.project-sub-title2{margin:0;font-size:35px;color:#af0;animation-name:titleShow2;animation-duration:3.5s;animation-delay:1.5s;animation-fill-mode:forwards}.project-hero-info{margin:0;width:80%;text-align:center;font-size:25px;color:#aaff009d;animation-name:titleShow2;animation-duration:3.5s;animation-delay:1.5s;animation-fill-mode:forwards}@keyframes titleShow2{0%{opacity:0}to{opacity:1}}.vanilla-card2-cont{width:100%;height:55vh;display:flex;align-items:center}.vanilla-card2-left-cont{width:70%;height:80%;display:flex;align-items:center;justify-content:space-evenly}.vanilla-card2-images{width:48%;height:100%;z-index:9999}.vanilla-card2-right-cont{width:30%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}.vanilla-cards-titles{margin:0 0 10px;text-align:center;font-size:50px;color:#af0}.vanilla-cards-subtitles{margin:0;width:85%;text-align:center;font-size:25px;color:#af0}.vanilla-card3-cont{width:100%;height:55vh;display:flex;align-items:center;justify-content:center}.vanilla-card3-left-cont{width:30%;height:80%;z-index:9999}.vanilla-card3-right-cont{width:66%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;z-index:9999}.vanilla-card3-images{width:100%;height:100%;z-index:9999}.vanilla-card4-cont{width:100%;height:55vh;display:flex;align-items:center;justify-content:center;position:relative}.vanilla-card4-images{width:50%;height:100%;z-index:9999}.vanilla-card5-cont{width:100%;height:55vh;display:flex;align-items:center}.vanilla-card6-cont{border-radius:5px;width:100%;height:8.5vh;display:flex;align-items:center;justify-content:space-evenly;background-color:#ffffff43}.vanilla-card6-info{margin:0;font-size:25px;color:#75b000}.vanilla-card6-btn{width:30%;height:30px;border:none;border-radius:5px;font-size:18px;font-weight:700;color:#aaff0064;background-color:#00b7ff67}.vanilla-card6-btn:hover{scale:1.025;color:#af0;background-color:#00b7ffdc;cursor:pointer}@media screen and (max-width: 1030px){.vanilla-card2-cont{flex-direction:column-reverse;margin-top:20px}.vanilla-card2-left-cont,.vanilla-card2-right-cont{width:99%}.vanilla-card3-cont{flex-direction:column;margin-top:80px;margin-bottom:80px}.vanilla-card3-left-cont,.vanilla-card3-right-cont{width:99%}.vanilla-card4-images{width:90%}.vanilla-card5-cont{flex-direction:column;margin-top:20px}.vanilla-card6-cont{flex-direction:column;height:fit-content;padding:5px;margin-top:20px}.vanilla-card6-info{text-align:center;margin-bottom:10px}.vanilla-card6-btn{width:fit-content}}