@import"https://fonts.googleapis.com/css2?family=Poppins:wght@100;300;400;500;600;700&display=swap";:root{--primary: #1877f2;--bg-color:#ffff;--bg-shade-start: #f5fcff;--bg-shade-end: #dbc1ac;--letter-color1: #201c19;--letter-color2: #dbc1ac}*{padding:0;margin:0;box-sizing:border-box}html{scroll-snap-type:y mandatory;scroll-behavior:smooth}body{background:linear-gradient(to bottom,var(--bg-shade-start),var(--bg-shade-end));font-family:Poppins,Montserrat,sans-serif;color:var(--letter-color1);min-height:100vh;overflow-x:hidden}a{text-decoration:none;color:var(--letter-color1)}section{height:100vh}.main-layout-wrapper{height:90vh;width:100vw;background-color:#d3d3d3;display:flex;align-items:center;justify-content:center;scroll-snap-align:center}.about-wrapper{display:flex;flex-direction:column;gap:10px;max-width:1366px;margin:20px auto auto;height:100%;scroll-snap-align:center}.about-wrapper .top{display:flex;flex-direction:column;gap:10px;align-items:center;justify-content:center;height:100px}.about-wrapper .top h3{font-weight:400;font-size:20px}.about-wrapper .top h2{font-weight:500;font-size:35px}.about-wrapper .bottom{height:calc(100vh - 110px);display:flex;align-items:center;justify-content:center;gap:50px}.about-wrapper .left{flex:1;display:flex;align-items:center;justify-content:center}.about-wrapper .left img{width:430px;height:440px;border-radius:15px;object-fit:cover;background:linear-gradient(to bottom,lightgray,var(--bg-shade-start),var(--bg-shade-end))}.about-wrapper .right{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:25px}.aboutme-badges{display:flex;gap:20px}.aboutme-badge{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;background-color:var(--bg-color);border-radius:10px;padding:15px 25px;flex:1;text-align:center}.aboutme-badge img{width:50px;height:50px;object-fit:fill;border-radius:100%}.aboutme-badge p{font-weight:300;font-size:15px}.bio-container{display:flex;gap:10px;flex-direction:column}.bio-container p{font-weight:300;font-size:13px}.bio-container h2{background:linear-gradient(180deg,red,#00f);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.bio-container img{width:120px;height:40px;object-fit:fill}.bio-container div{width:95%;text-align:right}@media (max-width: 1366px){.about-wrapper{max-width:1186px}}@media (max-width: 1098px){.about-wrapper{max-width:998px;gap:6px}.about-wrapper .bottom{gap:30px}.about-wrapper .left img{width:380px;height:380px}}@media (max-width: 1026px){.about-wrapper{max-width:960px;padding:10px 0}.about-wrapper .top{height:50px}.about-wrapper .top h3{font-weight:300;font-size:15px}.about-wrapper .top h2{font-weight:500;font-size:25px}.about-wrapper .left img{width:350px;height:350px}.aboutme-badges,.about-wrapper .right{gap:10px}.about-wrapper .right p{font-size:13px}}@media (max-width: 853px){.about-wrapper{max-width:650px}.about-wrapper .bottom{flex-direction:column}.about-wrapper .left{display:none}.about-wrapper .right{gap:10px}}@media (max-width: 698px){.about-wrapper{max-width:500px}}@media (max-width: 532px){.about-wrapper{max-width:400px}.aboutme-badge{padding:10px;gap:5px}.aboutme-badge img{width:30px;height:30px}.aboutme-badge h3{font-size:13px}.aboutme-badge p{font-size:10px}}@media (max-width: 452px){.about-wrapper{max-width:320px}}@media (max-width: 350px){.about-wrapper{max-width:300px}}@media (max-width: 325px){.about-wrapper{max-width:200px}.bio-container h2,img{display:none}}.hero{height:calc(100vh - 100px);max-width:100vw;overflow-x:hidden}.hero-wrapper{min-height:100%;max-width:1366px;margin:auto;display:flex;align-items:center;justify-content:center;gap:50px;scroll-snap-align:center}.hero-wrapper .left{flex:1;min-height:100%;display:flex;align-items:center;justify-content:center}.hero-wrapper .left img{width:430px;height:430px;border-radius:100%;object-fit:cover;background:linear-gradient(to bottom,lightgray,var(--bg-shade-start),var(--bg-shade-end))}.hero-wrapper .right{flex:1.5;min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px}.hero-wrapper h3{font-weight:400;font-size:20px}.hero-wrapper h1{font-weight:700;font-size:55px;letter-spacing:7px;white-space:nowrap}.hero-wrapper h2{font-weight:500;font-size:35px;background:linear-gradient(90deg,red,#00f);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.awardList{display:flex;gap:8px}.awardList img{width:50px;height:50px;padding:8px;background:var(--bg-color);border-radius:100%;cursor:pointer}.awardList a:nth-of-type(1) img:hover{transform:scale(1.2) rotate(10deg)}.awardList a:nth-of-type(2) img:hover{transform:scale(1.2) rotate(-10deg)}.hero-links{display:flex;align-items:center;justify-content:center;gap:10px}.hero-links button{padding:10px 15px;width:200px;border-radius:40px;border:.5px solid var(--letter-color1);cursor:pointer;white-space:nowrap}.hero-links button:nth-child(1){background-color:var(--bg-color);color:var(--letter-color1);font-weight:600}.hero-links a:nth-child(2) button{background:var(--letter-color1);color:var(--bg-color);font-weight:500}.hero-links button:hover{transform:scale(1.05);transition:1s}.right .animated-conatiner{width:100%;display:flex;align-items:center;justify-content:flex-end}.animated-conatiner img{height:100%;filter:invert(1)}.sliding-text-container{position:absolute;bottom:0;left:0;max-height:40vh;min-height:max-content;max-width:100vw;z-index:-1;overflow-x:hidden}.sliding-text-container h1{white-space:nowrap;display:inline-block;color:#1b17170e;font-weight:700;font-size:30vh;padding-left:95%;padding-right:5%;animation:slideText 30s ease-in-out infinite alternate}@keyframes slideText{0%{transform:translate(0)}to{transform:translate(-98%)}}@media (max-width: 1366px){.hero-wrapper{max-width:1186px}}@media (max-width: 1098px){.hero-wrapper{max-width:998px}.hero-wrapper{gap:30px}.hero-wrapper .left img{width:350px;height:350px}.hero-wrapper .right h3{font-weight:400;font-size:15px}.hero-wrapper .right h1{font-weight:600;font-size:40px}.hero-wrapper .right h2{font-weight:500;font-size:30px}}@media (max-width: 890px){.hero-wrapper{max-width:850px}.hero-wrapper{gap:15px}.hero-wrapper .left img{width:320px;height:320px}.hero-wrapper .right h1{font-weight:500;font-size:40px;letter-spacing:1px}.hero-wrapper .right h2{font-weight:400;font-size:20px}.hero-links button{padding:10px 15px;width:150px}}@media (max-width: 700px){.hero-wrapper{max-width:650px;flex-direction:column}.hero-wrapper .left{min-height:50%;min-width:100vw}.hero-wrapper .left img{width:250px;height:250px}.hero-wrapper .right{gap:2px;min-height:50%;min-width:100vw;justify-content:space-between}.right .animated-conatiner{display:none}.awardList img{width:30px;height:30px;padding:5px}.sliding-text-container{bottom:20%}.sliding-text-container h1{font-size:10vh;padding-left:50%;padding-right:5%}}@media (max-width: 447px){.hero-wrapper .right{justify-content:flex-start;gap:5px}.hero-wrapper .right h1{font-weight:600;font-size:25px;letter-spacing:2px}.hero-links button{padding:10px 15px;font-size:10px;width:100px}}@media (max-width: 330px){.hero-wrapper .left img{width:200px;height:200px}.hero-links button{width:max-content}}@media (max-width: 279px){.hero-wrapper{max-width:250px}.hero-wrapper .right h1{font-weight:500;font-size:20px}}.bio{height:100%;scroll-snap-align:center}.bio-wrapper{height:100%;max-width:1366px;margin:auto;display:flex}.bio-text-wrapper{padding:20px;display:flex;flex-direction:column;gap:50px;flex:1;overflow-y:scroll}.bio-text-wrapper::-webkit-scrollbar{display:none}.bio-text-wrapper h3{background:linear-gradient(180deg,red,#00f);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.skills-conatiner{display:flex;flex-direction:column;gap:10px}.skills-lists{display:flex;gap:5px;flex-wrap:wrap;padding-right:10px}.skills-lists span{background-color:var(--letter-color1);color:var(--bg-color);padding:4px 13px;border-radius:5px;font-size:13px;letter-spacing:1px}.skills-lists span:hover{background-color:var(--bg-color);color:var(--letter-color1);transition:1s}.scroll-button{cursor:pointer}.experiance-wrapper{display:flex;flex-direction:column;gap:10px}.experiance-conatiner{display:flex;flex-direction:column}.experiance-list-item{display:flex;justify-content:space-between;gap:10px}.experiance-item-left{flex:1}.experiance-item-centre{flex:.2}.experiance-item-right{flex:1}.job-title{background-color:var(--bg-color);padding:10px 15px;font-weight:500;font-size:15px;border-radius:10px}.job-desc{padding:5px 0;font-style:italic;font-size:13px}.job-date{padding:5px 0;font-size:13px;font-weight:500;color:brown}.job-company{background-color:var(--bg-color);padding:5px 8px;font-weight:400;font-size:13px;border-radius:5px;width:max-content}.line{height:100%;width:3px;background-color:var(--letter-color1);position:relative;display:flex;align-items:center}.line-circle{height:20px;width:20px;border:solid 2px var(--letter-color1);border-radius:100%;background-color:var(--bg-color);position:absolute;left:-8px}.bio-svg-wrapper{flex:1;display:flex;align-items:center;justify-content:center}@media (max-width: 1366px){.bio-wrapper{max-width:1186px}}@media (max-width: 907px){.line-circle{background:var(--letter-color1)}}@media (max-width: 855px){.bio-wrapper{max-width:800px}.skills-lists span{font-size:10px}.bio-text-wrapper{flex:1.3}.bio-svg-wrapper{flex:1}.line-circle{background:var(--letter-color1)}}@media (max-width: 655px){.bio-wrapper{max-width:710px}.bio-svg-wrapper{display:none}.line-circle{background-color:var(--bg-color)}}@media (max-width: 475px){.line-circle{background:var(--letter-color1)}.experiance-item-left,.experiance-item-right{padding:10px}}@media (max-width: 366px){.line,.line-circle{display:none}.experiance-list-item{padding:10px 0}.experiance-item-right{border-left:dotted 3px black;padding:0 10px}}.project{min-height:calc(100vh - 100px)}.project-main-wrapper{max-width:1185px;margin:auto;display:flex;flex-direction:column}.project-header-conatiner{min-height:calc(100vh - 100px);display:flex;flex-direction:column;align-items:center}.scroll-project-div{margin:auto;top:0;left:0;bottom:0;right:0}.project-header{min-width:100%;text-align:center}.project-header h1{position:sticky;top:0;font-weight:800;font-size:45px;background:linear-gradient(180deg,red,#00f);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.scroll-project-div img{height:22%;object-fit:cover;filter:invert(1) brightness(0%)}.project-section{scroll-snap-align:center;min-height:100vh}.project-wrapper{height:100%;width:100%;display:flex;align-items:center;justify-content:center;gap:50px}.project-section:nth-of-type(odd) .project-wrapper{flex-direction:row-reverse}.project-img-wrapper{flex:1;display:flex;align-items:center;justify-content:space-between;height:100%}.button-conatiner{height:35px;width:35px;display:flex;align-items:center;justify-content:center;border-radius:100%}.prev,.next{width:25px;height:25px;display:flex;align-items:center;justify-content:center;padding:5px;background-color:var(--bg-color);border:.5px solid lightgray;border-radius:100%;object-fit:cover;cursor:pointer;z-index:1}.prev:disabled,.next:disabled{background-color:gray;color:#aaa;cursor:not-allowed}.project-main-img-container{width:100%;height:350px;display:flex;justify-content:center;align-items:center;position:relative;background-color:#6b5252;border-radius:6px}.project-image{width:100%;height:100%;object-fit:cover;border-radius:6px;clip-path:polygon(0% 0%,100% 0%,100% 89%,0% 100%);transform:rotate(4.5deg) translateY(20px);border:.5px solid lightgray;cursor:grab}.tech-images{width:100%;display:flex;justify-content:flex-end;align-items:center;z-index:1;gap:5px;position:absolute;bottom:5px;right:0;margin-right:5px}.project-image:hover{border:none;transform:rotate(0) scale(1.1) translateY(-10px);clip-path:polygon(0% 0%,100% 0%,100% 100%,0% 100%);transition:all 1s ease}.tech-img{width:30px;height:30px;padding:5px;background-color:var(--bg-color);border-radius:100%}.project-text-wrapper{flex:1;display:flex;align-items:center;justify-content:center;height:100%}.project-text-container{display:flex;align-items:start;justify-content:center;flex-direction:column;gap:8px;height:100%;width:100%}.project-text-container h1{font-weight:400;font-size:30px}.project-text-container p{font-size:15px;font-weight:300;color:var(--letter-color1)}.listConatiner ul{padding:5px 25px;font-size:13px;font-weight:300}.listConatiner li{padding:3px 5px}.project-text-container .listConatiner h4{font-size:15px;font-weight:400}.project-buttons-conatiner{display:flex;gap:15px;align-items:center;justify-content:space-between}.project-buttons-conatiner button{font-size:15px;font-weight:200;width:120px;border:none;padding:10px 15px;border-radius:6px;cursor:pointer}.project-buttons-conatiner a:nth-child(1) button{background-color:var(--letter-color1);color:var(--bg-color)}.project-buttons-conatiner a:nth-child(2) button{background-color:var(--bg-color);color:var(--letter-color1)}.project-buttons-conatiner button:hover{transform:scale(1.1);transition:all .5s ease-out}@media (max-width: 1025px){.project-main-wrapper{max-width:950px}.project-text-container h1{font-size:25px}.project-text-container p{font-size:13px}.listConatiner ul{font-size:10px}.project-buttons-conatiner{gap:10px}.project-buttons-conatiner button{font-size:13px;width:max-content;padding:8px 10px}}@media (max-width: 767px){.project-main-wrapper{max-width:700px}.project-header h1{font-weight:400;font-size:30px}.project-text-container h1{font-size:20px}.listConatiner ul:nth-of-type(2){display:none}.project-image:hover{transform:rotate(0) scale(1) translateY(-10px)}}@media (max-width: 600px){.project-header-conatiner{min-height:calc(100vh - 60px)}.project-main-wrapper{max-width:500px}.project-wrapper{flex-direction:column;gap:10px}.project-section:nth-of-type(odd) .project-wrapper{flex-direction:column}.project-img-wrapper{flex:.7;height:50%;padding:10px 5px}.project-main-img-container{height:230px;background-color:transparent}.project-image{clip-path:polygon(0% 0%,100% 0%,100% 100%,0% 100%);transform:rotate(0)}.project-image:hover{transform:translateY(10px)}.project-text-wrapper{flex:1;height:50%}.project-text-container h1{font-size:20px}.listConatiner ul:nth-of-type(2){display:none}}@media (max-width: 490px){.project-header{min-height:calc(100vh - (100vh - 200px))}.project-main-wrapper{max-width:390px}.project-img-wrapper{flex:1.5}.project-text-wrapper{flex:1}.project-text-container{align-items:center;justify-content:flex-start;gap:10px}.listConatiner{display:none}.project-buttons-conatiner button{font-size:10px;width:max-content;padding:8px}}.section-conatct{height:calc(100vh - 180px)}.contact-wrapper{max-width:1366;height:100%;margin:auto;display:flex;align-items:center;justify-content:center;gap:50px;padding:20px}.contact-text-conatiner{flex:1;height:100%;display:flex;align-items:center;justify-content:center}.contact-text-conatiner span{font-size:35px;font-weight:600;letter-spacing:1px}.contact-text-conatiner .contact-animated-text{background:linear-gradient(180deg,red,#00f);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.contact-form-conatiner{flex:1;display:flex;align-items:center;justify-content:center;background-color:#df94a40e;border-radius:6px;height:100%}.mail-form{width:100%;display:flex;flex-direction:column;gap:15px;padding:5px 20px;font-size:15px}.mail-form textarea,input{background-color:transparent;border:none;border-bottom:1.5px black solid;outline:none;resize:none;letter-spacing:1px;font-size:15px}.mail-form button{color:var(--bg-color);border:none;padding:10px;border-radius:6px;background-color:var(--letter-color1);cursor:pointer;z-index:2}.success{color:green}.err{color:red}@media (max-width: 1366px){.contact-wrapper{max-width:1186px}}@media (max-width: 834px){.contact-text-conatiner span{font-size:25px;font-weight:500;letter-spacing:.5px}.contact-text-conatiner{flex:1}.contact-form-conatiner{flex:1.5}}@media (max-width: 520px){.contact-wrapper{flex-direction:column;gap:10px}.contact-text-conatiner{height:30%;width:80%}.contact-form-conatiner{height:70%;width:80%}}@media (max-width: 460px){.section-conatct{height:calc(100vh - 160px)}}.navbar{height:100px;background-color:var(--bg-color);scroll-snap-align:center}.nav-wrapper{max-width:1366px;margin:auto;height:100%;display:flex;align-items:center;justify-content:space-between}.nav-wrapper .logo span{font-weight:600;font-size:20px}.logo span:nth-child(1){background:linear-gradient(90deg,red,#00f);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.links{display:flex;align-items:center;gap:30px}.links a:not(.selected):hover{transform:scale(1.1,1.2);transition:all .5s ease-out}.selected{color:var(--letter-color1);border:.5px solid var(--letter-color1);padding:5px 15px;border-radius:6px}.selected:hover{cursor:default}.sidebar-menu{display:none}.sidebar-menu .sidebar-links{position:fixed;top:0;right:0;height:100vh;width:50vw;background-color:var(--bg-color);opacity:.95;display:flex;flex-direction:column;gap:15px;justify-content:center;align-items:center;z-index:2}.sidebar-menu .sidebar-links a:not(.selected):hover{transform:scale(1.1);transition:all .5s ease-out}.toggle-button{width:22px;height:18px;border:none;cursor:pointer;background-color:var(--bg-color);display:flex;flex-direction:column;justify-content:space-between;z-index:3}.toggle-button .lines{width:22px;height:3px;background-color:var(--letter-color1);border-radius:20px}.toggle-button .lines:nth-child(odd){transform-origin:left}@media (max-width: 1366px){.nav-wrapper{max-width:1186px}}@media (max-width: 1098px){.nav-wrapper{max-width:998px}.logo span:nth-child(1){font-weight:600}}@media (max-width: 855px){.nav-wrapper{max-width:85vw}.navbar{height:60px}.nav-wrapper .logo span{font-weight:500;font-size:15px}.links{gap:15px;font-weight:400;font-size:13px}}@media (max-width: 655px){.nav-wrapper{max-width:85vw;margin-left:0}.links{display:none}.sidebar-menu{display:flex}}.footer{width:100%;height:max-content;position:sticky;bottom:0;left:0;transition:all .3s ease-in-out;background-color:var(--letter-color1);color:gray;scroll-snap-align:center;overflow:hidden}.footer-container{max-width:1150px;margin:auto;height:100%;text-align:center}.footer-top{width:100%;text-align:right}.footer-top h1{font-size:60px;font-weight:800;opacity:.1;display:inline-block;white-space:nowrap;animation:slideText 30s linear infinite;padding-left:100%}@keyframes slideText{0%{transform:translate(5%)}to{transform:translate(-105%)}}.footer-bottom{display:flex;flex-direction:column;gap:5px;height:100%}.footer-bottom-conatiner{flex:5;display:flex;align-content:center;justify-content:space-between;border-bottom:1px solid gray}.footer-bottom-conatiner h4{font-size:15px;font-weight:300;color:#d3d3d3}.footer-bottom-conatiner div{display:flex;padding:5px 0;flex-direction:column;gap:5px;font-size:10px;font-weight:300}.footer-bottom-conatiner a{color:gray}.footer-bottom-conatiner .left{text-align:left}.footer-bottom-conatiner .right{text-align:right}.footer-last{flex:1;display:flex;align-content:center;justify-content:space-between;padding:5px 0}.footer-last span{font-size:10px;font-weight:300;flex:1}.footer-last :first-child{text-align:left}.footer-last :last-child{text-align:right}.footer-icons{display:flex;gap:10px}.icon{color:#d3d3d3;transition:color .3s ease-in-out,transform .3s ease-in-out}.icon img{width:20px;height:20px;padding:2px;background:var(--bg-color);border-radius:100%;cursor:pointer}.icon img:hover{transform:scale(1.2) rotate(10deg)}@media (max-width: 1025px){.footer-container{max-width:940px}.footer-last span{font-size:8px;font-weight:200}}@media (max-width: 767px){.footer-container{max-width:700px}.footer-last :last-child{display:none}.footer-last :nth-child(2){display:none}.footer-last :first-child{text-align:center}}@media (max-width: 460px){.footer-top h1{font-size:35px;font-weight:600}.footer-container{max-width:360px}.footer-bottom-conatiner .center{display:none}}
