<style>
       
        :root{
        --rhb2b-med-blue: rgb(98,156,177);
        --rhb2b-light-blue: rgb(225,255,255);
        --rhb2b-bright-green: rgb(107, 246, 213);
        --rhb2b-gradient-blue: rgba(228, 255, 255, 0);
        --rhb2b-light-gray: rgb(236, 235, 234);
    }

    
    .rhb2b-language-selector {
      display: flex;
      justify-content: center;
    }

    /**** ------------   SITE WIDE  --------------- ****/
    .header-content {
        margin-bottom: 0px !important;
        background-color: rgb(255,255,255) !important;
        z-index:9999;
    }
    @media screen and (min-width: 1024px){
        .header-search .suggestions-combobox-container{
            max-width: 400px !important;
        }
    }
    .footer_dark{
        background-color: var(--rhb2b-med-blue )!important;
    }
    .footer_light{
        margin-top: auto !important;
        background-color: var(--rhb2b-light-blue ) !important;;
    }
    .footer-link{
        color: var(--com-c-link-list-anchor-text-color) !important;
    }
    footer, .footer{
        margin: 0px !important;
        padding: 0px !important;
        width: 100% !important;
        max-width: none !important; 
      
    }
    .footer_gradient{
        background-image: linear-gradient(180deg, rgba(228, 255, 255, 0), rgba(228, 255, 255, 1) ) !important;
    }
 
   .brands-logo-size{
      width: auto;
      height: 48px !important;
    }
    .brands-logo-size2{
      width: auto;
      height: 42px !important;
    }
    
    .input-search-button{
        border-radius: 16px !important;
        padding: 4px 8px !important;
        margin-left: -16px !important;
        border-color: var(--dxp-g-brand) !important;
    }
    .input-search-button .slds-icon{
        fill: var(--dxp-g-brand) !important;
    }    
    .input-search-button:hover .slds-icon{
        fill: #FFFFFF !important;
    }    

    .component-wrapper-spacer{
        background-color: #FFFFFF !important;
    }

    .custom-text-heading_x-large{
        font-size: var(--dxp-s-text-heading-medium-font-size);
        font-family: var(--dxp-s-text-heading-medium-font-family);
        font-weight: var(--dxp-s-text-heading-medium-font-weight);
    }
    
    .custom-profile-menu .slds-icon{
        fill: var(--dxp-g-brand) !important;
    }
    
    .custom-primary-button-color{
        color: var(--dxp-s-button-color) !important;
    }
    .article-column-container .cb-outputRichText-container{
        display: flex !important;
    }
    .article-card-wrapper{
        height: 100% !important;
    }
    .learn-more-button{
        position: absolute;
        left:    0;
        bottom:   0;
    }
    
    .slds-button_neutral{
        color: var(--dxp-g-brand) !important;
    }
    .slds-button_neutral:hover{
        color: var(--rhb2b-bright-green) !important;
    }

    .slds-button_outline-brand{
        color: var(--dxp-g-brand) !important;
        border-color: var(--dxp-g-brand) !important;
    }
    .slds-button_outline-brand:hover{
        color: var(--dxp-g-brand) !important;
        background-color: var(--rhb2b-light-gray) !important;
    }

    .slds-tabs_default__item
    {
        font-size: var(--dxp-s-text-heading-small-font-size) !important;
    }
    @media screen and (min-width: 768px){
        .custom-text-heading_x-large{
            font-size: var(--dxp-s-text-heading-large-font-size);
            font-family: var(--dxp-s-text-heading-large-font-family);
            font-weight: var(--dxp-s-text-heading-large-font-weight);
        }
        .custom-large-button{
            font-size: var(--dxp-s-button-large-font-size);
            border-radius: var(--dxp-s-button-large-radius-border);
        }
    }
    @media screen and (min-width: 1024px){
        .custom-text-heading_x-large{
            font-size: var(--dxp-s-text-heading-extra-large-font-size);
            font-family: var(--dxp-s-text-heading-extra-large-font-family);
            font-weight: var(--dxp-s-text-heading-extra-large-font-weight);
        }
        .custom-large-button{
            font-size: var(--dxp-s-button-large-font-size);
            border-radius: var(--dxp-s-button-large-radius-border);
        }
    }    
    /**** ------------   Login Layout   --------------- ****/
    .custom-login-container{
        min-height: 100vh;
        background-image: linear-gradient(180deg, rgba(228, 255, 255, 0), rgba(228, 255, 255, 1) ); 
    }
    .custom-login-card{
        background-color: #FFF;
        border-radius: 16px;
        border-color: rgba(182,189,200,0.15);
        box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1);
        margin-top: 32px;
        margin-bottom: 32px;
        margin-left: 16px;
        margin-right: 16px;    
    }
    .login_footer{
        margin-top: auto;   
    }
    
    .register-brands{
      min-height: 420px;
      background: url('/sfsites/c/resource/Landscape');
      background-repeat: no-repeat;
      background-position: right;
    }
    
    @media screen and (min-width: 768px){
        .custom-login-card{
            min-width: 350px;
            max-width: 4840px; 
            margin-left: auto;
            margin-right: auto;    
        }
    }
    @media screen and (min-width: 1024px){
        .register-container{
            min-height: 520px;
        }
        .custom-login-card{
            background-color: #FFF;
            border-radius: 30px;
            border-color: rgba(182,189,200,0.15);
            box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1);
            min-width: 350px;
            max-width: 484px;
            margin-top: 72px;
            margin-bottom: 72px;
        }
    }
    /**** ------------   NAVIGATION   --------------- ****/
    .main_menu nav {
        font-weight: 500 !important;
        justify-content: left !important;
        
        background-color: var(--dxp-g-brand) !important;
        color: #FFF !important;
    }
    .main_menu nav ul.comm-drilldown-navigation__bar {
        background-color: var(--dxp-g-brand) !important;
        color: #FFF !important;
    }
    .main_menu nav ul.slide-down li{
        width: 100%;
    }

    .main_menu nav ul.comm-drilldown-navigation__bar li a, .main_menu nav ul.comm-drilldown-navigation__bar li button {
        background-color: var(--dxp-g-brand) !important;;
        color: #FFF !important;
        font-weight: 500 !important;
    }
    .main_menu nav ul.slide-down li a, .main_menu nav ul.slide-down li button {
        background-color: var(--dxp-s-dropdown-color-background) !important;
        color: #000 !important;
        font-size: 20px;
    }
    .main_menu nav ul.slide-down {
        background-color:  var(--dxp-s-dropdown-color-background)  !important;;
        color: #000 !important;
    }
    
    .main_menu nav ul.comm-drilldown-navigation__bar li a:hover, .main_menu nav ul.comm-drilldown-navigation__bar li button:hover {
        background-color: var(--dxp-g-brand) !important;
        color:  var(--dxp-s-button-color) !important;
    }
    .main_menu nav ul.slide-down li a:hover, .main_menu nav ul.slide-down li button:hover {
        background-color: var(--dxp-g-brand) !important;
        color:  var(--dxp-s-button-color) !important;
    }
    
    .custom-profile-menu .menu-button{
        padding: 4px;
    }

    .custom-profile-menu ul.user-profile-menu-list li a:hover{
        background-color: var(--dxp-g-brand) !important;
        color:  var(--dxp-s-button-color) !important;
    }
    
    @media screen and (min-width: 1024px){
        .main_menu nav {
            font-size: 30px;
            font-weight: 500 !important;
            justify-content: left !important;
        }
        .main_menu nav ul.comm-drilldown-navigation__bar {
            margin-left: 70px;
        }
        .main_menu nav ul.comm-drilldown-navigation__bar li {
            margin-right: 40px;
        }

    }
    

    /**** ------------   HOME HERO - AUTOSHIP   --------------- ****/
    .home{
        max-height: 500px;
        background-image: linear-gradient(180deg, rgba(228, 255, 255, 0), rgba(228, 255, 255, 1) );
        padding-bottom: 25px;
    }
    .home-autoship{
        background-color: var(--dxp-g-brand);
        box-sizing: border-box;
        padding: 0 15px 15px 15px;
        position: relative;
    }
    .home-intro{
        margin-left: 10px;
        margin-right: 10px;
        z-index: 999;
    }
    .h-cta-img{
      height: auto;
      width: 100%;      
    }
    .h-cta-p{
      height: 75px;
    }
    .h-a-link{
        color: #FFFFFF !important;
        text-decoration: underline !important;
    }
    @media screen and (min-width: 768px){
        .home{
            min-height: 285px;
        }
        .h-cta-img{
           max-width: 426px;
        }
        .h-a-img{
           position:absolute;
           left: -20px;
           top: -50px;
           max-width: 250px;
           margin-left: 35px !important;   
        }
    }
    @media screen and (min-width: 1024px){
        .home-intro{
            margin-left: 70px;
        }
        .home-img{
            max-height: 500px;
        }
        .h-cta-box{
          height: 480px;
          border-radius: 30px;
          border-color: rgba(182,189,200,0.15);
          background-color: rgba(182,189,200,0.15);
          box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1);
          box-sizing: border-box;
          margin: 0 30px;
        }
        .h-cta-img{
          height: 236px;
          width: auto;
        }
        .h-a-img{
           position:absolute;
           left: -20px;
           top: -110px;
           max-width: 426px;
           margin-left: 70px !important;   
        }
    }
    /**** ------------   HOME RESOURCES   --------------- ****/

    .resources{
        margin: 0;
        padding: 0;
        background-image: radial-gradient(80.88% 1405.15% at 8.91% 33.88%, rgba(252, 206, 121, 0.15) 0%, rgba(252, 225, 170, 0.1065) 100%);
        border-radius: 0px;
        box-shadow: none;
    }
    .resources-img{
        max-height: 80px;  
    }
    @media screen and (min-width: 768px){
        .resources{
          margin: 30px 35px 30px 35px;
          background-image: radial-gradient(80.88% 1405.15% at 8.91% 33.88%, rgba(252, 206, 121, 0.15) 0%, rgba(252, 225, 170, 0.1065) 100%);
          border-radius: 15px;
          box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1);
        }
    }
    @media screen and (min-width: 1024px){
        .resources{
          margin: 60px 70px;
          background-image: radial-gradient(80.88% 1405.15% at 8.91% 33.88%, rgba(252, 206, 121, 0.15) 0%, rgba(252, 225, 170, 0.1065) 100%);
          border-radius: 30px;
          box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1);
        }
    }

    /**** ------------   HOME REFRESH   --------------- ****/
    .refresh{
      background: url('/sfsites/c/resource/WomanOnCouchFlipped');
      background-repeat: no-repeat;
      background-position: center;
      background-size: cover;
      border-radius: 20px;
      margin: 16px;
    }
    .refresh-btn-arrow{
        height: 32px;
        float: right;
    }
    .refresh-btn-r{
        background-color: #ffffff;
        background-color: rgba(255,255,255,0.8);
        border-color: #ffffff;
        border-radius: 16px;
        box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.1);
        color: #193767;
        max-width: 100%;
    }

    .refresh-asterisk{
        height: 32px;
        float: left;
        padding-right: 5px;
    }
    @media screen and (min-width: 768px){
         .refresh-asterisk{
           height: 64px;
           float: left;
            padding-right: 5px;
        }
        .refresh{
          margin: 0px 35px 0 35px;
        }
        .refresh-btn-r{
            border-radius: 16px;
        }
        .refresh-btn-arrow{
            height: auto;
        }
        .refresh-btn-h{
            font-size: 30px !important;
            font-family: var(--dxp-s-text-heading-medium-font-family);
            font-weight: var(--dxp-s-text-heading-medium-font-weight);
        }
        .refresh-btn-p{
          font-size: 24px !important;
        }
    }
    
    @media screen and (min-width: 1024px){
        .refresh-asterisk{
            float: left;
            padding-right: 10px;
        }
        .refresh{
          
        }
        .refresh-btn-h{
          font-size: 30px !important;
          font-weight: 700 !important;
        }
        .refresh-btn-p{
          font-size: 24px !important;
        }
        .refresh-btn-r{
            border-radius: 30px;
         }

    }
    /**** ------------   TILE MENUS   --------------- ****/
    .comm-tile-menu__item{
        height: 280px !important;        
    }    

    .comm-tile-menu__item-title{
        background-color: var(--rhb2b-bright-green) !important;
        font-weight: bold !important;
        color:  var(--dxp-g-brand) !important;
    }
    .comm-tile-menu__item-image{
        height: 216px !important;
    }
    .comm-tile-menu__item-title:hover{
        text-decoration: underline;
    } 
    @media screen and (min-width: 768px){   
        .comm-tile-menu__item{
            margin: 0 32px !important;
        }                
    }
    @media screen and (min-width: 1024px){
        .comm-tile-menu__item{
            margin: 44px !important;
        }
    }

    /**** ------------   Category Results - PLP Overrides   --------------- ****/
    .category-results .callToActionButton{
        margin-left: 16px;
    }
    
    /**** ------------   My Support Cases   --------------- ****/
    .support-case-header-container .columns-content{
        border-bottom-style: solid;
        border-bottom-color: var(--dxp-g-brand) !important;
        border-width: 2px !important;
        background-color: var(--dxp-s-dropdown-color-background) !important;
        padding: 8px 16px !important;
    }
    .support-case-row .columns-content{
        border-bottom-style: solid;
        border-bottom-color: var(--dxp-g-brand) !important;
        border-width: 1px !important;        
        padding: 8px !important;
    }
    .support-case-header-block{
    }
    .custom-caseitem-mobile{
        border-bottom-style: solid;
        border-bottom-color: var(--dxp-g-brand) !important;
        border-width: 1px !important;        
        padding: 8px !important;        
    }
    
    
</style>