*{box-sizing:border-box}body{margin:0;font-family:Roboto,sans-serif;-webkit-font-smoothing:"Roboto",sans-serif;-moz-osx-font-smoothing:"Roboto",sans-serif;font-style:normal;box-sizing:border-box}h1,h2,h3,h4,h5,h6,p{margin:0}:root{--primary: #5e3bee;--heading-color: #282938;--bg-shade: #f5fcff;--github: #24292e;--darkblue: #1c1e53;--black: #000000;--white: #ffffff}.btn{font-family:Roboto;font-size:14px;display:inline-block;padding:14px 32px;font-style:normal;font-weight:400;line-height:24px;cursor:pointer;text-align:center;text-decoration:none;border-radius:4px;-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px;transition:background-color .5s;-webkit-transition:background-color .5s;-moz-transition:background-color .5s;-ms-transition:background-color .5s;-o-transition:background-color .5s}.btn-outline-primary{color:var(--primary);background-color:var(--white);border:1px solid var(--primary)}.btn-outline-primary:hover{color:var(--white);background-color:var(--primary)}.btn-primary{color:var(--white);background-color:var(--primary);border:1px solid var(--primary)}.btn-primary:hover{color:var(--primary);background-color:var(--white)}.btn-github{color:var(--white);background-color:var(--github);border:var(--github);display:flex;flex-direction:row;justify-content:center;align-items:center;box-shadow:0 1px 2px #101828f2;gap:16px}.btn-github:hover{color:var(--github);background-color:var(--white)}h1{font-size:56px;font-weight:700;line-height:67px}h2{font-size:48px;font-weight:700;line-height:58px}h3{font-size:24px;font-weight:700;line-height:34px}.text-lg{color:var(--darkblue);font-size:18px;font-style:normal;font-weight:400;line-height:27px}.text-md{color:var(--darkblue);font-size:16px;font-style:normal;font-weight:400;line-height:24px}.text-sm{color:var(--black);font-size:14px;font-style:normal;font-weight:400;line-height:21px}.section-title{color:var(--heading-color);font-size:21px;text-align:center;font-style:normal;font-weight:600;line-height:32px;display:flex;align-items:flex-start}.sub-title{color:var(--heading-color);font-size:16px;font-weight:600;line-height:24px}.navbar{display:flex;justify-content:space-between;background:var(--white);align-items:center;padding:15px 85.333px;box-shadow:0 5.333px 80px #0000001a;position:fixed;z-index:10;top:0;left:0;right:0}.navbar-logo{display:flex;flex-wrap:nowrap}.navbar-logo img{display:flex;border-radius:10px;width:200px;cursor:pointer;max-height:70px;min-width:70px}.navbar-items>ul{list-style:none;display:flex;align-items:flex-start;gap:42.667px;text-decoration:none}.navbar-items>ul>li>a{text-decoration:none}.navbar-content{color:var(--darkblue);font-size:16px;font-style:normal;font-weight:400;line-height:24px;cursor:pointer}.navbar-active-content{color:var(--primary)}.hero-section{min-height:100vh;display:grid;grid-template-columns:repeat(2,1fr);padding:133.333px 85.33px 133.33px;align-items:center;justify-content:center;gap:32px;background-color:var(--bg-shade)}.hero-section-content-box{display:flex;flex-direction:column;align-items:flex-start;gap:32px}.hero-section-content{display:flex;flex-direction:column;align-items:flex-start;gap:21.33px}.hero-section-content-box>button{margin-top:21.33px}.hero-section-title{color:var(--heading-color);font-size:74.667px;font-weight:700;line-height:90px;align-self:stretch}.hero-section-title-color{color:var(--primary)}.hero-section-title-description{color:var(--darkblue);font-size:24px;font-weight:400;line-height:36px}.hero-section-img{display:flex;justify-content:center;align-items:center}.hero-section-img>img{min-width:300px;width:100%;height:100%;border-radius:50%}.hero-section-button-group{display:flex;gap:20px;justify-content:space-between;align-items:center}.social-icon>ul{list-style:none;text-decoration:none;margin:0;padding:0;display:flex;justify-content:flex-end;align-items:center;gap:26px;flex-shrink:0}.social-icon-a{color:var(--black)}.social-icon>ul>li:hover{transform:translateY(-2px)}/*! About section */.about-section{display:grid;min-height:100vh;padding:133.3px 85.3px;align-items:center;justify-content:center;gap:144.6px;grid-template-columns:repeat(2,1fr)}.about-section-img>img{min-width:300px;width:100%;height:100%;max-height:900px;border-radius:20px}.about-section-description{font-weight:420;text-align:justify;line-height:1.6;font-size:16px;color:#333;letter-spacing:.5px;word-spacing:.5px}/*! All skill section */.allSkill-section{color:var(--heading-color);font-size:21px;text-align:center;min-height:100vh;padding:120.3px 85.3px;font-style:normal;font-weight:600;line-height:32px;display:flex;align-items:center;justify-content:center;background-color:var(--bg-shade)}.innerSectContainer{max-width:1000px;width:95vw;padding:0 auto;margin:0 auto}.sectTitle{text-align:center;font-size:2.5em;margin-bottom:20px;color:#333}.skillGroupTitle{font-size:1.2em;padding:20px 0 10px;color:#444}.skillGroup{display:flex;gap:15px;flex-wrap:wrap;margin:0;justify-content:center;align-content:center}.box{display:flex;flex-direction:column;align-items:center;justify-content:center;width:140px;height:120px;border:1px solid var(--primary);border-radius:10px;background:var(--white)}.skillBox{padding:5px}@media screen and (max-width: 465px){.box{width:100px;height:100px}.skillBox>p{display:none}.git-btn-text{display:none}}.box.skillBox svg{width:50px;height:50px;margin-bottom:10px}.box.skillBox:hover{transform:translateY(-5px);box-shadow:0 5px 15px #0003}.portfolio-section{display:flex;flex-direction:column;align-items:flex-start;min-height:100vh;padding:112px 85px;gap:80px}.portfolio-container-box{display:flex;justify-content:space-between;align-items:center;width:100%}.portfolio-container{display:flex;flex-direction:column;align-items:flex-start;gap:21.3px}.portfolio-section-container{display:grid;grid-template-columns:repeat(3,minmax(250px,400px));justify-content:center;align-items:stretch;width:100%;height:100%;gap:21.3px}.portfolio-section-img{border-radius:8px;width:100%}.portfolio-section-img>img{border-top-left-radius:12px;border-top-right-radius:12px;min-height:288px;object-fit:fill;width:100%}.portfolio-section-card{display:flex;flex-direction:column;align-items:flex-start;min-width:300px;height:100%;max-height:fit-content;flex:1;background:#fff;box-sizing:0 0 32px 0 rgba(0,0,0,.15);cursor:pointer;border-top-left-radius:12px;border-top-right-radius:12px}.portfolio-section-card:hover{border-radius:12px;transform:translateY(-5px);stroke:#006b6a;box-shadow:0 5px 15px #0003}.portfolio-section-card-content{display:flex;padding:32px;flex-grow:1;text-align:justify;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:32px;align-self:stretch}.portfolio-section-card-content>div>h3{text-align:left}.portfolio-section-title{color:var(--heading-color)}.portfolio-link{text-decoration:none;display:flex;gap:16px;border-bottom:1.33px solid var(--primary);padding-bottom:10.66px;font-weight:600}.portfolio-link:hover{color:var(--white);background-color:var(--primary);border:1px solid var(--primary);border-radius:5px;padding:5px;transition:.3s ease-in-out}/*! Contact section */.contact-section{display:flex;background:var(--bg-shade);min-height:100vh;padding:150px 85px;justify-content:center;align-items:center;text-align:center;flex-direction:column;gap:64px}.contact-form-container{display:grid;grid-template-columns:auto;grid-template-rows:repeat(5,auto)}.container{display:grid;grid-template-columns:repeat(2,auto);column-gap:32px;row-gap:32px}.contact-label{display:flex;flex-direction:column;align-items:flex-start;gap:10.6px;flex:1 0 0;width:100%}.contact-input{display:flex;font-family:Roboto;padding:16px;align-items:center;align-self:stretch;border-radius:8px;border:1.33px solid var(--primary);background-color:var(--white)}.contact-message{display:flex;padding:32px 0}.error-text{color:red}.success-icon{color:green;font-size:25px;margin-bottom:10px}.success-message{padding-bottom:32px}@media only screen and (max-width: 1800px){.hero-section-title{font-size:68px;line-height:70px}}/*! CSS for all section below 1200px */@media only screen and (max-width: 1200px){.btn-outline-primary{display:none}.hero-section{display:flex;flex-direction:column-reverse;padding-bottom:70px}.hero-section-title,.about-section-description{text-align:center}.skills-section-container,.about-section,.portfolio-container-box{display:flex;flex-direction:column}.portfolio-section-container{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}.portfolio-container,.hero-section-content,.hero-section-content-box{align-items:center}.portfolio-container-box{gap:30px}.contact-section{gap:20px;padding-top:70px;padding-bottom:70px}.about-section{padding:90px 80px;align-items:center;gap:20px}.section-heading{text-align:center}.hero-section-title,.skills-section-heading,.section-heading{font-size:35px;line-height:40px;text-align:center}.hero-section-content-box{gap:10px}.contact-form-container{width:100%}.container{display:flex;flex-direction:column;gap:10px}.social-icon>ul{padding:0;align-items:center}}.nav_hamburger{display:none;width:1.875rem;height:1.313rem;flex-direction:column;justify-content:space-around;position:absolute;top:32px;right:25px}.nav_hamburger_line{display:block;height:.188rem;width:100%;background-color:#000;border-radius:.625rem;transition:all ease-in-out .2s}@media screen and (max-width: 1200px){.nav_hamburger{display:flex;z-index:200}.navbar-items{display:flex}.navbar-items{position:absolute;display:flex;align-items:center;justify-content:center;background-color:#fff;top:-20rem;left:0;width:100%;transition:all ease-in-out .4s}.navbar-items ul{flex-direction:column;align-items:center;width:100%;padding:3rem 0 .6rem;z-index:-100}.navbar-items ul li{text-align:center}.navbar-items ul li a{padding:.5rem}.navbar-items{z-index:-1000}.navbar-items.active{top:30px}.nav_hamburger.active :nth-child(1){transform:rotate(45deg) translate(.45rem,.1875rem)}.nav_hamburger.active :nth-child(2){opacity:0}.nav_hamburger.active :nth-child(3){transform:rotate(-45deg) translate(.45rem,-.1875rem)}}@media screen and (max-width:414px){.section-heading{font-size:35px}.portfolio-section-card-content{text-align:center}.portfolio-section-card{border-radius:12px;box-shadow:0 5px 15px #0003}.portfolio-section-card:hover{transform:none}.portfolio-section-card-content>div>h3{text-align:center}.portfolio-section-img{display:none}}.notfound-container{height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;background-color:var(--bg-shade);color:var(--heading-color);font-family:Inter,sans-serif}.notfound-title{font-size:6rem;font-weight:800;margin:0;color:var(--heading-color)}.notfound-text{font-size:1.5rem;margin:.5rem 0 1.5rem;color:var(--heading-color)}body{margin:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}