:root {
    /*
    --primary: #99CA45;
    --primary-dark: #678a2c;
    --primary-light: #c0ec76;
    --primary-alt: #81BA1E;
    --secondary: #FCE817;
    --tertiary: #BA4F9D;
    --tertiary-alt: #F47525;
    */
    --primary: #0065A4;
    --primary-dark: #1B315E;
    --primary-light: #75BEE9;
    --primary-alt: #0087CB;
    --secondary: #1B315E;
    --tertiary: #0065A4;
    --tertiary-alt: #1B315E;
    --tertiary-alt2: #6ABE66;
    --tertiary-alt3: #75BEE9;
    --tertiary-alt4: #ffb000;
    --tertiary-alt5: #9A5DA9;
    --tertiary-alt6: #FA6032;
    --alert: #ffb000;
    --neutral-grey: #D6D7D6;
    --neutral-grey-dark: #626267;
    --neutral-grey-darker: #31313B;
    --neutral-grey-light: #EFEEED;
    --semantic-black: #000000;
    --semantic-white: #fff;
    --vylla-yellow: #fbaf1a;
    --bg-primary: rgba(106,190,102,0.3);
    --bg-primary-vylla: #F9F5F2;
    --success: #57B947;
    --success-alt: #6ABE66;
}

@import url('/fonts/montserrat.css?family=Montserrat:ital,wght@0,400;0,500;0,700;0,800;1,400;1,500;1,700;1,800&display=swap');

@media (min-width: 1480px) {
    .container {
        max-width: 1440px;
        padding-right: 0;
        padding-left: 0;
    }
}


/*************************/
/* Existing General/Utilities styles override */
/*************************/
body {
    font-size: 15px;
    font-family: Montserrat, Arial, sans-serif;
    font-weight: 400;
    line-height: 22px;
}

h1, .h1, h1.custom-headline {
    font-family: Montserrat, Arial, sans-serif;
    font-size: 40px;
    font-weight: 900;
    line-height: 1;
    color: var(--primary);
    text-transform: uppercase;
    letter-spacing: 0;
}

.simple-header h1 {
    color: var(--semantic-black);
}

h2, .h2, h2.custom-headline {
    font-family: Montserrat, Arial, sans-serif;
    font-size: 38px;
    font-weight: 900;
    line-height: 1;
    color: var(--semantic-black);
    text-transform: uppercase;
    letter-spacing: 0;
}

h3, .h3, h3.custom-headline {
    font-family: Montserrat, Arial, sans-serif;
    font-size: 34px;
    font-weight: 900;
    line-height: 1;
    color: var(--semantic-black);
    text-transform: uppercase;
    letter-spacing: 0;
}

h4, .h4 {
    font-family: Montserrat, Arial, sans-serif;
    font-size: 24px;
    font-weight: 900;
    line-height: 36px;
    color: var(--semantic-black);
    text-transform: uppercase;
    letter-spacing: 0;
}

h5, .h5 {
    font-family: Montserrat, Arial, sans-serif;
    font-size: 20px;
    font-weight: 900;
    line-height: 27px;
    color: var(--semantic-black);
    letter-spacing: 0;
}

h6, .h6 {
    font-family: Montserrat, Arial, sans-serif;
    font-size: 15px;
    font-weight: 900;
    line-height: 1;
    color: var(--semantic-black);
    letter-spacing: 0;
}

span.h1, span.h2, span.h3, span.h4, span.h5, span.h6 {
    display: block;
}

    h1.small, h2.small, h2.main, h3.main, h4.main {
        color: inherit;
        letter-spacing: 0;
    }

.main.h3 {
    margin: 30px 0 20px;
    font-size: 1rem !important;
    line-height: 1.6rem;
}
.main.h4 {
    margin: 0 0 20px;
    font-size: 1rem !important;
}

small, .small {
    font-weight: inherit;
}

p, ul, ol, blockquote {
    margin-bottom: 14px;
    font-size: 15px;
    font-weight: 400;
    line-height: 22px;
    color: var(--semantic-black);
}

.paragraph {
    display: block;
    margin-bottom: 14px;
    font-size: 15px;
    font-weight: 400;
    line-height: 22px;
    color: var(--semantic-black);
}

a, a:link, a:visited, a:active {
    font-weight: 800;
    color: var(--primary-dark);
    letter-spacing: 0.3px;
}

    a:hover {
        color: var(--semantic-black);
        text-decoration: none;
    }

.custom-headline::before {
    display: none;
}

strong small, small strong {
    font-weight: 900;
}

p small {
    color: inherit;
}

.emphasis {
    border-bottom: 5px solid var(--vylla-yellow);
}

.item-module-content-wrap-light .emphasis {
    border-bottom: 5px solid var(--semantic-white);
}

@media (min-width: 1300px) {
    h1, .h1 {
        font-size: 50px;
    }

    h2, .h2 {
        font-size: 48px;
    }

    h3, .h3 {
        font-size: 44px;
    }

    h4, .h4 {
        font-size: 32px;
        line-height: 44px;
    }

    h5, .h5 {
        font-size: 25px;
        line-height: 32px;
    }
}

.btn:focus, button:focus, a:focus {
    outline: solid 2px var(--primary-alt);
}

