:root{
    --bg-color:#FFFFFF;
    --text-color:#333;
    --outline-color:#DB83ED;
    --header-color:#5E5184;
    --anchor-color:#9E358F;
    --anchor-visited-color:#6F5F9C;
    --code-bg-color:#FAFAFA;
    --filename-bg:#EAEAEA;
    --code-color:#383a42;
    --code-bg-color:#fafafa;
    --code-comment-color:#a0a1a7;
    --code-kw-color:#af005f;
    --code-name-color:#e45649;
    --code-literal-color:#268bd2;
    --code-string-color:#cb4b16;
    --code-attr-color:#986801;
    --code-constructor-color:#5f5faf;
    --code-symbol-color:#4078f2;
    --code-record-field-color:#c18401;
    --code-pragma-color:#2aa198
}
@media (prefers-color-scheme:dark){
    :root{
        --bg-color:#333;
        --text-color:#C9D1D9;
        --header-color:#BBA1FF;
        --anchor-color:#EB82DC;
        --anchor-visited-color:#D5C5FF;
        --code-bg-color:transparent;
        --filename-bg:#2C2C2C;
        --code-color:#C9D1D9;
        --code-bg-color:#333;
        --code-comment-color:#a0a1a7;
        --code-kw-color:#BBA1FF;
        --code-name-color:#e45649;
        --code-literal-color:#268bd2;
        --code-string-color:#cb4b16;
        --code-attr-color:#986801;
        --code-constructor-color:#d079c9;
        --code-symbol-color:var(--code-color);
        --code-record-field-color:#c18401;
        --code-pragma-color:#2aa198
    }
}
*:focus-visible{
    outline-color:var(--outline-color)
}
body{
    color:var(--text-color);
    background-color:var(--bg-color)
}
a{
    color:var(--anchor-color)
}
a:visited{
    color:var(--anchor-visited-color)
}
h1,h2,h3,h4,h5,h6{
    color:var(--header-color)
}
input{
    background-color:rgba(255,255,255,0.06);
    color:var(--text-color)
}
.nav-bar{
    text-align: right;
}
.nav-bar ul{
    display: inline-block;
    list-style: none;
    margin: 0;
    padding: 0;
}
.nav-bar li{
    display: inline-block;
    vertical-align: middle;
    padding: 0;
    margin: 0;
    height: 100%;
    position: relative;
}
 *:focus-visible{
    outline-offset:4px;
    outline-width:1px
}
body{
    font-size:1.6rem;
    margin:0 auto;
    max-width:120rem
}
footer{
    margin-top:3rem;
    padding:1.2rem 0;
    border-top:0.2rem solid #000;
    font-size:1.2rem;
    color:#555
}
h1{
    font-size:2.4rem
}
h2{
    font-size:2rem
}
html{
    font-size:62.5%;
    font-family:Helvetica,sans-serif
}
table tbody td{
    padding:5px
}
footer{
    padding: 0 2%;
    text-align: center;
}
footer .HF{
    height:50px;
    line-height:50px;
    display:inline-block;
    background-repeat:no-repeat;
    background-image:url('../images/hf-logo.png');
    background-size:50px;
    background-position:left center;
    padding-left:60px
}
@media (max-width:319px){
    .nav-bar{
        margin:0 1.5rem 0 0;
    }
    .nav-bar a{
        display:block;
        line-height:1.6
    }
}
@media (min-width:320px){
    .nav-bar{
        margin:0 2rem 0 0;
    }
    .nav-bar a{
        display:inline;
        margin:0 0.6rem
    }
}
@media (min-width:640px){
    .nav-bar{
        margin:0 3rem 0 0;
    }
    .nav-bar a{
        margin:0 0 0 1.2rem;
        display:inline
    }
}

#advisory dt {
    margin-top: 0.75em;
}
