@import "https://fonts.googleapis.com/css2?family=Poppins:wght@100;500;700&display=swap";
@import "https://fonts.googleapis.com/css2?family=Bangers&display=swap";
@font-face{font-family:Geist;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/fef07dbb0973bf53-s.00az9qtie3ho1.woff2)format("woff2");unicode-range:U+460-52F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:Geist;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/8a480f0b521d4e75-s.3j-a226dh71aj.woff2)format("woff2");unicode-range:U+301,U+400-45F,U+490-491,U+4B0-4B1,U+2116}@font-face{font-family:Geist;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/53b9e256198e5412-s.2gwoz23eiro2t.woff2)format("woff2");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Geist;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/7178b3e590c64307-s.0i3h3th1vs4m7.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Geist;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/caa3a2e1cccd8315-s.p.0zr6hhvz-h9nw.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Geist Fallback;src:local(Arial);ascent-override:95.94%;descent-override:28.16%;line-gap-override:0.0%;size-adjust:104.76%}.geist_a71539c9-module__T19VSG__className{font-family:Geist,Geist Fallback;font-style:normal}.geist_a71539c9-module__T19VSG__variable{--font-geist-sans:"Geist", "Geist Fallback"}
@font-face{font-family:Geist Mono;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/5ce348bf30bf5439-s.27spqqad3wyeo.woff2)format("woff2");unicode-range:U+460-52F,U+1C80-1C8A,U+20B4,U+2DE0-2DFF,U+A640-A69F,U+FE2E-FE2F}@font-face{font-family:Geist Mono;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/4fa387ec64143e14-s.3f4zuumv8svu0.woff2)format("woff2");unicode-range:U+301,U+400-45F,U+490-491,U+4B0-4B1,U+2116}@font-face{font-family:Geist Mono;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/6306c77e7c8268e4-s.34r5yzckw0h2s.woff2)format("woff2");unicode-range:U+2000-2001,U+2004-2008,U+200A,U+23B8-23BD,U+2500-259F}@font-face{font-family:Geist Mono;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/7d817b4c03b0c5f1-s.2jyz_zw3a8jit.woff2)format("woff2");unicode-range:U+102-103,U+110-111,U+128-129,U+168-169,U+1A0-1A1,U+1AF-1B0,U+300-301,U+303-304,U+308-309,U+323,U+329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Geist Mono;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/bbc41e54d2fcbd21-s.30bdpjkrtcces.woff2)format("woff2");unicode-range:U+100-2BA,U+2BD-2C5,U+2C7-2CC,U+2CE-2D7,U+2DD-2FF,U+304,U+308,U+329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Geist Mono;font-style:normal;font-weight:100 900;font-display:swap;src:url(../media/797e433ab948586e-s.p.1v5bejj26fx9h.woff2)format("woff2");unicode-range:U+??,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Geist Mono Fallback;src:local(Arial);ascent-override:74.67%;descent-override:21.92%;line-gap-override:0.0%;size-adjust:134.59%}.geist_mono_8d43a2aa-module__8Li5zG__className{font-family:Geist Mono,Geist Mono Fallback;font-style:normal}.geist_mono_8d43a2aa-module__8Li5zG__variable{--font-geist-mono:"Geist Mono", "Geist Mono Fallback"}
*{margin:0;padding:0;text-decoration:none;list-style:none}body{background:#fff;font-family:Poppins,sans-serif}header{z-index:9999;background:#259be9 no-repeat;width:100%;height:350px;position:relative}header:before{content:"";z-index:-1;background-image:url(/assets/header-cover-image.svg);width:100%;height:400px;position:absolute;bottom:-395px;transform:scaleY(-1)}nav{z-index:9999;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:0 0;justify-content:space-between;align-items:center;width:100%;height:65px;display:flex;position:fixed}.logo a{color:#000;text-transform:uppercase;-webkit-user-select:none;user-select:none;margin-left:40px}.nav-list{margin-right:40px}.nav-item{text-transform:uppercase;padding:0 20px;font-size:14px;font-weight:400;display:inline-block}.a-link{color:#2a2b2b;text-decoration:none}.resume-button{text-align:center;cursor:pointer;text-transform:capitalize;background:#000;border-radius:4px;width:100px;padding:10px;font-size:13px;font-weight:500}.resume-link{color:#fff;justify-content:space-between;align-items:center;display:flex}.nav-list-mobile{display:none}.menu-icons{width:20px;margin:0 30px;display:none}.header-container{align-items:center;width:100%;display:flex;overflow:hidden}.header-info{flex-direction:column;justify-content:center;align-items:center;width:100%;height:auto;margin-top:150px;display:flex}.info-title{color:#444;text-align:center;letter-spacing:2px;font-family:Bangers,system-ui;font-size:50px;position:relative}.info-title span{color:#fff;font-size:60px}.info-title .role-title{color:#2a2b2b00;-webkit-text-stroke:1px #561d1d;z-index:0;font-weight:500;position:relative}.info-title .role-title:before{content:var(--content);color:#ec0f0ff5;visibility:visible;z-index:0;position:absolute;transform:rotate(-362deg)}.info-des{color:#2a2b2b;width:80%;margin:5px 0;font-size:14px}.mobile-resume{display:none}.illustration{-webkit-user-select:none;user-select:none;width:50%;height:100%;margin-top:80px}.illut-image{width:100%;height:100%}.image-cover{background:0 0;width:100%;height:100%;position:absolute;top:0}.keyboard-container{z-index:999;background:#fff;border:.5px solid #f9f9f9;border-radius:12px;flex-direction:column;justify-content:center;width:100%;max-width:850px;margin:50px auto;padding:10px;display:flex;position:relative;box-shadow:0 8px 24px #959da533}.keyboard-row{justify-content:flex-start;align-items:center;width:100%;display:flex}.keyboard-row .key{color:#3d4349;cursor:pointer;-webkit-user-select:none;user-select:none;background:#f3f2f2;border-radius:5px;flex-direction:column;flex-grow:1;justify-content:center;align-items:center;height:30px;margin:2px;padding:10px;font-size:14px;display:flex;position:relative}.keyboard-row .key.active{color:#fff;background:#1198f6}.keyboard-row .key.backsapce-active{color:#fff;background:#eb0404}.key.space{flex-grow:8}.key.space:before{content:"Space"}.portfolio-section{z-index:0;flex-direction:column;align-items:center;width:100%;height:auto;margin-top:300px;display:flex;position:relative;overflow-x:clip}.portfolio-section:before{content:"";z-index:-1;background:#bfa99200;border:1px dashed #000;border-radius:50px;width:270px;height:270px;position:absolute;bottom:0;right:-92px;rotate:-20deg}.portfolio-section:after{content:"";z-index:-1;background:#ffac59bf;border-radius:50px;width:270px;height:270px;position:absolute;bottom:0;right:-100px;rotate:-20deg}.portfolio-cont{grid-template-columns:repeat(2,1fr);gap:20px;width:950px;height:auto;display:grid}.project{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#fff8;border:1px solid #e1e1e1;border-radius:8px;flex-direction:column;align-content:center;width:100%;transition:all .5s;display:flex;position:relative;overflow:hidden}.project:hover{box-shadow:0 8px 24px #959da533}.project-title{color:#242323;margin:10px;font-size:50px}.project-description{color:#727171;margin:0 10px;font-size:14px;font-weight:400;line-height:1.5}.project-language{margin:10px 5px}.project-button{text-align:center;color:#fff;background:#1198f6;border-radius:24px;width:100px;margin:10px;padding:10px 15px;font-size:14px;right:20px}.project-button:hover{opacity:.6}.language-list{color:#3d4349;background:#f3f2f2;border-radius:2px;margin:3px;padding:2px 13px;font-size:13px;display:inline-block}.preview-image{border-radius:7px;width:100%}.about-container{flex-direction:column;align-items:center;width:100%;height:auto;margin:auto;display:flex;position:relative}.about-container:after{content:"";z-index:-1;border:1px solid #464545;border-radius:50%;width:300px;height:300px;position:absolute;left:-147px}.about-container:before{content:"";z-index:-1;background:#259be96e;border-radius:50%;width:300px;height:300px;position:absolute;top:1%;left:-150px}.about-tab{flex-direction:column;align-items:center;width:100%;max-width:1300px;height:auto;padding:50px 0;display:flex}.about-heading,.portfolio-heading,.contact-heading{color:#259be9;letter-spacing:2px;text-align:center;z-index:2;margin:20px 0;font-family:Bangers,system-ui;font-size:45px;position:relative}.about-heading:before,.portfolio-heading:before,.contact-heading:before{content:"";color:#e0e0e0;z-index:-1;width:100%;height:100%;position:absolute;top:4px;left:0}.about-heading:before{content:"About Me"}.portfolio-heading:before{content:"Portfolio"}.contact-heading:before{content:"Contact"}.about-des{color:#464545;word-spacing:1px;width:60%;font-size:13px;font-weight:500}.social-links{grid-template-columns:auto auto auto auto;gap:5px;margin-top:20px;display:grid}.social-links *{color:#fff;text-align:center;width:120px;padding:8px 11px;font-size:14px;font-weight:500}.linkedin{background:#0a66c2}.github{background:#24292f}.whatsapp{background:#25d366}.email-link{background:#e40e06}.linkedin:hover,.github:hover,.whatsapp:hover,.email-link:hover{opacity:.7}.skill-section{background:green;align-items:center;width:100%;height:auto;display:flex}.skill-tab{flex-direction:column;align-items:center;width:100%;height:auto;padding:50px 0;display:flex;position:relative;overflow:hidden}.skill-tab:after{content:"";z-index:-1;border:1px solid #000;width:180px;height:180px;position:absolute;right:-100px;transform:rotate(100deg)}.skill-tab:before{content:"";z-index:-1;background:#259be96e;width:170px;height:170px;position:absolute;right:-80px;transform:rotate(100deg)}.skill-heading{color:#464545;text-align:center;font-size:18px;font-weight:500}.skills-cont{text-align:center;grid-template-columns:auto auto auto auto;justify-content:center;gap:5px;width:50%;height:auto;margin-top:10px;display:grid}.skill-name{text-align:center;cursor:pointer;background:#f3f2f2;border:2px solid #0000;width:160px;padding:10px 0;font-size:14px;font-weight:400}.plus{background:#fff;border:2px dashed #383737;font-size:15px}.contact-container{flex-direction:column;align-items:center;width:100%;height:auto;display:flex;position:relative}.contact-container:after{content:"";z-index:-1;border:1px solid #464545;border-radius:50%;width:300px;height:300px;position:absolute;bottom:-20%;left:-200px}.contact-container:before{content:"";z-index:-1;background:#259be96e;border-radius:50%;width:300px;height:300px;position:absolute;bottom:-20%;left:-210px}.contact-heading{padding:0}.contact-handler{flex-direction:column;justify-content:center;align-items:center;gap:20px;width:100%;max-width:500px;display:flex}.contact-info{align-items:center;gap:20px;width:100%;display:flex}.contact-btn{color:#2a2b2b;cursor:pointer;background:#f7f7f7;border:1px solid #e1e1e1;border-radius:12px;flex-direction:column;align-items:center;width:100%;padding:10px 15px;font-size:14px;display:flex}.contact-btn p{color:#727171;margin:5px 0 0;font-size:12px;position:relative}.contact-btn p:before{content:"";background:#e1e1e1;width:30px;height:1px;position:absolute;top:50%;left:-35px}.contact-btn p:after{content:"";background:#e1e1e1;width:30px;height:1px;position:absolute;top:50%;right:-35px}.contact-btn:hover{opacity:.8}.footer-social-links{grid-template-columns:repeat(4,1fr);gap:10px;width:100%;display:grid}.footer-social-links a{color:#3d4349;text-align:center;background:#f3f2f2;border:1px solid #e1e1e1;border-radius:12px;width:100%;padding:30px 0}@media screen and (max-width:1050px){.portfolio-cont{grid-template-columns:auto auto;width:90%}.skills-cont{grid-template-columns:auto auto auto;width:80%}}@media screen and (max-width:900px){.skills-cont{grid-template-columns:auto auto;width:90%}.keyboard-container{max-width:700px}}@media screen and (max-width:768px){nav{height:50px}.logo{font-size:18px}.nav-list{display:none}.menu-icons{display:block}.nav-list-mobile{background:#fff no-repeat;width:100%;height:100vh;display:block;position:absolute;top:0}.close-menu{width:20px;position:absolute;top:20px;right:30px}.nav-item-mobile{text-align:center;text-transform:uppercase;padding:10px}.nav-item-mobile:nth-child(2){margin-top:70px}.resume-button{text-transform:capitalize;margin-top:25px;position:absolute;left:50%;transform:translate(-50%,-50%)}.portfolio-section{margin-top:150px}.header-info{width:100%;margin-top:100px}header:after{display:none}.info-title{font-size:30px}.info-des{color:#2a2b2b;width:100%;margin:5px 0;font-size:14px}.mobile-resume{display:block;position:relative;top:5px;left:50px}.illustration{display:none}.portfolio-cont{grid-template-columns:auto}.about-des{width:85%}.social-links{grid-template-columns:auto auto}.skills-cont{grid-template-columns:auto auto;width:90%}.keyboard-container{display:none}}@media screen and (max-width:550px){.info-title .role-title{visibility:hidden;text-align:left;display:inline}.info-title .role-title:after{content:"Frontend Developer";visibility:visible;-webkit-text-stroke:1px #fff8f8;z-index:-1;position:absolute;top:0;left:0;transform:rotate(-362deg)}.info-title{font-size:65px}.info-title span{height:0;display:block}.project-title{margin-left:10px;font-size:40px;line-height:45px}.contact-handler{width:90%}.contact-info{flex-wrap:wrap}.footer-social-links{grid-template-columns:repeat(2,1fr)}}