:root{
    --bg-color:#fff;
    --bg-secondary-color:#f3f3f6;
    --color-primary:#168D54;
    --color-grey:#3f4144;
    --color-error:#D74747;
    --color-success:#28bd14;
    --grid-maxWidth:120rem;
    --grid-gutter:2rem;
    --font-size:1.6rem;
    --font-color:#333;
    --font-family-sans:-apple-system,"BlinkMacSystemFont","Avenir","Avenir Next","Segoe UI","Roboto","Oxygen","Ubuntu","Cantarell","Fira Sans","Droid Sans","Helvetica Neue",sans-serif;
    --font-family-mono:monaco,"Consolas","Lucida Console",monospace
}
html{
    -webkit-box-sizing:border-box;
    box-sizing:border-box;
    font-size:62.5%;
    line-height:1.15;
    -webkit-text-size-adjust:100%;
    -moz-text-size-adjust:100%;
    -ms-text-size-adjust:100%;
    text-size-adjust:100%
}
*,:after,:before{
    -webkit-box-sizing:inherit;
    box-sizing:inherit
}
body{
    background-color:var(--bg-color);
    line-height:1.6;
    font-size:var(--font-size);
    color:var(--font-color);
    font-family:"Segoe UI","Helvetica Neue",sans-serif;
    font-family:var(--font-family-sans);
    margin:0;
    padding:0
}
body.dark{
    --bg-color:#0c0c0c;
    --bg-secondary-color:#131316;
    --font-color:#f5f5f5;
    --color-grey:#ccc
}
h1,h2,h3{
    font-weight:500;
    margin:.35em 0 .6em
}
h1{
    font-size:1.5em
}
h2{
    font-size:1em
}
h3{
    font-size:.85em
}
a{
    color:var(--color-primary);
    text-decoration:none
}
a:hover:not(.button){
    opacity:.75
}
p{
    margin-top:0
}
img{
    max-width:100%
}
.container{
    max-width:720px;
    margin:3em auto 0;
    width:96%;
    padding:0 calc(var(--grid-gutter)/2)
}
.row{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:horizontal;
    -webkit-box-direction:normal;
    -ms-flex-flow:row wrap;
    flex-flow:row wrap;
    -webkit-box-pack:start;
    -ms-flex-pack:start;
    justify-content:flex-start;
    margin-left:calc(var(--grid-gutter)/-2);
    margin-right:calc(var(--grid-gutter)/-2)
}
.col{
    -webkit-box-flex:1;
    -ms-flex:1;
    flex:1;
    margin:0 calc(var(--grid-gutter)/2) calc(var(--grid-gutter)/2)
}
.button{
    padding:1rem 2.5rem;
    color:var(--color-grey);
    border-radius:4px;
    border:1px solid transparent;
    font-size:var(--font-size);
    line-height:1;
    text-align:center;
    -webkit-transition:opacity .2s ease;
    transition:opacity .2s ease;
    text-decoration:none;
    -webkit-transform:scale(1);
    transform:scale(1);
    display:inline-block;
    cursor:pointer
}
.button.secondary{
    color:#fff;
    z-index:1;
    background-color:#000
}
.button:hover{
    opacity:.8
}
.button.secondary{
    background-color:var(--color-grey)
}
.button.outline{
    background-color:transparent
}
.button.outline.secondary{
    border-color:var(--color-grey);
    color:var(--color-grey)
}
.button:active:not(:disabled),[type=button]:active:not(:disabled),[type=reset]:active:not(:disabled),[type=submit]:active:not(:disabled),button:active:not(:disabled){
    -webkit-transform:scale(.98);
    transform:scale(.98)
}
::-webkit-input-placeholder{
    color:#bdbfc4
}
::-moz-placeholder{
    color:#bdbfc4
}
:-ms-input-placeholder{
    color:#bdbfc4
}
::-ms-input-placeholder{
    color:#bdbfc4
}
.nav{
    min-height:5rem;
    -webkit-box-align:stretch;
    -ms-flex-align:stretch;
    align-items:stretch
}
.nav,.nav .brand,.nav a,.nav-center{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex
}
.nav-center{
    -webkit-box-flex:1;
    -ms-flex:1;
    flex:1;
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center
}
.nav .brand,.nav a{
    text-decoration:none;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    padding:1rem 0;
    color:var(--color-grey)
}
.nav .brand{
    font-size:1.75em;
    padding-top:0;
    padding-bottom:1rem
}
.tag{
    display:inline-block;
    text-transform:uppercase;
    color:var(--color-grey);
    padding:.5rem;
    line-height:1;
    letter-spacing:.5px
}
.tag.is-small{
    padding:.4rem;
    font-size:.75em
}
.bd-primary{
    border:1px solid var(--color-primary)!important
}
.bd-success{
    border:1px solid var(--color-success)!important
}
.text-grey{
    color:var(--color-grey)!important
}
.text-error{
    color:var(--color-error)!important
}
.text-success{
    color:var(--color-success)!important
}
.text-center{
    text-align:center
}
.is-full-screen{
    width:100%;
    min-height:100vh
}
.is-center,.is-vertical-align{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center
}
.is-center{
    -webkit-box-pack:center;
    -ms-flex-pack:center;
    justify-content:center
}
.is-rounded{
    border-radius:100%
}
.iconify-inline{
    margin-right:.5em
}
.iconify-inline.badge{
    margin-left:.3em;
    margin-right:auto
}
.custom-icon svg{
    width:1em;
    height:1em;
    vertical-align:-.125em
}
.custom-icon svg path{
    fill:currentColor
}
.top{
    flex-direction:column
}
#theme-switch{
    width:3em;
    height:3em;
    position:fixed;
    margin:35rem 0 0;
    z-index:1
}
section,summary{
    margin:.4em 0 .5em
}
summary{
    cursor:pointer
}
.bio-gallery{
    display:grid;
    grid-template-columns:repeat(3,1fr)
}
.bio-item{
    aspect-ratio:1;
    margin:.2em;
    overflow:hidden
}
.bio-img{
    object-fit:cover;
    object-position:center
}
.col.link{
    position:relative
}
footer{
    margin-top:.5em;
    margin-bottom:2em
}
@media screen and (max-width:599px){
    .container{
        width:100%
    }
    .col{
        -webkit-box-flex:0;
        -ms-flex:0 1 100%;
        flex:0 1 100%;
        max-width:100%
    }
}
@media screen and (max-width:480px){
    .nav{
        -webkit-box-orient:vertical;
        -webkit-box-direction:normal;
        -ms-flex-direction:column;
        flex-direction:column
    }
    .nav-center{
        -ms-flex-wrap:wrap;
        flex-wrap:wrap;
        -webkit-box-pack:center;
        -ms-flex-pack:center;
        justify-content:center
    }
}