.btn, .btn:link, .btn:visited, .btn:active {
    padding: 11px 16px 12px;
    background-color: var(--primary-dark);
    border-radius: 0;
    box-shadow: none;
    font-family: Montserrat, Arial, sans-serif;
    font-size: 14px;
    font-weight: 800;
    text-transform: uppercase;
    color: var(--semantic-white);
    line-height: 1;
}

    .btn.btn-sm, .btn.btn-md, .btn.btn-lg, .btn.btn-md, .hbspt-form form .hs_submit.hs-submit .actions input.btn-md[type="submit"] {
        padding: 11px 16px 12px;
        background-color: var(--primary-dark);
        border-radius: 0;
        box-shadow: none;
        font-family: Montserrat, Arial, sans-serif;
        font-size: 14px;
        font-weight: 800;
        text-transform: uppercase;
        color: var(--semantic-white);
        line-height: 1;
    }

    .btn.btn-primary.btn-sm {
        background-color: var(--primary-dark);
    }

    .btn:hover, .btn-primary:hover {
        background-color: var(--primary);
        color: var(--semantic-white);
        transition: 1s;
    }

    .btn:disabled, .btn.disabled, .btn-primary.disabled, btn.btn-primary.disabled, .btn-primary:disabled, btn.btn-primary:disabled {
        filter: grayscale(1);
    }

    .btn.btn-default, .hbspt-form form .hs_submit.hs-submit .actions input.btn-default[type="submit"] {
        background-color: var(--neutral-grey-light);
        color: var(--semantic-black);
    }

        .btn.btn-default:hover, .hbspt-form form .hs_submit.hs-submit .actions input.btn-default[type="submit"]:hover {
            background-color: var(--neutral-grey-light);
            filter: brightness(0.9);
            color: var(--semantic-black);
            transition: 1s;
        }

    .btn.btn-default-alt {
        background-color: var(--semantic-black);
        color: var(--semantic-white);
    }

        .btn.btn-default-alt:hover {
            background-color: var(--vylla-yellow);
            color: var(--semantic-black);
            transition: 1s;
        }

    .btn.btn-primary, .hbspt-form form .hs_submit.hs-submit .actions input[type="submit"] {
        box-shadow: none;
    }

    .btn.btn-primary-alt {
        background-color: var(--primary);
    }

        .btn.btn-primary-alt:hover {
            background-color: var(--primary-dark);
        }

    .btn.btn-lg, .btn-group-lg > .btn, .hbspt-form form .hs_submit.hs-submit .actions input[type="submit"] {
        padding: 11px 16px 12px;
        background-color: var(--secondary);
        border-radius: 0;
        box-shadow: none;
        font-family: Montserrat, Arial, sans-serif;
        font-size: 14px;
        font-weight: 800;
        text-transform: uppercase;
        color: var(--semantic-white);
        line-height: 1;
    }

    .btn.btn-lg {
        padding: 11px 32px 12px;
        font-size: 24px;
        font-weight: 600;
    }

    .btn.btn-xl {
        font-size: 38px;
    }

    .btn.btn-outline {
        padding: 9px 16px 10px;
        background: var(--secondary);
        border: 2px solid var(--semantic-white);
        color: var(--semantic-white);
    }

        .btn.btn-outline:hover {
            background: var(--primary);
        }

    .btn.btn-outline-primary, .hbspt-form form .hs_submit.hs-submit .actions input.btn-outline-primary[type="submit"], .btn.btn-outline-secondary, .hbspt-form form .hs_submit.hs-submit .actions input.btn-outline-secondary[type="submit"], .btn.btn-outline-default, .hbspt-form form .hs_submit.hs-submit .actions input.btn-outline-default[type="submit"], .btn-group-sm > .btn, .hbspt-form form .hs_submit.hs-submit .actions .btn-group-sm > input[type="submit"], .hbspt-form form .hs_submit.hs-submit .actions input.btn-sm[type="submit"], .btn.btn-secondary, .btn-outline-primary:not(:disabled):not(.disabled):active, .btn-outline-primary:not(:disabled):not(.disabled).active, .show > .btn-outline-primary.dropdown-toggle {
        padding: 11px 16px 12px;
        background-color: var(--secondary);
        border: 0;
        border-radius: 0;
        box-shadow: none;
        font-family: Montserrat, Arial, sans-serif;
        font-size: 14px;
        font-weight: 800;
        text-transform: uppercase;
        line-height: 1;
        color: var(--semantic-white);
    }
    .hbspt-form form .hs_submit.hs-submit .actions input[type="submit"]:hover {
        background-color: var(--primary);
        color: var(--semantic-white);
        transition: 1s;
    }
    /*
    .btn.btn-outline-primary:hover, .hbspt-form form .hs_submit.hs-submit .actions input.btn-outline-primary[type="submit"]:hover, .btn.btn-outline-primary:focus, .hbspt-form form .hs_submit.hs-submit .actions input.btn-outline-primary[type="submit"]:focus, .btn.btn-sm:hover, .btn-group-sm > .btn:hover, .hbspt-form form .hs_submit.hs-submit .actions .btn-group-sm > input[type="submit"]:hover, .hbspt-form form .hs_submit.hs-submit .actions input.btn-sm[type="submit"]:hover, .btn.btn-secondary:hover {
        background-color: var(--secondary);
        filter: brightness(1.1);
        color: var(--semantic-black);
        transition: 1s;
    }
    */
    .btn-secondary, .btn.btn-secondary, .btn.btn-remove, .btn.btn-secondary.btn-sm {
        padding: 9px 16px 10px;
        background-color: var(--semantic-white);
        border: 2px solid var(--secondary);
        box-shadow: none;
        color: var(--secondary);
    }
    .btn-secondary.disabled, btn.btn-secondary.disabled, .btn-secondary:disabled, .btn.btn-secondary:disabled {
        filter: grayscale(1);
    }
    .btn-secondary:hover, .btn.btn-secondary:hover, .btn.btn-remove:hover, .btn.btn-secondary.btn-sm:hover,
    .btn-secondary:focus, .btn.btn-secondary:focus, .btn.btn-remove:focus, .btn.btn-secondary.btn-sm:focus {
        background-color: var(--primary);
        border-color: var(--primary);
        color: var(--semantic-white);
        transition: 1s;
    }
    .btn-tertiary, .btn.btn-tertiary, .btn.btn-tertiary.btn-sm {
        padding: 9px 16px 10px;
        background-color: var(--tertiary-alt2);
        border: 2px solid var(--tertiary-alt2);
        box-shadow: none;
        color: var(--semantic-black);
    }
    .btn-tertiary:hover, .btn.btn-tertiary:hover, .btn.btn-tertiary.btn-sm:hover {
        background-color: var(--primary);
        border-color: var(--primary);
        color: var(--semantic-white);
        transition: 1s;
    }
    .btn-tertiary.disabled, btn.btn-tertiary.disabled, .btn-tertiary:disabled, .btn.btn-tertiary:disabled {
        filter: grayscale(1);
    }
    .btn-tertiary-alt3, .btn.btn-tertiary-alt3, .btn.btn-tertiary-alt3.btn-sm {
        padding: 9px 16px 10px;
        background-color: var(--tertiary-alt3);
        border: 2px solid var(--tertiary-alt3);
        box-shadow: none;
        color: var(--semantic-black);
    }
    .btn-tertiary-alt3:hover, .btn.btn-tertiary-alt3:hover, .btn.btn-tertiary-alt3.btn-sm:hover {
        background-color: var(--primary);
        border-color: var(--primary);
        color: var(--semantic-white);
        transition: 1s;
    }
    .btn-tertiary-alt3.disabled, btn.btn-tertiary-alt3.disabled, .btn-tertiary-alt3:disabled, .btn.btn-tertiary-alt3:disabled {
        filter: grayscale(1);
    }
    .btn-tertiary-alt4, .btn.btn-tertiary-alt4, .btn.btn-tertiary-alt4.btn-sm {
        padding: 9px 16px 10px;
        background-color: var(--tertiary-alt4);
        border: 2px solid var(--tertiary-alt4);
        box-shadow: none;
        color: var(--semantic-black);
    }
    .btn-tertiary-alt4:hover, .btn.btn-tertiary-alt4:hover, .btn.btn-tertiary-alt4.btn-sm:hover {
        background-color: var(--primary);
        border-color: var(--primary);
        color: var(--semantic-white);
        transition: 1s;
    }
    .btn-tertiary-alt4.disabled, btn.btn-tertiary-alt4.disabled, .btn-tertiary-alt4:disabled, .btn.btn-tertiary-alt4:disabled {
        filter: grayscale(1);
    }

    .btn svg:not(:root).svg-inline--fa {
        color: var(--semantic-white);
    }

    .btn.btn-secondary svg:not(:root).svg-inline--fa, .btn.btn-text svg:not(:root).svg-inline--fa, .btn.btn-link svg:not(:root).svg-inline--fa {
        color: inherit;
    }

    .btn.btn-link, .btn-link, .btn.btn-text, .btn-text {
        background-color: transparent;
        font-weight: 800;
        color: var(--primary);
    }

    .btn.btn-link:hover, .btn-link:hover, .btn.btn-text:hover, .btn-text:hover {
        filter: brightness(1.1);
    }

    .btn.btn-link-underline {
        text-decoration: underline;
    }

    .btn.text-wrap {
        height: auto;
        line-height: 1.2;
    }

    .btn.btn-default-alt-reversed {
        background-color: var(--vylla-yellow);
        color: var(--semantic-black);
    }

        .btn.btn-default-alt-reversed:hover {
            background-color: var(--semantic-black);
            color: var(--semantic-white);
            transition: 1s;
        }

    .btn-secondary-alt, .btn.btn-secondary-alt, .btn.btn-secondary-alt.btn-sm {
        background-color: var(--primary);
        box-shadow: none;
        color: var(--semantic-white);
    }

        .btn-secondary-alt.disabled, btn.btn-secondary-alt.disabled, .btn-secondary-alt:disabled, .btn.btn-secondary-alt:disabled {
            filter: grayscale(1);
        }

        .btn-secondary-alt:hover, .btn.btn-secondary-alt:hover, .btn.btn-secondary-alt.btn-sm:hover {
            background-color: var(--secondary);
            color: var(--semantic-white);
            transition: 1s;
        }

    .btn.btn-vylla-yellow {
        background-color: var(--vylla-yellow);
        color: var(--semantic-black);
    }

        .btn.btn-vylla-yellow:hover {
            background-color: var(--primary);
            filter: brightness(0.9);
            color: var(--semantic-white);
            transition: 1s;
        }

    .btn-icon {
        display: flex;
    }

    .btn-icon-container {
        margin: -11px -16px -12px;
        padding: 11px 16px 12px;
        background: var(--primary);
    }

        .btn-icon-container::after {
            content: "";
            position: absolute;
            top: calc(50% - 5px);
            right: -5px;
            display: block;
            margin: 0 auto;
            width: 0;
            height: 0;
            border-top: 5px solid transparent;
            border-bottom: 5px solid transparent;
            border-left: 5px solid var(--primary);
            z-index: 1;
        }

    .btn-icon-text {
        padding-left: 26px;
    }

.btn.btn-dark {
    background-color: var(--semantic-black);
}

    .btn.btn-dark:hover {
        background-color: var(--primary);
    }

    .btn.btn-dark.btn-dark-vylla:hover {
        color: var(--semantic-black);
        background-color: var(--vylla-yellow);
    }

.btn.btn-text.btn-text-alt {
    text-transform: none;
    text-decoration: underline;
    color: var(--semantic-black);
}

/*
.bg-primary {
    background-color: var(--primary) !important;
}
*/

.bg-primary-dark {
    background-color: var(--primary-dark);
}

.bg-grey {
    background-color: var(--neutral-grey);
}

.bg-dark-grey {
    background-color: var(--neutral-grey-darker);
}

.bg-grey-light {
    background-color: var(--neutral-grey-light);
}

.bg-tertiary-alt2 {
    background-color: var(--tertiary-alt2) !important;
}

.bg-tertiary-alt3 {
    background-color: var(--tertiary-alt3) !important;
}

.bg-tertiary-alt4 {
    background-color: var(--tertiary-alt4) !important;
}

.bg-tertiary-alt5 {
    background-color: var(--tertiary-alt5) !important;
}

.bg-tertiary-alt6 {
    background-color: var(--tertiary-alt6) !important;
}

.bg-primary-vylla {
    background-color: var(--bg-primary-vylla);
}

.bg-vylla-home {
    background: url(/images/Background-photos/bg-vyllahome.jpg) no-repeat center;
    background-size: cover;
}

.bg-transparent {
    background: transparent !important;
}

/*
.alert-warning, .alert-info, .alert-light {
    color: var(--semantic-black);
    background-color: var(--primary-light);
    border-color: transparent;
}

    .alert-warning a, .alert-warning a:link, .alert-warning a:visited, .alert-warning a:active,
    .alert-info a, .alert-info a:link, .alert-info a:visited, .alert-info a:active,
    .alert-light a, .alert-light a:link, .alert-light a:visited, .alert-light a:active {
        color: var(--tertiary);
    }

    .alert-warning a:hover,
    .alert-info a:hover,
    .alert-light a:hover {
        color: var(--semantic-black);
    }
 */

.alert.alertBanner-danger, .alert.alertBanner-info, .alert.alertBanner-warning {
    color: var(--semantic-black);
}

    .alert.alertBanner-danger a, .alert.alertBanner-danger a:link, .alert.alertBanner-danger a:visited, .alert.alertBanner-danger a:active,
    .alert.alertBanner-info a, .alert.alertBanner-info a:link, .alert.alertBanner-info a:visited, .alert.alertBanner-info a:active,
    .alert.alertBanner-warning a, .alert.alertBanner-warning a:link, .alert.alertBanner-warning a:visited, .alert.alertBanner-warning a:active {
        color: var(--semantic-black);
    }

    .alert.alertBanner-danger a:hover, .alert.alertBanner-info a:hover, .alert.alertBanner-warning a:hover {
        color: var(--semantic-black);
    }

    .alert.alertBanner-danger .svg-inline--fa, .alert.alertBanner-info .svg-inline--fa, .alert.alertBanner-warning .svg-inline--fa {
        color: var(--semantic-black);
    }

    .alert.alertBanner-danger .fad.fa-info-circle:after, .alert.alertBanner-info .fad.fa-info-circle:after, .alert.alertBanner-warning .fad.fa-info-circle:after {
        color: var(--semantic-black);
    }

    .alert.alertBanner-warning {
        background-color: var(--tertiary-alt3);
    }

    .alert.alertBanner-danger {
        background-color: var(--tertiary-alt4);
    }

    .alert.alertBanner-info {
        background-color: var(--tertiary-alt2);
    }

.text-primary {
    color: var(--primary-alt) !important; /* this uses primary alt because it needs to be darker */
}

.text-secondary {
    color: var(--secondary) !important;
}

.text-tertiary {
    color: var(--tertiary) !important;
}

.text-tertiary-alt {
    color: var(--tertiary-alt) !important;
}

.text-tertiary-alt3 {
    color: var(--tertiary-alt3) !important;
}

.text-semantic-black {
    color: var(--semantic-black) !important;
}

.text-semantic-white {
    color: var(--semantic-white) !important;
}

.text-neutral-grey-dark {
    color: var(--neutral-grey-dark) !important;
}

.text-vylla-yellow {
    color: var(--vylla-yellow) !important;
}

a.text-vylla-yellow:hover {
    color: var(--semantic-black) !important;
}

.text-transform-none {
    text-transform: none !important;
}

.text-line-height {
    line-height: 1 !important;
}

.text-wrap {
    white-space: normal;
}

.color-vylla-yellow {
    color: var(--vylla-yellow) !important;
    fill: var(--vylla-yellow) !important;
}

