*,*:before,*:after,:root{margin:0;padding:0;box-sizing:border-box}html,body{height:100%;width:100%}body{color:#252934;background:#fafafa;font-size:62.5%;font-family:Overlock,Arial,Helvetica,sans-serif;overflow-x:hidden}a,a:visited{color:gold;font-size:1.4rem;text-decoration:none;transition:.2s}a:hover,a:active{color:gold}.menu-container>.overlay,.menu-container.active>.overlay{position:absolute;right:0;height:calc(100vh - 120px);width:calc(100vw - 120px);background:#fafafa}.menu-container.active>.overlay{animation:overlay-slide-in .3s forwards .3s}@keyframes overlay-slide-in{0%{width:calc(100vw - 120px)}to{width:0}}.menu-container>.overlay{animation:overlay-slide-out .3s forwards}@keyframes overlay-slide-out{0%{left:0;width:0}to{left:0;width:calc(100vw - 120px)}}.menu-container{position:fixed;height:100vh;width:100vw;background:#202934;border:60px solid #181d23;display:flex;flex-direction:column;justify-content:center;align-items:center;overflow:hidden}.menu-container:before,.menu-container:after{content:"";position:absolute;width:100%;min-height:100vh;z-index:-1}.menu-container:before{background:url(/svg/Stars.svg)}.menu-container:after{background:#b46600 url(/svg/floresta.svg) bottom repeat-x}.menu-container.deactive{animation:fade-out .6s forwards}@keyframes fade-out{0%{opacity:1;z-index:999}50%{opacity:1;z-index:999}to{opacity:0;z-index:-1}}.menu-container.active{animation:fade-in .3s forwards}@keyframes fade-in{0%{opacity:0;z-index:-1}to{opacity:1;z-index:999}}.menu-container ul,.menu-container .social{margin-left:-80px;opacity:0;animation:slide-out .2s forwards}.menu-container ul{list-style-type:none!important;font-size:3rem}@keyframes slide-out{0%{opacity:1;margin-left:0}to{opacity:0;margin-left:-80px}}.menu-container.active ul,.menu-container.active .social{animation:slide-in .3s forwards .6s}@keyframes slide-in{0%{opacity:0;margin-left:-80px}to{opacity:1;margin-left:0}}.menu-container ul li{border-left:.2rem solid transparent;transition:border-left .2s}.menu-container ul li a{font-size:3rem;padding-left:.5rem}.menu-container ul li a:after{content:" »";font-size:2.5rem;color:transparent;transition:color .2s}.menu-container ul li a:hover:after{content:" »";color:gold}.social{padding:1rem 0 0 .5rem}.social a{font-size:1.5rem;padding:.2rem}.menu-container a,.menu-container a:visited{color:#fafafa}.menu-container a:hover,.menu-container a:active{color:gold}@media only screen and (max-width: 649px){.menu-container{border:none}.menu-container>.overlay,.menu-container.active>.overlay{height:100vh;width:100vw}.menu-container.active>.overlay{animation:overlay-slide-in .3s forwards .3s}@keyframes overlay-slide-in{0%{width:100vw}to{width:0}}.menu-container>.overlay{animation:overlay-slide-out .3s forwards}@keyframes overlay-slide-out{0%{left:0;width:0}to{left:0;width:100vw}}}#navbar{position:fixed;z-index:9999;width:100%;padding:1rem;display:flex;justify-content:center}#navbar.bg-active{background:#181d23}#navbar .nav-wrapper{width:100%;display:flex;justify-content:space-between;align-items:center;max-width:1400px;padding:0 2rem}#navbar .brand{font-size:1.6rem;color:#fafafa;cursor:default}.menu-button{position:relative;height:22px;width:30px;outline:none}.menu-button span,.menu-button span:before,.menu-button span:after{position:absolute;content:"";width:30px;height:3px;background:#fafafa;transition:.5s cubic-bezier(.77,0,.175,1)}.menu-button span{position:relative;display:block;top:50%;transform:translateY(-50%)}.menu-button span:before{top:-8px}.menu-button span:after{top:8px}.menu-button:hover>span,.menu-button:hover>span:before,.menu-button:hover>span:after{background:gold}.menu-button.active>span{background:transparent}.menu-button.active>span:before{transform:rotate(-225deg);top:0}.menu-button.active>span:after{transform:rotate(225deg);top:0}@media only screen and (max-width: 849px){#navbar{background:#181d23aa}}#welcome-section{background:#202736;background:linear-gradient(to bottom,#181d23,#202736 80%);background-attachment:fixed;background-size:cover;position:relative;min-height:100vh;width:100vw;margin:0 auto;z-index:1}#welcome-section:before{content:"";position:fixed;background:url(/svg/estrelas.svg?sanitize=true);background-attachment:fixed;width:100%;min-height:100vh;z-index:-1;opacity:0;animation:stars-move-in 1s .3s forwards}@keyframes stars-move-in{0%{background-position-y:-100px}to{opacity:1;background-position-y:0}}.forest{position:absolute;bottom:-300px;left:0;background:url(/svg/floresta.svg) bottom left repeat-x;background-size:cover;width:100%;height:80%;opacity:0;animation:forest-move-in 1s .5s forwards;border-bottom:300px solid #181d23}@keyframes forest-move-in{0%{background-position-y:150%}to{opacity:1;background-position-y:100%}}.silhouette{position:absolute;left:10px;right:0;top:0;background:url(/svg/programador.png) bottom left no-repeat;background-size:40vw 80vh;bottom:-200px}@keyframes silhouette-move-in{0%{background-position-x:0}to{opacity:1;background-position-x:50%}}@media (max-width: 2000px){.silhouette{background-size:40vw 70vh;bottom:-180px}}@media (max-width: 1500px){.silhouette{background-size:50vw 70vh;bottom:-100px}}@media (max-width: 1000px){.silhouette{background-size:60% 50%;bottom:-10%}}@media (max-width: 500px){.silhouette{background-size:80% 50%;bottom:-10%}}.moon{position:absolute;top:0;right:0;position:fixed;background:url(/svg/lua.svg?sanitize=true) right 150% no-repeat;background-size:40% 30vh;background-attachment:fixed;width:100%;height:100%;z-index:-1;opacity:0;animation:moon-move-in 1.2s 1s forwards}@keyframes moon-move-in{0%{opacity:0;background-position:right 150%}to{opacity:1;background-position:top right}}@media (max-width: 500px){.moon{background-size:200px 200px;bottom:-10%}}#welcome-section .container{width:-moz-fit-content;width:fit-content;position:absolute;top:50%;right:25%;opacity:0;transform:translateY(-50%);animation:text-fade-in 1s .8s forwards}@keyframes text-fade-in{0%{right:0}to{opacity:1;right:25%}}#welcome-section .container h3{font-size:2rem;font-weight:400;font-style:italic;color:#fafafa;line-height:3rem}#welcome-section .container h3 .line:first-child{margin-left:1rem;margin-top:2rem}#welcome-section .container h3 .line:last-child{margin-left:2rem}@media (max-width: 3000px){#welcome-section .container h3{font-size:4rem}}@media (max-width: 2500px){#welcome-section .container h3{font-size:3rem}}@media (max-width: 700px){#welcome-section .container h3{font-size:2.5rem;background-color:#0006;padding:0 10px;border-radius:15px}}@media (max-width: 500px){#welcome-section .container h3{font-size:1.5rem;background-color:#0006;padding:0 10px;border-radius:15px}}#welcome-section .container .buttons{display:flex;margin-top:1rem}#welcome-section .container .buttons a,#welcome-section .container .buttons a:visited{width:100%;padding:1rem;border:1px solid #fafafa;color:#fafafa;text-align:center;text-transform:uppercase;font-size:1rem}#welcome-section .container .buttons a:hover,#welcome-section .container .buttons a:active{border:1px solid gold;transform:translateY(-2px);box-shadow:0 10px 100px -20px gold}#welcome-section .container .buttons a.cta,#welcome-section .container .buttons a.cta:visited{background:gold;border:1px solid transparent;color:#fafafa;font-weight:700}#welcome-section .container .buttons a.cta:hover,#welcome-section .container .buttons a.cta:active{background:transparent;border:1px solid gold}#welcome-section .container .buttons a:first-child{margin-right:1rem}@media (max-width: 3000px){#welcome-section .container .buttons a{font-size:2rem}}@media (max-width: 700px){#welcome-section .container .buttons a{font-size:1rem}}.line{display:block}.color{color:gold;font-style:italic}@media only screen and (max-width: 649px){#welcome-section .container{right:50%;top:10%;width:80%;transform:translate(50%);animation:text-fade-in 1s .8s forwards}@keyframes text-fade-in{0%{right:0}to{opacity:1;right:50%}}.silhouette{width:100%}}#about{height:100%;min-height:100vh;font-size:1.4rem;position:relative;background:#fafafa;clip-path:polygon(0 0,20% 5%,100% 0,100% 100%,80% 95%,0 100%);z-index:5;background:#fafafa url(/img/minha_foto.png) center right no-repeat;background-attachment:fixed}#about .wrapper{padding:15rem 10rem 12rem;height:100%;min-height:100vh;max-width:1400px;margin:0 auto}#about article{display:grid;grid-template-columns:repeat(4,1fr);grid-gap:1rem;padding:3rem 0}#about .title{grid-column-end:span 4;display:flex;flex-direction:column;align-items:center}#about .title h3{font-size:2.4rem}@media only screen and (max-width: 1380px){#about .title h3{color:#bbbaba}}#about .separator{background:gold;width:150px;height:2px;margin:1rem 0;padding:0}#about .subtitle{font-size:1.6rem;text-align:center;color:inherit;padding-bottom:1.5rem;color:gold}#about p{padding-bottom:1.5rem;color:#fff;line-height:1.9rem;font-size:15px}#about .desc.full{grid-column-end:span 4;margin-bottom:2rem}#about .desc{grid-column-end:span 2;background:#000a;padding:2rem;text-align:justify}@media only screen and (max-width: 1149px){#about article{grid-template-columns:1fr;grid-gap:0}#about .desc.full,#about .desc{grid-column-end:-1}}@media only screen and (max-width: 949px){#about{clip-path:polygon(0 0,20% 2%,100% 0,100% 100%,80% 98%,0 100%);background-position:top left;background-size:cover}}@media only screen and (max-width: 649px){#about .wrapper{padding:10rem 2rem 8rem}}#projects{min-height:100vh;font-size:1.4rem;position:relative;background:linear-gradient(215deg,#8d8d8d,#444);margin-top:-10rem;z-index:1}#projects a,#projects a:visited{color:gold}#projects a:hover,#projects a:active{color:#252934}#projects .projects-container{max-width:1400px;margin:0 auto;width:100%;padding:12rem 5rem 8rem}#projects .heading .title{text-align:center;font-size:2.4rem;line-height:2.4rem}#projects .heading .separator{background:gold;width:150px;height:2px;margin:1rem auto}#projects .heading .subtitle{font-size:1.4rem;text-align:center;width:70%;margin:0 auto;text-align:justify}#projects .project{margin:1rem auto;width:70%;padding:2rem;display:grid;grid-template-columns:1fr 1fr;grid-template-rows:1fr;grid-gap:2rem}#projects .project .project-link{display:block;margin:auto 0;color:#252934;overflow:hidden;text-align:center;border-radius:50%;border:1px solid gold;box-shadow:0 20px 10px -10px #25293450;transition:.3s;height:300px;width:300px}#projects .project .project-link:hover{box-shadow:0 50px 15px -30px #25293450}#projects .project .project-link:hover>img{filter:saturate(1);transform:scale(1.05)}#projects .project .project-image{width:100%;transform:scale(1);filter:saturate(1);transition:all .3s}#projects .project .project-details{margin:auto 0}#projects .project-details .project-tile{font-size:2rem;text-transform:uppercase;font-weight:700;margin-bottom:0;color:gold}#projects .project-details .icons{margin:0;color:#252934}#projects .project-details .icons i{margin-right:.4rem;font-weight:400;font-size:1.4rem}#projects .project-details small{font-style:italic}#projects .project-details p{margin:1rem 0}#projects .project-details .buttons{display:flex;justify-content:space-between}#projects .project-details .buttons a{width:49%;padding:.5rem;border:none;border-bottom:1px solid gold;color:#252934;background:#fafafa;font-size:1.2rem;text-align:center}#projects .project-details .buttons a:hover{background:gold;color:#fafafa}#projects .project-details .buttons i{font-size:.8rem;vertical-align:middle;margin-left:.5rem}@media only screen and (max-width: 1149px){#projects .project{grid-template-columns:1fr 2fr}}@media only screen and (max-width: 949px){#projects .project{grid-template-columns:1fr}}@media only screen and (max-width: 649px){#projects{background:#f0f0f0}#projects .projects-container{padding:12rem 0 8rem}#projects .project{padding:2rem 0}}#contact{background:#181d23 url(/svg/envelope.svg) no-repeat right;clip-path:polygon(0 0,20% 100px,100% 0,100% 100%,0 100%);color:#fafafa;min-height:100vh;width:100%;padding:5rem 3rem;display:flex;justify-content:center;align-items:center;position:relative;margin:-100px 0 140px;z-index:1}#contact .container{width:70%;max-width:1200px;padding:25vh 0}#contact .container .heading-wrapper{display:flex;justify-content:space-between}#contact .heading-wrapper .social a{color:#fafafa}#contact .heading-wrapper .social a:hover{color:gold}.heading-wrapper .heading .title{font-size:3rem;line-height:2.4rem}.heading-wrapper .heading .separator{background:gold;width:150px;height:2px;margin:1rem 0}.heading-wrapper .heading .subtitle{font-size:1.4rem}#contact-form{margin-top:1rem}input,textarea{border:none;padding:1rem;font-family:Overlock,Arial,Helvetica,sans-serif;width:100%;height:40%;transition:.2s}input[type=text],input[type=email],input[type=text]:not(output):not(:focus),input[type=email]:not(output):not(:focus),textarea{border-bottom:1px solid #fafafa;background:transparent;color:#fafafa;font-size:1.8rem;box-shadow:none;outline:none}input[type=text]:focus,input[type=email]:focus,input[type=text]:not(output):focus,input[type=email]:not(output):focus,textarea:focus{border-bottom:1px solid gold}input[type=submit]{background:gold;color:#fafafa;margin-top:1rem;width:auto;float:right}input[type=submit]:hover,input[type=submit]:focus{cursor:pointer;color:#333;background:#fafafa}::-moz-placeholder{color:#fafafa}::placeholder{color:#fafafa}.mail{display:inline-block;font-style:italic}.mail .at,.mail .dot{font-size:.9rem;margin:0 .1rem;color:gold}@media only screen and (max-width: 1149px){#contact .social a{display:block}}@media only screen and (max-width: 649px){#contact{clip-path:polygon(0 0,20% 5%,100% 0,100% 100%,0 100%);padding:0}}footer{font-size:1rem;display:flex;justify-content:center;position:fixed;bottom:0;left:0;width:100%;height:150px;background:#fafafa;z-index:0}footer .wrapper{display:flex;width:100%;padding:2rem;max-width:1400px;align-items:center;justify-content:space-between}@media only screen and (max-width: 649px){footer .wrapper{flex-direction:column}footer .wrapper h3{padding-bottom:.8rem}}