.header-container{display:flex;flex-flow:row nowrap;justify-content:space-around;align-items:center;align-content:center;box-shadow:0 8px 16px -5px rgba(0,0,0,.24);z-index:99;width:100%;position:absolute;top:0;height:10vh;overflow-x:hidden}.header-container .navigation-image,.header-container .navigation-image-social{width:30px;margin:0 8px;flex:1 1}.header-container .an-icon-container{display:flex;justify-content:center;align-items:center;align-content:center;width:30px}.header-container .an-icon-container #an-icon{width:30px}.header-container .navigation-container{display:flex;flex-flow:row nowrap;justify-content:center;align-items:center;margin:0}.header-container .navigation-container .navigation-button{flex:1 1;display:flex;text-decoration:none;font-size:2em;font-weight:600;color:grey;position:relative;margin:20px 0}.header-container .header-sosmed-container,.header-container .navigation-container .text{display:none}@media only screen and (min-width:768px){.header-container{justify-content:space-between}.header-container .navigation-image{width:32px;margin:0 25px;flex:1 1}.header-container .an-icon-container{margin-left:32px}.header-container .an-icon-container #an-icon{width:32px}.header-container .navigation-image-social{width:30px;flex:1 1}.header-container .header-sosmed-container{display:flex;justify-content:center;align-items:center;margin-right:32px}}@media only screen and (min-width:1024px){.header-container{flex-flow:column nowrap;justify-content:space-around;align-items:center;width:12vh;height:100vh;top:0;left:0;box-shadow:0 8px 16px -4px rgba(0,0,0,.37);border-bottom:0}.header-container .navigation-image,.header-container .navigation-image-social{width:30px;margin:5px 10px}.header-container .an-icon-container{display:flex;justify-content:center;align-items:center;width:100%;margin:0 auto}.header-container .an-icon-container #an-icon{width:40px}.header-container .navigation-container{flex-flow:column nowrap;width:10vh}.header-container .navigation-container .navigation-button{display:flex;justify-content:center;align-items:center;text-decoration:none;height:20px;font-size:1vw;font-weight:600;color:#524e4e;text-align:center}.header-container .navigation-container .navigation-button:hover{color:#fcf4f4}.header-container .navigation-container .navigation-button:active{color:#0e1116;text-decoration:none}.header-container .navigation-container .navigation-button:link,.header-container .navigation-container .navigation-button:visited{text-decoration:none}.header-container .overlay{display:flex;justify-content:center;align-items:center;position:absolute;top:0;bottom:0;left:0;right:0;opacity:0;transition:.5s ease;background-color:#e5e5e5}.header-container .navigation-button:hover .overlay{opacity:1}.header-container .text{display:block!important;color:#386c0b;font-size:20px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center}.header-container .header-sosmed-container{display:flex;flex-flow:column nowrap;justify-content:center;align-items:center;width:100%;margin-right:0}}*{font-family:"Roboto"}body{box-sizing:border-box;padding:0;height:100%;margin:10vh 0 0;background-color:#e5e5e5}@media only screen and (min-width:1024px){body{box-sizing:border-box;padding:0;height:100%;margin:0 0 0 10vh}}.main-container{display:flex;justify-content:flex-start;align-items:center;height:50vh;color:#0e1116}.fade-enter{opacity:0;z-index:1}.fade-enter,.fade-enter-active{opacity:1;transition:opacity 1s ease-in}.home-container{align-content:flex-start;height:100%;margin-top:30vh;flex-flow:column wrap;color:#0e1116;overflow:hidden;padding-bottom:20px}.home-bottom,.home-container{display:flex;justify-content:center;width:100%;z-index:20;position:relative}.home-bottom{align-content:center;height:50%}.home-bottom .home-left{display:flex;flex-flow:column nowrap;align-items:flex-start;width:100%;margin-left:10%}.home-bottom .home-left .title-style-home{font-weight:700;font-size:2rem;margin-bottom:32px}.home-bottom .home-left .button-contactme{color:#0e1116;background-color:#e5e5e5;font-weight:700;font-size:1em;width:65%;min-width:130px;max-width:180px;min-height:52px;border-radius:56px;border:3px solid rgba(55,74,103,.2);display:block;box-shadow:0 0 12px 0 rgba(0,0,0,.24)}@media only screen and (min-width:768px){.home-container{margin-top:30vh}.home-bottom .home-left{width:100%}.home-bottom .home-left .title-style-home{font-weight:700;font-size:2.5rem}.button-contactme{width:60%}}@media only screen and (min-width:1024px){.home-container{height:100%;width:100%;display:flex;justify-content:center;align-content:center}.home-bottom{margin:0}.home-bottom .home-left{width:100%}.home-bottom .home-left .title-style-home{font-weight:700;font-size:3rem;margin-bottom:48px}.home-bottom .home-left .button-contactme{height:54px}}.about-container{width:85%;height:100%;margin:0 auto;color:#0e1116;z-index:80;top:0}.about-container,.about-container .about-wrapper{display:flex;align-items:center;justify-content:center;flex-flow:column nowrap;position:relative}.about-container .about-wrapper{width:80%}.about-container .about-wrapper .about-title{margin:5% auto;font-weight:700;text-align:center;font-size:2rem}.about-container .about-wrapper .about-bottom .bottom-left{display:flex;align-items:center;justify-content:center}.about-container .about-wrapper .about-bottom .bottom-left img{width:60%;max-width:350px;border-radius:3%;border:1px solid rgba(55,74,103,.5);box-shadow:0 0 21px -4px rgba(0,0,0,.4)}.about-container .about-wrapper .about-bottom .bottom-right{display:flex;align-items:center;justify-content:center;flex-flow:column nowrap;z-index:50}.about-container .about-wrapper .about-bottom .bottom-right .bottom-text{display:flex;align-items:center;justify-content:center;flex-flow:column nowrap;margin-top:20px;text-align:center;width:100%;font-weight:600;font-size:1.1em;position:relative}.about-container .about-wrapper .about-bottom .bottom-right .about-contact{display:flex;align-items:center;justify-content:center;flex-flow:column nowrap;width:15%;max-width:48px;margin:16px 0}.about-container .about-wrapper .about-bottom .bottom-right .about-contact img{width:100%}.about-container .about-wrapper .about-bottom .bottom-right .bottom-quote{display:flex;align-items:center;justify-content:center;flex-flow:column nowrap;text-align:center;width:100%;font-size:20px;position:relative;font-family:"Courgette",cursive}@media only screen and (min-width:768px){.about-container .about-wrapper .about-title{text-align:center;font-size:3rem}#anphoto{width:40%}}@media only screen and (min-width:1024px){.about-container{display:flex;align-items:center;justify-content:center;position:relative;top:0;width:100%;margin:0 auto;color:#0e1116;overflow:hidden}.about-container .about-wrapper{flex-flow:column nowrap}.about-container .about-wrapper .about-title{text-align:center;font-size:3.5rem}.about-container .about-wrapper .about-bottom{display:flex;align-items:center;justify-content:center;flex-flow:row nowrap}.about-container .about-wrapper .about-bottom .bottom-left{width:50%}.about-container .about-wrapper .about-bottom .bottom-left #anphoto{width:70%}.about-container .about-wrapper .about-bottom .bottom-right{width:50%}.about-contact{display:none}}.card-container{display:flex;align-items:center;justify-content:center;flex-flow:row wrap;width:100%;height:100%;margin:16px auto;padding:20px 0;border-radius:20px;background-color:#e5e5e5;box-shadow:inset 0 0 16px -7px rgba(0,0,0,.6)}.cardWrapper{width:75px;height:75px;position:relative;float:left;margin:8px;-webkit-font-smoothing:antialiased}.cardFace{display:flex;align-items:center;justify-content:center;border-radius:4px;flex-flow:column nowrap;position:absolute;width:75px;height:75px;overflow:hidden}.skill-icons{width:60%}.front{background-color:#374a67}.back{background-color:#616283}.cardFace h1{text-align:center;margin:0;font-size:15px;color:#fff}.cardFace .back h1{border-color:#91e600}@media only screen and (min-width:768px){.cardFace,.cardWrapper{width:100px;height:100px}}@media only screen and (min-width:1024){.cardFace,.cardWrapper{width:100px;height:100px}}.skills-container{width:85%;height:100%;margin:0 auto;color:#0e1116;z-index:80;top:0;width:95%}.skills-container,.skills-container .skill-wrapper{display:flex;align-items:center;justify-content:center;flex-flow:column nowrap;position:relative}.skills-container .skill-wrapper{width:80%}.skills-container .skill-wrapper .skill-title{margin:5% auto;font-weight:700;text-align:center;font-size:2rem}.skills-container .skill-wrapper .skill-bottom .skill-right{display:none}.skills-container .skill-wrapper .skill-bottom .skill-left{display:flex;align-items:center;justify-content:center;flex-flow:column nowrap}.skills-container .skill-wrapper .skill-bottom .skill-left .skill-desc{font-size:1rem;font-weight:600;letter-spacing:1px;text-align:justify}.skills-container .skill-wrapper .skill-bottom .skill-left .skill-right-mobile{margin:5px}.skills-container .skill-wrapper .skill-bottom .skill-left .skill-right-mobile a{text-decoration:none}.skills-container .skill-wrapper .skill-bottom .skill-left .skill-right-mobile button{width:200px;height:40px;margin:12px 0 4px;border:3px solid rgba(55,74,103,.2);display:block;box-shadow:0 0 12px 0 rgba(0,0,0,.2);border-radius:12px;font-weight:800}@media only screen and (min-width:768px){.skills-container{height:100%}.skills-container .skill-wrapper .skill-desc{font-size:1rem;font-weight:600;letter-spacing:1px;text-align:justify}.skills-container .skill-wrapper .skill-title{text-align:center;font-size:3rem}.skill-left .skill-right-mobile button{height:100px}}@media only screen and (min-width:1024px){.skills-container .skill-wrapper .skill-title{text-align:center;font-size:3.5rem}}.contact-container{display:flex;align-items:center;justify-content:center;flex-flow:column nowrap;width:85%;height:100%;margin:0 auto;color:#0e1116;z-index:80;top:0;justify-content:flex-start;position:relative}.contact-container .contact-title{margin:5% auto;font-weight:700;text-align:center;font-size:2rem}.contact-container .contact-greeting{text-align:justify;font-weight:600;font-size:1em;margin-bottom:5%}.contact-container .contact-map-form{overflow:hidden;display:flex;flex-flow:column nowrap}.contact-container .contact-map-form .contact-top{display:flex;justify-content:center;align-items:center;margin:0 auto;width:100%}.contact-container .contact-map-form .contact-top #mapboxgl{width:100%;height:15vh}.contact-container .contact-map-form .contact-bottom{display:flex;flex-flow:column nowrap;width:100%;margin:5% auto;justify-content:center;align-items:center}.contact-container .contact-map-form .contact-bottom .contact-bottom__top form .half-top{display:flex;justify-content:space-between}.contact-container .contact-map-form .contact-bottom .contact-bottom__top form .half-top input{width:48%}.contact-container .contact-map-form .contact-bottom .contact-bottom__top form div>input,.contact-container .contact-map-form .contact-bottom .contact-bottom__top form textarea{height:35px;width:100%;margin-bottom:1.3vh;border:1px solid rgba(55,74,103,.5);box-shadow:0 0 4px 0 rgba(0,0,0,.28);border-radius:8px;background-color:#fff;box-sizing:border-box;padding:10px}.contact-container .contact-map-form .contact-bottom .contact-bottom__top form div>input[type=submit]{width:50%;padding:0;height:35px;display:block;border-radius:56px;border:1px solid rgba(55,74,103,.2);box-shadow:0 0 12px 0 rgba(0,0,0,.28)}.contact-container .contact-map-form .contact-bottom .contact-bottom__top form .half-bottom{display:flex;flex-flow:column nowrap;justify-content:center;align-items:center}.contact-container .contact-map-form .contact-bottom .contact-bottom__top form .half-bottom #contact-textarea{height:15vh;max-height:20vh;max-width:100%}.form-response{display:flex;justify-content:center;align-items:center;text-align:center;flex-flow:column nowrap;border:3px solid rgba(55,74,103,.5);border-radius:8px;position:absolute;width:50vw;height:10vh;left:50%;z-index:80;top:50%;transform:translate(-50%,-28%);background-color:hsla(0,0%,82.7%,.9)}.form-response .response-button input{width:100%;border-radius:8px}.form-response .response-button img{width:10%}@media only screen and (min-width:768px){.contact-container .contact-title{text-align:center;font-size:3rem}.contact-container .contact-map-form{justify-content:center;align-items:center;flex-direction:row-reverse;width:100%;height:50vh}.contact-container .contact-map-form .contact-top{height:100%;margin:0 5px;padding:20px}.contact-container .contact-map-form .contact-top #mapboxgl{height:85%;border:1px solid rgba(55,74,103,.5);box-shadow:0 0 8px 0 rgba(0,0,0,.28);border-radius:8px}.contact-container .contact-map-form .contact-bottom{height:100%;margin:0 20px;justify-content:center}.contact-container .contact-map-form .contact-bottom .contact-bottom__top form div>input,.contact-container .contact-map-form .contact-bottom .contact-bottom__top form textarea{height:40px;margin-bottom:1.5vh}.contact-container .contact-map-form .contact-bottom .contact-bottom__top form div>input[type=submit]{height:40px;border-radius:20px}.contact-container .contact-map-form .contact-bottom .contact-bottom__top form .half-bottom{display:flex;flex-flow:column nowrap;justify-content:center;align-items:center}.contact-container .contact-map-form .contact-bottom .contact-bottom__top form .half-bottom #contact-textarea{height:20vh;max-height:20vh;max-width:100%}.form-response{width:30vw;height:10vh;left:50%;z-index:80;top:50%;transform:translate(-50%,-50%)}}@media only screen and (min-width:1024px){.contact-container{width:80%;height:100vh}.contact-title{text-align:center;font-size:3.5rem}.contact-greeting{text-align:justify;font-weight:600;font-size:1.3em;margin-bottom:5%}.contact-bottom{display:flex;flex-flow:column nowrap;width:100%;margin:5% auto;justify-content:center;align-items:center}.contact-bottom .contact-bottom__top{width:100%}.contact-bottom #mapboxgl{height:1vh}}@media only screen and (min-width:1440px){.contact-title{margin:5% auto;font-weight:700;font-size:3.5rem}.contact-greeting{text-align:justify;font-weight:600;font-size:1.3em;margin-bottom:5%}.contact-bottom{display:flex;flex-flow:column nowrap;width:100%;margin:5% auto;justify-content:center;align-items:center}.contact-bottom #mapboxgl{height:1vh}}.info-container{display:flex;justify-content:flex-start;align-items:flex-start;flex-flow:row nowrap;width:100%;color:#000;border-radius:12px;position:fixed;top:10vh;z-index:90}.info-container .arrow-wrapper{display:flex;align-items:center;justify-content:center;width:12px;background-color:#e5e5e5;transform:translateX(5vw);transition:all .4s ease-in;position:absolute;top:3vh;left:0;z-index:99}.info-container .arrow-wrapper img{width:28px;opacity:1}.info-container .arrow-wrapper.active{transform:translateX(90vw)}.info-container .info-content{display:flex;flex-flow:column nowrap;justify-content:flex-start;align-items:center;height:100%;width:100vw;background-color:#e5e5e5;color:#000;position:absolute;border-radius:12px;transform:translateX(-150%);transition:all .4s ease-in}.info-container .info-content.active{transform:translateX(0)}.info-container .info-content .content-wrapper{width:100vw;background-color:#e5e5e5;padding-bottom:24px}.info-container .info-content .content-wrapper,.info-container .info-content .content-wrapper .icon-wrapper{display:flex;align-items:center;justify-content:center;flex-flow:column nowrap;box-shadow:0 0 4px 0 rgba(0,0,0,.28);border:1px solid rgba(55,74,103,.2)}.info-container .info-content .content-wrapper .icon-wrapper{padding-top:12px;margin:8px 0;width:200px;border-radius:8px}.info-container .info-content .content-wrapper .icon-wrapper p{font-size:14px;font-weight:700}.info-container .info-content .content-wrapper .icon-wrapper img{width:32px}.info-container .info-content #contact-link{text-decoration:none}@media only screen and (min-width:1024px){.info-container{display:none}}.socialmedia-container{display:flex;align-items:center;justify-content:center;display:none}.socialmedia-container .socialmedia-wrapper{display:flex;align-items:center;justify-content:center}.socialmedia-container .socialmedia-wrapper .socialmedia-link-container{display:flex;align-items:center;justify-content:center;height:50px;width:50px;padding:24px;margin:20px;background-color:hsla(0,0%,89.8%,.4);border:3px solid rgba(55,74,103,.1);border-radius:12px;box-shadow:0 8px 16px -4px rgba(0,0,0,.37)}.socialmedia-container .socialmedia-wrapper .socialmedia-link-container a{display:flex;align-items:center;justify-content:center;color:#000;text-decoration:none}.socialmedia-container .socialmedia-wrapper .socialmedia-link-container a img{width:48px}@media only screen and (min-width:1024px){.socialmedia-container{display:flex}}.works-container{width:85%;height:100%;margin:0 auto;color:#0e1116;z-index:80;top:0}.works-container,.works-container .works-wrapper{display:flex;align-items:center;justify-content:center;flex-flow:column nowrap;position:relative}.works-container .works-wrapper{width:80%}.works-container .works-wrapper .works-title{margin:5% auto;font-weight:700;text-align:center;font-size:2rem}.works-container .works-wrapper .works-card-container,.works-container .works-wrapper .works-card-container .works-card{display:flex;align-items:center;justify-content:center;flex-flow:column nowrap}.works-container .works-wrapper .works-card-container .works-card{height:500px;min-height:500px;box-shadow:0 0 21px -4px rgba(0,0,0,.4);border-radius:24px;padding:24px 12px;width:250px;margin:0 20px 20px}.works-container .works-wrapper .works-card-container .works-card .works-link-wrapper{display:flex;justify-content:flex-start;align-items:flex-start;flex-flow:column nowrap;width:100%;height:200px}.works-container .works-wrapper .works-card-container .works-card .works-link-wrapper div{width:100%;height:100%}.works-container .works-wrapper .works-card-container .works-card .works-link-wrapper div #works-link{display:flex;justify-content:flex-start;align-items:flex-start;width:100%;height:100%}.works-container .works-wrapper .works-card-container .works-card .works-link-wrapper div #works-link img{height:200px;width:100%;text-align:center;object-fit:contain;border-radius:12px}.works-container .works-wrapper .works-card-container .works-card .modal-icon{padding:12px}.works-container .works-wrapper .works-card-container .works-card .modal-icon .card-title{width:100%;margin:12px auto;font-weight:700;font-size:24px}.works-container .works-wrapper .works-card-container .works-card .modal-icon .card-tech{display:flex;margin:12px auto;flex-flow:row wrap}.works-container .works-wrapper .works-card-container .works-card .modal-icon .card-tech #tech{margin:0 4px 8px;background-color:#374a67;padding:8px;border-radius:12px;color:#fff;letter-spacing:.4px}.works-container .works-wrapper .works-card-container .works-card .modal-icon .card-desc{width:100%;font-weight:600;line-height:24px}@media only screen and (min-width:768px){.works-container .works-wrapper .works-title{text-align:center;font-size:3rem}}@media only screen and (min-width:1024px){.works-container{width:100%}.works-container .works-wrapper .works-card-container{flex-flow:row nowrap}.works-container .works-wrapper .works-title{text-align:center;font-size:3.5rem}}.particle-container{margin-top:10vh;height:90vh;width:100%;position:fixed;top:0;left:0;z-index:-1;overflow:hidden}.particle-container .particle-content{z-index:1;display:block;position:relative;width:100%;height:100%}@media only screen and (min-width:1024px){.particle-container{height:100vh;width:90vw;margin-left:10vw;margin-top:0;position:fixed;z-index:1}.particle-container .particle-content{z-index:1;position:relative;width:100%;height:100%}}.loader-container{height:100vh;width:100vw;z-index:100;opacity:1;position:absolute;top:0;left:0;background-color:#e5e5e5}.loader-container,.loader-container .loader-wrapper{display:flex;justify-content:center;align-items:center}.loader-container .loader-wrapper{flex-flow:column nowrap;width:100px;height:100px}.loader-container .loader-wrapper img{width:100%;height:80%;-webkit-animation:bounceAndRotate .8s infinite alternate;animation:bounceAndRotate .8s infinite alternate}@-webkit-keyframes bounceAndRotate{0%{transform:translateY(0) rotateY(0deg)}to{transform:translateY(-80px) rotateY(1turn)}}@keyframes bounceAndRotate{0%{transform:translateY(0) rotateY(0deg)}to{transform:translateY(-80px) rotateY(1turn)}}
/*# sourceMappingURL=main.148b97b1.chunk.css.map */