a.color-vylla-yellow:hover, a:hover .color-vylla-yellow {
    color: var(--semantic-black) !important;
    fill: var(--semantic-black) !important;
}

.link-on-dark {
    color: var(--primary-light) !important;
}

    .link-on-dark:hover {
        color: var(--semantic-white) !important;
    }

.section-divider {
    padding: 60px 0 100px 0;
}

    .section-divider:nth-child(odd) {
        background-color: var(--neutral-grey-light);
    }

#homeTakeAdvantage, #homeBreakingItDown, #homeResources, #homeNumbersSpeakForThemselves, #homePayWithASwipe {
    background-color: var(--semantic-white);
}

#homeHelpingManageYourAsset, #homeHaveQuestions, #homeCoreValues, #homeCCF {
    background-color: var(--neutral-grey-light);
}

#homeTakeAdvantage svg {
    min-width: 80px;
    max-width: 100px;
}

@media (min-width: 768px) {
    #homeTakeAdvantage .col-md-4 {
        max-width: 30%;
    }
}
.sectionTopArrow::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    display: block;
    width: 50%;
    border-bottom: 50px solid var(--neutral-grey-light);
    border-right: 50px solid transparent;
    z-index: 1;
}
.sectionTopArrow::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: 0;
    right: 0;
    display: block;
    width: 50%;
    border-bottom: 50px solid var(--neutral-grey-light);
    border-left: 50px solid transparent;
    z-index: 1;
}
.custom-image-card-inner-section .card-inner::after {
    content: "";
    display: inline-block;
    margin-top: 20px;
    height: 10px;
    width: 100%;
    background: var(--primary);
}
.custom-image-card-inner-section .card-inner-alt::after {
    background: var(--secondary);
}

@media (min-width: 992px) {
    .col-home-explore {
        margin-top: -20px;
    }
    .col-home-explore .card-body {
        padding-bottom: 20px !important;
    }
}

.section-divider .container h3:first-child {
    margin: 0;
    padding-top: 0;
    padding-bottom: 40px;
}

.side-widget {
    background-color: var(--neutral-grey-light);
    border-top: 0;
}

    .side-widget::after {
        display: block;
        content: "";
        margin-top: 12px;
        height: 10px;
        width: 100%;
        background-color: var(--primary);
    }

    .side-widget.side-widget-no-after::after {
        display: none;
    }

.card-shadow, .card-bg {
    box-shadow: 0 0 5px 0 rgba(39, 63, 74, 0.15);
    -webkit-border-radius: 0;
    border-radius: 0;
}

.card-shadow.with-icon img {
    /*
    filter: grayscale(1);
    */
    z-index: 0;
}

.card-bg.card-bg-white h1 {
    color: var(--semantic-black);
}

.card-bg.card-bg-white h2.blue {
    font-weight: 700;
    color: var(--semantic-black);
}

.card-bg.card-bg-white h3 {
    color: var(--semantic-black);
}

    .card-bg.card-CTA.cta-beta.card-bg-green-gradient, .card-bg.card-gradient, .card-bg.card-bg-primary-green {
        background: var(--success-alt);
        /* fallback for old browsers */
        background: -webkit-linear-gradient(to right, var(--success-alt), var(--success-alt));
        /* Chrome 10-25, Safari 5.1-6 */
        background: linear-gradient(to right, var(--success-alt), var(--success-alt));
        /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
        color: var(--semantic-black);
    }

    .card-bg.card-CTA.cta-beta.card-bg-green-gradient h3, .card-bg.card-CTA.cta-beta.card-bg-green-gradient p {
        color: var(--semantic-black);
    }

.card-bg-green-gradient .fa-credit-card {
    color: var(--semantic-white);
}

.card-transparent-white {
    background: rgba(255, 255, 255, 0.9);
}

/*
.fal::before, .svg-inline--fa {
    color: var(--primary-alt);
}
*/

.new-customer-wrap {
    background-color: var(--semantic-white);
}

.section-divider.section-blue, .section-divider.section-yellow, .section-divider.section-orange {
    background-color: var(--semantic-white);
}

    .section-divider.section-blue:nth-child(odd), .section-divider.section-yellow:nth-child(odd), .section-divider.section-orange:nth-child(odd) {
        background-color: var(--neutral-grey-light);
    }

.section-divider.section-grey {
    background-color: var(--neutral-grey-light);
}

.section-divider.hero-banner-wrap {
    background-color: var(--neutral-grey-light);
}

.hero-banner-wrap + .section-divider:nth-child(odd) {
    background-color: var(--semantic-white);
}

.navbar-light .navbar-nav .nav-link.active {
    color: var(--primary);
}

.loan-sidebar nav ul.loan-navigation li a.active::after {
    border-left-color: var(--primary);
}

.text-primary {
    color: var(--primary) !important;
}

.text-primary-alt {
    color: var(--primary-alt) !important;
}

.nav-tabs .nav-link {
    color: var(--neutral-grey-darker);
}

.nav-tabs .nav-link.active {
    border-bottom-color: var(--primary);
    color: var(--primary);
}

/*
.fad:before {
    color: var(--primary);
}

.fad::after {
    color: var(--neutral-grey);
}

    .fad.fa-info-circle:before {
        color: var(--primary-light);
    }

    .alertBanner-danger .fad.fa-info-circle:before {
        color: var(--alert)
    }

    .fad.fa-info-circle:after {
        color: var(--semantic-black);
        opacity: 1;
    }

.fa-credit-card:before {
    color: var(--semantic-white);
}
 */
.announcement-module {
    background-color: var(--neutral-grey-light);
    box-shadow: none;
}

.text-danger p, .text-danger ul, .text-danger ol, .text-danger blockquote {
    color: #dc3545 !important;
}

.feature-list .feature-list-content h3 {
    font-size: 15px;
    line-height: 1.5rem;
}

    .feature-list .feature-list-content h3:first-child {
        padding-bottom: 0;
    }

.loan-header.fixed {
    top: 57px;
}

.loan-header .navbar-expand-md .navbar-nav .nav-item:last-child .nav-link {
    padding-right: 0;
}

.targeted-announcement {
    background: linear-gradient(to bottom,var(--primary-dark),var(--primary));
}

.forbearance-alert-container {
    margin-bottom: 1em;
    width: 100%;
}

.forbearance-alert-container .forbearance-alert {
    background-color: var(--tertiary-alt);
}

.progressbar li {
    color: var(--semantic-black);
}
    .progressbar li:after {
        background-color: var(--semantic-black);
    }

    .progressbar li i {
        color: var(--semantic-black);
    }

    .progressbar li.active {
        color: var(--semantic-black);
    }

        .progressbar li.active i {
            background-color: var(--primary);
            border-color: var(--primary);
        }

    .progressbar li.completed {
        color: var(--semantic-black);
    }

        .progressbar li.completed i {
            background-color: var(--primary);
            border-color: var(--primary);
        }

#contentForm .progressbar-check li {
    color: var(--semantic-black);
}

    #contentForm .progressbar-check li:before {
        border-color:var(--semantic-black);
    }

    #contentForm .progressbar-check li:after {
        background-color: var(--semantic-black);
    }

    #contentForm .progressbar-check li.active {
        color: var(--primary);
    }

        #contentForm .progressbar-check li.active:before {
            border-color: var(--primary);
        }

        #contentForm .progressbar-check li.active + li:after {
            background-color: var(--semantic-black);
        }

    #contentForm .progressbar-check li.completed {
        color: var(--primary);
    }

        #contentForm .progressbar-check li.completed:before {
            border-color: var(--primary);
        }

        #contentForm .progressbar-check li.completed + li:after {
            background-color: var(--semantic-black);
        }

/*
.background-photo.registration-bg,
.background-photo.find-loan-bg,
.background-photo.new-customer-bg,
.background-photo.announcement-bg,
.background-photo.interior.contact-us-bg,
.background-photo.interior.our-mission-bg,
.background-photo.interior.mortgage-assistance-bg,
.background-photo.interior.disaster-assistance-bg,
.svg-container {
    filter: grayscale(1);
}
*/

.side-widget a:hover h3 {
    color: var(--primary-alt);
    text-decoration: none;
}

.main.main-alternate {
    color: var(--semantic-white) !important;
    background: var(--primary);
}

@media (min-width: 768px) {
    .new-customer-wrap {
        border-left-color: var(--neutral-grey-light);
    }

    .section-divider.section-blue, .section-divider.section-yellow, .section-divider.section-orange {
        background-color: var(--semantic-white);
    }

    .section-divider.section-grey {
        background-color: var(--neutral-grey-light);
    }

    .section-divider.hero-banner-wrap {
        background-color: var(--neutral-grey-light);
    }
}

.loan-header .navbar-text {
    color: var(--semantic-black);
}

@media (min-width: 992px) {
    .loan-header .navbar {
        padding: 0;
    }

    .loan-header .navbar-text {
        margin-left: 0;
    }
}

.loan-sidebar nav ul.loan-navigation li a {
    font-weight: normal;
}

.tooltipster-content a, .tooltipster-content a:link, .tooltipster-content a:visited, .tooltipster-content a:active {
    font-weight: normal;
}

.loan-officer h3 a:hover {
    color: var(--primary-alt);
    text-decoration: none;
}

.side-widget ul.side-cta-icon li a:hover {
    text-decoration: none;
}

.side-widget ul li a {
    color: var(--neutral-grey-darker);
}

.side-widget ul li a:hover {
    color: var(--primary-alt);
}

.payment-step {
    position: relative;
    z-index: 1;
}

.form-group.cta-get-lo {
    font-weight: 800;
    color: var(--primary-alt);
    letter-spacing: 0.3px;
}


.anchor {
    padding-top: 140px;
}

@media (min-width: 768px) {
    .anchor {
        padding-top: 160px;
    }
}

@media (min-width: 992px) {
    .anchor {
        padding-top: 320px;
    }
}


/*************************/
/* New General/Utilities styles */
/*************************/
.variant1 {
    color: var(--primary) !important;
}

.variant2 {
    color: var(--tertiary) !important;
}

.variant3 {
    color: var(--tertiary-alt) !important;
}

.normal-case {
    text-transform: none !important;
}

/*
img[src*='.jpg'], img[src*='.png'], img.img-fluid, .inline-svg-illustration, .error-page .card-bg img, .loanInfo img {
    filter: grayscale(1);
}

img.btn-mobile-store, .btn-mobile-store, .login-mobile-app-buttons-group img, img.logo-ccf, img.logo {
    filter: grayscale(0) !important;
}
 */

