/* GRAY & BLUE THEME */
/* BEGIN HEADER */

/*HEADER BG COLOR */
.rsc-header-background-color {
    color: #222222 !important;
    background: #FFFFFF !important;
}

/* (logged out) Log in link text color and SVG color, (logged in) user name text color and SVG color + separator color */
.rsc-login-link a,
.rsc-header svg,
.rsc-login-link .truncate,
.rsc-login-link span:after {
    color: #0067C5 !important;
    fill: #0067C5 !important;
}


/* Bottom header full BG color */
/* NAV BAR COLOR TRANSLATED INTO RGB for first two; CONTACT US BG COLOR translated into RGB for last two */
.rsc-lower-header {
    background: linear-gradient(90deg, rgba(50, 98, 149, 1) 0%, rgba(50, 98, 149, 1) 49%, rgba(11, 58, 93, 1) 51%, rgba(11, 58, 93, 1) 100%);
}

/* Nav area (left)*/
/* Nav area BG and font color */
.rsc-navbar-background-color {
    background-color: #326295;
    /* NAV BAR COLOR */
    color: #FFFFFF;
    /* NAV BAR FONT COLOR */
}

/* Schedule appointment + Return to my plan text and SVG color*/
.rsc-header .rsc-lower-header-inner.rsc-navbar-background-color a.rsc-link-schedule,
.rsc-header .rsc-lower-header-inner.rsc-navbar-background-color a.rsc-link-schedule svg,
.rsc-header .rsc-lower-header-inner.rsc-navbar-background-color a.rsc-link-return-to-plan,
.rsc-header .rsc-lower-header-inner.rsc-navbar-background-color a.rsc-link-return-to-plan svg {
    color: #FFFFFF !important;
    fill: #FFFFFF !important;
}

/* Contact/search area (right)*/
/* Contact/search BG and font color */
.rsc-navbarRight-background-color {
    color: #FFFFFF;
    background: #0B3A5D;
}

/* Contact/search hover BG color*/
.rsc-lower-header a.rsc-link-contact-us:hover,
.rsc-lower-header a.rsc-link-contact-us:focus,
.rsc-lower-header a.rsc-link-search:hover,
.rsc-lower-header a.rsc-link-search:focus {
    background: #0072CF;
    /* CONTACT AND SEARCH HOVER COLORS */
}

/* Contact/search link text and SVG color */
.rsc-lower-header a.rsc-link-contact-us svg,
.rsc-lower-header a.rsc-link-contact-us,
.rsc-lower-header a.rsc-link-search svg,
.rsc-lower-header a.rsc-link-search {
    color: #FFFFFF !important;
    fill: #FFFFFF !important;
}

/* On hover, Contact/search link text and SVG color (comment out if it doesn't change on hover) */
/* .rsc-lower-header a.rsc-link-contact-us:hover svg, 
.rsc-lower-header a.rsc-link-contact-us:focus svg,
.rsc-lower-header a.rsc-link-contact-us:hover span, 
.rsc-lower-header a.rsc-link-contact-us:focus span,
.rsc-lower-header a.rsc-link-search:hover svg, 
.rsc-lower-header a.rsc-link-search:focus svg {
  fill: #FFFFFF !important;
  color: #FFFFFF !important;
}  */

@media screen and (max-width: 650px) {

    /* Mobile - (logged in) when dropdown activated: BG color of dropdown */
    .rsc-login-link.active,
    ul.header-profile-panel {
        background: #326295;
    }

    /* Mobile - (logged in) when dropdown activated: link text, SVG, and text color + dropdown link text color */
    .rsc-login-link.active a,
    .rsc-login-link.active .truncate,
    .rsc-login-link.active .username-inner svg,
    .rsc-login-link.active .username-inner a.active svg,
    .header-profile-panel.active a {
        color: #FFFFFF !important;
        fill: #FFFFFF !important;
    }

    /* Mobile - return to plan SVG hover bg color */
    a.rsc-link-return-to-plan svg:hover,
    a.rsc-link-return-to-plan svg:focus {
        background: #0B3A5D;
    }

}

@media screen and (max-width: 550px) {

    /* Mobile - Schedule SVG hover bg color */
    a.rsc-link-schedule svg:hover,
    a.rsc-link-schedule svg:focus {
        background: #0B3A5D;
    }

}

/* END HEADER */

/* BEGIN FOOTER */
/* Footer BG and font color */
.nw-footer {
    background-color: #F0F0EE;
    color: #222222;
}

/* Footer link text color */
.nw-footer a,
.nw-footer a:visited,
.nw-footer a:active {
    color: #222222 !important;
}

/* Footer social SVG color */
.nw-footer .nw-footer__social svg {
    fill: #979797;
}

/* Footer social SVG hover color */
.nw-footer__social a:hover svg,
.nw-footer__social a:focus svg {
    fill: #0067C5 !important;
}

/* mobile app and broker check icon hover BG color */
.nw-footer__third-party a:hover,
.nw-footer__third-party a:focus,
.nw-footer__third-party a:active {
    background-color: rgba(255, 255, 254, .25) !important;
}

/* END FOOTER */