/* ============== Typography  ============== */

h1,
h2,
h3,
h4,
h5,
h6,
h1 > span.sub-title,
h2 > span.sub-title,
h3 > span.sub-title,
h4 > span.sub-title,
h5 > span.sub-title,
h6 > span.sub-title {
    font-family: 'Roboto Condensed', Arial, Helvetica, sans-serif;
    font-weight: bold;
}

h1 {
    letter-spacing: 0.48px;
}

h2 {
    letter-spacing: 0.36px;
}

h3 {
    letter-spacing: 0.32px;
}

h4 {
    letter-spacing: 0.24px;
}

h5 {
    letter-spacing: 0.2px;
}

span.sub-title {
    display: block;
}

.bold {
    font-weight: bold;
}

.italic {
    font-style: italic;
}

.underline {
    text-decoration: underline;
}

p, b, span, a {
    font-family: 'Lato', Arial, Helvetica, sans-serif;
}

.lato {
    font-family: 'Lato', Arial, Helvetica, sans-serif;
}

.roboto-condensed {
    font-family: 'Roboto Condensed', Arial, Helvetica, sans-serif;
}

/* Extra small devices - xs */
@media (max-width: 575px) {
    h1, h1 > span.sub-title {
        font-size: 38px;
        line-height: 58px;
        margin-bottom: 15px;
    }

    h2,
    h2 > span.sub-title {
        font-size: 28px;
        line-height: 46px;
        margin-bottom: 15px;
    }

    h3,
    h3 > span.sub-title {
        font-size: 24px;
        line-height: 40px;
        margin-bottom: 15px;
    }

    h4,
    h4 > span.sub-title {
        font-size: 20px;
        line-height: 20px;
        margin-bottom: 15px;
    }

    h5,
    h5 > span.sub-title {
        font-size: 18px;
        line-height: 30px;
        margin-bottom: 15px;
    }

    h6,
    h6 > span.sub-title {
        font-size: 15px;
        line-height: 26px;
        margin-bottom: 15px;
    }

    p,
    span,
    b,
    a,
    strong {
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 15px;
    }
}

/* Small devices (landscape phones, 576px and up) - sm */
@media (min-width: 576px) {
    h1,
    h1 > span.sub-title {
        font-size: 38px;
        line-height: 58px;
        margin-bottom: 15px;
    }

    h2,
    h2 > span.sub-title {
        font-size: 28px;
        line-height: 46px;
        margin-bottom: 15px;
    }

    h3,
    h3 > span.sub-title {
        font-size: 24px;
        line-height: 40px;
        margin-bottom: 15px;
    }

    h4,
    h4 > span.sub-title {
        font-size: 20px;
        line-height: 34px;
        margin-bottom: 15px;
    }

    h5,
    h5 > span.sub-title {
        font-size: 18px;
        line-height: 30px;
        margin-bottom: 15px;
    }

    h6,
    h6 > span.sub-title {
        font-size: 15px;
        line-height: 26px;
        margin-bottom: 15px;
    }

    p,
    span,
    b,
    a,
    strong {
        font-size: 14px;
        line-height: 24px;
        margin-bottom: 15px;
    }
}

/* Medium devices (tablets, 768px and up) - md */
@media (min-width: 768px) {
    h1,
    h1 > span.sub-title {
        font-size: 42px;
        line-height: 58px;
        margin-bottom: 15px;
    }

    h2,
    h2 > span.sub-title {
        font-size: 32px;
        line-height: 46px;
        margin-bottom: 15px;
    }

    h3,
    h3 > span.sub-title {
        font-size: 28px;
        line-height: 40px;
        margin-bottom: 15px;
    }

    h4,
    h4 > span.sub-title {
        font-size: 20px;
        line-height: 34px;
        margin-bottom: 15px;
    }

    h5,
    h5 > span.sub-title {
        font-size: 18px;
        line-height: 30px;
        margin-bottom: 15px;
    }

    h6,
    h6 > span.sub-title {
        font-size: 16px;
        line-height: 26px;
        margin-bottom: 10px;
    }

    p,
    span,
    b,
    a,
    strong {
        font-size: 14px;
        line-height: 24px;
        margin-bottom: 10px;
    }
}

/* Large devices (desktops, 992px and up) - lg */
@media (min-width: 992px) {
    h1,
    h1 > span.sub-title {
        font-size: 48px;
        line-height: 58px;
        margin-bottom: 15px;
    }

    h2,
    h2 > span.sub-title {
        font-size: 36px;
        line-height: 46px;
        margin-bottom: 15px;
    }

    h3,
    h3 > span.sub-title {
        font-size: 32px;
        line-height: 40px;
        margin-bottom: 15px;
    }

    h4,
    h4 > span.sub-title {
        font-size: 24px;
        line-height: 34px;
        margin-bottom: 15px;
    }

    h5,
    h5 > span.sub-title {
        font-size: 20px;
        line-height: 30px;
        margin-bottom: 15px;
    }

    h6,
    h6 > span.sub-title {
        font-size: 18px;
        line-height: 26px;
        margin-bottom: 10px;
    }

    p,
    span,
    b,
    a,
    strong {
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 10px;
    }
}