.cta-container {
    padding-top: 20px;
    display: flex;
    gap: 20px;
    flex-wrap: wrap;
}

.section-transition {
    position: relative;
}

    .section-transition::after {
        content: "";
        position: absolute;
        bottom: -50px;
        left: calc(50% - 50px);
        display: block;
        margin: 0 auto;
        width: 0;
        height: 0;
        border-left: 50px solid transparent;
        border-right: 50px solid transparent;
        border-top: 50px solid var(--semantic-white);
    }

    .section-transition:nth-child(odd)::after {
        border-top: 50px solid var(--neutral-grey-light);
    }

    .section-transition + .section-divider {
        padding-top: 110px;
    }

.section-pt-lg {
    padding-top: 100px;
}

.dont-break-out {
    /* These are technically the same, but use both */
    overflow-wrap: break-word;
    word-wrap: break-word;
    -ms-word-break: break-all;
    /* This is the dangerous one in WebKit, as it breaks things wherever */
    word-break: break-all;
    /* Instead use this non-standard one: */
    word-break: break-word;
    /* Adds a hyphen where the word breaks, if supported (No Blink) */
    -ms-hyphens: auto;
    -moz-hyphens: auto;
    -webkit-hyphens: auto;
    hyphens: auto;
}
.app-icon {
    border-radius: 20%;
}


/*************************/
/* Alert styles */
/*************************/
.alertBanner-info {
    /*
    background: var(--primary-light);
    */
    font-weight: normal;
    /*
    color: var(--semantic-black);
    */
}

#alertBannerContainer img {
    margin-right: 10px;
}

.alert-dismissible .btn-close {
    top: 0.25rem;
    right: 1rem;
    padding: 0.1em;
    --bs-btn-close-bg: none;
}

.mobile-app-push-inner {
    background: var(--semantic-black);
}


/*************************/
/* Header styles */
/*************************/
.main-header[role=banner] .navbar {
    padding: 0;
}

    .main-header[role=banner] .navbar .navbar-brand {
        margin: 10px 15px;
        background: url(/images/logos/carrington_logo_final_2col_rgb.svg) no-repeat 0 0;
    }

.main-header[role=banner] .navbar-toggler {
    margin-right: 15px;
    margin-left: 15px;
}

    .main-header[role=banner] .navbar-toggler span {
        background: var(--semantic-black);
    }

.main-header[role=banner] .nav-courtesy {
    margin-top: 0;
    margin-bottom: 20px;
    text-align: right;
}

    .main-header[role=banner] .nav-courtesy .navbar-nav .nav-item .nav-link {
        padding: 10px 35px;
        font-weight: 700;
    }

    .main-header[role=banner] .nav-courtesy .navbar-nav .nav-item:last-child {
        margin-right: -35px;
    }

.main-header[role=banner] .nav-link.dropdown-toggle svg g {
    fill: var(--primary);
}

.navbarsDefault ul > li.dropdown.show {
    position: static;
}

    .navbarsDefault ul > li.dropdown.show .dropdown-menu {
        width: 100%;
    }

        .navbarsDefault ul > li.dropdown.show .dropdown-menu > div {
            margin: 0 auto;
            max-width: 1440px;
        }

.main-nav-container {
    background: var(--primary);
}

.navbarsDefault.navbar-collapse.collapse.show {
    overflow: auto;
    padding-bottom: 20px;
    max-height: 92vh;
}

.navbarsDefault > .navbar-nav {
    background: var(--semantic-white);
}

.main-header .navbar .navbar-tagline {
    width: 280px;
    height: 51px;
    background: url(/images/logos/MakeHomeWork-Wordmark-2.png) no-repeat 0 0;
    background-size: cover;
}

.main-header[role=banner] .navbarsDefault .navbar-nav .nav-item .nav-link {
    padding: 15px 15px;
    font-size: 13px;
    font-family: Montserrat, Arial, sans-serif;
    font-weight: 700;
    color: var(--semantic-black);
    line-height: 1;
    letter-spacing: 0.2px;
}

    .main-header[role=banner] .navbarsDefault .navbar-nav .nav-item .nav-link:hover, .main-header[role=banner] .navbarsDefault .navbar-nav .nav-item .nav-link:focus,
    .main-header[role=banner] .navbar .nav-courtesy .navbar-nav .nav-item .nav-link:hover, .main-header[role=banner] .navbar .nav-courtesy .navbar-nav .nav-item .nav-link:focus {
        color: var(--primary-alt);
        text-decoration: none;
    }

.navbar .nav-courtesy .btn {
    margin: 0;
    padding: 11px 16px 12px;
    line-height: 1;
}

    .navbar .nav-courtesy .btn:last-child {
        margin-left: 15px;
    }
    
    .navbar .nav-courtesy .btn.btn-secondary {
        padding: 9px 16px 10px;
    }

.navbarsDefault .nav-subtitle {
    display: block;
    padding-bottom: 10px;
    width: 100%;
    border-bottom: 7px solid var(--primary);
    font-size: 17px;
    font-weight: 700;
    letter-spacing: 0.4px;
    text-transform: uppercase;
    line-height: 1;
    color: var(--neutral-grey-dark);
}

.main-header[role=banner] .navbar .navbarsDefault .dropdown-menu {
    padding: 10px 15px;
    width: 100%;
}

    .main-header[role=banner] .navbar .navbarsDefault .dropdown-menu .dropdown-item {
        display: flex;
        justify-content: space-between;
        padding: 1rem 0 1.5rem 0;
        font-size: 14px;
        font-weight: 400;
        letter-spacing: 0.2px;
        line-height: 1;
        text-transform: uppercase;
        color: var(--semantic-black);
    }

        .main-header[role=banner] .navbar .navbarsDefault .dropdown-menu .dropdown-item:hover {
            background-color: transparent;
            color: var(--primary);
            text-decoration: none;
        }

        .main-header[role=banner] .navbar .navbarsDefault .dropdown-menu .dropdown-item::after {
            content: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg width='6px' height='10px' viewBox='0 0 6 10' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Ctitle%3ELearn-More-Icon%3C/title%3E%3Cg id='cms_website_R6' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='AlertNotifications-Section' transform='translate(-1509.000000, -19.000000)' fill='%23000000'%3E%3Cpolygon id='Learn-More-Icon' transform='translate(1512.000000, 24.000000) rotate(-90.000000) translate(-1512.000000, -24.000000) ' points='1507 21 1512.03903 27 1517 21'%3E%3C/polygon%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
            width: 6px;
            height: 10px;
        }

.navbarsDefault .dropdown-menu-col {
    width: 100%;
}

    .navbarsDefault .dropdown-menu-col:not(:first-child), .navbarsDefault .nav-subtitle:not(:first-child) {
        padding-top: 1rem;
    }

.main-header[role=banner] .btn-wrap {
    margin: 0;
}

.main-header[role=banner] .navbar .dropdown.user-account .dropdown-menu .dropdown-item {
    color: var(--semantic-black);
}

    .main-header[role=banner] .navbar .dropdown.user-account .dropdown-menu .dropdown-item:active {
        background-color: inherit;
    }

    .main-header[role=banner] .navbar .dropdown.user-account .dropdown-menu .dropdown-item:hover, .main-header[role=banner] .navbar .dropdown.user-account .dropdown-menu .dropdown-item:focus {
        background-color: transparent;
        color: var(--primary-alt);
        text-decoration: none;
    }
/*
.main-header[role=banner] .navbar .dropdown.user-account .fal::before {
    color: var(--semantic-black);
}
*/

.loan-header .navbar .nav-link.active {
    border-bottom-color: var(--primary);
}

.loan-header .navbar .nav-link svg {
    filter: brightness(0.9);
}

.navbar-light .navbar-nav .nav-link:hover {
    color: var(--primary-alt);
}

@media (min-width: 1200px) {
    .navbar-expand-xl {
        flex-wrap: wrap;
    }

    .main-header[role=banner] .navbar .navbar-brand {
        margin: 0;
    }

    .main-nav-container {
        background: url(/images/Background-photos/bg-navigation-2.png) no-repeat right 0 var(--primary);
    }

    .main-header .navbar {
        flex-wrap: wrap;
    }

    .main-header .navbarsDefault {
        background: transparent;
        align-items: stretch;
    }

    .navbarsDefault > .navbar-nav {
        flex-direction: row;
        flex: 1 1 auto;
        align-items: center;
        justify-content: flex-end;
        background: url(/images/Background-photos/bg-navigation-repeater-2.png) repeat-x transparent;
    }

    .navbarsDefault .dropdown-menu-col {
        padding: 0 45px;
        width: 33%;
        max-width: 365px;
        border-right: 1px solid var(--neutral-grey);
    }

        .navbarsDefault .dropdown-menu-col:last-child {
            border-right: 0;
        }

        .navbarsDefault .dropdown-menu-col:not(:first-child) {
            padding-top: 0;
        }

    .main-header .navbarsDefault > .navbar-nav > .nav-item {
        position: static;
        margin-left: 90px;
    }

    .main-header[role=banner] .navbarsDefault .navbar-nav .nav-item .nav-link {
        padding: 0 0.2rem;
    }

    .navbarsDefault .nav-subtitle {
        display: block;
        margin-bottom: 10px;
        width: 100%;
        border-bottom: 7px solid var(--primary);
    }

    .main-header[role=banner] .navbar .navbarsDefault .dropdown-menu {
        padding: 50px 0;
    }

    .navbarsDefault ul > li.dropdown.show .dropdown-menu > div {
        justify-content: center;
    }

    .main-header[role=banner] .navbar .navbarsDefault .dropdown-menu .dropdown-item {
        padding: 6px 0 7px 0;
    }

        .main-header[role=banner] .navbar .navbarsDefault .dropdown-menu .dropdown-item:last-child {
            padding-bottom: 7px;
        }
}


/*************************/
/* Navigation Scroll Position styles */
/*************************/
#navbarScrollPosition {
    display: none;
    position: fixed;
    right: 10px;
    top: 40%;
    z-index: 10;
}

    #navbarScrollPosition .nav {
        flex-direction: column;
    }

    #navbarScrollPosition .nav-link {
        margin: 0.5em 0;
        padding: 0;
        width: 20px;
        height: 20px;
        border-radius: 50%;
        background: #D8D8D8;
    }

        #navbarScrollPosition .nav-link.active {
            background: var(--primary);
        }

@media (min-width: 768px) {
    #navbarScrollPosition {
        display: block;
        top: 40%;
    }
}


