@import url(https://fonts.googleapis.com/css?family=Montserrat:400,500&display=swap);
@media screen and (max-width: 600px){.hamburger{width:30px;height:60px;display:flex;align-items:center;justify-content:center}.hamburger>div{position:relative;width:100%;height:2px;background-color:#fff;display:flex;align-items:center;justify-content:center;transition:all 0.4s ease}.hamburger>div::before,.hamburger>div::after{content:"";position:absolute;z-index:1;top:-10px;width:100%;height:2px;background:inherit}.hamburger>div::after{top:10px}.toggler{position:absolute;z-index:2;cursor:pointer;width:30px;height:60px;opacity:0}.toggler:checked+.hamburger>div::before,.toggler:checked+.hamburger>div::after{top:0;transform:rotate(90deg)}.toggler:checked+.hamburger>div{transform:rotate(135deg)}.toggler:checked:hover+.hamburger>div{transform:rotate(225deg)}.toggler:checked ~ .overlay-nav-container{visibility:visible;z-index:-1}.toggler:checked ~ .overlay-nav-container>div{transform:scale(1);transition-duration:.35s}.toggler:checked ~ .overlay-nav-container>div>div{opacity:1;transition:opacity 0.4s ease}.overlay-nav-container{position:fixed;top:0;left:0;width:100%;height:100%;visibility:hidden;display:flex;align-items:center;justify-content:center;z-index:1}.overlay-nav-container>div{background-color:rgba(24,39,51,0.882353);width:100vw;height:100%;display:flex;flex:none;align-items:center;justify-content:center;transform:scale(0);transition:all 0.4s ease}.overlay-nav-container>div>div{text-align:center;max-width:90vw;max-height:100vh}.overlay-nav-container>div>div li{list-style:none !important;font-size:1.5rem !important;padding:1rem !important}.overlay-nav-container>div>div li>a{color:#fff !important;text-decoration:none !important;transition:color 0.4s ease !important}}

.header{position:absolute;width:100%}.header .nav{height:75px;display:flex;justify-content:center}.header .nav .menu__list{display:flex;justify-content:center;align-items:center}.header .nav .menu__list ul{display:inline-flex;list-style:none}.header .nav .menu__list ul li{margin:0px 30px;font-size:13px;font-weight:500}.header .nav .menu__list ul li a{color:inherit}.header .nav .menu__list ul li a:hover{color:#e0bd4d}.header .nav .menu__list .logo{width:40px;height:40px}.header .nav .menu__list .hamburger__menu{display:none}@media screen and (max-width: 600px){.header{padding-top:0 !important}.header .nav .menu__list{justify-content:space-between;width:90%;margin:0 auto}.header .nav .menu__list ul{display:none}.header .nav .menu__list .hamburger__menu{display:block;z-index:1}}

.button_component-style{padding:20px;font-size:12px;font-family:inherit;font-weight:500;letter-spacing:0.05em;text-transform:uppercase;outline:none;cursor:pointer}.button_component-style.fill{background:#e0bd4d;border:1px solid #e0bd4d;color:#001624}.button_component-style.border{background:transparent;border:1px solid #e0bd4d;color:#d4d4d4}

.about .about-body{display:flex;height:26em}.about .about-body .image-section{width:40%;padding:0 20px}.about .about-body .image-section .image{background-size:cover;background-position:center;height:100%}.about .about-body .about-me{width:60%;display:flex;justify-content:flex-end;flex-direction:column}.about .about-body .about-me .greeting-text{font-size:15px;margin-bottom:16px}.about .about-body .about-me .ellipsis{padding-left:8px}.about .about-body .about-me .name{font-size:58px}.about .about-body .about-me .title{color:#e0bd4d;font-size:64px}.about .about-body .about-me .text{margin-top:30px;max-width:34em;font-size:15px;line-height:1.5em}.about .about-body .about-me .buttons-wrap{margin-top:20px}.about .about-body .about-me .buttons-wrap button{margin-right:10px}@media screen and (max-width: 1300px){.about .about-body .about-me .name{font-size:4.07vw}.about .about-body .about-me .title{font-size:4.5vw}}@media screen and (max-width: 1284px){.about .about-body .about-me .greeting-text{font-size:14px}.about .about-body .about-me .text{font-size:15px}}@media screen and (max-width: 832px){.about .about-body .about-me .greeting-text{font-size:12px}.about .about-body .about-me .text{margin-bottom:20px;font-size:14px}}@media screen and (max-width: 767px){.about .about-body{position:relative}.about .about-body .image-section{width:100%;padding:0}.about .about-body .about-me{position:absolute;width:100%;background:#001c2ebf;align-items:center;padding:12px;bottom:0px}.about .about-body .about-me .name{font-size:28px}.about .about-body .about-me .title{font-size:32px}.about .about-body .about-me .text{font-size:13px}.about .about-body .about-me .buttons-wrap{margin:20px 0}.about .about-body .about-me .buttons-wrap button{padding:18px;margin:0 5px;font-size:10px}}@media screen and (max-width: 430px){.about .about-body .about-me{display:block}.about .about-body .about-me .name{font-size:26px}.about .about-body .about-me .title{font-size:30px}.about .about-body .about-me .text{margin-top:18px}.about .about-body .about-me .buttons-wrap{display:flex;justify-content:center}}@media screen and (max-width: 380px){.about .about-body .about-me .title{font-size:24px}.about .about-body .about-me .buttons-wrap button{padding:18px;font-size:8px}}

.work{width:80%;margin:0 auto;display:flex}.work .tab-list{width:19%}.work .tab-list li{list-style:none;padding:16px;border-left:2px rgba(212,212,212,0.63) solid;cursor:pointer}.work .tab-list li[aria-selected="true"]{background:#182733;border-left:2px #e0bd4d solid;color:#e1d8b7}.work .tab-content{margin:15px 5px 0 20px;width:81%}.work .tab-content .title .company-name{color:#e7d597}.work .tab-content .date{padding-bottom:12px;font-size:14px}.work .tab-content p{padding-left:20px;margin-bottom:20px;font-size:15px;position:relative;line-height:1.7em}.work .tab-content p::before{content:"\27A4";color:#e7d597;position:absolute;left:0}.work .tab-content p:nth-of-type(1){margin-top:27px}@media screen and (max-width: 1024px){.work{width:95%}}@media screen and (max-width: 767px){.work{display:unset}.work .tab-list{display:flex;width:100%;margin-bottom:30px;overflow-y:auto;white-space:nowrap}.work .tab-list li{border:none;padding:12px}.work .tab-content{margin-left:5px;width:100%}.work .tab-content p{font-size:13px}}@media screen and (max-width: 395px){.work .tab-content .title{font-size:18px}}

.skill-grid-icon{border:1px solid #f6eed5;display:flex;flex-direction:column;justify-content:center;align-items:center}.skill-grid-icon .icon{fill:#ffffff;padding:0.7rem;width:3rem;height:3rem;transition:0.3s ease-in-out}.skill-grid-icon:hover .icon{width:45%;height:45%}.skill-grid-icon>span{margin-top:9px;font-size:12px}

.skills-section{display:flex}.skills-section .grid-container{width:50%;display:grid;grid-template-columns:repeat(4, 120px);grid-template-rows:repeat(3, 120px);gap:3px;transition:0.4s ease-in-out}.skills-section .tools-section{width:50%;display:grid;grid-template-columns:repeat(auto-fit, minmax(50%, 1fr));padding-left:25px}.skills-section .tools-section .skills-wrap{padding-top:5px}.skills-section .tools-section .skills-wrap>p{padding-left:40px;position:relative;margin-bottom:10px;font-size:14px}.skills-section .tools-section .skills-wrap>p>span>svg{fill:#f9eecd;width:16px;height:16px;position:absolute;left:7px}.skills-section .tools-section .skills-wrap .header-icon{width:12%;height:auto;margin-right:10px}.skills-section .tools-section .skills-wrap .skills-heading{margin-bottom:12px;font-size:16px;display:flex;align-items:center;letter-spacing:2px}@media screen and (max-width: 1220px){.skills-section .grid-container{width:45%;grid-template-columns:repeat(4, 100px);grid-template-rows:repeat(3, 100px)}.skills-section .tools-section{width:55%}.skills-section .tools-section .skills-wrap{padding-top:2px}}@media screen and (max-width: 1080px){.skills-section .grid-container{grid-template-columns:repeat(3, 100px);grid-template-rows:repeat(4, 100px)}.skills-section .tools-section{padding-left:0}}@media screen and (max-width: 899px){.skills-section .tools-section .skills-wrap>p>span>svg{left:4px}}@media screen and (max-width: 825px){.skills-section .grid-container{grid-template-columns:repeat(3, 95px);grid-template-rows:repeat(4, 95px)}}@media screen and (max-width: 750px){.skills-section{flex-direction:column}.skills-section .grid-container{width:100%;grid-template-columns:repeat(auto-fit, minmax(100px, 1fr));grid-template-rows:none;grid-auto-rows:100px}.skills-section .tools-section{margin-top:30px;width:100%}.skills-section .tools-section .skills-wrap{padding-top:30px}.skills-section .tools-section .skills-wrap>p{padding-left:47px}.skills-section .tools-section .skills-wrap>p>span>svg{left:10px}}@media screen and (max-width: 600px){.skills-section .tools-section .skills-wrap>p>span>svg{left:7px}}@media screen and (max-width: 600px){.skills-section .tools-section .skills-wrap>p{padding-left:34px}.skills-section .tools-section .skills-wrap>p>span>svg{left:3px}}

.featured-project{height:440px;margin-bottom:60px;display:flex}.featured-project.switch{flex-direction:row-reverse}.featured-project.switch .details{flex-direction:row-reverse}.featured-project.switch .details .sidebar{border-right:1px solid #2b3840;border-left:none}.featured-project .image-section{width:55%;display:flex;justify-content:center;align-items:center;user-select:none}.featured-project .image-section .image{max-width:100%}.featured-project .details{width:45%;background:#00111a;display:flex}.featured-project .details .center{margin:50px 50px;width:85%}.featured-project .details .center .featured-heading{height:10%}.featured-project .details .center .featured-heading .project-type-name{user-select:none;font-size:10px;font-weight:600;color:#e0bd4d;letter-spacing:1px}.featured-project .details .center .featured-body{height:75%;display:flex;justify-content:flex-end;flex-direction:column;padding-bottom:40px}.featured-project .details .center .featured-body .project-name{margin-top:5px;letter-spacing:-2px}.featured-project .details .center .featured-body .description{font-size:14px;line-height:1.5em}.featured-project .details .center .featured-footer{height:15%}.featured-project .details .center .featured-footer .svg-border{width:35px;height:35px;display:flex;justify-content:center;align-items:center;border:1px solid #bfbfbf63;margin-right:15px;float:left}.featured-project .details .center .featured-footer .svg-border .stack-icon{width:80%;height:80%}.featured-project .details .center .featured-footer .techs p{font-size:14px;color:#949494}.featured-project .details .sidebar{width:15%;border-left:1px solid #2b3840;display:flex;flex-direction:column;justify-content:center;align-items:center}.featured-project .details .sidebar .link{width:45px;height:45px;padding:9px;margin:3px 0;fill:#8c8c8c}.featured-project .details .sidebar .link:hover{fill:inherit}@media screen and (max-width: 610px){.featured-project{flex-direction:column;position:relative}.featured-project.switch{flex-direction:column}.featured-project.switch .details .center .featured-heading{left:22px}.featured-project .image-section{width:100%;height:200px}.featured-project .details{width:100%;height:300px}.featured-project .details .center{margin:15px 20px}.featured-project .details .center .featured-heading{top:15px;position:absolute}.featured-project .details .center .featured-heading .project-type-name{background:#001c2ed9}.featured-project .details .center .featured-body{padding-bottom:25px}.featured-project .details .center .featured-body .project-name{margin-top:0;margin-bottom:5px}.featured-project .details .center .featured-body .description{font-size:13px}.featured-project .details .center .featured-footer .techs p{font-size:12px}.featured-project .details .sidebar{border-left:1px solid #2b3840}}

.notable-project-card{background:#00111a;padding:27px 20px;min-height:366px;display:flex;flex-direction:column;justify-content:space-between}.notable-project-card .body .techs{height:58px;color:#949494}.notable-project-card .body .techs span{word-spacing:4px;font-size:10px;font-weight:500;letter-spacing:0.05em;text-transform:uppercase}.notable-project-card .body .details{margin:25px 0 30px 0}.notable-project-card .body .details h2{margin-bottom:10px}.notable-project-card .body .details p{font-size:14px;line-height:1.5em}.notable-project-card .footer-container{display:flex;justify-content:space-between;align-items:center}.notable-project-card .footer-container .open-folder-icon{width:45px}.notable-project-card .footer-container .links{display:flex;align-items:center}.notable-project-card .footer-container .links .link{width:40px;height:40px;padding:9px;margin:0 2px;fill:#8c8c8c}.notable-project-card .footer-container .links .link:hover{fill:inherit}

.backend-project-card{height:350px;flex-basis:23%;background:#e1d8b7;margin:15px 10px;position:relative;display:flex;justify-content:center}.backend-project-card:hover .background-image{filter:none;mix-blend-mode:normal}.backend-project-card .background-image{width:100%;mix-blend-mode:multiply;filter:grayscale(100%) contrast(1)}.backend-project-card .content{height:200px;background:white;color:#00111a;width:85%;position:absolute;bottom:10px;padding:15px 10px}.backend-project-card .content .heading{height:50%}.backend-project-card .content .heading .desc-container .desc{line-height:20px;font-size:9px;letter-spacing:0.05em;text-transform:capitalize;margin:0 1px;word-spacing:2px}.backend-project-card .content .heading .project-title{font-size:18px;font-weight:600}.backend-project-card .content .details{height:50%;width:100%;display:flex}.backend-project-card .content .details .techs{width:70%;display:flex;flex-direction:column;padding-top:5px;padding-left:8px}.backend-project-card .content .details .techs span{font-size:13px;letter-spacing:0.05em}.backend-project-card .content .details .techs span::before{content:" - "}.backend-project-card .content .details .links{width:30%;border-left:1px solid #d4d4d4a1;display:flex;flex-direction:column;justify-content:center;align-items:center}.backend-project-card .content .details .links .link{width:33px;height:33px;padding:8px;margin:0 2px;fill:#484a58}.backend-project-card .content .details .links .link:hover{fill:inherit}

.portfolio .frontend-projects{height:auto;background:#2b3840;padding-bottom:200px}.portfolio .frontend-projects .projects-wrap .inverse{margin-top:60px}.portfolio .frontend-projects .projects-wrap.container{padding-top:0}.portfolio .frontend-projects .projects-wrap .notable-projects{margin-top:100px}.portfolio .frontend-projects .projects-wrap .notable-projects .section-name{margin-bottom:30px;font-size:30px;font-weight:600;text-align:center;color:#e0bd4d}.portfolio .frontend-projects .projects-wrap .notable-projects .grid{display:grid;grid-template-columns:repeat(auto-fill, minmax(280px, 1fr));gap:8px}.portfolio .backend-projects .grid-container{display:grid;grid-template-columns:repeat(auto-fit, minmax(260px, auto))}.portfolio .backend-projects .grid-container::after{content:"";flex:auto}

.footer .middle{height:250px;display:flex;flex-direction:column;align-items:center;padding:30px 15px}.footer .middle.light-bar{width:200%;background:#00111a}.footer .middle .custom{font-size:12px}.footer .middle .contact-me-text{font-size:20px;text-align:center;margin:20px 0 40px 0}.footer .middle .buttons-wrap button{margin:0 5px}.footer .footer-container{background:#2b3840;height:320px;display:flex;flex-direction:column;justify-content:flex-end}.footer .footer-container .social-links-wrap{height:100px}.footer .footer-container .social-links-wrap .social-icons{height:65%;display:flex;align-items:center;justify-content:center}.footer .footer-container .social-links-wrap .social-icons .link{width:37px;height:37px;padding:8px;margin:0 7px;fill:white}.footer .footer-container .social-links-wrap .footer-text{height:35%;font-size:11px;background:#00111a;display:flex;justify-content:center;align-items:center}@media screen and (max-width: 1050px){.footer .top-bar .middle{width:400%}.footer .top-bar .middle .section-description{text-align:center}.footer .top-bar .middle .contact-me-text{font-size:16px}}@media screen and (max-width: 780px){.footer .top-bar .middle{width:750%}}@media screen and (max-width: 677px){.footer .top-bar .middle .section-description{font-size:12px}.footer .top-bar .middle .section-description .custom{font-size:10px}}@media screen and (max-width: 450px){.footer .top-bar .middle{width:900%}.footer .top-bar .middle .contact-me-text{font-size:14px}.footer .top-bar .middle .buttons-wrap button{padding:18px;margin:0 5px;font-size:10px}}@media screen and (max-width: 370px){.footer .top-bar .middle{width:1100%}.footer .top-bar .middle .contact-me-text{margin-bottom:20px}}

html.sr .load-hidden{visibility:hidden}.container{margin:auto;min-height:100vh;width:80%;max-width:1058px;padding:5em 0;display:flex;flex-direction:column;justify-content:center}@media screen and (max-width: 926px){.container{width:90%}}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}body{font-family:"Montserrat", sans-serif;background:#00111a;color:#c1d5e2;fill:#e0bd4d;line-height:1.3;font-size:20px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{text-decoration:none}.section-description{color:#e0bd4d}.section-description .tagline{font-size:10px;font-weight:600;letter-spacing:1px;text-transform:uppercase}.section-description .section-name{margin:30px 0;font-size:37px;font-weight:600;letter-spacing:-0.025em}.top-bar{display:flex;height:35px;width:100%}.top-bar .stripes{width:55%;background:repeating-linear-gradient(45deg, #00111a, #00111a 5px, #2b3840 5px, #2b3840 10px)}.top-bar .light-bar{width:45%;background:#2b3840;box-shadow:0px 5px 4px 0px #00111a}@media screen and (max-width: 500px){.section-description .section-name{font-size:26px;margin-top:5px}}