:root {
    --app-bg: #222;
    --app-fg: var(--bs-light);
    --app-a-hover: #66aaff;
    --header-font: Gruppo, "Ubuntu", var(--bs-font-sans-serif);
}

.navbar {
    --bs-navbar-active-color: var(--bs-info) !important;
}

body {
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

main {
    flex-grow: 1;
}

#app-navbar {
    z-index: 500;
}

.app-bg {
    background-color: var(--app-bg);
    color: var(--app-fg);

    a {
        color: var(--app-fg);
    }

    a:hover {
        color: var(--app-a-hover);
    }

    .dropdown-menu {
        background-color: var(--app-bg);
    }
}


#hero {
    width: 100%;
    height: 150px;
}

.header-text {
    height: 100%;
    font-size: 4em;
    color: var(--bs-white);
    text-shadow: 2px 2px black;
}

.header-font {
    font-family: var(--header-font);
}

a.offsite::after {
    padding-left: .4em;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    content: '\f35d';
    /* font-family: 'Font Awesome 5 free';
    font-weight: 600; */
    font: var(--fa-font-solid);
    font-size: .6em;
    vertical-align: top;
    text-decoration: none !important;
}