:root {
    --sts-red: #AC202D;
    --sts-func-red: #ED1C24;
    --sts-dark-red: #561016;
    --sts-gray: #231F20;
    --sts-gold: #BC9D6C;
    --sts-light-red: #DDA5AB;
    --sts-light-blue: #9ad1f5;
    --sts-navy: #254155;
}

/* Text in general */
body, body .button, body h1, body h2, body h3, body h4, body h5, body h6, body [class*=span] > h3 {
    font-family: font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    color: black;
    font-weight: 550;
}

/* Homepage tiles */
body .large-notice {
    background-color: #e3e3e3;
    border-radius: 10px;
}


.large-notice p.desc {
    line-height: 16px;
    margin-top: 5px;
}

/* Headers */
h1, h2, h3, h4, h5, h6 {
    color: var(--sts-red);
}

h3.colheader {
    background-color: var(--sts-red);
    color: white;
}

#top-line{
    background-color: var(--sts-dark-red) !important;
}

/* Links */
a, a:visited {
/*    color: var(--sts-func-red);*/
}

/* Buttons */
body .button.gray, body input[type=button], body input[type=submit], body .button.color {
    background-color: var(--sts-gray);
    color: white;
    border-radius: 5px;
}

    body input[type=button]:hover, body .button.gray:hover, body .button.color:hover, body input[type=submit].active:hover, body button.active:hover {
        background: var(--sts-gray);
        color: white;
    }

    a.button.active, body input[type=submit].active {
        background: var(--sts-gray);
        color: white;
    }

a.search-btn-widget, div.filters-dropdown.active {
    background-color: var(--sts-red);
}

.filters-dropdown:hover {
    background-color: var(--sts-red);
    color: white;
}

/* Pagination */
div.pagination ul li a.current {
    background: var(--sts-func-red) !important;
}

li a.selected{
    color: var(--sts-gold) !important;
}

/* Navigation menu */
body #navigation {
    background-color: var(--sts-red);
    color: white;
}

body ul.menu li.active { /* should the active item be a different color? */
    background-color: var(--sts-red);
    color: white;
}

body ul.menu li > a:hover, body .menu > li:hover > a {
    background-color: var(--sts-dark-red);
    color: var(--sts-gold);
}
.large-loginnotice {
    background-color: var(--sts-red) !important;
    color: white;
    border-radius: 10px;
}
.large-setupnotice {
    border-radius: 10px;
}
.large-setupnotice p {
    color: var(--sts-navy) !important;
}
.large-setupnotice .button {
    background-color: var(--sts-red) !important;
}
.large-loginnotice h2, .large-loginnotice h2 .helper {
    color: white;
}

body ul.menu li.active > a:hover, body .menu > li.active:hover > a { /* should the active item be a different color (when hovered over)? */
    background-color: var(--sts-dark-red);
    color: var(--sts-gold);
}

/* Footer */
footer#footer-bottom {
    background-color: var(--sts-red);
    color: white;
}

/* Tables */
body table.standard-table th /*, body table.standard-table tr:hover td*/ {
    background-color: var(--sts-red);
    color: white;
}

/* Get rid of extraneous whitespace from e.g. unused master page content placeholders */
div:empty {
    display: none;
}

#wrapper {
    background: none !important;
}