:root{--ff-primary:'Source Sans Pro',sans-serif;--ff-secondary:'Source Code Pro',monospace;--fw-reg:300;--fw-bold:900;--primary-color:#047aed;--secondary-color:#1c3fa8;--dark-color:#002240;--light-color:#f4f4f4;--success-color:#5cb85c;--error-color:#ff4d5a;--background-color:#072041;--fs-h1:3rem;--fs-h2:2.25rem;--fs-h3:1.25rem;--fs-body:1rem;--bs:0.25em 0.25em 0.75em rgba(0, 0, 0, 0.25),0.125em 0.125em 0.25em rgba(0, 0, 0, 0.15)}@media (min-width:800px){:root{--fs-h1:4.5rem;--fs-h2:3.75rem;--fs-h3:1.5rem;--fs-body:1.125rem}h1{letter-spacing:5px}}a{color:#000}h1,h2,h3{line-height:1;margin:0}h1{font-size:var(--fs-h1)}h2{font-size:var(--fs-h2)}h3{font-size:var(--fs-h3)}img{box-shadow:var(--bs);-webkit-user-drag:none;user-select:none;-moz-user-select:none;-webkit-user-select:none;-ms-user-select:none}html{scroll-behavior:smooth}*{margin:0;padding:0;box-sizing:border-box;text-decoration:none}body{font-family:var(--ff-primary);overflow-x:hidden;background:linear-gradient(331deg,#072041 100%,#384c67 0)}.sectionContainer{padding:6em 2em 6em;margin:auto;max-width:1200px;justify-content:center}.scroll-icon{position:relative;margin:1.5em;width:2em;height:3.5em;border:.2em solid #fff;border-radius:2em}.scroll-icon .wheel{position:absolute;left:50%;top:15%;width:.6em;height:1.5em;border:.1em solid #fff;transform:translate(-50%,0);border-radius:.6em;overflow:hidden}.scroll-icon.ex-2 .wheel::before{content:'';position:absolute;left:0;right:0;top:-100%;bottom:0;background-image:linear-gradient(0deg,#fff 2px,transparent 1px);background-size:100% 6px;opacity:.5;animation:ex-2-wheel 1s ease-in-out infinite}@keyframes ex-2-wheel{0%{transform:translateY(0);opacity:.5}40%,50%{opacity:.8}100%,90%{transform:translateY(50%);opacity:.5}}.heading{margin:0 auto 1.5em;display:inline-block;font-size:clamp(18px,5vw,30px);color:var(--light-color);position:relative;letter-spacing:.5rem}.heading::after,.heading::before{content:'';position:absolute;height:21px;width:21px;border-top:3px solid var(--error-color);border-left:3px solid var(--error-color)}.heading::before{top:-.6rem;left:-1rem}.heading::after{bottom:-.7rem;right:-.6rem;transform:rotate(180deg)}.disppear{animation:vanish .3s forwards}@keyframes vanish{100%{visibility:hidden}}.add-shadow{animation:add 1.5s forwards}@keyframes add{100%{background:#061c3a;box-shadow:0 .2rem .5rem rgba(0,0,0,.4)}}.nav-toggle{padding:.5em;background:0 0;border:0;cursor:pointer;position:absolute;right:1.8em;top:1.8em;z-index:1000;opacity:0}.nav-open .nav-toggle{position:fixed}.nav-open .hamburger{transform:rotate(.625turn)}.nav-open .hamburger::before{transform:rotate(90deg) translateX(-6px)}.nav-open .hamburger::after{opacity:0}.hamburger{display:block;position:relative}.hamburger,.hamburger::after,.hamburger::before{background:var(--light-color);width:2em;height:3px;border-radius:1em;transition:transform 250ms ease-in-out}.hamburger::after,.hamburger::before{content:'';position:absolute;left:0;right:0}.hamburger::before{top:6px}.hamburger::after{bottom:6px}.preloader-bg-blur{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--background-color);z-index:190}.preloader{position:fixed;top:0;left:0;width:100%;height:100%;z-index:200}.loader{display:block;position:relative;left:50%;top:50%;width:70px;height:70px;margin:-75px 0 0 -75px;border-radius:50%;border:5px solid transparent;border-top-color:var(--error-color);-webkit-animation:spin 1.1s linear infinite;animation:spin 1.1s linear infinite}.loader::before{content:'';position:absolute;top:5px;left:5px;right:5px;bottom:5px;border-radius:50%;border:5px solid transparent;border-top-color:var(--primary-color);-webkit-animation:spin 2s linear infinite;animation:spin 2s linear infinite}.loader::after{content:'';position:absolute;top:15px;left:15px;right:15px;bottom:15px;border-radius:50%;border:5px solid transparent;border-top-color:var(--success-color);-webkit-animation:spin .9s linear infinite;animation:spin .9s linear infinite}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes spin{0%{-webkit-transform:rotate(0);-ms-transform:rotate(0);transform:rotate(0)}100%{-webkit-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg)}}#canvas1{position:absolute;top:0;left:0;width:100%;height:100%;z-index:-1}.header{position:fixed!important;display:flex;align-items:center;justify-content:space-between;height:4.125rem;width:100%;padding:1rem 1rem;top:0;left:0;z-index:100;background:var(--background-color);transition:all .3s linear}.header .logo span{font-family:var(--ff-secondary);font-size:1.7rem;color:var(--light-color);font-weight:var(--fw-bold)}.header .logo span::before{content:'\003C';padding-right:.2em;color:var(--error-color);font-size:1.5rem}.header .logo span::after{content:'\003E';padding-left:.1em;color:var(--error-color);font-size:1.5rem}.header .navbar ul{list-style-type:none;display:flex;text-align:center;justify-content:space-around}.header .navbar ul li{margin:0 1rem;pad:1rem}.header .navbar ul li a{font-size:.9rem;font-weight:var(--fw-reg);color:#fff;padding:.3em}.header .navbar ul li a:hover{border-bottom:2px solid var(--error-color);color:#fff}.home{min-height:100vh;width:100vw;display:flex;flex-flow:column;align-items:center;justify-content:center;text-align:center;position:relative;overflow:hidden!important}.home .hexagon-wrap{filter:drop-shadow(8px 8px 15px rgba(0, 0, 0, .2));margin-bottom:15px}.home .hexagon{position:relative;margin-top:5em;width:220px;height:270px}.home .hexagon .shape{position:absolute;top:0;left:0;width:100%;height:100%;background:#000;clip-path:polygon(0 25%,50% 0,100% 25%,100% 75%,50% 100%,0 75%);transition:.5s}.home .hexagon:hover .shape{transform:translateY(-13px)}.home .hexagon .shape img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}.home .banner{color:#fff;display:block;text-shadow:0 .3rem .5rem rgba(0,0,0,.3);font-weight:var(--fw-bold)}.home .slogan{margin-top:.5em;margin-bottom:.5em;color:#eee;font-size:clamp(1rem,5vw,1.5rem);letter-spacing:.2rem;font-weight:400}.btn{display:inline-block;padding:.5em 2.5em;border-radius:.3rem;background:#e4313e;color:#fff;text-decoration:none;cursor:pointer;font-size:.8rem;text-transform:uppercase;letter-spacing:2px;font-weight:var(--fw-bold);transition:transform .2s ease-in-out}.btn:hover{transform:scale(1.1)}.about{width:100vw;display:flex;justify-content:center;text-align:center;position:relative;background:#f7f8fc}.about .heading{color:var(--background-color)}.about .row{display:grid;grid-template-columns:250px 1fr;grid-template-areas:'img content';grid-column-gap:2em}.about .row .content{text-align:justify}.about .row .content p{font-size:20px;color:#333;line-height:30px}.about .row .about-me-img img{width:250px;height:250px;align-items:center;object-fit:cover;border-radius:50%;margin-bottom:20px;border:red 1px solid}.skill{width:100vw;display:flex;justify-content:center;text-align:center}.skill .container{margin:0 auto;overflow:hidden}.skill .card{background-color:#fff;color:#333;border-radius:10px;box-shadow:0 3px 10px rgba(0,0,0,.2);padding:20px;margin:10px}.skill .flex{display:flex;justify-content:center;align-items:center}.skill .flex{flex-wrap:wrap}.skill .card{text-align:center;margin:18px 10px 18px;transition:transform .2s ease-in}.skill .card h4{font-size:20px;margin-bottom:10px}.skill .card:hover{transform:translateY(-15px)}.skill .container .card img{height:110px;width:112px}.portfolio{width:100vw;display:flex;justify-content:center;text-align:center;position:relative;background:#f7f8fc}.portfolio .heading{color:var(--background-color)}.portfolioCards{display:grid;grid-template-columns:auto auto auto;grid-gap:20px}.portfolioCard{background-color:#fff;border-radius:10px;box-shadow:0 2px 20px rgba(0,0,0,.1);overflow:hidden;width:300px}.portfolioCard__img{position:relative;height:190px;overflow:hidden}.portfolioCard__img img{height:250px;width:100%;object-fit:cover}.cover{position:absolute;top:0;left:0;width:100%;height:100%;background:0 0;transition:.5s}.cover:before{content:'';position:absolute;top:0;left:0;width:100%;height:100%;opacity:1;transform:translateX(-100%) scale(1) skew(-45deg);transition:.5s}.cover_link{position:absolute;top:50%;transform:translateY(-50%);width:100%;text-align:center;margin:auto}.cover_link a{padding:0;color:#fff;font-size:1em;font-weight:700;background:#ff4d5a;padding:8px 12px;border-radius:8px;transform:translateY(-100%) scale(2);opacity:0}.portfolioCard__img:hover .cover:before{opacity:1;background:rgba(0,0,0,.5);transform:translateX(0) scale(1) skew(-45deg)}.portfolioCard__img:hover .cover_link a{opacity:1}.portfolioCard__img:hover img{transform:scale(1.3) translateX(10px);transition:.5s}.portfolioCard__content{display:flex;flex-direction:column;align-items:start;padding:20px;min-height:100px;border-top:rgb(199,199,199,.5) solid 1px}.portfolioCard__content p{text-align:left}.tag{background:#777;border-radius:50px;font-size:12px;margin:2px 3px;color:#fff;padding:2px 10px;text-transform:uppercase}.tag-flex{display:flex;flex-wrap:wrap}.tag-blue{background-color:#0072b5}.tag-coral{background-color:#e9897e}.tag-mint{background-color:#00a170}.tag-amethyst{background-color:#926aa6}.tag-rasberry{background-color:#d2386c}.tag-marigold{background-color:#fdac53}.contact{width:100vw;text-align:center}.contact .contactForm{padding:50px 50px;margin:auto;max-width:750px}.container .contactForm .formBox{position:relative;display:flex;justify-content:center;padding-top:35px}.contact .contactForm .formBox .inputBox{position:relative;margin-bottom:30px}.contact .contactForm .formBox .inputBox.w100{width:100%}.contact .contactForm .formBox .inputBox input,.contact .contactForm .formBox .inputBox textarea{width:100%;resize:none;padding:5px 0;font-size:18px;font-weight:300;color:#fff;border:none;outline:0;border-bottom:1px solid #fff;background:var(--background-color)}.contact .contactForm .formBox .inputBox textarea{height:120px}.contact .contactForm .formBox .inputBox span{position:absolute;left:0;padding:5px 0;pointer-events:none;font-size:18px;font-weight:300;transition:.3s;color:#c1c1c1}.contact .contactForm .formBox .inputBox input:focus~span,.contact .contactForm .formBox .inputBox input:valid~span,.contact .contactForm .formBox .inputBox textarea:focus~span,.contact .contactForm .formBox .inputBox textarea:valid~span{transform:translateY(-20px);font-size:13px;font-weight:400;letter-spacing:1px;color:var(--error-color)}.contact .contactForm .formBox .inputBox input[type=submit]{position:relative;cursor:pointer;background:var(--secondary-color);color:#fff;border:none;padding:12px}.contact .contactForm .formBox .inputBox input[type=submit]:hover{background:#163286}.reveal{position:relative;transform:translateY(150px);opacity:0;transition:all 2s ease}.reveal.active{transform:translateY(0);opacity:1}@media (min-width:1438px){.home>*{transform:scale(1.1)}.skill .container .card img{height:150px;width:152px}}@media (max-width:1437px){.sectionContainer{max-width:1000px}}@media (max-width:992px){.portfolioCards{grid-template-columns:auto auto}}@media (max-width:700px){.navbar ul{opacity:0;transform:translateY(-100%);transition:transform .35s cubic-bezier(.5,0,.5,1)}.nav-open .navbar ul{opacity:1}.nav-open .header{position:fixed;padding:1rem 0 0;height:100vh}.nav-open .header .navbar ul{justify-content:space-evenly!important;height:100vh;flex-direction:column;transform:translateY(0)}.nav-open .header .navbar ul li a:hover{color:var(--error-color)}.nav-open .header .navbar ul li a{font-size:var(--fs-h2)!important;font-weight:var(--fw-bold)!important}.nav-open .header{flex-direction:column}.logo{position:fixed;left:1em;top:1em;width:100%}.portfolioCards{grid-template-columns:auto}.about .row{display:flex;flex-direction:column}.nav-toggle{opacity:1}.loader{left:58%}}@media (max-width:480px){.portfolioCard{width:100%}.contact .contactForm{padding:0}.skill .sectionContainer{padding:6em 1em 6em}.loader{left:60%}}@media (max-width:360px){.home .hexagon{position:relative;width:165px;height:202.5px}}