*{margin:0;padding:0;box-sizing:border-box;text-decoration:none;background:transparent;font-family:Poppins,sans-serif;z-index:1}body{background:#191f36;color:#fff;overflow:hidden;overflow-y:scroll}.navbar{background:#191f36;height:5rem;width:100vw;max-width:auto;margin:0;padding:1rem 2rem;display:flex;align-items:center;justify-content:space-between;position:sticky;top:0;z-index:3}.name{margin-left:2rem;font-size:xxx-large;font-weight:800;color:#216382;animation:slideRight 1s ease forwards}.destopMenuListItem{margin:1rem;cursor:pointer}.destopMenuListItem:hover{color:#216382;border-bottom:5px solid #216382;width:100%}.active{color:#216382}.mobMenu{width:3rem;height:3rem;display:none;object-fit:cover}.navMenu{position:absolute;top:4rem;right:2rem;z-index:2;display:flex;flex-direction:column;padding:.5rem;height:fit-content;min-width:15rem;background:rgb(40,40,40);border-radius:1rem}.listItem{color:#fff;padding:.5rem 3rem;margin:.25rem;background:rgb(30,30,30)}@media screen and (max-width:720px){.mobMenu{display:flex}.desktopMenu{display:none}}#intro{height:calc(100vh - 4rem);width:100vw;max-width:75rem;margin:0 auto;position:relative;z-index:1}.bg{max-width:100%;height:90vh;position:absolute;top:-3rem;right:0;object-fit:cover;z-index:-1;transition:.3s;transition-property:all;margin-top:3rem;z-index:0}.introContent{height:100vh;width:100vw;padding:2rem;font-size:3rem;font-weight:700;display:flex;flex-direction:column;justify-content:center}.hi{font-size:1.75rem;font-weight:100;opacity:0;animation:slideBottom 1s ease forwards}.fn{color:#0ea5e9}.introPara{font-size:medium;font-weight:300;letter-spacing:1px;animation:slideLeft 1s ease forwards;text-align:left;color:#216382}.SocialBTN{margin:1rem 0;animation:slideLeft 1s ease forwards;animation-delay:calc(.1s * var(--i))}.desktopMenuBtn{background-color:#fff;border:none;color:#000;padding:10px;text-align:center;text-decoration:none;display:inline-block;font-size:16px;margin-top:-1rem;border-radius:12px;width:10rem}.desktopMenuBtn:hover{cursor:pointer;background-color:#216382;box-shadow:0 0 10px #216382,0 0 25px #216382,0 0 50px #216382,0 0 100px #216382,0 0 200px #216382}.hello{animation:slideRight 1s ease forwards}@media screen and (max-width: 480px){.bg{right:-1vw}}@media screen and (max-width: 720px){.bg{opacity:.3;top:-2rem}}@keyframes slideBottom{0%{transform:translateY(-100px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes slideRight{0%{transform:translate(-100px);opacity:0}to{transform:translate(0);opacity:1}}.text{font-size:3rem}.ani{margin-top:-2rem}.cursor{font-size:3rem}.contain{display:flex;flex-direction:row;gap:2rem;font-size:2.25rem}.social-icon{background-color:#191f36;box-sizing:content-box;padding:.5rem .75rem;border-radius:.5rem;animation:slideLeft 1s ease forwards;animation-delay:calc(.2s * var(--i));cursor:pointer;transition-duration:.3s}.social-icon:hover{box-shadow:0 0 10px #216382,0 0 25px #216382,0 0 50px #216382,0 0 100px #216382,0 0 200px #216382;color:#216382}@keyframes slideLeft{0%{transform:translate(100px);opacity:0}to{transform:translate(0);opacity:1}}#skills{width:100vw;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.contain1{display:flex;flex-direction:row;justify-items:center;align-items:center}.fName{background-color:#1e1e1e}.skillTitle{font-size:3rem;font-weight:600;padding-top:3rem;margin-bottom:1.5rem;animation:slideRight 1s ease forwards}.skillDes{font-weight:400;font-size:1rem;max-width:51rem;padding:0 2rem}.skillBars{display:flex;justify-content:space-around;flex-wrap:wrap;width:100vw;max-width:65rem}.skillBar{margin:1rem;padding:1.5rem 2rem;border-radius:.5rem;background:#0e4e6c;width:30%}.skillbarimg{object-fit:cover;height:5rem;width:5rem;margin-right:1rem}.skillBarText>p{font-size:.9rem;font-weight:200;text-align:center}@media (max-width: 768px){.skillBarText>p{font-size:2vw}.skillBars{width:100vw;margin-left:-6rem}.contain1{flex-direction:column}.skillBars{flex-direction:column;align-items:center;justify-content:center;margin-left:2%}.skillBar{flex-direction:column;align-items:center;text-align:center;width:80%}.skillbarimg{margin:0 0 10px}.skillBarText h2{font-size:16px}.skillBarText p{font-size:12px}}@media screen and (max-width:480px){.skillBarText>p{font-size:3vw}.skillbarimg{height:2.25rem;width:2.25rem}.skillBarText>h2{font-size:5vw}}#works{margin:0 auto;min-height:calc(100vh - 4rem);width:100vw;max-width:60rem;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 1rem;z-index:1}.worksTitle{margin:1rem 0;font-size:3rem}.worksDes{font-weight:300;font-size:1rem;max-width:45rem}.worksImgs{display:flex;justify-content:space-around;flex-wrap:wrap;width:100vw;max-width:65rem}.card{width:420px;height:250px;display:flex;box-shadow:0 7px 10px #00000080}.worksImg{height:15rem;margin:.5rem;border-radius:3rem;width:25rem}@media screen and (max-width:585px){.worksImg{height:48vw}}#contact{background-color:#323232;margin-top:5rem;padding:2rem}.contactPageTitle{display:flex;justify-content:center;align-items:center;position:relative}.contactDesc{display:flex;justify-content:center;align-items:center;padding:1rem;font-size:medium;font-weight:300}.contactForm{display:flex;flex-direction:column;justify-content:center;align-items:center;margin:1rem}.links{display:flex;flex-wrap:wrap;justify-content:center;align-items:center}.fname,.email,.msg{font-size:medium;width:100%;max-width:40rem;margin:.5rem;padding:.5rem 1rem;color:#fff;border:none;border-radius:.5rem;background-color:#1e1e1e;opacity:.7}.submitBtn{background:white;border:none;border-radius:.5rem;margin:2rem;padding:.75rem 3.5rem;cursor:pointer}.submitBtn:hover{cursor:pointer;background-color:#216382;box-shadow:0 0 10px #216382,0 0 25px #216382,0 0 50px #216382,0 0 100px #216382,0 0 200px #216382}.Container img{height:250px;width:200px;border-radius:20%;float:right;flex:1}.Container{margin-left:80%;margin-right:20%;padding-left:15%}.about{display:flex;align-items:center;justify-content:space-between;padding:50px;background-color:#1e293b;color:#f1f5f9;margin-top:2rem}.about-img{width:20rem;height:20rem;border-radius:50%;object-fit:cover;box-shadow:0 4px 8px #0003}.about-text{max-width:600px;margin-left:20px}.about-text h2{font-size:2rem;margin-bottom:20px;color:#0ea5e9}.about-text p{font-size:1rem;line-height:1.5;color:#94a3b8}@media (max-width: 720px){.about-img{display:none}}
