body { background-color: #f1f1f1; }

/* COLORS BEGIN */
:root {
    --site-cyan: #01EBFF;
    --site-cyan-dark: #0c4448;
    --site-gray: #9d9d9d;
    --site-green: #4EAC39;
    --site-orange: #f08321;
    --site-yellow: #FFDE3D;

    --font-serif: "Source Serif 4", serif;
}

.text-site { color: var(--site-orange); }
.bg-darker { background-color: #1b1b1b; }
.bg-extradark { background-color: #0d0d0d; }


/* COLORS END */

.aboutbg {
    background-image: url('/static/images/about-images/aboutbg.svg');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: bottom;
}
.about-nav .nav-link { color: var(--site-orange); }

/*BUTTONS BEGIN*/
.sitebtn {
    color: #fefefe;
    font-size: 1.1rem;
    font-weight: 500;
    padding: 4px 30px 4px 30px;
    -webkit-transition: background-color .25s;
    -o-transition: background-color .25s;
    -moz-transition: background-color .25s;
    transition: background-color .5s;
}

.sitebtn-cyan {
    border: 1px solid var(--site-cyan);
}

.sitebtn-cyan:hover {
    background-color: var(--site-cyan-dark);
    border: 1px solid var(--site-cyan);
}

.sitebtn-gray {
    border: 1px solid var(--site-gray);
}

.sitebtn-gray:hover {
    background-color: #383838;
    border: 1px solid var(--site-gray);
}

/*BUTTONS END*/
/* FONTS BEGIN */
.text-justify {
    text-align: justify;
}

.font-sans-serif {
    font-family: var(--bs-body-font-family);
}

.fs-10 {
    font-size: 10pt;
}

.fs-14 {
    font-size: 14pt;
}

.source-serif-4-extralight {
    font-family: var(--font-serif);
    font-weight: 200;
    font-style: normal;
}

.source-serif-4-light {
    font-family: var(--font-serif);
    font-weight: 300;
    font-style: normal;
}

.source-serif-4-regular {
    font-family: var(--font-serif);
    font-weight: 400;
    font-style: normal;
}

.source-serif-4-medium {
    font-family: var(--font-serif);
    font-weight: 500;
    font-style: normal;
}

.source-serif-4-semibold {
    font-family: var(--font-serif);
    font-weight: 600;
    font-style: normal;
}

.source-serif-4-bold {
    font-family: var(--font-serif);
    font-weight: 700;
    font-style: normal;
}

.source-serif-4-extrabold {
    font-family: var(--font-serif);
    font-weight: 800;
    font-style: normal;
}

.source-serif-4-black {
    font-family: var(--font-serif);
    font-weight: 900;
    font-style: normal;
}

.source-serif-4-extralight-italic {
    font-family: var(--font-serif);
    font-weight: 200;
    font-style: italic;
}

.source-serif-4-light-italic {
    font-family: var(--font-serif);
    font-weight: 300;
    font-style: italic;
}

.source-serif-4-regular-italic {
    font-family: var(--font-serif);
    font-weight: 400;
    font-style: italic;
}

.source-serif-4-medium-italic {
    font-family: var(--font-serif);
    font-weight: 500;
    font-style: italic;
}

.source-serif-4-semibold-italic {
    font-family: var(--font-serif);
    font-weight: 600;
    font-style: italic;
}

.source-serif-4-bold-italic {
    font-family: var(--font-serif);
    font-weight: 700;
    font-style: italic;
}

.source-serif-4-extrabold-italic {
    font-family: var(--font-serif);
    font-weight: 800;
    font-style: italic;
}

.source-serif-4-black-italic {
    font-family: var(--font-serif);
    font-weight: 900;
    font-style: italic;
}

/* FONTS END*/

/* SINGLE ARTICLE VIEW / DISPLAY BEGIN*/
div.singleContent {
    h1, h2, h3, h4, h5, h6,
    p, abbr, ol, ul, dl, dt, dd { font-family: var(--font-serif); }

    img {
        max-width: 100%;
        height: auto;
    }
    div.sourcebutton { margin: 10px auto 25px auto; }

    a.btn[href^="https://su"] { color: var(--site-cyan); }
    a.btn[href^="https://mo"] { color: var(--site-orange); }
    a.btn[href^="https://st"] { color: var(--site-green); }

    .sourcebutton a[href^="https://su"]:not([href*="finance"]) { color: var(--site-cyan) !important; }
    .sourcebutton a[href^="https://mo"]:not([href*="finance"]) { color: var(--site-orange) !important; }
    .sourcebutton a[href^="https://st"]:not([href*="finance"]) { color: var(--site-green) !important; }
}

/* SINGLE ARTICLE VIEW / DISPLAY END*/


/* ARTICLE DISPLAY CARDS BEGIN */
.cover-image-container img {
    max-width: 100%;
    height: auto;
}

.post-title {
    font-size: 1.09rem;
    color: #212529;
}

.publish-date {
    font-size: 10pt;
    color: #797979;
}

.page-item-link { text-decoration: none; }

.page-item:hover {
    color: #495057;
    background-color: #f8f9fa;
    -webkit-transition: background-color 200ms linear;
    -ms-transition: background-color 200ms linear;
    transition: background-color 200ms linear;
}

/* ARTICLE DISPLAY CARDS END */

/* HOMEPAGE FEATURED MODULE BEGIN */

/* HOMEPAGE FEATURED MODULE END */

/* CATEGORY NAV BEGIN */

.category-nav-container { background-color: white; }
.category-nav .nav-link {
    color: black;
    font-size: 10px;
    font-weight: bold;
    padding: 0.5rem 0.25rem;
}
.category-nav .nav-link:hover { color: var(--site-orange); }
@media (min-width: 1200px) {
    .category-nav .nav-link {
        font-size: 11.5px;
        padding: 0.5rem;
    }
}
@media (min-width: 1400px) {
    .category-nav-container .container { max-width: 1650px; }
    .category-nav .nav-link { font-size: 14px; }
}

/* CATEGORY NAV END */

/* LATEST ITEMS HOMEPAGE MODULE BEGIN*/
.latest-item {
    font-size: 10pt;
}

.latest-list {
    height: 250px;
    overflow-y: scroll;
}

/* LATEST ITEMS HOMEPAGE MODULE END*/

/*CATEGORY SECTIONING BEGIN*/
.allmoderule {
    background-color: #b4b4b4;
    height: 1px;
    flex-grow: 100;
    margin-top: 15px;
    margin-left: 15px;
}

/*CATEGORY SECTIONING  END*/

/*CONTACT FORMS BEGIN - Some of this seems to not be working right now? */
#contact-form {
    label.form-label {
        font-size: 14pt;
        font-weight: 500;
    }

    #id_contact_type {
        display: flex;
        justify-content: space-between;
        max-width: 420px;
    }

    #id_contact_authorization {
        display: flex;

        div { margin-right: 40px; }
    }

    input:not([type='radio']),
    textarea {
        width: 100%;
        border: 1px solid #909090;
        border-radius: 3px;
    }

}

div.testingclass input {
    width: 100% !important;
}
/*CONTACT FORMS END*/

/*MEDIA QUERIES*/
@media (min-width: 768px) {}

@media (min-width: 992px) {
    .latest-list {
        position: absolute;
        height: auto;
        top: 38px;
        bottom: 0;
        margin-bottom: 16px;
    }
}

@media (max-width: 1200px) {
    .post-title {
        font-size: 1rem;
    }
}