:root {
    --InfBlack: #000008;
    --OSGBlue: #002e6d;
    --OSGBlueHover: #002352;
    --OSGBlueActive: #001B42;
    --OSGBlueDisabled: #405776;
    --LightSea: #18988b;
    --LightSeaHover: #127268;
    --LightSeaDisabled: #8CCBC5;
    --Energize: #3cb4e5;
    --Ignition: #ff4d00;
    --Fuel: #ffc844;
    --Shadow: #5b6670;
    --Smoke: #b0bfbc;
    --MidTone: #cfd2d3;
    --HighLight: #fefefe;
    --Danger: #F9B9A7;
    --Warning: #FEF4D9;
    --WarningHover: #FEE9B4;
    --Info: #D8F0F9;
}

@font-face {
    font-family: Outfit;
    src: url(../fonts/Outfit-VariableFont_wght.ttf);
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
        font-weight: normal;
        font-family: Outfit !important;
        color: var(--InfBlack);
    }
}

html {
    font-size: 14px;
    position: relative;
    min-height: 100%;
}

body {
    margin-bottom: 60px;
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html, body {
    margin: 0;
    padding: 0;
    height: 100%;
    font-weight: normal;
    font-size: 14px;
    font-family: Outfit !important;
    background-color: var(--InfBlack);
}

div.topbar {
    background-color: var(--OSGBlue) !important;
}

#body {
    background-color: var(--HighLight);
    padding: 10px 0px;
    margin-top:-15px;
}

pre {
    padding: 8px;
    background-color: #f5f5f5;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.margin-top-15 {
    margin-top: 15px;
}

#footer-content {
    background-color: var(--OSGBlue);
}

    #footer-content .footerText {
        text-align: center;
        padding: 10px 0;
        color: #ffffff;
    }

/* used in footer */
a.revlink:link {
    font-weight: bold;
    text-decoration: none;
    color: #ffffff;
}

a.revlink:visited {
    font-weight: bold;
    color: #ffffff;
    text-decoration: none;
}

a.revlink:hover {
    font-weight: bold;
    color: #ffffff;
    text-decoration: underline;
}

a.revlink:active {
    font-weight: bold;
    color: #FFFFFF;
}
/* used in footer */