body {
    background-color: #050505;
    color: lightgray;
    font-family: Verdana;
    margin: 0 !important;
    padding: 0 !important;
    margin-bottom: 32px !important;
}

img#icon {
    image-rendering: pixelated;
    height: 128px;
}

img#logo {
    image-rendering: pixelated;
    height: 32px;
}

img#author {
    image-rendering: pixelated;
    height: 16px;
}

img#site-author {
    image-rendering: pixelated;
    height: 16px;
}

div#navbar {

    background-color: #1E1E1E;
    padding: 16px;
    position: sticky;
    top: 0;
    z-index: 999;
    box-shadow: 0px 5px 5px black;

    & > a {
        font-weight: bold;
    }

    &[data-page="home"] > a[href="?p=home"] { text-decoration: underline; }
    &[data-page="features"] > a[href="?p=features"] { text-decoration: underline; }
    &[data-page="nukemnet-support"] > a[href="?p=nukemnet-support"] { text-decoration: underline; }
    &[data-page="args-builder"] > a[href="?p=args-builder"] { text-decoration: underline; }
    &[data-page="changelog"] > a[href="?p=changelog"] { text-decoration: underline; }

    & > span.separator {
        color: var(--progold);
    }

}

select#lang {
    position: absolute;
    right: 32;
    background-color: #1E1E1E;
    color: lightgrey;
    border: none;
    outline:0px;
    cursor: pointer;
    height: 22px;
}

div#lang-flag {
    width: 22px;
    height: 22px;    
    background-size: cover;    
    position: absolute;
    right: 80;
}

html[lang="en"] div#lang-flag { background-image: url(res/icons/us.svg); }
html[lang="pt"] div#lang-flag { background-image: url(res/icons/br.svg); }

/* extremely lazy i18n */
html[lang="en"] [lang="pt"] { display: none; }
html[lang="pt"] [lang="en"] { display: none; }