@import url(https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;700&display=swap);
*,*::before,*::after{box-sizing:border-box}body,h1,h2,h3,h4,h5,h6,p,blockquote,pre,dl,dd,ol,ul,figure,hr,fieldset,legend{margin:0;padding:0}body{min-height:100vh;text-rendering:optimizeSpeed;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}ul[class],ol[class]{list-style:none}img{max-width:100%}input,button,textarea,select{font:inherit}button{cursor:pointer}a{text-decoration:none}@media(prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}}html{font-size:10px}@media screen and (max-width: 1480px){html{font-size:7px}}html body{font-family:"IBM Plex Mono",monospace;color:#fff}.blur{filter:blur(3px)}.toast{display:none;position:fixed;bottom:20px;left:50%;transform:translateX(-50%);background-color:#f44;color:#fff;padding:10px 20px;border-radius:5px;z-index:9999;font-size:1.4rem}.loader{position:fixed;top:50%;left:50%;transform:translate(-50%, -50%);width:100px;height:100px;display:none;border:10px solid #f3f3f3;border-top:10px solid #3498db;border-radius:50%;animation:spin 1.5s linear infinite;z-index:9999}@media screen and (max-width: 480px){.loader{width:60px;height:60px;border-width:6px}}@keyframes spin{from{transform:translate(-50%, -50%) rotate(0deg)}to{transform:translate(-50%, -50%) rotate(360deg)}}.loading-overlay{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:999;display:none;background-color:rgba(0,0,0,.8)}body{background-color:#1a1e23;overflow-x:hidden}body .container{position:relative;max-width:1480px;margin:0 auto;padding:0 3%}.navbar{position:fixed;top:0;left:0;width:100%;z-index:1;padding:0 2%;background-color:#1a1e23}.navbar__container{display:flex;justify-content:space-between;align-items:center;max-width:1480px;padding:30px 0;margin:0 auto;font-size:1.8rem}.navbar--line{position:absolute;bottom:0;height:2px;background-color:#12f7d6;border-radius:1px}@media screen and (max-width: 480px){.navbar__name{margin-left:25px}}.navbar__name span{margin-right:15px;color:#12f7d6}.navbar__main-nav{display:flex;justify-content:space-between;flex-basis:40%}@media screen and (max-width: 1024px){.navbar__main-nav{display:none}}.navbar__main-nav-item{opacity:.4;transition:all .4s ease}.navbar__main-nav-item:hover{opacity:.7}.navbar__main-nav-item--active{opacity:1}.navbar__main-nav-item>a{display:block;padding:5px 10px;overflow:hidden;color:#fff}.navbar__mobile-nav{display:none}@media screen and (max-width: 1024px){.navbar__mobile-nav{display:block;position:absolute;top:0;left:100%;width:65%;background-color:#ddd;border-radius:0 0 0 20px;transition:transform .4s}.navbar__mobile-nav--active{transform:translateX(-100%)}.navbar__mobile-nav-item{padding:14% 0;font-size:2.4rem;text-align:center;border-bottom:1px solid #888}.navbar__mobile-nav-item:last-child{border:none}.navbar__mobile-nav-item a{color:#1a1e23}.navbar__mobile-nav-toggle{position:absolute;top:30px;left:-70px;width:45px;height:25px;transition:all .4s}.navbar__mobile-nav-toggle--active{left:0;transform:rotate(180deg)}.navbar__mobile-nav-toggle .toggle__line{position:absolute;left:0;right:0;height:3px;background-color:#fff;border-radius:2px;transition:top .4s,transform .4s .4s,transform-origin .4s,width .4s,left .4s}.navbar__mobile-nav-toggle .toggle__line-top{top:0;width:100%}.navbar__mobile-nav-toggle .toggle__line-top--active{top:50%;left:0;width:30%;transform:translateY(-50%) rotate(-30deg);transform-origin:left center;background-color:#333;animation:anime .8s}.navbar__mobile-nav-toggle .toggle__line-middle{top:50%;width:70%;transform:translateY(-50%)}.navbar__mobile-nav-toggle .toggle__line-middle--active{left:-1px;background-color:#333}.navbar__mobile-nav-toggle .toggle__line-bottom{top:100%;width:40%;transform:translateY(-100%)}.navbar__mobile-nav-toggle .toggle__line-bottom--active{top:50%;left:0;width:30%;transform:translateY(-50%) rotate(30deg);transform-origin:left center;background-color:#1a1e23;animation:anime .8s}}@keyframes anime{0%{opacity:1}50%{opacity:0}100%{opacity:1}}.about{display:flex;align-items:center;padding:60px 0 80px;margin-top:102px;position:relative}@media screen and (max-width: 1024px){.about{margin-top:60px}}.about__intro{flex-basis:50%}@media screen and (max-width: 1024px){.about__intro{flex-basis:100%;text-align:center}}.about__intro-title{font-size:5.4rem;line-height:1.2;font-weight:400;color:#12f7d6}@media screen and (max-width: 480px){.about__intro-title{font-size:4.4rem}}.about__intro-description{margin:40px 0 110px 0;line-height:2;font-size:1.6rem}@media screen and (max-width: 1024px){.about__intro-description{width:60%;margin:40px auto 60px}}@media screen and (max-width: 480px){.about__intro-description{width:85%;margin-bottom:50px}}.about__intro-buttons .about__button{margin-right:40px;padding:1em 1.2em;border-radius:40px;font-size:1.8rem;font-weight:500;transition:all .2s ease-in-out}.about__intro-buttons .about__button:hover{box-shadow:inset 0 0 5px #12f7d6,0 0 12px #12f7d6}.about__intro-buttons .about__button--talk{border:none;box-shadow:0 0 16px #12f7d6;color:#1a1e23;background-color:#12f7d6}.about__intro-buttons .about__button--talk:hover{color:#12f7d6;background-color:#1a1e23}.about__intro-buttons .about__button--talk>span i{margin-left:15px}.about__intro-buttons .about__button--cv{border:1px solid #12f7d6;color:#12f7d6;background-color:#1a1e23}.about__intro-buttons .about__button--cv>span i{margin-left:10px}.about__animation{position:absolute;top:0;left:20%;bottom:0;width:120%;clip-path:polygon(4% 5%, 100% 0, 100% 100%, 0 95%, 14% 63%, 31% 48%, 29% 28%)}@media screen and (max-width: 1024px){.about__animation{display:none}}.skills{overflow-x:hidden}.skills__title{position:relative;display:inline-block;font-size:5.4rem;color:#12f7d6;font-weight:400}@media screen and (max-width: 480px){.skills__title{font-size:4.6rem}}@media screen and (max-width: 350px){.skills__title{font-size:3.6rem}}.skills__title::after{content:"";position:absolute;bottom:8px;left:125%;width:600%;height:1px;background-color:#12f7d6}@media screen and (max-width: 480px){.skills__title::after{left:110%}}.skills__list{display:flex;flex-wrap:wrap;padding:140px 0;position:relative}@media screen and (max-width: 480px){.skills__list{min-height:400px;padding:70px 0;align-content:space-between}}.skills__list-item{flex-basis:21%;height:120px;flex-direction:column;justify-content:space-between;align-items:center;display:none}@media screen and (max-width: 480px){.skills__list-item{flex-basis:46%;height:90px}}.skills__list-item img{width:5.5rem}.skills__list-item>p{font-size:1.6rem}.skills__list-item--active{display:block;display:flex;opacity:0;animation:fadeIn 4s linear}.skills__list-item--nodejs>img,.skills__list-item--jquery>img,.skills__list-item--sass>img,.skills__list-item--stylus>img,.skills__list-item--php>img,.skills__list-item--jest>img,.skills__list-item--tailwindcss>img{position:relative}.skills__list-item--nodejs>img{top:20%;width:80px}.skills__list-item--jquery>img{top:25%;width:80px}.skills__list-item--sass>img{top:10%}.skills__list-item--stylus>img{top:15%}.skills__list-item--php>img{width:90px}.skills__list-item--jest>img{top:10%;width:90px}.skills__list-item--tailwindcss>img{top:3%;width:80px}.skills__list-progress-bar{position:absolute;top:50%;transform:translateY(-50%);right:8px;height:60%;display:flex;flex-direction:column;justify-content:space-between;align-items:center}.skills__list-progress-bar .progress-bar-dot{width:1.7rem;height:1.7rem;border:1px solid #12f7d6;border-radius:50%;cursor:pointer;flex-shrink:0;transition:background-color .3s,box-shadow .3s,transform .3s}.skills__list-progress-bar .progress-bar-dot:hover{background-color:rgb(67.3346938776,248.6653061224,222.5346938776);box-shadow:0 0 12px rgb(116.6693877551,250.3306122449,231.0693877551);transform:scale(1.1)}.skills__list-progress-bar .progress-bar-dot--active{background-color:#12f7d6;box-shadow:0 0 10px #12f7d6}.skills__list-progress-bar .progress-bar-line{width:1px;height:100%;background-color:#12f7d6}@keyframes fadeIn{0%{opacity:0}50%{opacity:1}80%{opacity:1}100%{opacity:0}}.portfolio__project-apps-container .project__buttons .project-button,.portfolio__project-info .project-info__buttons .project-button{display:inline-block;font-size:1.8rem;background-color:#12f7d6;border-radius:50px;border:1px solid #12f7d6;color:#1a1e23;text-decoration:none;transition:all .2s ease-in-out}.portfolio__project-apps-container .project__buttons .project-button:hover,.portfolio__project-info .project-info__buttons .project-button:hover{color:#12f7d6;background-color:#1a1e23}.portfolio__project-description,.portfolio__project-info{flex-basis:51%;margin-left:4%}.portfolio{overflow:hidden;font-size:1.6rem}.portfolio>div{border-bottom:1px solid #ccc}.portfolio>:last-child{border-bottom:none}.portfolio__title{position:relative;display:inline-block;font-size:5.4rem;color:#12f7d6;font-weight:400}@media screen and (max-width: 480px){.portfolio__title{font-size:4.6rem}}@media screen and (max-width: 350px){.portfolio__title{font-size:3.6rem}}.portfolio__title::after{content:"";position:absolute;bottom:8px;left:125%;width:600%;height:1px;background-color:#12f7d6}@media screen and (max-width: 480px){.portfolio__title::after{left:110%}}.portfolio__project-info-box{display:flex}@media screen and (max-width: 480px){.portfolio__project-info-box{display:block}}.portfolio__project{display:flex;padding:140px 0 100px 0}@media screen and (max-width: 480px){.portfolio__project{flex-wrap:wrap;padding:100px 0 45px 0}}.portfolio__project--apps{position:static;display:block}@media screen and (max-width: 480px){.portfolio__project-info{margin:0;flex-basis:100%}}.portfolio__project-info .project-info__title{font-size:2.4rem;font-weight:700;text-shadow:0 0 2px #fff}@media screen and (max-width: 480px){.portfolio__project-info .project-info__title{margin:20px 0 40px;text-align:center}}.portfolio__project-info .project-info__summary{line-height:1.8;margin:25px 0 35px 0}@media screen and (max-width: 480px){.portfolio__project-info .project-info__summary{width:100%}}.portfolio__project-info .project-info__implementation{margin-bottom:50px}.portfolio__project-info .project-info__implementation .implementation__label{margin-bottom:25px}@media screen and (max-width: 480px){.portfolio__project-info .project-info__implementation .implementation__label{padding:0}}.portfolio__project-info .project-info__implementation .implementation__tools{display:flex;align-items:center}@media screen and (max-width: 480px){.portfolio__project-info .project-info__implementation .implementation__tools{padding:0;flex-wrap:wrap;row-gap:20px}}.portfolio__project-info .project-info__implementation .implementation__tools img{max-width:10%;height:30px;margin-right:8%}.portfolio__project-info .project-info__implementation .implementation__tools img:last-child{margin:0}.portfolio__project-info .project-info__implementation--apps{margin-top:35px}@media screen and (max-width: 480px){.portfolio__project-info .project-info__buttons{margin-top:30px;text-align:center}}.portfolio__project-info .project-info__buttons .project-button{padding:.8em 1em}.portfolio__project-info .project-info__buttons .project-button:hover{color:#12f7d6;background-color:#1a1e23}.portfolio__project-info .project-info__buttons .project-button--live{margin-right:4%}@media screen and (max-width: 480px){.portfolio__project-info .project-info__buttons .project-button--live{margin-right:7%}}.portfolio__project-info-apps{display:flex}.portfolio__project-features{list-style-type:disc !important;padding:0 0 0 20px;margin:-15px 0 -5px 0}.portfolio__project-features-item{line-height:1.6}.portfolio__project-thumbnail{flex-basis:49%;position:relative}@media screen and (max-width: 480px){.portfolio__project-thumbnail{flex-basis:100%}}.portfolio__project-thumbnail .decorative{position:absolute;top:-40px;left:0;width:100%;padding-left:20px;line-height:40px;border-radius:12px 12px 0 0;background-color:#2c3037}.portfolio__project-thumbnail .decorative--weather-app{background:#4e535d}.portfolio__project-thumbnail .decorative span{display:inline-block;width:8px;height:8px;border-radius:50%;background-color:#d9d9d9}.portfolio__project-thumbnail img{border-radius:0 0 12px 12px}.portfolio__project-apps-container{display:flex;flex-wrap:wrap;margin-top:70px;justify-content:space-between}.portfolio__project-apps-container .project{flex-basis:48%;margin-bottom:100px;display:flex;flex-direction:column;justify-content:space-between}.portfolio__project-apps-container .project:nth-last-of-type(1),.portfolio__project-apps-container .project:nth-last-of-type(2){margin-bottom:0}@media screen and (max-width: 480px){.portfolio__project-apps-container .project{flex-basis:100%}.portfolio__project-apps-container .project:nth-last-of-type(2){margin-bottom:40px}}.portfolio__project-apps-container .project__title{font-size:2rem}.portfolio__project-apps-container .project__summary{margin:10px 0 20px 0;line-height:1.6}.portfolio__project-apps-container .project__buttons .project-button{padding:.6em .8em}.portfolio__project-apps-container .project__buttons .project-button--live{margin-right:4%}.contact{overflow-x:hidden;padding-bottom:12px}.contact__title{position:relative;display:inline-block;font-size:5.4rem;color:#12f7d6;font-weight:400}@media screen and (max-width: 480px){.contact__title{font-size:4.6rem}}@media screen and (max-width: 350px){.contact__title{font-size:3.6rem}}.contact__title::after{content:"";position:absolute;bottom:8px;left:125%;width:600%;height:1px;background-color:#12f7d6}@media screen and (max-width: 480px){.contact__title::after{left:110%}}.contact__info-block{display:flex;padding-top:150px}@media screen and (max-width: 480px){.contact__info-block{flex-wrap:wrap;padding-top:50px}}.contact__info{flex-basis:38%}@media screen and (max-width: 480px){.contact__info{flex-basis:100%;margin-bottom:60px}}.contact__info-item{margin-bottom:35px;font-size:1.6rem}@media screen and (max-width: 480px){.contact__info-item{margin-bottom:20px}}.contact__info-item>img{margin-right:40px}@media screen and (max-width: 480px){.contact__info-item>img{margin-right:20px}}.contact__info-item a{display:inline-block;color:#fff}.contact__info-item:last-child{margin:0}.contact__info-link:hover{text-decoration:underline}.contact .contact__form-inputs-item input:valid~label,.contact__form-inputs-item .contact input:valid~label,.contact .contact__form-inputs-item input:focus~label,.contact__form-inputs-item .contact input:focus~label{top:-40px;font-size:1.6rem;color:#12f7d6;transition:all .125s cubic-bezier(0.2, 0, 0.03, 1)}@media screen and (max-width: 480px){.contact .contact__form-inputs-item input:valid~label,.contact__form-inputs-item .contact input:valid~label,.contact .contact__form-inputs-item input:focus~label,.contact__form-inputs-item .contact input:focus~label{top:-25px}}.contact__form{flex-grow:1;display:flex;justify-content:space-between}@media screen and (max-width: 480px){.contact__form{flex-wrap:wrap;justify-content:flex-end}}.contact__form-inputs{position:relative;flex-basis:74%;display:flex;flex-wrap:wrap;align-content:space-between;justify-content:space-between}@media screen and (max-width: 480px){.contact__form-inputs{flex-basis:100%}}.contact__form-inputs-item{position:relative}.contact__form-inputs-item label{position:absolute;top:0;left:0;padding:10px;font-size:1.6rem;color:#d1d1d1;transition:all .25s cubic-bezier(0.2, 0, 0.03, 1);pointer-events:none}.contact__form-inputs-item input{padding:10px;width:100%;border-radius:4px;font-size:1.6rem;background-color:rgb(47.737704918,55.0819672131,64.262295082);border:none;color:#fff}@media screen and (max-width: 480px){.contact__form-inputs-item input{margin-bottom:20px}}.contact__form-inputs-item input~span{position:absolute;display:block;bottom:0;left:0;width:0;height:3px;background:#12f7d6;transition:all .125s cubic-bezier(0.2, 0, 0.03, 1)}@media screen and (max-width: 480px){.contact__form-inputs-item input~span{bottom:20px}}.contact__form-inputs-item input:focus{outline:0}.contact__form-inputs-item input:focus~span{width:100%;transition:all .125s cubic-bezier(0.2, 0, 0.03, 1)}.contact__form-inputs-item--name{flex-basis:35%}.contact__form-inputs-item--email{flex-basis:55%}.contact__form-inputs-item--message{flex-basis:100%}.contact__form-error-info{position:absolute;top:50%;right:0;text-align:right;transform:translateY(-50%)}@media screen and (max-width: 480px){.contact__form-error-info{top:100%;right:34%;transform:translateY(0)}}.contact__form-error-info p{display:none;font-size:1.6rem;color:red}.contact__form-error-info h2{display:none;font-size:1.6rem}.contact__form-button{align-self:flex-end;padding:1em 1.1em;margin-right:9px;font-size:1.8rem;border:1px solid #12f7d6;border-radius:50px;background-color:#1a1e23;color:#12f7d6;transition:box-shadow .2s ease-in-out}@media screen and (max-width: 480px){.contact__form-button{justify-self:flex-end;margin-right:12px}}.contact__form-button:hover{box-shadow:inset 0 0 5px #12f7d6,0 0 12px #12f7d6}.contact__form-button>img{margin-left:10px}.footer{display:flex;align-items:center;padding:80px 0 50px 0;font-size:1.6rem}@media screen and (max-width: 480px){.footer{padding:40px 0;font-size:1.2rem}}.footer__link{flex-basis:20%;padding:10px 0;color:#fff;cursor:pointer;transition:.2s}.footer__link:hover{color:#ccc}@media screen and (max-width: 480px){.footer__link{flex-basis:30%;text-align:center}}.footer__link-image{margin-right:15px;vertical-align:bottom}@media screen and (max-width: 480px){.footer__link-image{margin:0}}.footer__copyright{margin-left:auto}