/*************************/
/* Custom Card Utilities styles */
/*************************/
.custom-image-card-section .col-sm-12 {
    display: flex;
}

.custom-image-card-section .card {
    background: transparent;
}

.custom-image-card-section .card-body {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: space-between;
}

    .custom-image-card-section .card-body:after {
        content: "";
        margin-top: 12px;
        height: 10px;
        width: 100%;
        background: var(--primary);
    }

    .custom-image-card-section .card-body.card-body-secondary:after {
        background: var(--secondary);
    }

    .custom-image-card-section .card-body.card-body-tertiary:after {
        background: var(--tertiary);
    }

    .custom-image-card-section .card-body.card-body-tertiary-alt:after {
        background: var(--tertiary-alt);
    }

    .custom-image-card-section .card-body.card-body-primary svg g {
        fill: var(--primary);
    }

    .custom-image-card-section .card-body.card-body-secondary svg g {
        fill: var(--secondary);
    }

    .custom-image-card-section .card-body.card-body-tertiary svg g {
        fill: var(--tertiary);
    }

    .custom-image-card-section .card-body.card-body-tertiary-alt svg g {
        fill: var(--tertiary-alt);
    }

.custom-image-card-section a {
    text-decoration: none;
}

.custom-image-card-section h5, .custom-image-card-section .h5 {
    margin: 0;
    padding: 27px 0;
}

.custom-image-card-section img {
    max-width: 100%;
}

@media (min-width: 1300px) {
}

.custom-image-card-alt-section > .row {
    gap: 30px;
    justify-content: space-between;
    margin: 0;
}

.custom-image-card-alt-section .col-sm-12 {
    display: flex;
    padding: 0;
}

.custom-image-card-alt-section .card {
    flex-direction: row;
    background: transparent;
    width: 100%;
}

.custom-image-card-alt-section .card-header {
    display: flex;
    padding: 0;
    border-radius: 0;
}

    .custom-image-card-alt-section .card-header::before {
        content: "";
        position: absolute;
        top: 0;
        left: 99px;
        display: block;
        height: 50%;
        border-right: 25px solid var(--primary);
        border-bottom: 25px solid transparent;
        z-index: 1;
    }

    .custom-image-card-alt-section .card-header::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 99px;
        display: block;
        height: 53%;
        border-right: 25px solid var(--primary);
        border-top: 25px solid transparent;
        z-index: 1;
    }

.custom-image-card-alt-section .col-sm-12:nth-child(3n-1) .card-header::before, .custom-image-card-alt-section .col-sm-12:nth-child(3n-1) .card-header::after {
    border-right-color: var(--secondary);
}

.custom-image-card-alt-section .col-sm-12:nth-child(3n) .card-header::before, .custom-image-card-alt-section .col-sm-12:nth-child(3n) .card-header::after {
    border-right-color: var(--tertiary-alt);
}

.custom-image-card-alt-section .card-image-wrapper {
    display: flex;
    position: relative;
}

.custom-image-card-alt-section .col-sm-12 .card-image-wrapper img {
    /*position: absolute;*/
    width: 123px;
}

.custom-image-card-alt-section .card-body {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 20px 20px 20px 0;
    background: var(--primary);
}

.custom-image-card-alt-section .col-sm-12:nth-child(3n-1) .card-body {
    background: var(--secondary);
}

.custom-image-card-alt-section .col-sm-12:nth-child(3n) .card-body {
    background: var(--tertiary-alt);
}

.custom-image-card-alt-section h5 {
    margin: 0;
    padding: 0 0 11px 0;
    line-height: 1 !important;
}

.custom-image-card-alt-section p, .custom-image-card-alt-section ul, .custom-image-card-alt-section ol, .custom-image-card-alt-section blockquote {
    font-size: 14px;
    color: var(--semantic-white);
}

@media (min-width: 992px) {
    .custom-image-card-alt-section .col-sm-12 {
        flex: 0 0 46%;
    }
}

@media (min-width: 1300px) {
    .custom-image-card-alt-section .col-sm-12 {
        flex: 0 0 47%;
    }

    .custom-image-card-alt-section p, .custom-image-card-alt-section ul, .custom-image-card-alt-section ol, .custom-image-card-alt-section blockquote {
        font-size: 14px;
    }
}

.custom-icon-card-section > .container > .row {
    gap: 30px;
    justify-content: space-between;
    margin: 0;
}

.custom-icon-card-section .col-sm-12 {
    display: flex;
    padding: 0;
}

.custom-icon-card-section .card {
    flex-direction: row;
    width: 100%;
    background: transparent;
}

.custom-icon-card-section .card-header {
    position: relative;
    display: flex;
    padding: 0;
    background: transparent;
    border: 0;
    border-radius: 0;
}

    .custom-icon-card-section .card-header::after {
        content: "";
        position: absolute;
        top: calc(50% - 30px);
        right: -30px;
        display: block;
        margin: 0 auto;
        width: 0;
        height: 0;
        border-top: 30px solid transparent;
        border-bottom: 30px solid transparent;
        border-left: 30px solid var(--semantic-black);
        z-index: 1;
    }

.card-icon-wrapper {
    display: flex;
    align-items: center;
    padding: 20px;
    background: var(--semantic-black);
}

.custom-icon-card-section .card-body {
    padding-left: 50px;
    background: var(--primary);
}

    .custom-icon-card-section .card-body.card-body-secondary {
        background: var(--secondary);
    }

    .custom-icon-card-section .card-body.card-body-tertiary {
        background: var(--tertiary);
    }

    .custom-icon-card-section .card-body.card-body-tertiary-alt {
        background: var(--tertiary-alt);
    }

.custom-icon-card-section h5, .custom-icon-card-section .h5 {
    margin: 0;
    padding: 0;
}

.custom-icon-card-section p, .custom-icon-card-section ul, .custom-icon-card-section ol, .custom-icon-card-section blockquote {
    color: var(--semantic-white);
}

.custom-icon-card-section img {
    width: 30px;
    height: 30px;
}

.custom-icon-card-section svg g {
    fill: var(--semantic-white);
}

@media (min-width: 992px) {
    .custom-icon-card-section .col-sm-12 {
        flex: 0 0 30%;
    }
}

@media (min-width: 1300px) {
    .card-icon-wrapper {
        padding: 35px;
    }

    .custom-icon-card-section h5, .custom-icon-card-section .h5 {
        font-size: 20px;
    }

    .custom-icon-card-section img {
        width: 50px;
        height: 50px;
    }
}


/*************************/
/* Home Hero styles */
/*************************/
#heroHome .carousel-item {
    height: auto;
    min-height: 400px;
    background-image: url(/images/Background-photos/homepage/carousel-image-01b-mobile.jpg);
    background-color: var(--secondary);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}

#heroHome .carousel-item > .container {
    display: flex;
    height: calc(100% + 50px);
}

    #heroHome .carousel-item > .container > .row {
        flex: 1 1 auto;
    }

#heroHome p, #heroHome ol, #heroHome ul, #heroHome blockquote {
    color: var(--semantic-white);
}

#heroHome .carousel-indicators-container {
    margin-top: -40px;
}

#heroHome .carousel-indicators-container > div {
    margin: 0 auto;
    max-width: 1280px;
}

@media (min-width: 1480px) {
    #heroHome .carousel-indicators-container > div {
        max-width: 1440px;
    }
}

#heroHome .carousel-indicators {
    position: relative;
    bottom: auto;
    left: auto;
    right: auto;
}

    #heroHome .carousel-indicators button {
        margin-right: 7px;
        margin-left: 7px;
        width: 14px;
        height: 14px;
        border-radius: 50%;
        cursor: pointer;
    }
    #heroHome .carousel-indicators button:hover {
        opacity: 0.8;
    }

#heroHome .btn {
    display: block;
}

#heroHome .h1 {
    font-size: 22px;
    font-weight: 900;
    color: var(--primary-dark);
    text-shadow: 0 0 5px var(--semantic-white);
}

#heroHome .h2 {
    font-size: 15px !important;
    font-weight: 900;
    color: var(--neutral-grey-darker);
    line-height: 1.5 !important;
    text-shadow: 0 0 5px var(--semantic-white);
}

#heroHome #hero-qm {
    background-image: url(/images/Background-photos/homepage/bg-hero-qm-mobile.jpg);
}

#heroHome #hero-non-qm {
    background-image: url(/images/Background-photos/homepage/bg-hero-non-qm-mobile.jpg);
    background-position: right top;
}

#heroHome #hero-rate-drop {
    background-image: url(/images/Background-photos/homepage/bg-hero-rate-drop-mobile.jpg);
}

.btn.btn-hero {
    padding: 7px 12px 8px;
    height: auto;
    border: 4px solid var(--primary);
}

    .btn.btn-hero:hover {
        background: var(--semantic-white);
        color: var(--primary-dark);
    }

@media screen and (min-width: 380px) {
    #heroHome .carousel-item {
        min-height: 380px;
    }
}

@media screen and (min-width: 768px) {
    #heroHome .h1 {
        font-size: 52px;
    }

    #heroHome .h2 {
        font-size: 35px !important;
        line-height: 1.2 !important;
    }

    #heroHome #hero-qm {
        background-image: url(/images/Background-photos/homepage/bg-hero-qm.jpg);
    }

    #heroHome #hero-non-qm {
        background-image: url(/images/Background-photos/homepage/bg-hero-non-qm.jpg);
    }

    #heroHome #hero-rate-drop {
        background-image: url(/images/Background-photos/homepage/bg-hero-rate-drop.jpg);
    }

    #heroHome .carousel-item {
        min-height: 620px;
    }

    .btn.btn-hero {
        padding: 20px 40px;
        height: auto;
        font-size: 18px;
    }
}

@media screen and (min-width: 992px) {
    #heroHome .h1 {
        font-size: 72px;
    }

    #heroHome .h2 {
        font-size: 36px !important;
        line-height: 1.2 !important;
    }

    #heroHome .carousel-item {
        min-height: 600px;
    }

    .btn.btn-hero {
        font-size: 24px;
        margin-bottom: 0 !important;
    }
}
@media screen and (min-width: 1200px) {
    #heroHome #hero-rate-drop h1 {
        padding-right: 3em;
    }
}
@media screen and (min-width: 1300px) {
    #heroHome .carousel-item {
        min-height: 500px;
    }
}

/*************************/
/* Home styles */
/*************************/
#homeBreakingItDown > .container > .row {
    align-items: center;
}

