@import"https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,400;0,500;0,700;1,400;1,500;1,700&display=swap";.fas,.fa,.fa-solid{font-family:"Font Awesome 5 Free"}html{font-size:10px;scroll-behavior:smooth}h1,h2,h3,h4,h5,h6{margin:0}h1{font-weight:400;font-size:7rem;margin:0}@media only screen and (max-width: 576px){h1{font-size:5rem}}h2{font-weight:700;font-size:5rem;letter-spacing:5px}h3{font-size:5rem;margin:0;font-weight:400}h4{font-size:3rem}@media only screen and (max-width: 576px){h4{font-size:2rem}}ul{margin:0;padding:0}a{text-decoration:none;color:#000}body{padding:0;margin:0;box-sizing:border-box;font-size:1.8rem;font-family:Plus Jakarta Sans,sans-serif}body.dark{background:#000;color:#fff}body.dark .hero:before{filter:invert(1)}body.dark .hero i{color:#fff;transition:.3s ease-out}body.dark .hero i:hover{color:#add8e6}body.dark section{background-color:#2d3a3a;color:#fff}body.dark section:nth-child(odd){background-color:#4e6565}body.dark header .dark-con .dark-mode-btn i:nth-child(1){opacity:0;pointer-events:none}body.dark header .dark-con .dark-mode-btn i:nth-child(2){opacity:1;color:#fff;transition:.3s ease-out;pointer-events:all}body.dark header .dark-con .dark-mode-btn i:nth-child(2):hover{text-shadow:0 2px 5px #fff}body.dark header .nav .menu .menu-links a{color:#fff}body.dark header .nav .menu .menu-links a:hover{color:#6f9090}body.dark header .nav .menu .menu-links a:before{border-color:#6f9090}body.dark header .nav .nav-button{color:#fff}body.dark header.fixed{background-color:#2d3a3a;box-shadow:none;border-bottom:1px solid #fff}body.dark .hero .socials a:hover{color:green}body.dark .projects-section .projects-con .project{box-shadow:none}body.dark .sidebar{background-color:#4e6565}body.dark .sidebar .sidebar-links a{color:#fff}body.dark .sidebar .sidebar-links a:hover{color:#add8e6}body.dark .sidebar .dark-con .dark-mode-btn i:nth-child(1){opacity:0;height:0}body.dark .sidebar .dark-con .dark-mode-btn i:nth-child(2){opacity:1;color:#fff;height:auto}body.dark .about .inner .skills-section .skills-con .skills{color:#fff}body.dark .contact-section .inner{background-color:#4e6565}body.dark .contact-section .inner .contact-box{color:#fff}body.dark .footer{background-color:#2d3a3a}body.dark .footer i{color:#fff;transition:.3s ease-out}body.dark .footer i:hover{color:#add8e6}body section{scroll-margin-top:8.3rem}.xl-con{max-width:70vw;padding-left:5vw;padding-right:5vw;margin:0 auto}.md-con{max-width:40vw;padding-left:5vw;padding-right:5vw;margin:0 auto}.padding{padding-top:8rem;padding-bottom:8rem}.header{position:fixed;z-index:999;transition:all .3s ease-out;width:100%}.header.fixed{box-shadow:0 1px 10px #000;background-color:#fff}.header .nav{display:flex;align-items:center;justify-content:space-evenly;padding:2rem}@media only screen and (max-width: 992px){.header .nav{justify-content:flex-end}}.header .nav .logo h3 span{color:#7a93ac}.header .nav .menu{display:flex;align-items:center;justify-content:space-evenly;gap:3rem}@media only screen and (max-width: 992px){.header .nav .menu{display:none}}.header .nav .menu .menu-links{font-size:2rem;list-style:none;font-size:1.8rem;text-transform:capitalize;letter-spacing:4px;padding:1rem}.header .nav .menu .menu-links a{text-decoration:none;transition:.3s ease-out;position:relative;text-transform:uppercase;font-weight:500}.header .nav .menu .menu-links a:before{content:"";position:absolute;border-bottom:2px solid #1b4965;left:50%;bottom:-.5rem;width:0;transform:translate(-52%);transition:.3s ease-out}.header .nav .menu .menu-links a:hover:before{width:100%}.header .nav .menu .menu-links a:hover{color:#1b4965}.header .nav .nav-button{display:none;border:none;background-color:transparent;padding:1rem;cursor:pointer}@media only screen and (max-width: 992px){.header .nav .nav-button{display:block}.header .nav .nav-button i{font-size:3rem}}.header .dark-con{position:absolute;top:2.5rem;right:6rem}@media only screen and (max-width: 992px){.header .dark-con{display:none}}.header .dark-con .dark-mode-btn{border:none;background:none;cursor:pointer;position:relative}.header .dark-con .dark-mode-btn i{font-size:3rem;display:block;transition:.3s ease-out;position:absolute;right:0;top:-1.5rem}.header .dark-con .dark-mode-btn i:nth-child(1):hover{text-shadow:0 2px 5px #000}.header .dark-con .dark-mode-btn i:nth-child(2){opacity:0;transition:.3s ease-out;pointer-events:none}.sidebar{position:fixed;top:0;left:0;width:100%;height:100%;background:#fff;z-index:9999;display:grid;place-items:center;transition:.3s ease-out;-webkit-transform:translate(-100%);transform:translate(-100%)}.sidebar .sidebar-links{text-align:center;list-style:none}.sidebar .sidebar-links a{font-size:4rem;text-transform:capitalize;transition:.3s ease-out;color:#000;display:inline-block;margin-bottom:1.5rem}.sidebar .sidebar-links a:hover{color:#add8e6}.sidebar .social-icons{display:grid;margin-top:3rem;grid-template-columns:repeat(2,1fr);justify-items:center;list-style:none}.sidebar .social-icon{font-size:3.5rem;color:var(--clr-grey-1);transition:.3s ease-out}.sidebar .social-icon:hover{color:#add8e6}.sidebar .close-btn,.sidebar .dark-con{position:absolute;top:2.5rem;right:2rem;font-size:4rem;background:transparent;border:none;transition:.3s ease-out;color:#bb2525;cursor:pointer}.sidebar .close-btn:hover,.sidebar .dark-con:hover{color:#e66b6b}.sidebar .dark-con{top:8.5rem}.sidebar .dark-con .dark-mode-btn{border:none;background:none;cursor:pointer}.sidebar .dark-con .dark-mode-btn i{font-size:3rem;display:block}.sidebar .dark-con .dark-mode-btn i:nth-child(2){height:0;opacity:0}.show-sidebar{-webkit-transform:translate(0);transform:translate(0)}.hero{display:flex;align-items:center;justify-content:center;gap:10rem;background-color:#e9ecf5;height:100vh;position:relative}.hero:before{content:"";position:absolute;inset:0;background:url(/assets/5026563-DkuIkgOJ.jpg) no-repeat center;background-size:cover}@media only screen and (max-width: 768px){.hero{padding:8rem 2rem;height:40vh}}.hero .hero-content{display:flex;align-items:center;justify-content:center;gap:10rem;width:90vw;max-width:117rem;margin:0 auto}@media only screen and (max-width: 1024px){.hero .hero-content{flex-direction:column}}.hero .hero-info{width:50%;width:100%;display:flex;align-items:center;justify-content:center;flex-direction:column}@media only screen and (max-width: 768px){.hero .hero-info{text-align:center}}.hero .hero-info h1{letter-spacing:5px;font-weight:700;padding-bottom:1rem;position:relative}.hero .hero-info h1:before{content:"";position:absolute;border:2px solid #6bcceb;width:10rem;top:0}@media only screen and (max-width: 992px){.hero .hero-info h1:before{border:none}}.hero .hero-info h4{text-transform:capitalize;letter-spacing:5px;padding-bottom:4rem}.hero .hero-info .hero-btn{text-transform:capitalize;letter-spacing:5px;background-color:#add8e6;padding:1.5rem 2rem;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;max-width:15rem;text-transform:uppercase}.hero .hero-info .hero-btn:before,.hero .hero-info .hero-btn:after{content:"";position:absolute;width:10px;height:10px;border:0px solid black;transition:1s}.hero .hero-info .hero-btn:hover:before,.hero .hero-info .hero-btn:hover:after{width:100%;height:100%}.hero .hero-info .hero-btn:after{top:3px;left:3px;border-top:1px solid black;border-left:1px solid black}.hero .hero-info .hero-btn:before{bottom:3px;right:3px;border-bottom:1px solid black;border-right:1px solid black}.hero .hero-info .socials{display:flex;align-items:center;justify-content:flex-start;padding-top:2rem;gap:2rem}.hero .hero-info .socials a{font-size:2.5rem;transition:.3s ease-out}.hero .hero-info .socials a:hover{color:#5fb3ce}.hero .profile-pic{width:50%;height:80rem;position:relative}@media only screen and (max-width: 1024px){.hero .profile-pic{display:none}}.hero .profile-pic:before{content:"";position:absolute;width:100%;height:100%;border:.4rem solid black;top:4rem;right:-4rem;border-radius:2rem}.hero .profile-pic img{height:100%;width:100%;object-fit:cover;object-position:top center;border-radius:2rem;position:relative}.about .inner{display:flex;align-items:stretch;justify-content:center;gap:10rem}@media only screen and (max-width: 1024px){.about .inner{flex-direction:column;gap:3rem}}.about .inner .about-info{width:50%}@media only screen and (max-width: 1024px){.about .inner .about-info{width:100%;display:flex;align-items:flex-start;justify-content:center;flex-direction:column}}.about .inner .about-info .title{padding-bottom:2rem}.about .inner .about-info .title h2{text-transform:capitalize;position:relative}.about .inner .about-info .title h2:before{content:"";position:absolute;border:2px solid #6bcceb;width:10rem;bottom:-1rem;left:0}.about .inner .skills-section{display:flex;flex-wrap:wrap;width:50%;flex-direction:column}@media only screen and (max-width: 992px){.about .inner .skills-section{width:100%}}.about .inner .skills-section .heading{padding-bottom:2rem}.about .inner .skills-section .heading h2{position:relative}.about .inner .skills-section .heading h2:before{content:"";position:absolute;border:2px solid #6bcceb;width:10rem;bottom:-1rem;left:0}.about .inner .skills-section .skills-con .skills{padding:1rem 2rem;margin-bottom:1.5rem;margin-right:1.5rem;font-size:1.6rem;background:#9993;border-radius:5px;font-weight:600;color:#666;display:inline-block}.projects-section{text-align:center;background-color:#e9ecf5}.projects-section .inner{padding:10rem 0}.projects-section .inner .text-content{margin:0 auto;margin-bottom:5rem;max-width:90rem}.projects-section .inner .text-content h2{position:relative}.projects-section .inner .text-content h2:before{content:"";position:absolute;border:2px solid #6bcceb;width:10rem;bottom:-1rem;left:50%;transform:translate(-50%)}.projects-section .inner .projects-con{display:flex;align-items:center;justify-content:center;gap:1rem;flex-wrap:wrap}.projects-section .inner .projects-con a{width:24%;height:auto;position:relative}@media only screen and (max-width: 1440px){.projects-section .inner .projects-con a{width:32%}}@media only screen and (max-width: 1024px){.projects-section .inner .projects-con a{width:49%}}@media only screen and (max-width: 768px){.projects-section .inner .projects-con a{width:48%}}@media only screen and (max-width: 576px){.projects-section .inner .projects-con a{width:100%}}.projects-section .inner .projects-con a:after{content:"";position:absolute;top:0;left:0;height:100%;width:100%;background:#21242a40;transition:all .3s;z-index:1}.projects-section .inner .projects-con a .project{height:0;padding-bottom:77%;position:relative;overflow:hidden}.projects-section .inner .projects-con a .project:before{transition:.3s ease-out;content:"";position:absolute;left:0;top:0;width:100%;height:100%;background:#34a4eeb3;opacity:0;z-index:1}.projects-section .inner .projects-con a .project:after{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;height:100%;border:.4rem solid #fff;opacity:0;transition:.3s ease-out;z-index:2}.projects-section .inner .projects-con a:hover .project .inner-bg img{transform:translate(-50%,-50%) scale(1.1)}.projects-section .inner .projects-con a:hover .project:before{opacity:1}.projects-section .inner .projects-con a:hover .project:after{opacity:1;transform:scale(.8) translate(-63%,-63%)}.projects-section .inner .projects-con a .project-img{transition:.3s ease-out;position:absolute;top:50%;left:50%;transform:translate3d(-50%,-50%,0);z-index:2;width:100%}.projects-section .inner .projects-con a .project-img.atd{width:75%}.projects-section .inner .projects-con a .project-info{content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);opacity:0;color:#fff;text-align:center;text-transform:capitalize}.projects-section .inner .projects-con a .inner-bg img{position:absolute;width:100%;height:100%;top:50%;object-fit:cover;left:50%;transform:translate(-50%,-50%);transition:transform .3s ease-out}.contact-section{display:flex;align-items:center;justify-content:center;background-color:beige;background-image:url(/assets/bram-naus-n8Qb1ZAkK88-unsplash-HvbENvaZ.jpg);background-position:center;background-size:cover;position:relative;padding:15rem 2rem}.contact-section:before{content:"";position:absolute;top:0;width:100%;height:100%;background-color:#00000080}.contact-section .inner{background-color:#fff;padding:10rem 5rem 25rem;max-width:65rem;clip-path:polygon(0% 0%,100% 0%,100% 75%,75% 75%,75% 100%,50% 75%,0% 75%);transition:.3s ease-out}.contact-section .inner .contact-box{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:3rem;text-align:center}.contact-section .inner .contact-box .heading{text-transform:capitalize}.contact-section .inner .contact-box .heading h2{position:relative}.contact-section .inner .contact-box .heading h2:before{content:"";position:absolute;border:2px solid #6bcceb;width:10rem;bottom:-1rem;left:50%;transform:translate(-50%)}.contact-section .inner .contact-box .contact-btn{text-transform:capitalize;letter-spacing:5px;background-color:#add8e6;padding:1.5rem 2rem;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;max-width:20rem;text-transform:uppercase}.contact-section .inner .contact-box .contact-btn:before,.contact-section .inner .contact-box .contact-btn:after{content:"";position:absolute;width:10px;height:10px;border:0px solid black;transition:1s}.contact-section .inner .contact-box .contact-btn:hover:before,.contact-section .inner .contact-box .contact-btn:hover:after{width:100%;height:100%}.contact-section .inner .contact-box .contact-btn:after{top:3px;left:3px;border-top:1px solid black;border-left:1px solid black}.contact-section .inner .contact-box .contact-btn:before{bottom:3px;right:3px;border-bottom:1px solid black;border-right:1px solid black}.footer{display:flex;align-items:center;justify-content:center;flex-direction:column;background-color:#add8e6}.footer .social-icons{padding-top:2rem}.footer .social-icons i{font-size:3rem;padding:.5rem;transition:.3s ease-out}.footer .social-icons i:hover{color:#fff}.target{opacity:0;transition-property:top,right,left,opacity}.target.fade-in{position:relative;right:4rem;transition:1.3s ease-out}.target.fade-in.activate{right:0;opacity:1}.target.fade-left{position:relative;left:4rem;transition:1.3s ease-out}.target.fade-left.activate{opacity:1;left:0}.target.fade{position:relative;opacity:0;transition:opacity 1.3s ease-out}.target.fade.activate{opacity:1}.target.fade-up{position:relative;bottom:-5rem;opacity:0;transition:1.3s ease-out}.target.fade-up.activate{opacity:1;bottom:0}.target.delay{transition-delay:1s}.header .target{opacity:0;transition-property:top,right,left,opacity}.header .target.fade-down{top:-4rem;position:relative;transition:1.3s ease-out}.header .target.fade-down.activate{transition-delay:.8s;top:0;opacity:1}