/* Extra large devices (large desktops, 1200px and up) - xl */
@media (min-width: 1200px) {
    h1,
    h1 > span.sub-title {
        font-size: 48px;
        line-height: 58px;
        margin-bottom: 15px;
    }

    h2,
    h2 > span.sub-title {
        font-size: 36px;
        line-height: 46px;
        margin-bottom: 15px;
    }

    h3,
    h3 > span.sub-title {
        font-size: 32px;
        line-height: 40px;
        margin-bottom: 15px;
    }

    h4,
    h4 > span.sub-title {
        font-size: 24px;
        line-height: 34px;
        margin-bottom: 15px;
    }

    h5,
    h5 > span.sub-title {
        font-size: 20px;
        line-height: 30px;
        margin-bottom: 15px;
    }

    h6,
    h6 > span.sub-title {
        font-size: 18px;
        line-height: 26px;
        margin-bottom: 10px;
    }

    p,
    span,
    b,
    a,
    strong {
        font-size: 16px;
        line-height: 24px;
        margin-bottom: 10px;
    }
}

/* ============== Colors  ============== */

:root {
    --white: #FFF;
    --navy: #004762;
    --gold: #D89016;
    --green: #258460;
    --teal: #468492;
    --yellow: #F4BE49;
    --red: #9D242B;
    --white-grey: #EBEBEB;
    --light-grey: #D9D9D9;
    --grey: #AAA;
    --charcoal: #444;
    --black: #000;
}

p.white,
span.white,
b.white,
a.white,
h1.white,
h2.white,
h3.white,
h4.white,
h5.white,
h6.white {
    color: #FFF;
}

div.white {
    background-color: #FFF;
}

.hover-white:hover {
    color: #FFF;
}

p.navy,
span.navy,
b.navy,
a.navy,
h1.navy,
h2.navy,
h3.navy,
h4.navy,
h5.navy,
h6.navy {
    color: #004762;
}

div.navy {
    background-color: #004762;
}

.hover-navy:hover {
    color: #004762;
}

p.gold,
span.gold,
b.gold,
a.gold,
h1.gold,
h2.gold,
h3.gold,
h4.gold,
h5.gold,
h6.gold {
    color: #D89016;
}

div.gold {
    background-color: #D89016;
}

.hover-gold:hover {
    color: #D89016;
}

p.green,
span.green,
b.green,
a.green,
h1.green,
h2.green,
h3.green,
h4.green,
h5.green,
h6.green {
    color: #258460;
}

div.green {
    background-color: #258460;
}

.hover-green:hover {
    color: #258460;
}

p.teal,
span.teal,
b.teal,
a.teal,
h1.teal,
h2.teal,
h3.teal,
h4.teal,
h5.teal,
h6.teal {
    color: #468492;
}

div.teal {
    background-color: #468492;
}

.hover-teal:hover {
    color: #468492;
}

p.yellow,
span.yellow,
b.yellow,
a.yellow,
h1.yellow,
h2.yellow,
h3.yellow,
h4.yellow,
h5.yellow,
h6.yellow {
    color: #F4BE49;
}

div.yellow {
    background-color: #F4BE49;
}

.hover-yellow:hover {
    color: #F4BE49;
}

p.red,
span.red,
b.red,
a.red,
h1.red,
h2.red,
h3.red,
h4.red,
h5.red,
h6.red {
    color: #9D242B;
}

div.red {
    background-color: #9D242B;
}

.hover-red:hover {
    color: #9D242B;
}

p.white-grey,
span.white-grey,
b.white-grey,
a.white-grey,
h1.white-grey,
h2.white-grey,
h3.white-grey,
h4.white-grey,
h5.white-grey,
h6.white-grey {
    color: #EBEBEB;
}

div.white-grey {
    background-color: #EBEBEB;
}

.hover-white-grey:hover {
    color: #EBEBEB;
}

p.light-grey,
span.light-grey,
b.light-grey,
a.light-grey,
h1.light-grey,
h2.light-grey,
h3.light-grey,
h4.light-grey,
h5.light-grey,
h6.light-grey {
    color: #D9D9D9;
}

div.light-grey {
    background-color: #D9D9D9;
}

.hover-light-grey:hover {
    color: #D9D9D9;
}