#bgBreakItDown {
    width: 621px;
    height: 400px;
    max-width: 100%;
    background: url(/images/Background-photos/homepage/Laptop-Circle-3.png) no-repeat center center;
    background-size: contain;
}

.section-bid-popup-link {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    background: transparent;
    border: 0;
    cursor: pointer;
    font-size: 0.9em;
}

    .section-bid-popup-link:active {
        outline: transparent;
        color: var(--primary);
    }

    .section-bid-popup-link > span:first-child {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 75px;
        height: 75px;
        background: var(--semantic-white);
        border: 2px solid var(--secondary);
        border-radius: 50%;
        transition: 1s;
    }

    .section-bid-popup-link > span:last-child {
        padding: 5px 10px;
    }

    .section-bid-popup-link > span:first-child svg > g > g {
        fill: var(--secondary);
        transition: 1s;
    }

    .section-bid-popup-link:hover > span:first-child {
        background-color: var(--primary);
        border-color: var(--primary);
    }

    .section-bid-popup-link:hover > span:first-child svg > g > g {
        fill: var(--semantic-white);
    }

    .section-bid-popup-link[data-bs-target='#modalPreQualify'] {
        top: 35%;
    }

    .section-bid-popup-link[data-bs-target='#modalFindYourHouse'] {
        top: 5%;
        left: 37%;
        flex-flow: column;
    }

    .section-bid-popup-link[data-bs-target='#modalSecureALoan'] {
        top: 40%;
        right: 5%;
        flex-flow: row-reverse;
    }

.img-carrington-mobile-app {
    height: 468px;
    width: 543px;
    max-width: 100%;
    background-size: contain;
    background-position: bottom center;
    background-repeat: no-repeat;
}
.img-carrington-mobile-app-landing {
    height: 468px;
    
    max-width: 100%;
    background-size: contain;
    background-position: top left;
    background-repeat: no-repeat;
}

.img-carrington-mobile-app-login {
    height: 300px;
    width: 280px;
    max-width: 100%;
    background-size: contain;
    background-position: left;
    background-repeat: no-repeat;
    text-align:left;
}
@media (min-width: 460px) {
    .section-bid-popup-link[data-bs-target='#modalPreQualify'] {
        left: 10%;
    }

    .section-bid-popup-link[data-bs-target='#modalSecureALoan'] {
        right: 10%;
    }
}

@media (min-width: 520px) {
    .section-bid-popup-link[data-bs-target='#modalPreQualify'] {
        left: 15%;
    }

    .section-bid-popup-link[data-bs-target='#modalSecureALoan'] {
        right: 15%;
    }
}

@media (min-width: 768px) {
    #homeWhatCanYourHomeDoForYou > .container > .row {
        justify-content: space-between;
    }

    #homeWhatCanYourHomeDoForYou .col-md-4 {
        max-width: 27%;
    }

    .section-bid-popup-link[data-bs-target='#modalPreQualify'] {
        top: 32%;
        left: 5%;
    }

    .section-bid-popup-link[data-bs-target='#modalFindYourHouse'] {
        top: 8%;
        left: 33%;
    }

    .section-bid-popup-link[data-bs-target='#modalSecureALoan'] {
        top: 40%;
        right: 5%;
    }
}

@media (min-width: 992px) {
    .section-bid-popup-link[data-bs-target='#modalPreQualify'] {
        top: 32%;
        left: 15%;
    }

    .section-bid-popup-link[data-bs-target='#modalFindYourHouse'] {
        top: 5%;
        left: 37%;
    }

    .section-bid-popup-link[data-bs-target='#modalSecureALoan'] {
        top: 38%;
        right: 15%;
    }
}

@media (min-width: 1200px) {
    #bgBreakItDown {
        height: 480px;
    }

    .section-bid-popup-link {
        font-size: 1em;
    }

        .section-bid-popup-link[data-bs-target='#modalPreQualify'] {
            top: 40%;
            left: 10%;
        }

        .section-bid-popup-link[data-bs-target='#modalFindYourHouse'] {
            top: 5%;
            left: 37%;
        }

        .section-bid-popup-link[data-bs-target='#modalSecureALoan'] {
            top: 36%;
            right: 10%;
        }
}

@media (min-width: 1300px) {
    #bgBreakItDown {
        height: 677px;
    }

    .section-bid-popup-link[data-bs-target='#modalPreQualify'] {
        top: 42%;
    }

    .section-bid-popup-link[data-bs-target='#modalFindYourHouse'] {
        top: 9%;
        left: 37%;
    }

    .section-bid-popup-link[data-bs-target='#modalSecureALoan'] {
        top: 38%;
        right: 10%;
    }

    .img-carrington-mobile-app-payment {
        min-height: 400px;
        background-size: contain;
        background-position: 3em 2em;
        background-repeat: no-repeat;
    }
}

@media (min-width: 1480px) {
    .section-bid-popup-link[data-bs-target='#modalPreQualify'] {
        top: 42%;
        left: 8%;
    }

    .section-bid-popup-link[data-bs-target='#modalFindYourHouse'] {
        top: 9%;
        left: 32%;
    }

    .section-bid-popup-link[data-bs-target='#modalSecureALoan'] {
        top: 38%;
        right: 20%;
    }
}


/*************************/
/* Home Slider / Side News Module styles */
/*************************/
.news-featured .slick-track .slick-slide, .news-module.news-module-escrow, .side-cta .news-module.news-module-escrow {
    display: flex;
    height: auto;
    justify-content: center;
    margin-right: 0;
    background: var(--primary);
    -webkit-border-radius: 0;
    border-radius: 0;
    box-shadow: none;
    text-align: left;
}

    .news-featured .slick-track .slick-slide:nth-child(3n-1), .news-featured .slick-track .slick-slide:nth-child(3n-1) .news-module, .news-module.news-module-escrow:nth-child(3n-1), .side-cta .item:nth-child(3n-1) .news-module.news-module-escrow {
        background: var(--secondary);
    }

    .news-featured .slick-track .slick-slide:nth-child(3n), .news-featured .slick-track .slick-slide:nth-child(3n) .news-module, .news-module.news-module-escrow:nth-child(3n), .side-cta .item:nth-child(3n) .news-module.news-module-escrow {
        background: var(--tertiary-alt);
    }

    .news-module.news-module-escrow a {
        display: block;
        height: 100%;
        width: 100%;
        color: var(--semantic-white);
    }

.news-featured .news-module {
    margin: 0;
}

.news-featured .slick-track .slick-slide .img-wrap, .news-module .escrow-video-card .img-wrap {
    position: relative;
    display: block;
    height: 300px;
    overflow: hidden;
}
    .news-module .escrow-video-card .img-wrap {
        height: 150px;
    }

    .news-featured .slick-track .slick-slide .img-wrap::before, .news-module .escrow-video-card .img-wrap::before {
        content: "";
        position: absolute;
        left: 0;
        bottom: 0;
        display: block;
        width: 50%;
        border-bottom: 50px solid var(--primary);
        border-right: 50px solid transparent;
        z-index: 1;
    }

    .news-featured .slick-track .slick-slide .img-wrap::after, .news-module .escrow-video-card .img-wrap::after {
        content: "";
        position: absolute;
        left: 50%;
        bottom: 0;
        right: 0;
        display: block;
        width: 50%;
        border-bottom: 50px solid var(--primary);
        border-left: 50px solid transparent;
        z-index: 1;
    }

.news-featured .slick-track .slick-slide:nth-child(3n-1) .img-wrap::before, .news-featured .slick-track .slick-slide:nth-child(3n-1) .img-wrap::after, .side-cta .item:nth-child(3n-1) .escrow-video-card .img-wrap::before, .side-cta .item:nth-child(3n-1) .escrow-video-card .img-wrap::after {
    border-bottom-color: var(--secondary);
}

.news-featured .slick-track .slick-slide:nth-child(3n) .img-wrap::before, .news-featured .slick-track .slick-slide:nth-child(3n) .img-wrap::after, .side-cta .item:nth-child(3n) .escrow-video-card .img-wrap::before, .side-cta .item:nth-child(3n) .escrow-video-card .img-wrap::after {
    border-bottom-color: var(--tertiary-alt);
}

.news-featured .slick-track .slick-slide .img-wrap img, .news-module .escrow-video-card .img-wrap img {
    position: absolute;
    height: 100%;
    max-width: none;
}

    .news-module .escrow-video-card .img-wrap img {
        min-width: 100%;
        margin-left: -25%;
    }

.news-featured .news-wrap {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    padding: 30px 18px 30px;
}

    .news-featured .news-wrap h3, .news-module.news-module-escrow h3 {
        font-size: 20px;
        font-weight: 800;
        line-height: 27px;
        color: var(--semantic-white);
        text-transform: none;
        text-align: left;
    }

        .news-featured .news-wrap h3:first-child {
            padding-bottom: 15px;
        }

.news-module.news-module-escrow .news-wrap .excerpt p {
    margin-bottom: 14px;
    font-size: 15px;
    font-weight: 400;
    line-height: 22px;
    color: var(--semantic-white);
}

    .news-module.news-module-escrow .news-wrap .excerpt p:last-child {
        margin-bottom: 0;
    }

.news-module.news-module-escrow .link-caret-right {
    display: none;
}

.news-featured .news-module .link-caret-right {
    display: none;
}

.news-featured .news-module:has(a:focus) {
    outline: solid 3px var(--primary);
}

.escrow-video-card small {
    display: block;
    font-size: 65%;
    line-height: 1.4;
}

@media (min-width: 768px) {
    .news-featured .slick-track .slick-slide, .news-module.news-module-escrow, .side-cta .news-module.news-module-escrow {
        margin-right: 27px;
    }
}

/* Account Sidebar Item Modules */
.item-new {
    display: flex;
    justify-content: center;
}

@media screen and (min-width: 768px) {
    .item-new {
        justify-content: flex-end;
    }
}

.item-new .item-module {
    max-width: 180px;
}

.item-module > a {
    text-decoration: none;
}

.img-wrap-top, .img-wrap-bottom {
    position: relative;
}

.icon-play-over-th {
    display: block;
    position: absolute;
    left: calc(50% - 25px);
    top: calc(50% - 25px);
}

    .icon-play-over-th svg {
        padding: 10px;
        width: 50px;
        height: 50px;
        border: 1px solid var(--tertiary-alt3);
        border-radius: 50%;
        fill: var(--semantic-white);
        background: rgba(0,0,0,0.7);
    }

