html,body{margin:0;padding:0;font-family:Inter,sans-serif;font-size:1.2em;font-weight:300}*{box-sizing:border-box}a{text-decoration:none;color:inherit}.nav{font-weight:600}.nav .divider{padding:0 1em}.nav .home:hover,.nav .home.active{color:#009a97}.nav .about:hover,.nav .about.active{color:#1e40af}.nav .blog:hover,.nav .blog.active{color:#4f46e5}.footer{border-top:solid 1px black;padding:1em 2em;display:flex;align-items:center;font-size:.7em}.footer .nav{padding-left:1.5em}.footer svg{width:2em}.footer .copyright{flex-grow:1;text-align:right;font-weight:300;font-size:.7em}.icon{border-radius:50%;display:flex;align-items:center;justify-content:center;position:relative;background-color:var(--icon-color)}.icon>*{pointer-events:none}.has-alt>*{transition:opacity .5s}.icon .hover{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;font-weight:700;display:flex;justify-content:center;align-items:center;color:#fff;text-shadow:black 0 .13em .1em}.has-alt:hover .hover{opacity:1}.has-alt:hover svg{opacity:.2}main .projects{display:flex;align-items:center;flex-direction:column;padding-top:4.2em}main .projects .grid{display:grid;grid-template-columns:repeat(3,1fr);width:100%;max-width:40em;grid-gap:1em}main .projects .project{display:flex;flex-direction:column;align-items:center;margin:3em 0}main .projects .project a:hover .image-container{opacity:.5}main .projects .project .image-container{width:12em;height:12em;display:flex;align-items:center;justify-content:center;padding:1em}main .projects .project img{max-width:100%;max-height:100%;height:auto}main .projects .project h4{margin:0;padding-top:.8em}@media (max-width: 50rem){.footer{padding:1em}.footer .nav{padding-left:.8em}main .projects .grid{grid-template-columns:repeat(1,1fr)}main .projects .project{margin:1em}}