.main{position:relative;height:100vh;overflow-x:hidden;overflow-y:hidden}.vid-image{width:100%;height:100%;object-fit:cover;position:absolute;top:0;left:0}.background-image{height:100%;object-fit:cover;position:absolute;top:0;left:45%}@media (max-width: 390px){.background-image{left:80%}}header{position:relative;width:100%;z-index:10}.content{position:absolute;width:100%;height:100%;top:30%;text-align:left;flex-direction:column;justify-content:center;color:#000;left:10%}.font{font-size:6em;color:#1f8aff;animation:fadeInFromLeft 1s ease-out both}.font-1{font-size:1.25em;animation:fadeInFromLeft 1s ease-out both}.font-2{font-size:1.5em;color:#3bc2ff;animation:fadeInFromLeft 1s ease-out both}.font-3{font-size:1.8em;animation:fadeInFromLeft 1s ease-out both}span{font-weight:400}@keyframes fadeInFromLeft{0%{opacity:0;transform:translate(-20px)}to{opacity:1;transform:translate(0)}}.socials{margin-right:2%;width:50px;height:50px}.socials:hover{opacity:.5}.buttons{padding-top:2.5%;animation:fadeInFromLeft 1.5s ease-out both}button.cta span{font-weight:400}.cta{position:relative;margin:auto;padding:12px 18px;transition:all .2s ease;border:none;background:none;cursor:pointer}.cta:before{content:"";position:absolute;top:0;left:0;display:block;border-radius:50px;background:#7ab8fd;width:45px;height:45px;transition:all .3s ease}.cta span{position:relative;font-size:18px;font-weight:700;letter-spacing:.05em;color:#000}.cta svg{position:relative;top:0;margin-left:10px;fill:none;stroke-linecap:round;stroke-linejoin:round;stroke:#000;stroke-width:2;transform:translate(-5px);transition:all .3s ease}.cta:hover:before{width:100%;background:#3bc2ff}.cta:hover svg{transform:translate(0)}.cta:active{transform:scale(.95)}.social-links,.flex-center{display:flex;justify-content:flex-start;align-items:center;animation:fadeInFromLeft 1.5s ease-out both}.social-btn{cursor:pointer;height:50px;width:50px;font-family:Titillium Web,sans-serif;color:#333;border-radius:10px;box-shadow:0 10px 10px #0000001a;background:#fff;margin:5px;transition:.3s;justify-content:center}.social-btn svg{height:24px;width:24px}.social-btn span{width:0px;overflow:hidden;transition:.3s;text-align:center;margin-left:5px}.social-btn:hover{width:150px;border-radius:5px}.social-btn:hover span{padding:2px;width:80px}#linkedin svg{fill:#0e76a8}#github{fill:#333}@media (max-width: 1100px){.content{align-items:left;padding-left:5%}.font{font-size:5em}.font-2{font-size:1.05em}.font-3{font-size:1.35em}}@media (max-width: 850px){.content{align-items:left}.font{font-size:4em}.font-2{font-size:.7em}}@media (max-width: 600px){.content{align-items:left}.font{font-size:4em}.font-2{font-size:9px}}*{padding:0;margin:0;box-sizing:0}:root{--mainColor: #3BC2FF;--mainColorLight: #1F8AFF;--secondaryColor: #1F8AFF;--textColor: black}header{display:flex;align-items:center;justify-content:flex-end;height:80px;padding:0 2rem;background-color:transparent;color:var(--textColor)}nav a{margin:0 2rem;color:var(--textColor);text-decoration:none}nav a:hover{color:var(--secondaryColor)}header .nav-btn{padding:5px;cursor:pointer;background:transparent;border:none;outline:none;color:var(--textColor);visibility:hidden;opacity:0;font-size:1.8rem;position:relative;right:4rem}@media only screen and (max-width : 1024px){header .nav-btn{visibility:visible;opacity:1}header nav{position:fixed;top:0;left:0;height:100%;width:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1.5rem;background-color:var(--mainColor);transition:1s;transform:translateY(-100vh)}header .responsive_nav{transform:none}nav .nav-close-btn{position:absolute;top:2rem;right:2rem}nav a{font-size:1.5rem}}.card{border:1px solid hsl(0,0%,80%);border-radius:10px;box-shadow:5px 5px 5px #0000001a;padding:20px;margin:10px;text-align:center;width:250px;height:100px;display:inline-block;opacity:0;transform:translateY(20px);transition:opacity .6s ease-out,transform .6s ease-out}.card .card-image{width:75px;height:75px;border-radius:30%;margin-bottom:10px}.card .card-title{margin:0;color:#333}.card .card-text{font-family:Arial,sans-serif;color:#4d4d4d}.card.visible{opacity:1;transform:translateY(0)}@keyframes fadeInFromBottom{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.cardExp{border:1px solid hsl(0,0%,80%);border-radius:10px;box-shadow:5px 5px 5px #0000001a;padding:20px;margin:10px;text-align:center;width:450px;height:180px;display:inline-block;opacity:0;transform:translateY(20px);transition:opacity .6s ease-out,transform .6s ease-out}.cardExp .cardExp-image{width:75px;height:75px;border-radius:30%;margin-bottom:10px}.cardExp .cardExp-title{margin:0;color:#333;font-size:1.6rem;font-weight:700}.cardExp .cardExp-pos{margin:0;color:#333;font-size:1.4rem}.cardExp .cardExp-time{margin:0;color:#333;font-size:1rem}.cardExp .cardExp-text{margin:10px;font-family:Arial,sans-serif;color:#4d4d4d}.cardExp.visible{opacity:1;transform:translateY(0)}@media (max-width: 768px){.cardExp{width:90%;height:180px;padding:15px;margin:10px auto}.cardExp .cardExp-title{font-size:1.4rem}.cardExp .cardExp-pos{font-size:1.2rem}.cardExp .cardExp-time,.cardExp .cardExp-text{font-size:.9rem}}.about{overflow-x:hidden;overflow-y:hidden;padding-bottom:5%}.card-info{border-radius:10px;padding:30px;margin:10px;text-align:left;width:45%;height:400px;display:inline-block;line-height:1.5;animation:fadeInFromLeft 1.25s ease-out both}.card-me{padding:50px;margin:10px;width:45%;height:100%;height:500x;display:inline-block;text-align:center;width:350px;height:350px;border-radius:50%;animation:fadeInFromLeft 1.25s ease-out both}.card-photo{text-align:center;width:350px;height:350px;border-radius:50%;margin-bottom:10px;animation:fadeInFromLeft 1.25s ease-out both}@media (max-width: 480px){.card-photo{width:270px;height:270px;position:relative;display:flex;align-items:center;justify-content:center}.card-me{margin-bottom:0%;height:270px;width:270px}}.bruh-2{padding:2%;font-size:1.3em;font-weight:400}.bruh-1{margin-left:5%;font-size:3em;padding:2%;animation:fadeInFromLeft 1.25s ease-out both}.bruh-3{margin-left:5%;font-size:3em;padding:2%;opacity:0;transform:translateY(20px);transition:opacity .6s ease-out,transform .6s ease-out}.bruh-3.transition{opacity:1;transform:translateY(0)}.bruh-4{font-size:2em;padding:.5%;opacity:0;text-align:center;transform:translateY(20px);transition:opacity .6s ease-out,transform .6s ease-out}.bruh-4.transition{opacity:1;transform:translateY(0)}@media (max-width: 1000px){.card-me{padding-bottom:0}.card-info{text-align:center;width:60%}}@media (max-width: 480px){.card-me{padding-bottom:0}.card-info{text-align:center;width:60%}.bruh-3{padding:10%}}.project-page{overflow-x:hidden;overflow-y:hidden;padding-bottom:5%}.project{padding-top:6%;opacity:0;transform:translateY(20px);transition:opacity 1.75s ease-out,transform 1.75s ease-out}.project.transition{opacity:1;transform:translateY(0)}.project p{font-size:1.5em;font-weight:300;line-height:1.5;margin:1em;width:50%}.video-me video-me{border-radius:10px;text-align:center;width:500px;height:300px;margin:0 auto;display:flex;justify-content:center;align-items:center}.video-me .card-video{text-align:center;width:500px;height:300px}.image-me .image-me{display:flex;justify-content:center;align-items:center}.image-me .image-me .card-image{border-radius:10px;text-align:center;width:500px;display:inline-block}.image-me .card-image{text-align:center;width:500px;height:300px}.laptop{transform:scale(.8)}.screen{border-radius:20px;box-shadow:inset 0 0 0 2px #c8cacb,inset 0 0 0 10px #000;height:318px;width:518px;margin:0 auto;padding:9px 9px 23px;position:relative;display:flex;align-items:center;justify-content:center;background-image:linear-gradient(15deg,#3f51b1,#5a55ae 13%,#7b5fac 25%,#8f6aae 38%,#a86aa4,#cc6b8e 62%,#f18271 75%,#f3a469 87%,#f7c978);transform-style:preserve-3d;transform:perspective(1900px) rotateX(-88.5deg);transform-origin:50% 100%;animation:open 4s infinite alternate}@keyframes open{0%{transform:perspective(1900px) rotateX(-88.5deg)}to{transform:perspective(1000px) rotateX(0)}}.screen:before{content:"";width:518px;height:12px;position:absolute;background:linear-gradient(#979899,transparent);top:-3px;transform:rotateX(90deg);border-radius:5px}.text{color:#fff;letter-spacing:1px;text-shadow:0 0 5px #fff;font-size:5em}.heads{width:100px;height:12px;position:absolute;background-color:#000;top:10px;left:50%;transform:translate(-50%,-0%);border-radius:0 0 6px 6px}.screen:after{background:linear-gradient(to bottom,#272727,#0d0d0d);border-radius:0 0 20px 20px;bottom:2px;content:"";height:24px;left:2px;position:absolute;width:514px}.keyboard{background:radial-gradient(circle at center,#e2e3e4 85%,#a9abac);border:solid #a0a3a7;border-radius:2px 2px 12px 12px;border-width:1px 2px 0 2px;box-shadow:inset 0 -2px 8px #6c7074;height:24px;margin-top:-10px;position:relative;width:620px;z-index:9}.keyboard:after{background:#e2e3e4;border-radius:0 0 10px 10px;box-shadow:inset 0 0 4px 2px #babdbf;content:"";height:10px;left:50%;margin-left:-60px;position:absolute;top:0;width:120px}.keyboard:before{background:0 0;border-radius:0 0 3px 3px;bottom:-2px;box-shadow:-270px 0 #272727,250px 0 #272727;content:"";height:2px;left:50%;margin-left:-10px;position:absolute;width:40px}@media (max-width: 800px){.video-me .card-video,.image-me .card-image{text-align:center;width:250px;height:150px}.project p{font-size:1em}.laptop{transform:scale(.6)}.screen{height:212px;width:344px}.screen:before{width:344px}.text{font-size:3em}.keyboard{width:414px}.keyboard:before{box-shadow:-190px 0 #272727,170px 0 #272727}}.tech-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}.tech-tags span{background-color:#3791f2;color:#fff;padding:6px 12px;border-radius:20px;font-size:14px;font-weight:500;white-space:nowrap;-webkit-user-select:none;user-select:none;cursor:default;box-shadow:0 0 6px #fff3;transition:background-color .3s ease}.tech-tags span:hover{background-color:#6eaaeb}.tech-stack{text-align:center;margin-top:16px}.tech-stack h4{margin-bottom:8px}.tech-tags{display:inline-flex;flex-wrap:wrap;gap:8px;justify-content:center;margin-bottom:24px}.contact-container{padding:2rem}.contact-form{display:flex;flex-direction:column;gap:1rem;max-width:400px;margin:0 auto}.contact-form input,.contact-form textarea{width:100%;padding:10px;font-size:1rem;border:1px solid #ccc;border-radius:5px}.contact-form button{background-color:#007bff;color:#fff;border:none;padding:10px;font-size:1rem;cursor:pointer;border-radius:5px}.contact-form button:hover{background-color:#0056b3}:root{font-family:-apple-system,BlinkMacSystemFont,sans-serif}*{padding:0;margin:0}