.icon-check {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 15px;
    background: var(--primary);
    border-radius: 50%;
}

    .icon-check svg {
        fill: var(--semantic-white);
        height: 1.5em;
    }

.item-module-content-wrap {
    padding: 30px 20px 70px 20px;
}

.item-module-content-wrap-with-bottom-img {
    padding-bottom: 30px;
}

.item-module-content-wrap-dark {
    display: block;
    background: var(--primary-dark);
}

.item-module-content-wrap-light {
    display: block;
    background: var(--tertiary-alt3);
}

.item-module-content-wrap > span {
    display: block;
}


/*************************/
/* Modal style overrides */
/*************************/
.modal .modal-header {
    flex-shrink: unset;
    padding-bottom: 0;
    background: var(--neutral-grey-light);
    border: 0;
}

.modal .modal-footer {
    background: var(--neutral-grey-light);
    border: 0;
}

.modal .modal-dialog .modal-header .modal-title {
    padding-top: 30px;
    padding-bottom: 0;
    width: 100%;
    font-weight: 900;
    color: inherit;
    text-align: center;
}

.modal .modal-header .btn-close {
    position: absolute;
    right: 30px;
    padding: 10px;
    font-size: 3em;
    font-weight: 300;
    color: var(--semantic-black);
    opacity: 1;
    --bs-btn-close-bg: none;
}

.modal .modal-body {
    background: var(--neutral-grey-light);
}

@media (min-width: 768px) {
    /*
    .modal .modal-dialog {
        width: 80%;
        max-width: 1000px;
    }*/

    .modal .modal-header, .modal .modal-body {
        padding: 1rem 10%;
    }

    .modal .modal-body {
        padding-bottom: 60px;
    }
}


/*************************/
/* Hubspot style overrides */
/*************************/
.hbspt-form form .hs-richtext span {
    background-color: transparent !important;
}


/*************************/
/* Footer styles */
/*************************/
footer.main-footer[role=contentinfo] {
    padding-top: 100px;
    background-color: var(--neutral-grey-light);
    text-align: left;
}

    footer.main-footer[role=contentinfo] .container .row {
        justify-content: space-between;
        gap: 10px;
        margin: 0;
    }

    footer.main-footer[role=contentinfo] .col-6 {
        padding: 0;
        max-width: 45%;
    }

    footer.main-footer[role=contentinfo] .col-12 {
        padding: 0;
    }

    footer.main-footer[role=contentinfo] .h4 {
        display: block;
        margin-bottom: 10px;
        padding-bottom: 10px;
        width: 100%;
        border-bottom: 7px solid var(--primary);
        font-size: 17px;
        font-weight: 700;
        letter-spacing: 0.4px;
        text-transform: uppercase;
        line-height: 1;
        color: var(--semantic-black);
    }

footer.main-footer .h4 > a {
    color: var(--neutral-grey-dark);
    text-decoration: none;
}

footer.main-footer[role=contentinfo] .list a {
    display: inline-block;
    padding: 10px 0;
    font-size: 14px;
    font-weight: 400;
    line-height: 23px;
    color: var(--neutral-grey-darker);
    text-decoration: none;
}

footer.main-footer[role=contentinfo] a:hover, footer.main-footer[role=contentinfo] a:active {
    color: var(--semantic-black);
    text-decoration: none;
}

footer.main-footer[role=contentinfo] .footer-copyright p {
    color: var(--neutral-grey-darker);
}

footer.main-footer[role=contentinfo] .footer-copyright a, footer.main-footer[role=contentinfo] .footer-copyright a:visited {
    color: var(--neutral-grey-darker);
    text-decoration: none;
}

    footer.main-footer[role=contentinfo] .footer-copyright a:hover, footer.main-footer[role=contentinfo] .footer-copyright a:active {
        color: var(--primary-alt);
        text-decoration: none;
    }
    footer.main-footer[role=contentinfo] .footer-copyright a svg g {
        fill: var(--neutral-grey-darker);
    }

footer.main-footer[role=contentinfo] .footer-copyright img {
    vertical-align: bottom;
}

footer.main-footer[role=contentinfo] .social {
    display: flex;
    justify-content: flex-start;
    gap: 10px;
}

    footer.main-footer[role=contentinfo] .social svg {
        color: var(--neutral-grey-darker);
    }
        footer.main-footer[role=contentinfo] .social svg g {
            fill: var(--neutral-grey-darker);
        }

    footer.main-footer[role=contentinfo] .social li {
        display: block;
    }

        footer.main-footer[role=contentinfo] .social li a {
            margin: 0;
        }

            footer.main-footer[role=contentinfo] .social li a:hover svg {
                filter: brightness(0);
            }

@media (min-width: 768px) {
    footer.main-footer[role=contentinfo] > .container > .row {
        gap: 30px;
    }

    footer.main-footer[role=contentinfo] .col-6 {
        max-width: 100%;
    }
}

@media (min-width: 992px) {
    footer.main-footer[role=contentinfo] .list a {
        padding-top: 5px;
    }

    footer.main-footer[role=contentinfo] .social {
        gap: 25px;
        padding-top: 30px;
    }
}

/* covered LP */
.lp-hero {
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    min-height: 300px;
}

.lp-footer-hero {
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    min-height: 400px;
}


/*************************/
/* Background / Retina styles */
/*************************/
#heroHome .carousel-item-1 {
    background-image: url(/images/Background-photos/homepage/carousel-image-01b-mobile.jpg);
}

#heroHome .carousel-item-2 {
    background-image: url(/images/Background-photos/homepage/carousel-image-02b-mobile.jpg);
}

#heroHome .carousel-item-3 {
    background-image: url(/images/Background-photos/homepage/carousel-image-03b-mobile.jpg);
}

#heroHome .carousel-item-4 {
    background-image: url(/images/Background-photos/homepage/carousel-image-04b-mobile.jpg);
}

#heroHome .carousel-item-5 {
    background-image: url(/images/Background-photos/homepage/carousel-image-05-mobile.jpg);
}

#heroHome .carousel-item-6 {
    background-image: url(/images/Background-photos/homepage/carousel-image-06-mobile.jpg);
}

.img-carrington-mobile-app {
    background-image: url(/images/Background-photos/homepage/Iphone-Mockup-2.png);
}

.img-carrington-mobile-app-landing {
    background-image: url('/images/Background-photos/homepage/Landing_Page-Whitexxhdpix35bare.jpg');
}

.img-carrington-mobile-app-login {
    background-image: url(/images/Background-photos/homepage/mobile_carousel.png);
}

#LPHeroCovered {
    background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), url(/images/Background-photos/covered/bg-covered-hero-mobile.jpg);
}

#LPFooterHeroCovered {
    background-image: url(/images/Background-photos/covered/bg-covered-footer-mobile.jpg);
}

@media (min-width: 768px) {
    #heroHome .carousel-item-1 {
        background-image: url(/images/Background-photos/homepage/carousel-image-01b.jpg);
        background-position: 30% top;
    }

    #heroHome .carousel-item-2 {
        background-image: url(/images/Background-photos/homepage/carousel-image-02b.jpg);
    }

    #heroHome .carousel-item-3 {
        background-image: url(/images/Background-photos/homepage/carousel-image-03b.jpg);
    }

    #heroHome .carousel-item-4 {
        background-image: url(/images/Background-photos/homepage/carousel-image-04b.jpg);
    }

    #heroHome .carousel-item-5 {
        background-image: url(/images/Background-photos/homepage/carousel-image-05.jpg);
    }

    #heroHome .carousel-item-6 {
        background-image: url(/images/Background-photos/homepage/carousel-image-06.jpg);
    }

    #LPHeroCovered {
        background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), url(/images/Background-photos/covered/bg-covered-hero.jpg);
    }

    #LPFooterHeroCovered {
        background-image: url(/images/Background-photos/covered/bg-covered-footer.jpg);
    }
}

@media (min-width: 1300px) {
    .img-carrington-mobile-app-payment {
        background-image: url(/images/Background-photos/homepage/Payment-options.jpg);
    }
}

@media (-webkit-min-device-pixel-ratio: 2), (min-resolution: 192dpi) {
    .main-header .navbar .navbar-tagline {
        background: url(/images/logos/MakeHomeWork-Wordmark-2@2x.png) no-repeat 0 0;
        background-size: contain;
    }

    #heroHome .carousel-item-1 {
        background-image: url(/images/Background-photos/homepage/carousel-image-01b-mobile@2x.jpg);
    }

    #heroHome .carousel-item-2 {
        background-image: url(/images/Background-photos/homepage/carousel-image-02b-mobile@2x.jpg);
    }

    #heroHome .carousel-item-3 {
        background-image: url(/images/Background-photos/homepage/carousel-image-03b-mobile@2x.jpg);
    }

    #heroHome .carousel-item-4 {
        background-image: url(/images/Background-photos/homepage/carousel-image-04b-mobile@2x.jpg);
    }

    #heroHome .carousel-item-5 {
        background-image: url(/images/Background-photos/homepage/carousel-image-05-mobile@2x.jpg);
    }

    #heroHome .carousel-item-6 {
        background-image: url(/images/Background-photos/homepage/carousel-image-06-mobile@2x.jpg);
    }

    .img-carrington-mobile-app {
        background-image: url(/images/Background-photos/homepage/Iphone-Mockup-2@2x.png);
    }

    .bg-vylla-home {
        background: url(/images/Background-photos/bg-vyllahome@2x.jpg) no-repeat center;
    }

    #LPHeroCovered {
        background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), url(/images/Background-photos/covered/bg-covered-hero-mobile@2x.jpg);
    }

    #LPFooterHeroCovered {
        background-image: url(/images/Background-photos/covered/bg-covered-footer-mobile@2x.jpg);
    }
}

@media (-webkit-min-device-pixel-ratio: 2) and (min-width: 768px), (min-resolution: 192dpi) and (min-width: 768px) {

    #heroHome .carousel-item-1 {
        background-image: url(/images/Background-photos/homepage/carousel-image-01b@2x.jpg);
    }

    #heroHome .carousel-item-2 {
        background-image: url(/images/Background-photos/homepage/carousel-image-02b@2x.jpg);
    }

    #heroHome .carousel-item-3 {
        background-image: url(/images/Background-photos/homepage/carousel-image-03b@2x.jpg);
    }
    
    #heroHome .carousel-item-4 {
        background-image: url(/images/Background-photos/homepage/carousel-image-04b@2x.jpg);
    }

    #heroHome .carousel-item-5 {
        background-image: url(/images/Background-photos/homepage/carousel-image-05@2x.jpg);
    }

    #heroHome .carousel-item-6 {
        background-image: url(/images/Background-photos/homepage/carousel-image-06@2x.jpg);
    }

    .bg-vylla-home {
        background: url(/images/Background-photos/bg-vyllahome@2x.jpg) no-repeat center;
    }

    #LPHeroCovered {
        background-image: linear-gradient(0deg, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)), url(/images/Background-photos/covered/bg-covered-hero@2x.jpg);
    }

    #LPFooterHeroCovered {
        background-image: url(/images/Background-photos/covered/bg-covered-footer@2x.jpg);
    }
}


