html {
    font-size: var(--fast-font-size);
}

html, body {
    width: 100%;
    max-width: 100%;
    margin: 0;
}

body {
    font-family: var(--fast-font-family-main);
    letter-spacing: var(--fast-letter-spacing);
    color: var(--fast-color-body-font);
    background: var(--fast-color-background) var(--fast-image-background) no-repeat 100% 95px;
    background-attachment: fixed;
    padding-bottom: 1rem;
    height: auto;
    min-height: 100%;
    position: absolute;
}

    body.active-menu header,
    body.active-menu nav {
        z-index: calc(var(--fast-menu-z-index) + 10);
    }

    body .main-content {
        position: relative;
        padding-left: var(--fast-padding-x);
        padding-right: var(--fast-padding-x);
    }

h1, .h1, h2, .h2, h3, .h3, h4, .h4, h5, .h5, h6, .h6 {
    font-family: var(--fast-font-family-accent);
    letter-spacing: var(--fast-letter-spacing);
    color: var(--fast-color-main);
    font-weight: normal;
    margin-bottom: var(--fast-margin-thick-y);
}

    h1:first-child, .h1:first-child,
    h2:first-child, .h2:first-child,
    h3:first-child, .h3:first-child,
    h4:first-child, .h4:first-child,
    h5:first-child, .h5:first-child,
    h6:first-child, .h6:first-child {
        margin-top: var(--fast-margin-y);
    }

    h1 a:link, h1 a:visited, h1 a:active,
    .h1 a:link, .h1 a:visited, .h1 a:active,
    h2 a:link, h2 a:visited, h2 a:active,
    .h2 a:link, .h2 a:visited, .h2 a:active,
    h3 a:link, h3 a:visited, h3 a:active,
    .h3 a:link, .h3 a:visited, .h3 a:active,
    h4 a:link, h4 a:visited, h4 a:active,
    .h4 a:link, .h4 a:visited, .h4 a:active,
    h5 a:link, h5 a:visited, h5 a:active,
    .h5 a:link, .h5 a:visited, .h5 a:active,
    h6 a:link, h6 a:visited, h6 a:active,
    .h6 a:link, .h6 a:visited, .h6 a:active {
        color: var(--fast-color-main);
        text-decoration: none;
    }

    h1 a:hover, .h1 a:hover,
    h2 a:hover, .h2 a:hover,
    h3 a:hover, .h3 a:hover,
    h4 a:hover, .h4 a:hover,
    h5 a:hover, .h5 a:hover,
    h6 a:hover, .h6 a:hover {
        color: var(--fast-color-hover);
    }

h1, .h1 {
    font-size: 2.825rem !important;
}

h2, .h2 {
    font-size: 1.25rem !important;
}

h3, .h3 {
    font-size: 1.17rem !important;
}

h4, .h4 {
    font-size: 1rem !important;
}

h5, .h5 {
    font-size: .9rem !important;
}

h6, .h6 {
    font-size: .75rem !important;
}

#PageHeadingControl {
    letter-spacing: var(--fast-letter-spacing-tight);
    display: inline-block;
}

#RequirementsLink.tooltip {
    vertical-align: top;
    margin-top: var(--fast-margin-y);
}

ul, ol {
    padding-left: 2.5rem;
}

li {
/*
    padding-left: .5rem;
    margin-bottom: .5rem;
*/
}

label, .label {
    font-family: var(--fast-font-family-main);
    font-size: var(--fast-font-size);
    letter-spacing: var(--fast-letter-spacing);
    font-weight: bold;
    font-size: var(--fast-font-size-small);
    color: var(--fast-color-dark);
    line-height: 1.1rem;
    padding-bottom: .5rem;
}

    label.inline, .label.inline {
        display: inline-block;
        margin-right: var(--fast-margin-x);
    }

a, a:link, a:visited, a:active,
.link, .link:link, .link:active {
    color: var(--fast-color-main);
    text-decoration: none;
    cursor: pointer;
}

    a img {
        border: 0;
    }

    a.disabled,
    .link.disabled {
        text-decoration: none;
        color: var(--fast-color-disabled-text);
        cursor: default;
    }

        a.disabled:hover,
        .link.disabled:hover {
            color: var(--fast-color-disabled-text);
        }

    a:hover,
    .link:hover {
        color: var(--fast-color-hover);
    }

img {
    height: auto;
}

body > footer {
    position: absolute;
    width: 100%;
    bottom: 0;
    margin-top: 1rem;
    height: var(--fast-page-footer-height);
    background: var(--fast-color-main);
    z-index: var(--fast-menu-z-index);
    border-top: 2px solid var(--fast-color-border);
}

    body > footer .starball {
        background-image: var(--fast-image-footer);
        background-size: 100%;
        width: 40px;
        height: 40px;
        box-shadow: 2px 3px 8px -1px var(--fast-color-main);
        border-radius: 50%;
        margin-left: auto;
        margin-right: auto;
        margin-top: -0.75rem;
    }