p.grey,
span.grey,
b.grey,
a.grey,
h1.grey,
h2.grey,
h3.grey,
h4.grey,
h5.grey,
h6.grey {
    color: #AAA;
}

div.grey {
    background-color: #AAA;
}

.hover-grey:hover {
    color: #AAA;
}

p.charcoal,
span.charcoal,
b.charcoal,
a.charcoal,
h1.charcoal,
h2.charcoal,
h3.charcoal,
h4.charcoal,
h5.charcoal,
h6.charcoal {
    color: #444;
}

div.charcoal {
    background-color: #444;
}

.hover-charcoal:hover {
    color: #444;
}

p.black,
span.black,
b.black,
a.black,
h1.black,
h2.black,
h3.black,
h4.black,
h5.black,
h6.black {
    color: #000;
}

div.black {
    background-color: #000;
}

.hover-black:hover {
    color: #000;
}

a,
a:hover {
    color: #377FBF
}

/* ============== Buttons  ============== */

.bfc-btn {
    border: 1px solid;
    border-radius: 4px;
    display: inline-block;
    font-family: 'Lato', Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: bold;
    margin-bottom: 20px;
    min-height: 45px;
    padding: 9px 20px;
    text-align: center;
    text-transform: uppercase;
    box-sizing: border-box;
    text-decoration: none;
}

    .bfc-btn:hover {
        text-decoration: none;
    }

    .bfc-btn.gold {
        background-color: #D89016;
        border-color: #D89016;
        color: #FFF;
    }

        .bfc-btn.gold:hover {
            background-color: #258460;
            border-color: #258460;
        }

    .bfc-btn.green {
        background-color: #258460;
        border-color: #258460;
        color: #FFF;
    }

        .bfc-btn.green:hover {
            background-color: #377FBF;
            border-color: #377FBF;
        }

    .bfc-btn.teal {
        background-color: #468492;
        border-color: #468492;
        color: #FFF;
    }

        .bfc-btn.teal:hover {
            background-color: #258460;
            border-color: #258460;
        }

    .bfc-btn.navy {
        background-color: #004762;
        border-color: #004762;
        color: #FFF;
    }

        .bfc-btn.navy:hover {
            background-color: #258460;
            border-color: #258460;
        }

    .bfc-btn.ghost {
        background-color: #FFF;
        border-color: #004762;
        color: #004762;
    }

        .bfc-btn.ghost:hover {
            background-color: #377FBF;
            border-color: #377FBF;
            color: #FFF;
        }

    .bfc-btn.red {
        background-color: #9D242B;
        border-color: #9D242B;
        color: #FFF;
    }

        .bfc-btn.red:hover {
            background-color: #7F1D22;
            border-color: #7F1D22;
            color: #FFF;
        }

/* ============== Accessibility Styles  ============== */

a#skip-link {
    background: #000000;
    color: white;
    position: absolute;
    left: 0;
    top: -40px;
    padding: 5px;
    z-index: 1000;
}

    a#skip-link:focus {
        top: 0;
    }

/* ============== Bootstrap Overrides  ============== */

/* Modal Pop-up Close icon */
button.close > span {
    font-size: 35px;
    font-weight: bold;
    line-height: 1rem;
}

.multiselect-container.dropdown-menu span.form-check {
    margin-bottom: 0;
}

.multiselect-option.dropdown-item > span.form-check > label.form-check-label {
    color: #000;
}

.input-group-text {
    margin-bottom: 0;
}

/* ============== Blog Styles  ============== */

.eds_news_NewsOne.eds_subCollection_news .article.details .main_content .article_section ol,
.eds_news_NewsOne.eds_subCollection_news .article.details .main_content .article_section ul {
    margin-bottom: 18px;
    margin-left: 25px;
}

/* ============== Containers  ============== */

.responsive-container {
    padding: 40px 0;
    width: 100%;
}

/* ============== General Helpers  ============== */
.cursor-pointer {
    cursor: pointer;
}

.mb-10 {
    margin-bottom: 10px;
}

.mb-15 {
    margin-bottom: 15px;
}

.mb-20 {
    margin-bottom: 20px;
}

.mb-25 {
    margin-bottom: 25px;
}

.flex-center {
    align-items: center;
    display: flex;
    justify-content: center;
}

html {
    scroll-padding-top: 80px;
}

table.general,
table.general tr,
table.general tr > td {
    border: none;
    display: block;
    width: 100%;
}

    table.general tr > td {
        text-align: left;
    }

/* Small devices (landscape phones, 576px and up) - sm */

@media (min-width: 576px) {
    table.general,
    table.general tr {
        display: table;
        width: 100%;
    }

        table.general tr > td {
            display: inline-block;
            width: 50%;
        }
}

