@import "https://fonts.googleapis.com/css2?family=Albert+Sans:wght@200;400;600;800;900&family=Voltaire&display=swap";.preact-hint{z-index:9999;cursor:default;padding-bottom:5px;position:absolute}.preact-hint__fade-in{animation:.5s fadeIn}.preact-hint__content{color:#fff;white-space:nowrap;background:#000;border-radius:5px;padding:10px;display:block}.preact-hint:after{content:"";border:5px solid #0000;border-top-color:#000;border-bottom:none;width:0;height:0;margin:auto;display:block;position:absolute;inset:auto 0 0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.button{color:#be1e2d;background-color:#fff;border:1px solid #be1e2d;border-radius:5px;padding:5px 15px;font-size:18px;font-weight:600;line-height:1.5;transition:background-color .25s ease-in-out,border-color .25s ease-in-out,color .25s ease-in-out;display:inline-block}.button:hover{color:#fff;cursor:pointer;background-color:#be1e2d}.button.inverse{color:#fff;background-color:#be1e2d}.button.inverse:hover{color:#be1e2d;background-color:#fff}[class^=icon-]{font-size:110%}.g-recaptcha{visibility:hidden;display:none}body{color:#000;background:#fff;margin:0;padding:0;font-family:Albert Sans,sans-serif;font-size:20px;line-height:26px}body a{color:inherit;text-decoration:none}header{background-color:#fff;border-bottom:1px solid #be1e2d;justify-content:space-between;align-items:flex-start;padding:20px;font-family:Voltaire,sans-serif;display:flex;position:relative}header.sticky{z-index:99;width:calc(100% - 40px);position:fixed;top:0}header .logo{margin:0;padding:0}header .logo span[role=button]{color:#be1e2d;letter-spacing:2px;cursor:pointer;font-size:34px;position:relative}header .logo span[role=button] span{color:#333;position:relative;left:-10px}header .logo span[role=button]:hover{color:#333}header .logo span[role=button]:hover span{color:#be1e2d}header .toggle{cursor:pointer;text-align:right;font-size:23px;display:none}header .toggle.menu{color:#be1e2d}@media only screen and (width<=700px){header .toggle{display:block}}header nav{justify-content:flex-end;display:flex}header nav span{cursor:pointer;letter-spacing:2px;color:#333;padding-left:20px;font-size:23px;transition:color .25s}header nav span:hover,header nav span.active{color:#be1e2d}header nav span.active:hover{color:#333}@media only screen and (width<=700px){header nav{display:none}header nav.menu{text-align:right;padding:10px 0 0;line-height:1.5;display:block;position:relative}header nav.menu a{display:block}}header .skip-nav{z-index:-999;background:#fff;padding:0;position:absolute;top:75px;left:-999px;overflow:hidden}header .skip-nav:focus{z-index:999;padding:15px 20px;left:0;overflow:auto}main section{padding:90px 10% 105px;position:relative}@media only screen and (width<=700px){main section{padding:70px 10%}}main section>div{max-width:1300px;margin:0 auto;position:relative}main section h2{color:#333;letter-spacing:1px;margin:0 0 30px;padding:0;font-family:Voltaire,sans-serif;font-size:34px;position:relative}main section h2 span{color:#be1e2d;position:relative;left:-10px}#top{color:#fff;text-align:center;padding:0;position:relative;overflow:hidden}@media only screen and (width<=1024px){#top{padding:10px 0}}@media only screen and (width<=800px){#top{padding:20px 0}}@media only screen and (width<=700px){#top{padding:30px 0}}@media only screen and (width<=500px){#top{padding:50px 0}}#top svg{scale:1.1}@media only screen and (width<=1024px){#top svg{scale:1.2}}@media only screen and (width<=800px){#top svg{scale:1.3}}@media only screen and (width<=700px){#top svg{scale:1.5}}@media only screen and (width<=500px){#top svg{scale:2}}#about{background-color:#fff}#about .content{align-items:stretch;gap:50px;display:flex}#about .content>div{flex-basis:0}@media only screen and (width<=700px){#about .content{display:block}}#about .summary{flex-grow:2}#about .photo{flex-grow:1;width:100%;position:relative;top:-15px}#about .photo img{width:100%;height:auto}@media only screen and (width<=700px){#about .photo{text-align:center;width:100%;margin-bottom:30px}#about .photo img{width:100%;max-width:350px}}#about p{margin-top:0;padding-top:0;font-size:18px;line-height:1.5}#about p:last-of-type{margin-bottom:0;padding-bottom:0}@media only screen and (width<=1024px){#about p{font-size:85%}}#about a{border-bottom:1px dotted #333;font-weight:600}#about a:hover{border-bottom:0}#skills{background-color:#f2f2f2}#skills h2{margin-bottom:0;padding-bottom:20px}#skills p{margin:0;padding-bottom:50px;font-weight:200}#skills .content{flex-wrap:wrap;justify-content:center;gap:30px 20px;display:flex}#skills .content .skill{z-index:1;min-width:calc(10% - 20px);display:inline-block}#skills .content .skill:hover{cursor:zoom-in;z-index:5}#skills .content .skill:hover img{transform:scale(1.7)}#skills .content .skill img{width:60px;height:60px;transition:transform .2s}#skills .content .skill .preact-hint{font-size:20px;font-weight:800;bottom:70px!important}#skills .content .skill>div{z-index:1}#projects{background-color:#fff}#projects h2{margin-bottom:0;padding-bottom:20px}#projects p{margin:0;padding-bottom:50px;font-weight:200}#projects .content{flex-wrap:wrap;justify-content:center;gap:40px;display:flex}#projects .project{border:1px solid #be1e2d;border-radius:10px;flex:0 0 33.3333%;max-width:calc(33.3333% - 30px);position:relative;overflow:hidden}@media only screen and (width<=1260px){#projects .project{flex-basis:50%;max-width:calc(50% - 30px)}}@media only screen and (width<=700px){#projects .project{flex-basis:100%;max-width:calc(100% - 30px)}}#projects .project .wrapper{width:100%;padding-bottom:50%;position:relative}#projects .project .image{z-index:10;background-position:0;background-repeat:no-repeat;background-size:cover;position:absolute;inset:0}#projects .project .overlay{z-index:20;text-align:center;opacity:0;background-color:#ffffffe6;flex-direction:column;justify-content:center;align-items:center;gap:5px;height:calc(100% - 40px);padding:20px;transition:opacity .25s ease-in-out;display:flex;position:relative}@media only screen and (width<=800px) and (width>=700px){#projects .project .overlay{gap:2px}}#projects .project .overlay:hover{opacity:1}@media (hover:hover) and (pointer:fine){#projects .project .overlay:hover{opacity:1}}@media only screen and (width<=800px) and (width>=700px){#projects .project .button{font-size:16px}}#projects .project h3{color:#be1e2d;font-size:20px}@media only screen and (width<=800px) and (width>=700px){#projects .project h3{font-size:18px}}#projects .project p{font-size:16px}@media only screen and (width<=800px) and (width>=700px){#projects .project p{font-size:14px}}#projects .project h3,#projects .project p{margin:0;padding:0}#contact{background-color:#f2f2f2}#contact h2{padding-bottom:15px}#contact .content{gap:20px;display:flex}@media only screen and (width<=1024px){#contact .content{display:block}}#contact .socials{color:#be1e2d;width:50%;font-size:40px;display:flex}#contact .socials .preact-hint{font-size:20px;font-weight:800}#contact .socials a:hover{color:#333}#contact-form{gap:20px;width:100%;display:flex}#contact-form label{color:#0000;height:0}#contact-form input,#contact-form textarea{color:#333;background-color:#fff;border:1px solid #be1e2d;border-radius:5px;padding:10px;font-family:Albert Sans,sans-serif;font-size:18px;display:block}#contact-form input[name=subject],#contact-form textarea[name=subject]{display:none}#contact-form input[disabled],#contact-form textarea[disabled]{opacity:.5;border-color:#333}#contact-form button[disabled]{opacity:.5;pointer-events:none;cursor:not-allowed}#contact-form textarea{height:100%}#contact-form>div{flex-direction:column;flex:auto;gap:10px;display:flex}@media only screen and (width<=1024px){#contact-form{margin-top:40px}}@media only screen and (width<=800px){#contact-form{flex-direction:column}}footer{color:#f2f2f2;text-align:center;background-color:#be1e2d;padding:30px 20px;font-weight:200}footer small{font-size:75%}footer small:last-of-type{padding-left:5px}@media only screen and (width<=500px){footer small{display:block}}footer a:not(.license){border-bottom:1px dotted #f2f2f2}footer a:not(.license):hover{border-bottom:0}.sr-only{clip:rect(1px 1px 1px 1px);clip:rect(1px, 1px, 1px, 1px);clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:0;padding:0;overflow:hidden;position:absolute!important}