/*************************/
/* calendar styles */
/*************************/
.picker.picker--focused .picker__day--selected, .picker .picker__day--selected, .picker .picker__day--selected:hover {
    background: var(--primary);
    color: var(--semantic-black);
}
.picker.picker--focused .picker__day--highlighted, .picker .picker__day--highlighted:hover, .picker .picker__day--infocus:hover, .picker .picker__day--outfocus:hover {
    background: var(--primary-light);
    color: var(--semantic-black);
}
.picker .picker__day--highlighted:hover, .picker .picker__day--infocus:hover, .picker .picker__day--outfocus:hover {
    background: var(--primary-light);
    color: var(--semantic-black);
}
.picker .picker__button--clear:hover, .picker .picker__button--close:hover, .picker .picker__button--today:hover {
    background: var(--primary-light);
    color: var(--semantic-black);
}
.picker .picker__button--today:before {
    border-top-color: var(--primary);
}
.picker .picker__button--clear:before {
    border-top-color: var(--tertiary);
}
.picker .picker__nav--next:hover, .picker .picker__nav--prev:hover {
    background: var(--primary-light);
    color: var(--semantic-black);
}
.picker .picker__button--today[disabled]:hover {
    color: var(--neutral-grey);
}


/*************************/
/* dashboard styles */
/*************************/
.product-data .product-data-right {
    background-color: var(--primary);
}
    .product-data .product-data-right::before {
        border-top-color: var(--primary);
        border-bottom-color: var(--primary);
    }
.product-data .product-data-solo {
    background-color: var(--primary);
}
.slidecontainer .ui-slider.ui-widget .ui-slider-handle {
    top: -0.5em;
    margin-left: -0.75em;
    width: 1.5em;
    height: 1.5em;
}
    .slidecontainer .ui-slider.ui-widget .ui-slider-handle:last-child {
        margin-left: -0.75em;
    }

.info-section.info-section-home-snapshot hr {
    background: var(--neutral-grey);
}


/*************************/
/* application styles */
/*************************/
.application-wrap .welcome-message {
    margin: 20px 0 30px;
}

.application-wrap h3.with-line, .application-wrap h4.with-line, .application-wrap h4, .application-wrap .with-line, .application-wrap h4.with-line.green, .application-wrap .with-line.green {
    color: var(--semantic-black);
}

.application-wrap .transformer-tabs a.active {
    color: var(--primary-alt);
}

.application-wrap .transformer-tabs a .svg-inline--fa.fa-check-circle {
    color: var(--primary-alt);
}


/*************************/
/* third party authorization styles */
/*************************/
.page-item.active .page-link {
    background-color: var(--primary);
    border-color: var(--primary);
}


/*************************/
/* covid19 styles */
/*************************/
.accordion.navbarcovid {
    background: var(--neutral-grey);
}

.accordion.navbarcovid a[aria-expanded="false"]::after, .accordion.navbarcovid a[aria-expanded="true"]::after {
    color: var(--semantic-white);
}


/*************************/
/* accordion styles */
/*************************/
.accordion a[role="button"][aria-expanded="true"], .accordion a[data-bs-toggle="collapse"][aria-expanded="true"] {
    color: var(--semantic-black);
    font-weight: 900;
}


/*************************/
/* contact us styles */
/*************************/
#accordion-Contact-Us h3 {
    font-size: 1rem;
    line-height: 1.3;
    text-transform: none;
}

@media (min-width: 1300px) {
    #accordion-Contact-Us h3 {
        font-size: 1rem;
        line-height: 1.3;
    }
}


/*************************/
/* admin styles */
/*************************/
#appraisal-info-accordion .btn-secondary.btn-dark {
    color: #fff;
    background-color: #343a40;
}
#appraisal-info-accordion .btn-secondary.btn-danger {
    color: #fff;
    background-color: red;
}
#appraisal-info-accordion .btn-secondary.btn-success {
    color: #fff;
    background-color: green;
}
#appraisal-info-accordion .btn-secondary:disabled, #appraisal-info-accordion .btn.btn-secondary:disabled {
    filter: grayscale(0);
}


/*************************/
/*Reponsive Table */
/*************************/
@media only screen and (max-width: 768px) {
    .responsive-table-data.refinance-a-home td:nth-of-type(1):before {
        content: "";
    }

    .responsive-table-data.buy-a-home td:nth-of-type(1):before {
        content: "";
    }
}

.popup-content {
    background: var(--semantic-white);
}

.popup-content span {
    padding: 0.5em;
}


/* Products */
#heroProducts {
    display: flex;
    justify-content: stretch;
    background-color: var(--secondary);
    background-position: center top;
    background-repeat: no-repeat;
    background-size: cover;
}

@media (min-width: 768px) {
    #heroProducts {
        height: 500px;
    }
}

#heroProducts > .container {
    display: flex;
    align-items: stretch;
}

    #heroProducts > .container > .row {
        flex: 1 1 auto;
    }


#heroProducts .hero-content-left {
    padding: 100px 10px 30px 10px;
    margin-bottom: 0;
    background-color: rgba(30,52,100,0.75);
}

@media (min-width: 768px) {
    #heroProducts .hero-content-left {
        display: flex;
        flex-flow: row wrap;
        padding-right: 30px;
        padding-bottom: 0;
        padding-left: 30px;
    }
}

    #heroProducts .hero-content-left > * {
        width: 100%;
    }

.hero-prehead, .hero-subhead {
    color: var(--primary-light);
    text-transform: none;
}

.hero-head {
    color: var(--semantic-white);
}

.hero-subhead {
    text-align: right;
}

.hero-ctas {
    display: flex;
    justify-content: center;
    align-self: flex-end;
    flex-wrap: wrap;
    gap: 20px;
    margin-bottom: 25px;
}

@media (min-width: 768px) {
    .hero-ctas {
        flex-wrap: nowrap;
    }
}

.accordion.accordion-products a[data-bs-toggle="collapse"] {
    padding: 10px 30px 10px 20px;
    background-color: var(--semantic-white);
    text-transform: uppercase;
}

.accordion.accordion-products > span {
    margin-top: 20px;
}

    .accordion.accordion-products > span:first-child {
        margin-top: 0;
    }

.accordion.accordion-products a[aria-expanded="false"]:after, .accordion.accordion-products a[aria-expanded="true"]:after {
    right: 20px;
    color: var(--primary-dark);
}

.accordion.accordion-products a[role="button"][aria-expanded="true"], .accordion.accordion-products a[data-bs-toggle="collapse"][aria-expanded="true"] {
    color: var(--primary-dark);
    font-weight: 800;
}

.accordion.accordion-products > div {
    padding: 10px 20px 20px 20px;
    background: var(--semantic-white);
}

.accordion.accordion-products li::marker {
    color: var(--primary);
    font-weight: bold;
}

.side-widget-products li {
    padding-left: 0;
    padding-right: 15px;
}

.side-widget-products .link-with-icon {
    display: flex;
    align-items: center;
    text-decoration: none;
}

.side-widget-products .icon svg {
    display: block;
}

@media (max-width: 767px) {

    .carousel-video-gallery .carousel-inner .carousel-item > div {
        display: none;
    }

        .carousel-video-gallery .carousel-inner .carousel-item > div:first-child {
            display: block;
        }

}

.carousel-video-gallery .carousel-inner .carousel-item.active,
.carousel-video-gallery .carousel-inner .carousel-item-next,
.carousel-video-gallery .carousel-inner .carousel-item-prev {
    display: flex;
}

@media (min-width: 768px) {

    .carousel-video-gallery .carousel-inner .carousel-item-end.active,
    .carousel-video-gallery .carousel-inner .carousel-item-next {
        transform: translateX(33.333333%);
    }

    .carousel-video-gallery .carousel-inner .carousel-item-start.active,
    .carousel-video-gallery .carousel-inner .carousel-item-prev {
        transform: translateX(-33.333333%);
    }

}

.carousel-video-gallery .carousel-inner .carousel-item-end,
.carousel-video-gallery .carousel-inner .carousel-item-start {
    transform: translateX(0);
}

.carousel-video-gallery .carousel-control-prev {
    width: auto;
}

.carousel-video-gallery .arrow-left {
    border: solid #000;
    border-width: 0 0 4px 4px;
    transform: rotate(45deg);
    display: inline-block;
    padding: 10px;
}

.carousel-video-gallery .carousel-control-next {
    width: auto;
}

.carousel-video-gallery .arrow-right {
    border: solid #000;
    border-width: 0 4px 4px 0;
    transform: rotate(-45deg);
    display: inline-block;
    padding: 10px;
}

.slideTitle {
    display: block;
    width: 100%;
    background: var(--semantic-black);
    color: var(--semantic-white);
    text-align: center;
    text-decoration: none;
    text-transform: uppercase;
}

.modal.modal-video .modal-header .btn-close {
    position: relative;
}

.modal.modal-video .modal-body {
    display: flex;
    align-items: stretch;
    justify-content: stretch;
    height: 224px;
}

.modal.modal-video video {
    width: 100%;
    height: 100%;
}

@media (min-width: 768px) {
    .carousel-video-gallery .carousel-item {
        padding-right: 60px;
        padding-left: 60px;
    }

    .carousel-control-prev {
        left: -20px;
    }

    .carousel-control-next {
        right: -20px;
    }

    .modal.modal-video .modal-body {
        height: 280px;
    }
}

@media (min-width: 1024px) {
    .modal.modal-video .modal-body {
        height: 449px;
    }
}

.floating-contact {
    position: fixed;
    right: 0;
    bottom: 0;
    padding: 10px;
    width: 100%;
    z-index: 1000;
}

@media (min-width: 768px) {
    .floating-contact {
        width: 200px;
    }
}

/* modal */
.marketing-announcement .form-check {
    display: flex;
    align-items: start;
    gap: 10px;
    padding-bottom: 10px;
}

    .marketing-announcement .form-check input[type=checkbox] {
        margin-top: 5px;
    }
