@import"https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap";.navbar{height:80px;background:var(--secondary-color);width:100%;padding:10px;color:var(--background-color)}.navbar .wrapper{max-width:1280px;margin:auto;display:flex;height:100%;align-items:center;justify-content:space-between}.navbar .wrapper .sidebarrr{display:none}.navbar .wrapper span{font-size:20px;font-weight:400;letter-spacing:1px}.navbar .wrapper span img{width:110px}.navbar .social{display:flex;justify-content:space-between;align-items:center;align-content:center;gap:15px;right:80px;padding:10px 20px;border-radius:5px}.navbar .social svg{display:none;font-size:30px;cursor:pointer}.navbar .social a{font-size:16px}@media (max-width: 479px){.navbar .wrapper .sidebarrr{display:block}.navbar .social,.navbar .social a{display:none}.navbar .social svg{display:block}}.sidebar{display:flex;flex-direction:column;align-items:center;justify-content:center;background:#fff;color:#000}.sidebar .bg{position:fixed;top:0;right:0;z-index:999;bottom:0;width:300px;background:#fff}.sidebar .bg .links{position:absolute;width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:20px}.sidebar .bg .links a{font-size:25px}.sidebar button{z-index:999;width:50px;height:50px;border-radius:50%;top:25px;position:fixed;background:transparent;border:none;right:25px;cursor:pointer;-webkit-border-radius:50%;-moz-border-radius:50%;-ms-border-radius:50%;-o-border-radius:50%}.hero{height:calc(100vh - 80px);overflow:hidden;background:linear-gradient(220deg,#f0f8ff,#f0f8ff);position:relative;cursor:pointer;display:flex;justify-content:space-between}.hero .wrapper{max-width:1000px;height:100%;margin:auto}.hero .wrapper .textContainer{width:50%;height:100%;display:flex;flex-direction:column;justify-content:center;gap:15px}.hero .wrapper .textContainer h2{font-size:24px;color:var(--another-color);letter-spacing:5px}.hero .wrapper .textContainer h1{font-size:40px;z-index:1}.hero .wrapper .textContainer .buttons{display:flex;gap:5px;z-index:1}.hero .wrapper .textContainer .buttons button{padding:10px;border:1px solid var(--primary-color);border-radius:5px;background:transparent;color:#000;font-weight:400;font-size:14px;letter-spacing:1.5px;-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;transition:all .5s ease-in-out;-o-border-radius:5px;cursor:pointer}.hero .wrapper .textContainer .buttons .Contact{background:var(--primary-color);color:#111132}.hero .wrapper .textContainer .Contact:hover{background:var(--background-color);color:#000}.hero .wrapper .textContainer .cv:hover{background:#fc6;color:#f0f8ff}.hero .imageContainer{height:100%;position:absolute;top:0;right:0;overflow:hidden;margin-right:120px}.hero .slidingText{font-size:50vh;position:absolute;bottom:-60px;white-space:nowrap;color:#25272910;width:50%;font-weight:700}@media (max-width: 479px){.hero{display:flex;flex-direction:column;justify-content:space-between}.hero .wrapper{margin-top:50px}.hero .wrapper .textContainer{width:100%;height:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;margin-right:5px}.hero .wrapper .textContainer h1{font-size:20px;text-align:center}.hero .imageContainer{margin-right:0;height:60%;position:absolute;top:40%;right:24%;overflow:hidden}.hero .imageContainer img{width:100%;height:100%;background-size:cover}}@media (max-width: 800px){.hero{display:flex;flex-direction:column;justify-content:space-between}.hero .wrapper{height:50%}.hero .wrapper .textContainer{margin-left:10px}.hero .imageContainer{margin-right:0}}.about-main-container{height:100vh;overflow:hidden;background:linear-gradient(220deg,#f0f8ff,#f0f8ff);position:relative;cursor:pointer}.about-main-container .wrapper{max-width:1150px;height:100%;margin:auto;padding:20px 0}.about-main-container .wrapper .text-img{display:flex;justify-content:space-between}.about-main-container .wrapper .text-img .textContainer{width:65%;height:100%;display:flex;align-items:center;flex-direction:column;justify-content:center;padding:20px;gap:8px}.about-main-container .wrapper .text-img .textContainer .imformation{display:flex;justify-content:space-between;flex-direction:row}.about-main-container .wrapper .text-img .textContainer .imformation .imfor{display:flex;flex-direction:column;gap:4px}.about-main-container .wrapper .text-img .textContainer .imformation .imfor span{font-size:16px;font-weight:400;letter-spacing:1.5px}.about-main-container .wrapper .text-img .textContainer .line{height:3px;width:100px;background:#969899;border-radius:25px}.about-main-container .wrapper .text-img .textContainer h2{font-size:20px;color:var(--another-color);font-weight:700}.about-main-container .wrapper .text-img .textContainer h3{font-size:17px;color:var(--secondary-color);font-weight:600}.about-main-container .wrapper .text-img .textContainer span{color:#636363;font-size:15px;line-height:28px}.about-main-container .wrapper .text-img .imageContainer{display:flex;justify-content:center;align-items:center}.about-main-container .wrapper .text-img .imageContainer .imageBackground{background:transparent;stroke-width:1.5px;background:#fc6;width:100%;height:100%;display:flex;justify-content:center;align-items:center;border-radius:15px}.about-main-container .wrapper .text-img .imageContainer .imageBackground img{margin-left:22px;margin-right:11px}@media (max-width: 768px){.about-main-container{overflow:scroll}.about-main-container .wrapper .text-img{display:flex;flex-direction:column}.about-main-container .wrapper .text-img .textContainer{margin-top:10px;width:100%;height:50%;padding:0 0 5px;gap:0px}.about-main-container .wrapper .text-img .textContainer h2{margin-bottom:0}.about-main-container .wrapper .text-img .textContainer h3{text-align:center;margin-bottom:5px;font-weight:400}.about-main-container .wrapper .text-img .textContainer .line{margin-bottom:5px}.about-main-container .wrapper .text-img .textContainer span{font-size:10px}.about-main-container .wrapper .imageContainer,.about-main-container .wrapper .imageContainer img{display:none}}@media (max-width: 867px){.about-main-container{overflow:scroll}.about-main-container .wrapper .text-img .textContainer{width:100%;height:100%;align-items:center;padding:20px;gap:0px}.about-main-container .wrapper .text-img .textContainer span{font-size:13px}.about-main-container .wrapper .text-img .imageContainer,.about-main-container .wrapper .text-img .imageContainer img{display:none}}@media (max-width: 479px){.about-main-container{overflow:scroll}.about-main-container .wrapper .text-img .textContainer{width:100%;height:100%;align-items:center;padding:0 10px;gap:0px}.about-main-container .wrapper .text-img .textContainer h3{font-size:15px}.about-main-container .wrapper .text-img .textContainer span{font-size:12px}.about-main-container .wrapper .text-img .imageContainer,.about-main-container .wrapper .text-img .imageContainer img{display:none}}.portfolio{position:relative}.portfolio .progress{position:sticky;top:0;left:0;padding:20px;text-align:center;color:var(--primary-color);font-size:15px}.portfolio .progress .progressBar{height:5px;border-radius:20px;-webkit-border-radius:20px;-moz-border-radius:20px;-ms-border-radius:20px;-o-border-radius:20px;border:none;outline:none;background:var(--primary-color)}.portfolio .container{display:flex;align-items:center;justify-content:center;width:100%;height:100%;overflow:hidden}.portfolio .container .wrapper{max-width:1000px;margin:auto;height:100%;display:flex;gap:10px;align-items:center;justify-content:center}.portfolio .container .wrapper .imagecontainer{height:50%;border-radius:15px}.portfolio .container .wrapper .imagecontainer img{width:100%;height:100%;object-fit:cover;border-radius:10px;-webkit-border-radius:10px;-moz-border-radius:10px;-ms-border-radius:10px;-o-border-radius:10px}.portfolio .container .wrapper .textcontainer{flex:1;display:flex;flex-direction:column;gap:6px}.portfolio .container .wrapper .textcontainer h2{font-size:25px;font-weight:500}.portfolio .container .wrapper .textcontainer p{color:gray;font-size:12px;letter-spacing:.4px}.portfolio .container .wrapper .textcontainer .button-container{display:flex;gap:5px}.portfolio .container .wrapper .textcontainer .button-container .button1{background:#000;color:#fff;border-radius:8px;border:none;width:140px;padding:8px;-webkit-border-radius:8px;-moz-border-radius:8px;-ms-border-radius:8px;-o-border-radius:8px;cursor:pointer}.portfolio .container .wrapper .textcontainer .button-container .button{background:#fc6;border-radius:8px;border:none;width:140px;padding:8px;-webkit-border-radius:8px;-moz-border-radius:8px;-ms-border-radius:8px;-o-border-radius:8px;cursor:pointer}@media (max-width: 479px){.portfolio{position:relative}.portfolio .progress{transform:none!important;padding-top:calc(100vh - 100px);font-size:14px;z-index:-1}.container{width:100%;height:100vh;display:flex;justify-content:center;align-items:center}.container .wrapper{flex-direction:column}.container .wrapper .imagecontainer{width:100%;max-height:200px;object-fit:cover}.container .wrapper .imagecontainer img{object-fit:contain}.container .wrapper .textcontainer{transform:none!important}}:root{--primary-color: #ffcc66;--secondary-color: #336699;--background-color: aliceblue;--another-color: #003366}.container{width:100%;min-height:100vh;padding:30px 10%}.container .main-title{max-width:700px;margin:0 auto;text-align:center}.container .main-title h1{position:relative;font-size:40px;font-weight:500;color:var(--primary-color);margin-bottom:10px;display:inline-block}.container .main-title h1:before{content:"";position:absolute;width:100%;height:1px;top:100%;left:0;background-color:#369}.container .main-title h1:after{content:"";position:absolute;width:50%;height:3px;background-color:var(--primary-color);top:calc(100% - 1px);left:50%;transform:translate(-50%)}.container .main-title p{color:#929191;font-family:helvetica;letter-spacing:.5px;font-size:17px}.container .row{width:100%;display:flex;justify-content:space-between;margin-top:50px}.container .row .col{flex-basis:46%}.container .row .col .sub h2{position:relative;color:var(--secondary-color);font-size:22px;font-weight:500;display:inline-block;margin-bottom:20px}.container .row .col .sub h2:before{content:"";position:absolute;width:50%;height:1px;top:125%;left:0;background:gray}.container .row .col .sub h2:after{content:"";position:absolute;width:25%;height:3px;top:calc(125% - 1px);left:0;background-color:var(--primary-color)}.container .row .col .skill-container .skill .subject{font-size:14px;font-weight:thin;color:#6e6e6e;text-transform:uppercase;padding-bottom:8px}.container .row .col .skill-container .skill .progress-bar{position:relative;width:100%;height:3px;background-color:#80808049;border-radius:15px;margin-bottom:12px}.container .row .col .skill-container .skill .progress-bar .progress-line{position:absolute;width:0%;height:4px;background-color:var(--primary-color);border-radius:15px;top:-1px;animation:animate 1.5s cubic-bezier(1,.2,.2,1) forwards}.container .row .col .skill-container .skill .progress-bar .c{content:"";position:absolute;width:9px;height:9px;border-radius:50%;top:-75%;left:100%;transform:translate(-50%,-50%);background-color:var(--primary-color)}.container .row .col .skill-container .skill .progress-bar:after{position:absolute;content:attr(value);top:-35px;right:0;color:#6e6e6e;font-size:14px}@keyframes animate{to{width:100%}}@media (max-width: 768px){.container{padding:20px 5%}}@media (max-width: 479px){.container{flex-direction:column}.container .main-title h1{font-size:25px;margin-bottom:20px}.container .main-title p{font-size:13px}.container .row{display:flex;flex-direction:column;justify-content:space-between;gap:0;margin-top:0}.container .row .col .sub h2{font-size:18px}.container .row .col .skill-container .skill .subject{font-size:13px}.container .row .col .skill-container .skill .progress-bar{margin-bottom:10px}.container .row .col .skill-container .skill .progress-bar:after{font-size:13px}}.main-services{padding:40px}.main-services .services{display:flex;flex-direction:column;gap:20px;align-items:center}.main-services .services h1{position:relative;font-size:40px;color:var(--another-color);margin-bottom:30px;display:inline-block}.main-services .services h1:before{content:"";position:absolute;width:100%;height:1px;top:125%;left:0;background-color:#369}.main-services .services h1:after{content:"";position:absolute;width:50%;height:3px;background-color:var(--another-color);top:calc(125% - 1px);left:50%;transform:translate(-50%)}.main-services .services .containers{display:flex;flex-direction:column;gap:10px;align-items:center;font-weight:300}.main-services .services .containers h2{text-align:center;text-transform:capitalize;color:var(--secondary-color)}.main-services .services .containers .p{font-size:19px;letter-spacing:1px;padding:20px;font-weight:600;color:#369}.main-services .services .containers .container{display:flex;justify-content:space-evenly}.main-services .services .containers .container .box{padding:20px;width:30%;background:var(--secondary-color);height:250px;text-align:center;align-items:center;align-content:center;border-radius:15px;color:#f0f8ff;gap:4px;display:flex;flex-direction:column;justify-content:center}.main-services .services .containers .container .box p{font-size:18px;font-weight:400}.main-services .services .containers .container .box span{font-size:14.5px}.main-services .services .containers .container .box li{text-decoration:none;list-style-type:none;font-size:14px;font-weight:lighter;letter-spacing:1px}@media only screen and (max-width: 30em){.main-services .services h1{font-size:20px;margin-bottom:10px;transform:none!important}.main-services .services .containers{gap:3px}.main-services .services .containers h2{font-size:17px}.main-services .services .containers .p{padding:0}.main-services .services .containers .container{display:flex;flex-direction:column;justify-content:start;gap:10px}.main-services .services .containers .container .box{width:100%;height:250px}.main-services .services .containers .container .box p{font-size:12px;font-weight:400}.main-services .services .containers .container .box span{font-size:10px}.main-services .services .containers .container .box li{text-decoration:none;list-style-type:none;font-weight:700;font-size:10px}}.contact{max-width:1000px;margin:auto;height:100vh;width:100%;display:flex;gap:20px;align-items:center}.contact .textContainer{flex:1;display:flex;flex-direction:column;gap:10px}.contact .textContainer h1{font-size:60px;color:var(--another-color);line-height:60px}.contact .textContainer .item{gap:5px}.contact .textContainer .item h2{font-weight:500;font-size:28px;color:var(--primary-color)}.contact .textContainer .item span{font-weight:200;font-size:14px;color:var(--secondary-color);letter-spacing:1px}.contact .formContainer{position:relative;flex:1}.contact .formContainer .phone{position:absolute;margin:auto;z-index:-1}.contact .formContainer form{display:flex;flex-direction:column;gap:15px}.contact .formContainer form input{height:35px;background:transparent;border:.5px solid gray;padding:14px;letter-spacing:1px;color:#000;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px}.contact .formContainer form textarea{background:transparent;border:.5px solid gray;padding:14px;color:#000;border-radius:5px;-webkit-border-radius:5px;-moz-border-radius:5px;-ms-border-radius:5px;-o-border-radius:5px}.contact .formContainer form button{padding:7px;background-color:var(--primary-color);color:#000;border:none;border-radius:7px;font-weight:600;cursor:pointer}@media (max-width: 479px){.contact{display:flex;flex-direction:column}.contact .textContainer{flex:1;display:flex;flex-direction:column;gap:8px;padding:15px;justify-content:center}.contact .textContainer h1{font-size:29px;margin-top:15px}.contact .textContainer h2{font-size:17px}.contact .formContainer{width:80%;padding-bottom:18px}}:root{--primary-color:#FFCC66;--secondary-color:#336699;--background-color:aliceblue;--another-color:#003366}*{margin:0;padding:0;box-sizing:border-box;font-family:Poppins,sans-serif}.main{margin:auto}.main .project{background:var(--background-color)}.main .slick-next,.main .slick-prev{border-radius:50%;background:#036}.main .slick-list,.main .slick-slider,.main .slick-track{padding:1rem 0}html{scroll-snap-type:y mandatory;scroll-behavior:smooth}a{text-decoration:none;color:inherit}body{background:var(--background-color)}section{height:100vh;scroll-snap-align:center;overflow:hidden}@media (max-width: 479px){section{height:100vh;scroll-snap-align:center;overflow:hidden}.skill-section{overflow:scroll}}