footer a:hover {
    color: var(--fast-color-red) !important;
}

footer a::before {
    color: var(--fast-color-gray-dark);
}

footer a {
    color: #ffffff !important;
    transition: .5s ease;
}

footer .row {
    height: 38px;
}

@keyframes showContent {
    from {
        transform-origin: top;
        transform: scale(0);
    }

    to {
        transform-origin: top;
        transform: scale(1);
    }
}

@keyframes hideContent {
    from {
        transform-origin: bottom;
        transform: scale(1);
    }

    to {
        transform-origin: bottom;
        transform: scale(0);
    }
}

/*
Elements to have transitional animation
*/
a,
a:before,
.button,
input,
select,
button,
nav > div div,
.ui-tabs-tab,
table.dataTable tr,
header,
.backdrop,
.mobile-menu,
footer,
.starball,
.box ul.block-list i:before,
[class^="icon-"]:before,
.smooth,
#tooltip {
    transition: all var(--fast-animation-time-quick) ease;
    -webkit-transition: all var(--fast-animation-time-quick) ease;
    -moz-transition: all var(--fast-animation-time-quick) ease;
    -o-transition: all var(--fast-animation-time-quick) ease;
}

/* Icon font */
@font-face {
    font-family: 'tngov-icons';
    src: url("fonts/tngov-icons.woff") format("woff");
    font-weight: normal;
    font-style: normal;
}

/* Open Sans regular */
@font-face {
    font-family: 'Open Sans';
    src: url("fonts/OpenSans-Regular-webfont.woff") format('woff');
    font-weight: normal;
    font-style: normal;
}

/* Open Sans italic */
@font-face {
    font-family: 'Open Sans';
    src: url("Fonts/OpenSans-Italic-webfont.woff") format('woff');
    font-weight: normal;
    font-style: italic;
}

/* Open Sans bold */
@font-face {
    font-family: 'Open Sans';
    src: url("Fonts/OpenSans-Bold-webfont.woff") format('woff');
    font-weight: bold;
    font-style: normal;
}

/* Open Sans bold italic */
@font-face {
    font-family: 'Open Sans';
    src: url("Fonts/OpenSans-BoldItalic-webfont.woff") format('woff');
    font-weight: bold;
    font-style: italic;
}

/* Permian Slab regular */
@font-face {
    font-family: 'Permian Slab';
    src: url("Fonts/PermianSlabSerifTypeface-webfont.woff") format("woff");
    font-weight: normal;
    font-style: normal;
}

/* Permian Slab italic */
@font-face {
    font-family: 'Permian Slab';
    src: url("Fonts/PermianSlabSerifTypeface-Italic-webfont.woff") format("woff");
    font-weight: normal;
    font-style: italic;
}

/* Permian Slab bold */
@font-face {
    font-family: 'Permian Slab';
    src: url("/Fonts/PermianSlabSerifTypeface-Bold-webfont.woff") format("woff");
    font-weight: bold;
    font-style: normal;
}

/*
Wide display (desktop)
*/
@media only screen and (min-width: 641px) {
    header, .backdrop {
        min-height: 115px;
    }

    .agency {
        padding-top: 20px;
    }

        .agency .title {
            padding-left: 90px;
            min-height: 69px;
        }

    .top-nav a.logo {
        width: 80px;
        height: 90px;
    }

    .agency .title span {
        font-size: 2.5rem;
    }

    .agency .title small {
        padding-left: 3px;
    }

    nav .active a {
        color: #6E7073;
    }

    nav ul {
        margin-bottom: 0;
    }

        nav ul.nav-items > li:hover,
        nav ul.nav-items > li.active {
            border-top-color: #EE3524;
            color: #6E7073;
        }

        nav ul.nav-items > li {
            border-top-width: 4px;
        }

        nav ul.inline-list.nav-items {
            display: inline-flex;
        }

    nav .mobile-hide {
        display: inline-flex;
    }

    nav .nav-items {
        padding-left: 0;
    }

    nav.fixed .nav-items {
        padding-left: 1.5rem;
    }

    nav .mobile-menu {
        display: none;
    }

    ul.inline-list li,
    ul.block-list li,
    ul.no-list li {
        width: auto;
    }

    footer .starball {
        width: 70px;
        height: 70px;
        margin-left: -35px;
        top: -20px;
    }

    /*    #footer-bottom {
        height: 45px;
    }
*/
    .button {
        width: auto !important;
    }

    .mobile-show {
        display: none;
    }

    tr .optional-column {
        display: table-cell;
    }

    .optional-element {
        display: initial;
    }
}