:root {
    /* BREAKPOINTS */
    --breakpoint-small: 640;
    --breakpoint-medium: 768;
    --breakpoint-large: 960;
    --breakpoint-x-large: 1200;
    --breakpoint-wide: 1440;

    /* SECTION HEIGHTS */
    --theme-section-height-xs: 300px;
    --theme-section-height-s: 420px;
    --theme-section-height-m: 560px;
    --theme-section-height-l: 640px;
    --theme-section-height-xl: 720px;
    --theme-section-height-xxl: 960px;

    --theme-section-height-xs-m: 300px;
    --theme-section-height-s-m: 420px;
    --theme-section-height-m-m: 560px;
    --theme-section-height-l-m: 640px;
    --theme-section-height-xl-m: 720px;
    --theme-section-height-xxl-m: 960px;

    --theme-section-height-xs-s: 300px;
    --theme-section-height-s-s: 420px;
    --theme-section-height-m-s: 560px;
    --theme-section-height-l-s: 640px;
    --theme-section-height-xl-s: 720px;
    --theme-section-height-xxl-s: 960px;

    --theme-section-height-viewport: 100vh;
    --theme-section-height-auto: auto;


    /* THEME COLORS */
    /* Medium Blue */
    --theme-primary-color: rgba(33, 152, 220, 1.0);
    --theme-primary-color-hover: rgba(33, 152, 220, 1.0);
    
    /* Dark Blue */
    --theme-secondary-color: rgba(0, 50, 79, 1.0);
    
    /* Red */
    --theme-accent-color: rgba(215, 9, 7, 1.0);
    
    /* Content Color */
    --theme-body-color: rgba(77, 80, 84, 1.0);

    /* COLORS */
    --black: #111;
    --blue-100: #f3f9fe;
    --blue-200: #8fbbe6;
    --blue-400: #2e669e;
    --focus: #3a58fc;
    --gray-100: #f5f5f5;
    --gray-200: #eaeaea;
    --gray-300: #ddd;
    --gray-400: #ccc;
    --gray-500: #767676;
    --gray-600: #575a5d;
    --green-100: #daf5eb;
    --green-200: #bbe1d3;
    --green-400: #0a7448;
    --red-100: #fbe3e3;
    --red-200: #f9c4c7;
    --red-400: #b13138;
    --transparent: transparent;
    --yellow-100: #f8f8e1;
    --yellow-200: #e6e086;
    --yellow-400: #65602e;
    --white: #fff;

    /* BUTTON HOVER COLORS */
    --black--tinted: #4d4d4d;
    --blue-400--shaded: #234d77;
    --gray-100--shaded: #b8b8b8;
    --gray-200--shaded: #b0b0b0;
    --gray-300--shaded: #a6a6a6;
    --gray-400--tinted: #d9d9d9;
    --gray-500--shaded: #595959;
    --gray-600--shaded: #414446;
    --green-400--shaded: #085736;
    --red-400--shaded: #85252a;
    --yellow-400--shaded: #4c4823;
    --white--shaded: #f5f5f5;


    /* DEFAULTS */
    --default-border-radius: 0.25rem;
    --default-border-width: 1px;
    --default-content-width: 96rem;
    --default-font-size: var(--paragraph-small);
    --default-input-font-size: 0.875rem;
    --default-line-height: 1.8;
    --default-spacing-unit: 1rem;

    /* BORDER RADIUS */
    --xsmall-border-radius: 0.5rem;
    --small-border-radius: 0.625rem;
    --medium-border-radius: 0.75rem;
    --large-border-radius: 1rem;
    --xlarge-border-radius: 1.25rem;

    --default-site-width: 100vw;
    --default-wrapper-width: 100rem;
    --half-column-max-width: calc(var(--default-wrapper-width) * 0.5);
    --one-quarter-max-width: calc(var(--default-wrapper-width) * 0.2825);
    --three-quarter-max-width: calc(var(--default-wrapper-width) * 0.6750);


   /* TYPOGRAPHY */
    --font-ultra-light: 100;
    --font-light: 200;
    --font-book: 300;
    --font-regular: 400;
    --font-medium: 500;
    --font-semibold: 600;
    --font-bold: 700;
    --font-black: 900;
    --message-one: 0.75rem;

    --primary-font-family: "Nunito", "Helvetica", "Arial", sans-serif;
    --secondary-font-family:"Nunito", "Helvetica", "Arial", sans-serif;
    --accent-font-family: "Apple Garamond", "Baskerville", "Times New Roman", "Droid Serif", "Times", "Source Serif Pro", serif;

    --font-awesome-family: "Font Awesome 6 Pro";
    
    
    --display-one: clamp(2.675rem, 1.467rem + 3.913vw, 5rem);
    --display-two: clamp(2.25rem, 1.467rem + 3.913vw, 4.5rem);
    --display-three: clamp(1.875rem, 1.24rem + 2.174vw, 3.25rem);
    --title-one: clamp(1.75rem, 1.428rem + 1.609vw, 2.675rem);
    --title-two: clamp(1.5rem, 1.283rem + 1.087vw, 2.125rem);
    --title-three: clamp(1.125rem, 0.995rem + 0.652vw, 1.5rem);
    --title-four: clamp(1rem, 0.913rem + 0.635vw, 1.35rem);
    --paragraph-large: clamp(1rem, 1.467rem + 3.913vw, 1.125rem);
    --paragraph-medium: clamp(0.925rem, 1.467rem + 3.913vw, 1rem);
    --paragraph-small: clamp(0.875rem, 1.467rem + 3.913vw, 0.925rem);

    --subheading-large: clamp(1rem, 0.913rem + 0.435vw, 1.25rem);
    --subheading-medium: clamp(0.925rem, 0.913rem + 0.435vw, 1.125rem);
    --subheading-small: clamp(0.875rem, 1.467rem + 3.913vw, 0.975rem);
    --subheading-x-small: clamp(0.875rem, 1.467rem + 3.913vw, 1rem);

    /* CAROUSEL */
    --default-carousel-nav-color-light: rgba(255,255,255,1.0);
    --default-carousel-nav-color-dark: rgba(0,0,0,1.0);

    --default-carousel-dots-color-light: rgba(255,255,255,1.0);
    --default-carousel-dots-color-dark: rgba(0,0,0,1.0);

    /* REVEAL */
    --reveal-dur: .6s;
    --reveal-ease: cubic-bezier(.22,.61,.36,1);


    /* CHH SITE COLORS */
}

.u-border-top-gray-300{
    border-top:solid 1px var(--gray-300);
}
.u-border-top-gray-400{
    border-top:solid 1px var(--gray-400);
}
.u-border-top-gray-500{
    border-top:solid 1px var(--gray-500);
}
.u-border-top-gray-600{
    border-top:solid 1px var(--gray-600);
}

.chh-have-questions{
    display:block;
    padding:1.5rem;
}
.chh-have-questions span{
    display:block;
    font-size:1.25rem;
    line-height:1.2;
    font-weight:700;
    color:var(--theme-secondary-color);
}
.chh-have-questions span a{
    color:var(--theme-primary-color);
    text-decoration:none;
}


.chh-gray-box {
  background-color: #f2f2f2;
  border-left: 4px solid var(--theme-primary-color);
  margin-bottom: 16px;
}

.chh-gray-box-inner {
  display: flex;
  flex-direction: column;
  padding: 24px 24px 24px 20px;
}

.chh-gray-box-heading {
  display: block;
  font-size: 0.75rem;
  font-weight:700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  margin-bottom: 3px;
  color:var(--theme-primary-color);
}

.chh-gray-box-subheading {
  display: block;
  font-size: 1.1rem;
   font-weight:700;
  margin-bottom: 16px;
  color:var(--theme-secondary-color);
}

/* Table */
.chh-gray-box-table {
  border-collapse: collapse;
}

.chh-gray-box-table td {
  padding: 2px 24px 2px 0;
  vertical-align: top;
}

/* List */
.chh-gray-box-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.chh-gray-box-list li {
  padding: 2px 0;
  color:var(--theme-primary-color);
}

.chh-gray-box-list li a{
    color:var(--theme-primary-color);
}
.chh-gray-box-list li a:hover{
    color:var(--theme-secondary-color);
}
.chh-gray-box-list li::before{
  content: '→';
  margin-right: 8px
}


/* Label */
#chh_contact_form .mmx-form-label {
  display: block;
  font-size: 0.7rem;
  font-weight: 700;
  color:var(--theme-secondary-color);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  margin-bottom: 6px;
}

/* Inputs & textarea */
#chh_contact_form .mmx-form-input,
#chh_contact_form .mmx-form-textarea {
  display: block;
  width: 100%;
  padding: 10px 14px;
  border: 1px solid #c8d4e0;
  border-radius: 4px;
  font-size: 0.95rem;
  box-sizing: border-box;
  background-color:rgba(245, 245, 245, 1);
  transition: border-color 0.2s ease;
}

#chh_contact_form .mmx-form-input:focus,
#chh_contact_form .mmx-form-textarea:focus {
  outline: none;
  border-color: #0099cc;
}

#chh_contact_form .mmx-form-textarea {
  min-height: 120px;
  resize: vertical;
}


#chh_contact_form .mmx-form-select {
  border: 1px solid #c8d4e0;
    border-radius: 4px;
  background-color: rgba(245, 245, 245, 1);
  transition: border-color 0.2s ease;
}

#chh_contact_form .mmx-form-select__dropdown {
  border: none;
  background: transparent;
  font-size: 0.95rem;
}

#chh_contact_form .mmx-form-select:focus-within {
  border-color: #0099cc;
  outline: none;
}

/* Submit button */
#chh_contact_form .mmx-form-submit-button {
  display: block;
  width: 100%;
  padding: 14px;
  font-size: 0.85rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  transition: background-color 0.2s ease;
}


.o-category-sub-header-wrapper{
    
}
.sub-category-container{
    
}
.sub-category-container-inner{
    padding:0.5rem 1.5rem;
}

.sub-category-buttons-container{
    padding:0.75rem 0 0 0;
}
.sub-subcategory-button{
    margin-top:0.5rem;
    margin-bottom:0.5rem;
}

.sub-subcategory-button-spacer{
   display:inline-block;
    width:0.5rem;
    height:0.5rem;
    margin:0;
    padding:0;
}



.video-wrapper {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 aspect ratio */
    height: 0;
    overflow: hidden;
}

.video-wrapper iframe,
.video-wrapper video,
.video-wrapper embed,
.video-wrapper object {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


/* ==========================================================================
   SITE FONTS / COLORS
   ========================================================================== */

/*** Fonts ***/
html,
body{
 color: var(--theme-body-color);
}

body,
.o-site-wrapper {
}


body.has-active-navigation { overflow-x: hidden; }
main{
    /* transition: filter 500ms ease-in; */
}
main:after{
   transition: background-color 500ms ease-in;
    content:'';
    display:none;
    
    position:absolute;
    z-index:15;
    top:0;
    left: 50%;
    transform: translateX(-50%);
    width: 100vw;
    
    height:100vw;
    
    background-color:rgba(0,0,0,0.7);
    
}
.has-active-navigation main {
  /* filter: blur(4px); */
}
.has-active-navigation main:after{
    display:block;
}

.mm-theme-typography-display-one,
.mm-theme-typography-display-two,
.mm-theme-typography-display-three,
.mm-theme-typography-title-one,
.mm-theme-typography-title-two,
.mm-theme-typography-title-three,
.mm-theme-typography-title-four,
.mm-theme-typography-subheading-large,
.mm-theme-typography-subheading-small,
.mm-theme-typography-subheading-extra-small
.mm-theme-typography-paragraph-large,
.mm-theme-typography-paragraph-small,
.mm-theme-typography-paragraph-extra-small,
.mm-theme-typography-price-large,
.mm-theme-typography-price-extra-small,
.mm-theme-typography-additional-price-large,
.mm-theme-typography-additional-price-extra-small,
.mm-theme-typography-discount-extra-small
{
	font-family:var(--primary-font-family) !important;
}

h1.mm-theme-typography-title-two{
    padding-top:1.5rem;
}
/*** Colors ***/
.u-bg-primary,
.c-color--primary-background{
    background-color:var(--theme-primary-color);
}
.u-color-primary,
.c-color--primary{
    color:var(--theme-primary-color);
}
.u-bg-secondary,
.c-color--secondary-background{
    background-color:var(--theme-secondary-color);
}
.u-color-secondary,
.c-color--secondary{
    color:var(--theme-secondary-color);
}
.u-bg-accent,
.c-color--accent-background{
    background-color:var(--theme-accent-color);
}
.u-color-accent,
.c-color--accent{
    color:var(--theme-accent-color);
}


/* PAGEWRAPPER
   =========================================== */
html.mm-background .mm-page,
#pagewrapper{
}

/* FULL-WIDTH PAGES
   =========================================== */
.t-page-sfnt .t-main-content-element,
.t-page-fullwidth .t-main-content-element{
    width: 100%;
    max-width: 100%;
    padding-left:0px;
    padding-right:0px;
}
@media screen and (min-width: 48em) {
    .t-page-sfnt .t-main-content-element,
    .t-page-fullwidth .t-main-content-element{
    }
    
}
@media screen and (min-width: 60em) {
    .t-page-sfnt .t-main-content-element,
    .t-page-fullwidth .t-main-content-element{
    }
}
.o-wrapper--fullwidth{
    width: 100%;
    max-width: 100%;
}
.t-main-content-element {
    border-top:var(--default-border-width) solid var(--gray-200);
}
@media screen and (min-width: 60em) {
  .t-main-content-element {
    }
body:not(.t-page-fullwidth) .t-main-content-element {
    }
}

#messages .x-messages{
    margin-top:1rem;
}

.x-breadcrumbs {
  margin:0.5rem 0;  
}
@media (min-width: 60em) {
    .x-breadcrumbs {
    }
}

.x-breadcrumbs__list {
    border-bottom: 0 none;
    color: var(--theme-body-color);
    display: flex;
    flex-wrap: wrap;
    font-size: var(--message-one);
    gap: 0.5em 0;
    line-height: inherit;
    list-style: none;
    margin-bottom: 0;
    margin-left: auto;
    margin-right: auto;
    max-width: var(--default-wrapper-width);
    padding-left: 0;
    padding-right:0;
    padding-top: 0rem;
}

html,
body,
.c-font--primary{
    font-family: var(--primary-font-family);
}
.c-font--secondary{
    font-family: var(--secondary-font-family);
}
.c-font--accent{
    font-family: var(--accent-font-family);
}


.c-font--awesome{
    font-family: var(--font-awesome-family);
}


/* ==========================================================================
   MARKDOWN STYLES
   ========================================================================== */
.u-markdown h1,
.mm-theme-typography-title-one{
  font-size: var(--display-two);
  font-weight: var(--font-bold);
  line-height: calc(var(--display-two) * 1.2);
}

.u-markdown h2,
.mm-theme-typography-title-two{
  font-size: var(--display-three);
  font-weight: var(--font-bold);
  line-height: calc(var(--display-three) * 1.08);
}

.u-markdown h3,
.mm-theme-typography-title-three{
  font-size: var(--title-one);
  font-weight: var(--font-bold);
  line-height: calc(var(--title-one) * 1.2);
}

.u-markdown h4,
.mm-theme-typography-title-four{
  font-size: var(--title-two);
  line-height: calc(var(--title-two) * 1.25);
}

.u-markdown h5,
.mm-theme-typography-title-five{
  font-size: var(--title-three);
  line-height: calc(var(--title-three) * 1.33);
}

.u-markdown h6,
.mm-theme-typography-title-six{
  font-size: var(--title-four);
  line-height: calc(var(--title-four) * 1.4);
}

.c-heading-alpha.c-heading-hero{
font-size:clamp(3.25rem, calc(0.758rem + 8.977vw), 6.5rem);
margin-bottom:1.25rem;
}
.c-heading-foxtrot.c-subheading-hero{
font-size:clamp(0.775rem, calc(0.685rem + 0.545vw), 1.5rem);
margin-bottom:1.25rem;
}
/* ICON IMAGE WIDTHS
   =========================================== */
.u-image-width--xs,
.u-image-width--xs > img{
    min-width:64px;
    max-width:64px;
}
.u-image-width--s,
.u-image-width--s > img{
    min-width:96px;
    max-width:96px;
}
.u-image-width--m,
.u-image-width--m > img{
    min-width:128px;
    max-width:128px;
}
.u-image-width--l,
.u-image-width--l > img{
    min-width:156px;
    max-width:156px;
}
.u-image-width--xl,
.u-image-width--xl > img{
    min-width:192px;
    max-width:192px;
}

/* ICON IMAGE HEIGHTS
   =========================================== */
.u-image-height--xs,
.u-image-height--xs > img{
    min-height:64px;
    max-height:64px;
    object-fit: contain;
}
.u-image-height--s,
.u-image-height--s > img{
    min-height:96px;
    max-height:96px;
    object-fit: contain;
}
.u-image-height--m,
.u-image-height--m > img{
    min-height:128px;
    max-height:128px;
    object-fit: contain;
}
.u-image-height--l,
.u-image-height--l > img{
    min-height:156px;
    max-height:156px;
    object-fit: contain;
}
.u-image-height--xl,
.u-image-height--xl > img{
    min-height:192px;
    max-height:192px;
    object-fit: contain;
}


.o-layout--height-xs{
    height:var(--theme-section-height-xs);
}
.o-layout--height-s{
    height:var(--theme-section-height-s);
}
.o-layout--height-m{
    height:var(--theme-section-height-m);
}
.o-layout--height-l{
    height:var(--theme-section-height-l);
}
.o-layout--height-xl{
    height:var(--theme-section-height-xl);
}
.o-layout--height-xxl{
    height:var(--theme-section-height-xxl);
}
.o-layout--height-viewport{
    height:var(--theme-section-height-viewport);
}
.o-layout--height-auto{
    height:var(--theme-section-height-auto);
}
@media screen and (max-width: 959px) {
    .o-layout--height-xs-m{
        height:var(--theme-section-height-xs-m);
    }
    .o-layout--height-s-m{
        height:var(--theme-section-height-s-m);
    }
    .o-layout--height-m-m{
        height:var(--theme-section-height-m-m);
    }
    .o-layout--height-l-m{
        height:var(--theme-section-height-l-m);
    }
    .o-layout--height-xl-m{
        height:var(--theme-section-height-xl-m);
    }
    .o-layout--height-xxl-m{
        height:var(--theme-section-height-xxl-m);
    }
    .o-layout--height-viewport-m{
    height:var(--theme-section-height-viewport);
    }
}

@media screen and (max-width: 767px) {
.o-layout--height-xs-s{
    height:var(--theme-section-height-xs-m);
}
.o-layout--height-s-s{
    height:var(--theme-section-height-s-m);
}
.o-layout--height-m-s{
    height:var(--theme-section-height-m-m);
}
.o-layout--height-l-s{
    height:var(--theme-section-height-l-m);
}
.o-layout--height-xl-s{
    height:var(--theme-section-height-xl-m);
}
.o-layout--height-xxl-s{
    height:var(--theme-section-height-xxl-m);
}
.o-layout--height-viewport-s{
    height:var(--theme-section-height-viewport);
}
}


.o-layout--justify-start {
    justify-content: flex-start;
}
.o-layout--justify-end {
    justify-content: flex-end;
}
.o-layout--justify-evenly {
    justify-content: space-evenly;
}

.o-layout--xwide {
        column-gap: 3rem;
}

.order-first {
  order: -1 !important; }

.order-0 {
  order: 0 !important; }

.order-1 {
  order: 1 !important; }

.order-2 {
  order: 2 !important; }

.order-3 {
  order: 3 !important; }

.order-4 {
  order: 4 !important; }

.order-5 {
  order: 5 !important; }

.order-last {
  order: 6 !important; }

@media screen and (min-width: 48em) {
.o-layout--justify-start--m {
    justify-content: flex-start;
}

.o-layout--justify-center--m {
    justify-content: center;
}

.o-layout--justify-end--m {
    justify-content: flex-end;
}

.o-layout--justify-around--m {
    justify-content: space-around;
}

.o-layout--justify-between--m {
    justify-content: space-between;
}
.o-layout--justify-evenly--m {
    justify-content: space-evenly;
}
.order-first--m {
  order: -1 !important; }

.order-0--m {
  order: 0 !important; }

.order-1--m {
  order: 1 !important; }

.order-2--m {
  order: 2 !important; }

.order-3--m {
  order: 3 !important; }

.order-4--m {
  order: 4 !important; }

.order-5--m {
  order: 5 !important; }

.order-last--m {
  order: 6 !important; }
}
@media screen and (min-width: 60em) {
.o-layout--justify-start--l {
    justify-content: flex-start;
}

.o-layout--justify-center--l {
    justify-content: center;
}

.o-layout--justify-end--l {
    justify-content: flex-end;
}

.o-layout--justify-around--l {
    justify-content: space-around;
}

.o-layout--justify-between--l {
    justify-content: space-between;
}
.o-layout--justify-evenly--l {
    justify-content: space-evenly;
}
.order-first--l {
  order: -1 !important; }

.order-0--l {
  order: 0 !important; }

.order-1--l {
  order: 1 !important; }

.order-2--l {
  order: 2 !important; }

.order-3--l {
  order: 3 !important; }

.order-4--l {
  order: 4 !important; }

.order-5--l {
  order: 5 !important; }

.order-last--l {
  order: 6 !important; }
}
@media screen and (min-width: 75em) {
.o-layout--justify-start--xl {
    justify-content: flex-start;
}

.o-layout--justify-center--xl {
    justify-content: center;
}

.o-layout--justify-end--xl {
    justify-content: flex-end;
}

.o-layout--justify-around--xl {
    justify-content: space-around;
}

.o-layout--justify-between--xl {
    justify-content: space-between;
}
.o-layout--justify-evenly--xl {
    justify-content: space-evenly;
}
.order-first--xl {
  order: -1 !important; }

.order-0--xl {
  order: 0 !important; }

.order-1--xl {
  order: 1 !important; }

.order-2--xl {
  order: 2 !important; }

.order-3--xl {
  order: 3 !important; }

.order-4--xl {
  order: 4 !important; }

.order-5--xl {
  order: 5 !important; }

.order-last--xl {
  order: 6 !important; }

}

@media screen and (min-width: 90em) {
.o-layout--justify-start--w {
    justify-content: flex-start;
}

.o-layout--justify-center--w {
    justify-content: center;
}

.o-layout--justify-end--w {
    justify-content: flex-end;
}

.o-layout--justify-around--w {
    justify-content: space-around;
}

.o-layout--justify-between--w {
    justify-content: space-between;
}
.o-layout--justify-evenly--w {
    justify-content: space-evenly;
}


.order-first--w {
  order: -1 !important; }

.order-0--w {
  order: 0 !important; }

.order-1--w {
  order: 1 !important; }

.order-2--w {
  order: 2 !important; }

.order-3--w {
  order: 3 !important; }

.order-4--w {
  order: 4 !important; }

.order-5--w {
  order: 5 !important; }

.order-last--w {
  order: 6 !important; }
}


.u-text-ultra-light {
    font-weight: var(--font-ultra-light);
}
.u-text-light {
    font-weight: var(--font-light);
}
.u-text-book {
    font-weight: var(--font-book);
}
.u-text-regular{
    font-weight: var(--font-regular);
}
.u-text-regular-medium {
    font-weight: var(--font-medium);
}
.u-text-medium{
    font-weight: var(--font-semibold);
}
.u-text-bold{
    font-weight: var(--font-bold);
}
.u-text-boldest{
    font-weight: var(--font-black);
}

.u-paragraph-large {
  font-size: var(--paragraph-large);
}

.u-paragraph-small {
  font-size: var(--paragraph-small);
}

.u-text-spacing--s{
    letter-spacing:1.125pt;
}
.u-text-spacing--m{
    letter-spacing:1.875pt;
}
.u-text-spacing--l{
    letter-spacing:2.75pt;
}
.u-text-spacing--xl{
    letter-spacing:3.5pt;
}

.u-text-shadow-xl{
    text-shadow: -1px -1px 1px rgba(255,255,255,.1), 1px 1px 1px rgba(0,0,0,.25);
}


.u-padding-top--xxs{
    padding-top:0.5rem;
}
.u-padding-bottom--xxs{
    padding-bottom:0.5rem;
}
.u-padding-top--xs{
    padding-top:1.25rem;
}
.u-padding-bottom--xs{
    padding-bottom:1.25rem;
}
.u-padding-top--s{
    padding-top:2.125rem;
}
.u-padding-bottom--s{
    padding-bottom:2.125rem;
}
.u-padding-top--m{
    padding-top:4.5rem;
}
.u-padding-bottom--m{
    padding-bottom:4.5rem;
}
.u-padding-top--l{
    padding-top:5.25rem;
}
.u-padding-bottom--l{
    padding-bottom:5.25rem;
}
.u-padding-top--xl{
    padding-top:8rem;
}
.u-padding-bottom--xl{
    padding-bottom:8rem;
}
.u-padding-top--xxl{
    padding-top:12rem;
}
.u-padding-bottom--xxl{
    padding-bottom:12rem;
}
.u-padding-top--n{
    padding-top:0;
}
.u-padding-bottom--n{
    padding-bottom:0;
}
@media screen and (min-width: 48em) {
.u-padding-top--xxs{
    padding-top:0.75rem;
}
.u-padding-bottom--xxs{
    padding-bottom:0.75rem;
}
.u-padding-top--xs{
    padding-top:1.5rem;
}
.u-padding-bottom--xs{
    padding-bottom:1.5rem;
}
.u-padding-top--s{
    padding-top:2.5rem;
}
.u-padding-bottom--s{
    padding-bottom:2.5rem;
}
.u-padding-top--m{
    padding-top:6rem;
}
.u-padding-bottom--m{
    padding-bottom:6rem;
}
.u-padding-top--l{
    padding-top:8rem;
}
.u-padding-bottom--l{
    padding-bottom:8rem;
}
.u-padding-top--xl{
    padding-top:12rem;
}
.u-padding-bottom--xl{
    padding-bottom:12rem;
}
.u-padding-top--xxl{
    padding-top:16rem;
}
.u-padding-bottom--xxl{
    padding-bottom:16rem;
}
.u-padding-top--n{
    padding-top:0;
}
.u-padding-bottom--n{
    padding-bottom:0;
}   
    
    
}
@media screen and (min-width: 60em) {
    .u-padding-top--xxs{
        padding-top:1rem;
    }
    .u-padding-bottom--xxs{
        padding-bottom:1rem;
    }
    .u-padding-top--xs{
        padding-top:2rem;
    }
    .u-padding-bottom--xs{
        padding-bottom:2rem;
    }
    .u-padding-top--s{
        padding-top:4rem;
    }
    .u-padding-bottom--s{
        padding-bottom:4rem;
    }
    .u-padding-top--m{
        padding-top:8rem;
    }
    .u-padding-bottom--m{
        padding-bottom:8rem;
    }
    .u-padding-top--l{
        padding-top:12rem;
    }
    .u-padding-bottom--l{
        padding-bottom:12rem;
    }
    .u-padding-top--xl{
        padding-top:16rem;
    }
    .u-padding-bottom--xl{
        padding-bottom:16rem;
    }
    .u-padding-top--xxl{
        padding-top:20rem;
    }
    .u-padding-bottom--xxl{
        padding-bottom:20rem;
    }
    
}


/**
 * Offset size modifiers.
 */
.u-offset-1-r {
    margin-right: 8.333%;
}

.u-offset-2-r {
    margin-right: 16.666%;
}

.u-offset-3-r {
    margin-right: 25%;
}

.u-offset-4-r {
    margin-right: 33.333%;
}

.u-offset-5-r {
    margin-right: 41.666%;
}

.u-offset-6-r {
    margin-right: 50%;
}

.u-offset-7-r {
    margin-right: 58.333%;
}

.u-offset-8-r {
    margin-right: 66.666%;
}

.u-offset-9-r {
    margin-right: 75%;
}

.u-offset-10-r {
    margin-right: 83.333%;
}

.u-offset-11-r {
    margin-right: 91.666%;
}

/* Small Breakpoint [40em = 640px]
   =========================================== */
@media screen and (min-width: 40em) {

    /**
     * Offset size modifiers.
     */
    .u-offset-1-r--s {
        margin-right: 8.333%;
    }
    .u-offset-2-r--s {
        margin-right: 16.666%;
    }
    .u-offset-3-r--s {
        margin-right: 25%;
    }
    .u-offset-4-r--s {
        margin-right: 33.333%;
    }
    .u-offset-5-r--s {
        margin-right: 41.666%;
    }
    .u-offset-6-r--s {
        margin-right: 50%;
    }
    .u-offset-7-r--s {
        margin-right: 58.333%;
    }
    .u-offset-8-r--s {
        margin-right: 66.666%;
    }
    .u-offset-9-r--s {
        margin-right: 75%;
    }
    .u-offset-10-r--s {
        margin-right: 83.333%;
    }
    .u-offset-11-r--s {
        margin-right: 91.666%;
    }
}

/* Medium Breakpoint [48em = 768px]
   =========================================== */
@media screen and (min-width: 48em) {
    /**
     * Offset size modifiers.
     */
    .u-offset-1-r--m {
        margin-right: 8.333%;
    }
    .u-offset-2-r--m {
        margin-right: 16.666%;
    }
    .u-offset-3-r--m {
        margin-right: 25%;
    }
    .u-offset-4-r--m {
        margin-right: 33.333%;
    }
    .u-offset-5-r--m {
        margin-right: 41.666%;
    }
    .u-offset-6-r--m {
        margin-right: 50%;
    }
    .u-offset-7-r--m {
        margin-right: 58.333%;
    }
    .u-offset-8-r--m {
        margin-right: 66.666%;
    }
    .u-offset-9-r--m {
        margin-right: 75%;
    }
    .u-offset-10-r--m {
        margin-right: 83.333%;
    }
    .u-offset-11-r--m {
        margin-right: 91.666%;
    }
}

/* Large Breakpoint [60em = 960px]
   =========================================== */
@media screen and (min-width: 60em) {

    /**
     * Offset size modifiers.
     */
    .u-offset-1-r--l {
        margin-right: 8.333%;
    }
    .u-offset-2-r--l {
        margin-right: 16.666%;
    }
    .u-offset-3-r--l {
        margin-right: 25%;
    }
    .u-offset-4-r--l {
        margin-right: 33.333%;
    }
    .u-offset-5-r--l {
        margin-right: 41.666%;
    }
    .u-offset-6-r--l {
        margin-right: 50%;
    }
    .u-offset-7-r--l {
        margin-right: 58.333%;
    }
    .u-offset-8-r--l {
        margin-right: 66.666%;
    }
    .u-offset-9-r--l {
        margin-right: 75%;
    }
    .u-offset-10-r--l {
        margin-right: 83.333%;
    }
    .u-offset-11-r--l {
        margin-right: 91.666%;
    }
}

/* Extra-Large Breakpoint [75em = 1200px]
   =========================================== */
@media screen and (min-width: 75em) {
    /**
     * Offset size modifiers.
     */
    .u-offset-1-r--xl {
        margin-right: 8.333%;
    }
    .u-offset-2-r--xl {
        margin-right: 16.666%;
    }
    .u-offset-3-r--xl {
        margin-right: 25%;
    }
    .u-offset-4-r--xl {
        margin-right: 33.333%;
    }
    .u-offset-5-r--xl {
        margin-right: 41.666%;
    }
    .u-offset-6-r--xl {
        margin-right: 50%;
    }
    .u-offset-7-r--xl {
        margin-right: 58.333%;
    }
    .u-offset-8-r--xl {
        margin-right: 66.666%;
    }
    .u-offset-9-r--xl {
        margin-right: 75%;
    }
    .u-offset-10-r--xl {
        margin-right: 83.333%;
    }
    .u-offset-11-r--xl {
        margin-right: 91.666%;
    }
}

/* Wide-Screen Breakpoint [90em = 1440px]
   =========================================== */
@media screen and (min-width: 90em) {
    /**
     * Offset size modifiers.
     */
    .u-offset-1-r--w {
        margin-right: 8.333%;
    }
    .u-offset-2-r--w {
        margin-right: 16.666%;
    }
    .u-offset-3-r--w {
        margin-right: 25%;
    }
    .u-offset-4-r--w {
        margin-right: 33.333%;
    }
    .u-offset-5-r--w {
        margin-right: 41.666%;
    }
    .u-offset-6-r--w {
        margin-right: 50%;
    }
    .u-offset-7-r--w {
        margin-right: 58.333%;
    }
    .u-offset-8-r--w {
        margin-right: 66.666%;
    }
    .u-offset-9-r--w {
        margin-right: 75%;
    }
    .u-offset-10-r--w {
        margin-right: 83.333%;
    }
    .u-offset-11-r--w {
        margin-right: 91.666%;
    }
}


.u-margin-top--xxs{
    margin-top:0.5rem;
}
.u-margin-bottom--xxs{
    margin-bottom:0.5rem;
}
.u-margin-top--xs{
    margin-top:1rem;
}
.u-margin-bottom--xs{
    margin-bottom:1rem;
}
.u-margin-top--s{
    margin-top:2rem;
}
.u-margin-bottom--s{
    margin-bottom:2rem;
}
.u-margin-top--m{
    margin-top:4rem;
}
.u-margin-bottom--m{
    margin-bottom:4rem;
}
.u-margin-top--l{
    margin-top:6rem;
}
.u-margin-bottom--l{
    margin-bottom:6rem;
}
.u-margin-top--xl{
    margin-top:9rem;
}
.u-margin-bottom--xl{
    margin-bottom:9rem;
}
.u-margin-top--xxl{
    margin-top:12rem;
}
.u-margin-bottom--xxl{
    margin-bottom:12rem;
}

.u-margin-bottom--none{
    margin-bottom:0;
}
@media screen and (min-width: 60em) {
    .u-margin-bottom--none--l{
        margin-bottom:0;
    }
}
.u-center-item{
    margin-left: auto;
    margin-right: auto;
}

/* ==========================================================================
   NOTE - ADJUST THESE/ BUILD OUT NEEDED
   ========================================================================== */

.u-padding-lr--xxs{
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}
.u-padding-lr--xs{
    padding-left: 1rem;
    padding-right: 1rem;
}
.u-padding-lr--s{
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}
.u-padding-lr--m{
    padding-left: 2.25rem;
    padding-right: 2.25rem;
}
.u-padding-lr--l{
    padding-left: 3rem;
    padding-right: 3rem;
}
.u-padding-lr--xl{
    padding-left: 3.5rem;
    padding-right: 3.5rem;
}
.u-padding-lr--xxl{
    padding-left: 4.5rem;
    padding-right: 4.5rem;
}

.u-padding-tb--xxs{
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}
.u-padding-tb--xs{
    padding-top: 1rem;
    padding-bottom: 1rem;
}
.u-padding-tb--s{
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
}
.u-padding-tb--m{
    padding-top: 2.25rem;
    padding-bottom: 2.25rem;
}
.u-padding-tb--l{
    padding-top: 3rem;
    padding-bottom: 3rem;
}
.u-padding-tb--xl{
    padding-top: 3.5rem;
    padding-bottom: 3.5rem;
}
.u-padding-tb--xxl{
    padding-top: 4.5rem;
    padding-bottom: 4.5rem;
}
@media screen and (min-width: 48em) {
 .u-padding-lr--xxs--m{
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}
.u-padding-lr--xs--m{
    padding-left: 1rem;
    padding-right: 1rem;
}
.u-padding-lr--s--m{
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}
.u-padding-lr--m--m{
    padding-left: 2.25rem;
    padding-right: 2.25rem;
}
.u-padding-lr--l--m{
    padding-left: 3rem;
    padding-right: 3rem;
}
.u-padding-lr--xl--m{
    padding-left: 3.5rem;
    padding-right: 3.5rem;
}
.u-padding-lr--xxl--m{
    padding-left: 4.5rem;
    padding-right: 4.5rem;
}

.u-padding-tb--xxs--m{
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}
.u-padding-tb--xs--m{
    padding-top: 1rem;
    padding-bottom: 1rem;
}
.u-padding-tb--s--m{
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
}
.u-padding-tb--m--m{
    padding-top: 2.25rem;
    padding-bottom: 2.25rem;
}
.u-padding-tb--l--m{
    padding-top: 3rem;
    padding-bottom: 3rem;
}
.u-padding-tb--xl--m{
    padding-top: 3.5rem;
    padding-bottom: 3.5rem;
}
.u-padding-tb--xxl--m{
    padding-top: 4.5rem;
    padding-bottom: 4.5rem;
}   
    
    
}
@media screen and (min-width: 60em) {
   .u-padding-lr--xxs--l{
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}
.u-padding-lr--xs--l{
    padding-left: 1rem;
    padding-right: 1rem;
}
.u-padding-lr--s--l{
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}
.u-padding-lr--m--l{
    padding-left: 2.25rem;
    padding-right: 2.25rem;
}
.u-padding-lr--l--l{
    padding-left: 3rem;
    padding-right: 3rem;
}
.u-padding-lr--xl--l{
    padding-left: 3.5rem;
    padding-right: 3.5rem;
}
.u-padding-lr--xxl--l{
    padding-left: 4.5rem;
    padding-right: 4.5rem;
}

.u-padding-tb--xxs--l{
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
}
.u-padding-tb--xs--l{
    padding-top: 1rem;
    padding-bottom: 1rem;
}
.u-padding-tb--s--l{
    padding-top: 1.5rem;
    padding-bottom: 1.5rem;
}
.u-padding-tb--m--l{
    padding-top: 2.25rem;
    padding-bottom: 2.25rem;
}
.u-padding-tb--l--l{
    padding-top: 3rem;
    padding-bottom: 3rem;
}
.u-padding-tb--xl--l{
    padding-top: 3.5rem;
    padding-bottom: 3.5rem;
}
.u-padding-tb--xxl--l{
    padding-top: 4.5rem;
    padding-bottom: 4.5rem;
} 
    
}
/* ==========================================================================
   NOTE - ADJUST THESE/ BUILD OUT NEEDED
   ========================================================================== */
.u-inner-padding-lr--xxs .o-layout__item-inner{
    padding-left: 0.5rem;
    padding-right: 0.5rem;
}
.u-inner-padding-lr--xs .o-layout__item-inner{
    padding-left: 1rem;
    padding-right: 1rem;
}
.u-inner-padding-lr--s .o-layout__item-inner{
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}
.u-inner-padding-lr--m .o-layout__item-inner{
    padding-left: 2.25rem;
    padding-right: 2.25rem;
}
.u-inner-padding-lr--l .o-layout__item-inner{
    padding-left: 3rem;
    padding-right: 3rem;
}
.u-inner-padding-lr--xl .o-layout__item-inner{
    padding-left: 3.5rem;
    padding-right: 3.5rem;
}
.u-inner-padding-lr--xxl .o-layout__item-inner{
    padding-left: 4.5rem;
    padding-right: 4.5rem;
}


/* ==========================================================================
   HALF COLUMNS
   ========================================================================== */

@media screen and (min-width: 60em) {
    .u-width-half-column-max{
        max-width: var(--half-column-max-width);
        margin:0 auto;
    }
    .u-width-one-quarter-column-max{
        max-width: var(--one-quarter-max-width);
    }
    .u-width-three-quarter-column-max{
        max-width: var(--three-quarter-max-width);
    }
}


.u-float-right{
    float:right;
}
.u-float-left{
    float:left;
}
@media screen and (min-width: 48em) {
    .u-float-right--m{
        float:right;
    }
    .u-float-left--m{
        float:left;
    }    
}
@media screen and (min-width: 60em) {
    .u-float-right--l{
        float:right;
    }
    .u-float-left--l{
        float:left;
    }    
    
}


.u-list-spacing--m ol li{
    margin-bottom:1rem;
}
.u-list-color--primary ol li::marker{
 color: var(--theme-primary-color);
}



.u-column-inner-padding--s{
    padding:4.5rem 2rem 4.5rem 2rem;
}
@media screen and (min-width: 48em) {
.u-column-inner-padding--s{
    padding:5.5rem 2rem 5.5rem 2rem;
}
}
@media screen and (min-width: 60em) {
    .u-column-inner-padding--s{
        padding:6.5rem 3.5rem 6.5rem 3.5rem;
    }
}




/* ==========================================================================
   COMPONENTS / BUTTONS
   ========================================================================== */
.c-button,
.c-button--primary{
    align-items: center;
    align-self: start;
    background-color: var(--theme-primary-color);
    border: var(--default-border-width) solid var(--transparent);
    border-radius: var(--default-border-radius);
    color: var(--white);
    cursor: pointer;
    display: inline-flex;
    font-size: var(--default-input-font-size);
    font-weight: var(--font-bold);
    justify-content: center;
    padding: calc(1.32em - var(--default-border-width)) calc(2.65em - var(--default-border-width));
    text-decoration: none;
    transition: background-color 100ms, color 125ms ease-in-out;
    -webkit-user-select: none;
            user-select: none;


    text-transform:uppercase;
    letter-spacing:1.25pt;
}
.c-button:hover,
.c-button:focus,
.c-button--primary:hover,
.c-button--primary:focus{
    background-color: var(--theme-primary-color-hover);
    border: var(--default-border-width) solid var(--transparent);
}

@media (hover: hover) and (pointer: fine) {
  .c-button:hover:not(:disabled):not([aria-disabled=true]):not(.c-button--as-link),
  .c-button--primary:hover:not(:disabled):not([aria-disabled=true]):not(.c-button--as-link) {
    background-color: var(--theme-primary-color-hover);
    border-color: var(--transparent);
    color: var(--white);
    outline: var(--default-border-width) solid var(--black);
  }
    .c-button-dark:hover:not(:disabled):not([aria-disabled=true]):not(.c-button--as-link) {
        background-color: var(--transparent);
        border-color: var(--white);
        color: var(--white);
    }
    .c-button-dark--secondary:hover:not(:disabled):not([aria-disabled=true]):not(.c-button--as-link) {
        background-color: var(--white);
        border-color: var(--transparent);
        color: var(--black);
    }
}


.c-button--primary-outline{
    background-color: transparent;
    border: var(--default-border-width) solid var(--theme-primary-color);
    color: var(--theme-primary-color);
}

.c-button--secondary {
    background-color: var(--theme-secondary-color);
    color: var(--white);
}
.c-button--secondary-outline{
    background-color: transparent;
    border: var(--default-border-width) solid var(--theme-secondary-color);
    color: var(--theme-secondary-color);
}

.c-button--accent {
    background-color: var(--theme-accent-color);
    color: var(--white);
}
.c-button--accent-outline{
    background-color: transparent;
    border: var(--default-border-width) solid var(--theme-accent-color);
    color: var(--theme-accent-color);
}

.c-button--white{
    background-color: var(--white);
    color: var(--black);
}
.c-button--white-outline{
    background-color: transparent;
    border: var(--default-border-width) solid var(--white);
    color: var(--white);
}

.c-button--light{
    background-color: var(--gray-200);
    color: var(--black);
}
.c-button--light-outline{
    background-color: transparent;
    border: var(--default-border-width) solid var(--gray-200);
    color: var(--gray-200);
}
.c-button--dark{
    background-color: var(--gray-600);
    color: var(--white);
}
.c-button--dark-outline{
    background-color: transparent;
    border: var(--default-border-width) solid var(--gray-600);
    color: var(--gray-600);
}

.c-button--black {
    background-color: var(--black);
    color: var(--white);
}

.c-button--black-outline {
    background-color: var(--transparent);
    border: var(--default-border-width) solid var(--black);
    color: var(--black);
}




/* Button sizing modifiers
   =========================================== */
.c-button--xsmall {
    font-size: 0.65rem;
    padding: calc(0.85em - var(--default-border-width)) calc(1.5em - var(--default-border-width));
}
.c-button--small {
    font-size: 0.7125rem;
    padding: calc(1em - var(--default-border-width)) calc(1.625em - var(--default-border-width));
}
.c-button--medium {
    font-size: var(--default-input-font-size);
    padding: calc(1.125em - var(--default-border-width)) calc(1.925em - var(--default-border-width));
}
.c-button--large {
    font-size: 0.85rem;
    padding: calc(1.25em - var(--default-border-width)) calc(2.25em - var(--default-border-width));
}
.c-button--xlarge {
    font-size: 1rem;
    padding: calc(1.375em - var(--default-border-width)) calc(2.5em - var(--default-border-width));
}
@media screen and (min-width: 60em) {
.c-button--xsmall {
    font-size: 0.675rem;
    padding: calc(0.95em - var(--default-border-width)) calc(1.875em - var(--default-border-width));
}
.c-button--small {
    font-size: 0.75rem;
    padding: calc(1em - var(--default-border-width)) calc(2.25em - var(--default-border-width));
    
    min-width: auto;
}
.c-button--medium {
    font-size: var(--default-input-font-size);
    padding: calc(1.32em - var(--default-border-width)) calc(2.65em - var(--default-border-width));
}
.c-button--large {
    font-size: 1rem;
    padding: calc(1.5em - var(--default-border-width)) calc(2.85em - var(--default-border-width));
}
.c-button--xlarge {
    font-size: 1.25rem;
    padding: calc(1.65em - var(--default-border-width)) calc(3em - var(--default-border-width));
}

}
.c-button--flush {
    padding-left: 0;
    padding-right: 0;
}
.c-button--full {
    width: 100%;
}

@media screen and (max-width: 47.999em) {
    .c-button--full-small {
        width: 100%;
    }
}

/* Button shape modifiers
   =========================================== */

.c-button.c-button--squared{
    border-radius: 0;
}

.c-button--xsmall.c-button--rounded{
    border-radius: var(--xsmall-border-radius);
}
.c-button--small.c-button--rounded{
    border-radius: var(--small-border-radius);
}
.c-button.c-button--rounded,
.c-button--medium.c-button--rounded{
    border-radius: var(--medium-border-radius);
}
.c-button--large.c-button--rounded{
    border-radius: var(--large-border-radius);
}
.c-button--xlarge.c-button--rounded{
    border-radius: var(--xlarge-border-radius);
}


.c-button--xsmall.c-button--pill{
    border-radius: 1.875em;
}
.c-button--small.c-button--pill{
    border-radius: 2em;
}
.c-button.c-button--pill,
.c-button--medium.c-button--pill{
    border-radius: 2.25em;
}
.c-button--large.c-button--pill{
    border-radius: 2.75em;
}
.c-button--xlarge.c-button--pill{
    border-radius: 3.25em;
}


/* Button state modifiers
   =========================================== */
.c-button:active,
.c-button:focus,
.c-button:hover {
    text-decoration: none;
    transition-duration: 250ms;
}

.c-button:disabled,
.c-button[aria-disabled=true] {
    background-color: var(--gray-400);
    cursor: not-allowed;
}

.c-button:focus:not(:focus-visible) {
    outline: none;
}

.c-button:focus-visible {
    outline: calc(var(--default-border-width) * 2) solid var(--focus);
    outline-offset: var(--default-border-width);
    transition: none;
}

/* Button shape modifiers
   =========================================== */
.c-button--circle {
    border-radius: 50%;
}

.c-button--circle,
.c-button--square {
    padding: calc(1em - var(--default-border-width));
}


/* Button aesthetic modifier
   (For buttons you want to look like normal links)
   =========================================== */
.c-button--as-link {
    background-color: rgba(0, 0, 0, 0);
    text-transform:none;
    letter-spacing:0;
    border: none;
    color: currentColor;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
    padding: 0;
    text-decoration: underline;
    text-decoration-thickness: from-font;
    -webkit-user-select: auto;
            user-select: auto;
}

.c-button--as-link:active,
.c-button--as-link:focus,
.c-button--as-link:hover {
    background-color: rgba(0, 0, 0, 0);
    border: none;
    text-decoration: underline;
    text-decoration-thickness: 0.1em;
    text-underline-offset: 0.15em;
}

.c-button:focus-visible {
  outline: none !important;
  outline-offset:0px !important;
}
@media (hover: hover) and (pointer: fine) {
  .c-button:hover:not(:disabled):not([aria-disabled=true]):not(.c-button--as-link),
  .c-button--secondary:hover:not(:disabled):not([aria-disabled=true]):not(.c-button--as-link) {
    outline: none !important;
  }
  .c-button-dark:hover:not(:disabled):not([aria-disabled=true]):not(.c-button--as-link) {
  }
  .c-button-dark--secondary:hover:not(:disabled):not([aria-disabled=true]):not(.c-button--as-link) {
  }
}

button.x-toggle-password{
 border: 0 none !important;
    border-radius: 0;
    color: var(--gray-800) !important;
    font-size: 1.5em;
    margin-top: -0.125em;
    padding: 0.25em;
    position: absolute;
    right: 0.5em;
    top: calc(50% - 1px);
    background-color:transparent !important;

}
button.x-toggle-password:hover{
    color: var(--gray-800) !important;
    background-color:transparent !important;
    outline: none !important;
    border:none !important;
}
button.u-icon-cross{
    padding:0.75rem !important;
    margin:0 !important;
}
#global_account button.x-toggle-password{
    top:15%;
}


/* Button state overrides
   =========================================== */
[class^=u-icon-]:hover::before,
[class*=" u-icon-"]:hover::before,
[data-icon]:hover::before {
  background-color: rgba(0, 0, 0, 0);
}


.c-button.c-button--secondary.u-icon-subtract,
.c-button.c-button--secondary.u-icon-add{
    background-color:var(--white) !important;
    color:var(--theme-body-color) !important;
    border:none !important;
    outline:none !important;
    padding: 0;
    height: 100%;
}
.c-button.c-button--secondary.u-icon-subtract:active,
.c-button.c-button--secondary.u-icon-subtract:focus,
.c-button.c-button--secondary.u-icon-subtract:hover,
.c-button.c-button--secondary.u-icon-add:active,
.c-button.c-button--secondary.u-icon-add:focus,
.c-button.c-button--secondary.u-icon-add:hover{
    background-color:var(--gray-100) !important;
    color:var(--theme-body-color) !important;
    border:none !important;
    outline:none !important;
}


@media screen and (-webkit-min-device-pixel-ratio: 2) {
  .c-form-input,
  .c-form-select {
    font-size: var(--paragraph-medium);
  }
    /*
  .c-form-input,
  .c-form-select__dropdown {
    padding: 0;
  }
    */
}

.x-product-layout-purchase__cta .x-quantify {
    width:8.5rem;
}

.c-button.c-button--secondary.u-icon-subtract{
    border-radius:var(--default-border-radius) 0 0 var(--default-border-radius) !important;
}
.c-button.c-button--secondary.u-icon-add{
    border-radius:0 var(--default-border-radius) var(--default-border-radius) 0 !important;
}
.c-button.c-button--secondary.u-icon-subtract,
.c-button.c-button--secondary.u-icon-subtract:active,
.c-button.c-button--secondary.u-icon-subtract:focus,
.c-button.c-button--secondary.u-icon-subtract:hover{
    border-right:solid 1px var(--gray-400) !important;
}
.c-button.c-button--secondary.u-icon-add,
.c-button.c-button--secondary.u-icon-add:active,
.c-button.c-button--secondary.u-icon-add:focus,
.c-button.c-button--secondary.u-icon-add:hover{
    border-left:solid 1px var(--gray-400) !important;
}

.u-button--sep{
    display:inline-block;
    width:var(--default-spacing-unit);
    height:1px;
    }

.u-button-stacked .u-button--sep{
    display:inline-block;
    width:100%;
    height:var(--default-spacing-unit);
}
@media screen and (max-width: 47.99em) {
    .u-button-stacked--s .u-button--sep{
    display:inline-block;
    width:100%;
    height:var(--default-spacing-unit);
    }
}
@media screen and (max-width: 59.99em) {
   .u-button-stacked--m .u-button--sep{
    display:inline-block;
    width:100%;
    height:var(--default-spacing-unit);
    }
}
@media screen and (max-width: 74.99em) {
   .u-button-stacked--l .u-button--sep{
    display:inline-block;
    width:100%;
    height:var(--default-spacing-unit);
    }
}
@media screen and (max-width: 89.99em) {
   .u-button-stacked--xl .u-button--sep{
    display:inline-block;
    width:100%;
    height:var(--default-spacing-unit);
    }
}
@media screen and (min-width: 90em) {
   .u-button-stacked--w .u-button--sep{
    display:inline-block;
    width:100%;
    height:var(--default-spacing-unit);
    }
}


/* DATA ITEMS
   =========================================== */
/* Select any element that has a data-url attribute */
[data-url]:hover {
  cursor: pointer;
}

[data-reveal]{
  opacity: 0;
  transform: translate3d(var(--rx,0), var(--ry,0), 0) scale(var(--rscale,1));
  filter: var(--rfilter, none);
  transition:
    transform var(--reveal-dur) var(--reveal-ease),
    opacity var(--reveal-dur) var(--reveal-ease),
    filter var(--reveal-dur) var(--reveal-ease);
  will-change: transform, opacity, filter;
  transition-delay: 0.35s;
}

[data-reveal].is-revealed{
  opacity: 1;
  transform: none;
  filter: none;
}

[data-reveal="up"]      { --ry: 16px; }
[data-reveal="down"]    { --ry: -16px; }
[data-reveal="left"]    { --rx: -18px; }
[data-reveal="right"]   { --rx: 18px; }
[data-reveal="fade"]    { --rx: 0; --ry: 0; }
[data-reveal="scale"]   { --rscale: .9; }
[data-reveal="float"]   { --ry: 14px; --rfilter: blur(.2px); }

@keyframes bob {
  0%   { transform: translateY(0); }
  50%  { transform: translateY(-2px); }
  100% { transform: translateY(0); }
}
[data-reveal="float"].is-revealed{
  animation: bob 3.8s ease-in-out .2s 1;
}

@media (prefers-reduced-motion: reduce){
  [data-reveal]{
    opacity: 1 !important;
    transform: none !important;
    filter: none !important;
    transition: none !important;
  }
}


/* Form Elements State Modifiers
   =========================================== */
.c-form-input:focus-visible,
.c-form-select__dropdown:focus-visible,
.c-form-checkbox:focus-within {
    /*
    outline: calc(var(--default-border-width) * 2) solid var(--focus);
    outline-offset: var(--default-border-width);
    transition: none;
    */
    outline:none !important;
    outline-offset:0;
}


@media screen and (-webkit-min-device-pixel-ratio: 2) {
  .c-form-input,
  .c-form-select {
    font-size: var(--paragraph-small);
  }
/*
  .c-form-input,
  .c-form-select__dropdown {
    padding: calc(0.75em - var(--default-border-width)) calc(1.25em - var(--default-border-width));
  }*/
  .c-form-select__dropdown {  
     padding: calc(1.05em - var(--default-border-width)) calc(1.375em - var(--default-border-width));
    }
}

/* OWL CAROUSEL
   =========================================== */
.owl-carousel{
   opacity:0; 
   transition: opacity .5s ease;
}
.owl-carousel.owl-loaded{
    opacity:1;
}
.dwg-carousel .owl-theme .owl-dots{
    position:absolute;
    width:100%;
    text-align:center;
    z-index:5;
    bottom:0px;
    margin:0 auto;
}

.dwg-carousel .owl-theme .owl-dots .owl-dot span {
    width: 12px;
    height: 12px;
    margin: 5px 7px;
    display: block;
    -webkit-backface-visibility: visible;
    transition: opacity .2s ease;
    border-radius: 30px;
    opacity:0.5;
}
.dwg-carousel .owl-theme .owl-dots .owl-dot.active span,
.dwg-carousel .owl-theme .owl-dots .owl-dot:hover span {
    opacity:1;
}
.dwg-carousel .owl-carousel-prev-next{
    display:block;
    position:absolute;
    z-index:10;
    top:50%;
    transform:translateY(-50%);

    text-decoration:none;

    font-size:1rem;
    line-height:36px;
    text-align:center;

    width:32px;
    height:32px;

    overflow:hidden;

    background-color:var(--theme-primary-color);
    color:var(--white);
    border-radius:50%;

    transition: background-color 125ms ease-in-out;
}
.dwg-carousel .owl-carousel-prev-next:hover{
  background-color:var(--theme-secondary-color);
    color:var(--white) !important;
}
.dwg-carousel .owl-carousel-prev-next.owl-carousel-prev-trigger{
}
.dwg-carousel .owl-carousel-prev-next.owl-carousel-next-trigger{
}

.dwg-product-carousel-item-header{
    
}
.dwg-product-carousel-item-control{
    display:flex;
    justify-content:flex-end;
    align-items: center;
    gap:1.5rem;
}
.dwg-carousel .dwg-product-carousel-item-control .owl-carousel-prev-next{
    position:relative;
    top:auto;
    transform:none;
}

/* FASTEN HEADER
   =========================================== */

#fasten_header .t-site-header__search-form{
    background-color: rgba(0, 0, 0, 0.06);
    border-radius:999px;
    overflow:hidden;
}
#fasten_header .t-site-header__search-form:focus-within,
#fasten_header .t-site-header__search-form:focus-within:has(.x-search-preview--open){
    outline:none !important;
    border-radius:999px;
    overflow:visible;
}


.x-fasten-header {
}
.x-fasten-header-top{

}
.x-fasten-header-top .t-site-header__message {
    padding: 0.25rem 1rem;
    font-size:0.775rem;
    /* color: var(--white); */
    font-weight: var(--font-medium);
}

.x-fasten-header-main{
  padding: 0.25rem 1rem;
}
@media screen and (min-width: 60em) {
    .x-fasten-header {
        box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
        color: var(--gray-600);
        display: flex;
        font-size: 0.875rem;
        left: 0;
        max-width: none;
        opacity: 0;
        padding: 0.5rem 2rem;
        position: fixed;
        right: 0;
        top: 0;
        transform: translateY(-100%);
        transform-origin: top;
        transition: all ease-in-out 0.15s;
        z-index: 300;
    }
}
.fasten_header_site_logo{
    display:block;
    max-width:120px;
    margin:0 auto;
    width:120px;
}

.x-fasten-header__navigation-element{
    position:relative;
    top:0;
}
.x-fasten-header__navigation-element nav{
    position:absolute;
    top:98%;
    width:calc(100% - 1rem);
    background-color: var(--gray-100);
}
@media screen and (min-width: 60em) {
    .x-fasten-header__navigation-list {
        background-color: var(--gray-100);
        border: var(--default-border-width) solid var(--gray-200);
        box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.08);
        list-style: none;
        margin: 0;
        padding: 0.5em 1.5em;
    }

    .x-fasten-header__navigation-element summary {
        border-radius: var(--default-border-radius);
        padding: 1em 1.5em 1em 1.5em;
        margin-right:1rem;
    }

    .x-fasten-header__navigation-element[open] summary {
        background-color: var(--gray-100);
        margin-bottom:0;
    }

    .x-fasten-header__navigation-element summary span {
        padding-left: 1em;
        position: relative;
        top: -1px;
    }
    .x-fasten-header__navigation-item{
        padding: 0.125rem 0;
    }
    .x-fasten-header__navigation-link {
        display: block;
        padding: 0.25rem 0;
        text-decoration: none;
    }
    .x-fasten-header__navigation-link:hover {
        text-decoration: none;
        color: var(--theme-primary-color);
    }
}


/* NAVBAR
   =========================================== */
.t-site-header__top-navigation{

}
.t-site-header__top-navigation .t-site-header__banner,
.t-site-header__top-navigation .t-site-header__links{
    padding: 0.575rem 0.75rem 0.575rem 0.75rem;
}
.t-site-header__top-navigation .t-site-header__message,
.t-site-header__top-navigation .t-site-header__message a,
#visit-dealership {
    color: var(--white);
    font-size:0.775rem;
    font-weight: var(--font-bold);
}


.t-site-header__top-navigation .t-site-header__message {
   padding:0;
}

#visit-dealership {
    position:relative;
    background-color: var(--theme-secondary-color);
    padding:0.75rem 42px 0.575rem 1.25rem;
    text-decoration:none;
}

#visit-dealership:after{
    content:'\f08e';
    font-family: var(--font-awesome-family);
    color: var(--theme-primary-color);
    font-size:1rem;
    line-height:1.2;
    display:block;
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    right:6px;
    float:right;
    width:24px;
}
#visit-dealership:hover{
    
}
#visit-dealership:hover:after{
    
}

@media screen and (min-width: 60em) {
    .t-site-header__top-navigation .t-site-header__message,
    .t-site-header__top-navigation .t-site-header__message a,
    #visit-dealership {
        font-size:0.8125rem;
    }
 
}


.t-site-header__links .x-transfigure-navigation__footer {
    padding-right: 2rem;
}
.t-site-header__search{
    padding-top:0;
}


@media screen and (min-width: 60em) {
   .t-site-header__search{
        padding-top:0.375rem;
    }
}
.t-site-header__search-form {
    background-color:rgba(0, 0, 0, 0.06);
    max-width: 280px;
    border-radius:999px;
    overflow:hidden;
    position:relative;   /* anchor the search-preview popover */
}
.t-site-header__search-form:focus-within,
.t-site-header__search-form:focus-within:has(.x-search-preview--open){
    outline:none !important;
    border-radius:999px;
    overflow:visible;
}
.x-search-preview{
    z-index:999;
    padding-top:0;
}
/* Search preview popover — styled result dropdown (theme) */
.x-search-preview.x-search-preview--open{
    position:absolute; top:calc(100% + 8px); left:0;
    width:360px; max-width:92vw; max-height:70vh; overflow-y:auto;
    background:#fff; border:1px solid rgba(0,0,0,.12); border-radius:12px;
    box-shadow:0 14px 34px rgba(0,0,0,.18); padding:6px; margin:0; list-style:none;
}
.x-search-preview__entry{ display:block; padding:0; }
.x-search-preview__list{ margin:0; }
.x-search-preview__line{ display:flex; align-items:center; gap:12px; padding:8px 10px; border-radius:8px; transition:background-color 120ms ease; }
.x-search-preview__entry:hover .x-search-preview__line{ background:var(--gray-100); }
.x-search-preview__image{ flex:0 0 48px; width:48px; height:48px; margin:0; display:flex; align-items:center; justify-content:center; background:#f4f5f7; border-radius:8px; overflow:hidden; }
.x-search-preview__image img{ width:100%; height:100%; object-fit:contain; }
.x-search-preview__item{ flex:1 1 auto; min-width:0; display:flex; align-items:center; gap:10px; }
.x-search-preview__item .c-keyline{ display:none; }
.x-search-preview__item-text{ flex:1 1 auto; min-width:0; display:flex; flex-direction:column; gap:1px; }
.x-search-preview__item-name{ margin:0; min-width:0; font-size:.82rem; font-weight:600; line-height:1.25; color:var(--theme-secondary-color,#111); display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.x-search-preview__item-sku{ margin:0; min-width:0; font-size:.66rem; font-weight:600; letter-spacing:.02em; text-transform:uppercase; color:#565b63; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.x-search-preview__item-price{ flex:0 0 auto; text-align:right; white-space:nowrap; font-size:.8rem; }
.x-search-preview__item-price strong{ color:var(--theme-secondary-color,#111); }
.x-search-preview__item-price .u-font-small{ font-size:.68rem; color:#565b63; }
.x-search-preview__search-all{ display:block; text-align:center; padding:11px 10px; margin-top:4px; border-top:1px solid rgba(0,0,0,.08); font-weight:700; font-size:.8rem; color:var(--theme-primary-color,#c8102e); cursor:pointer; }

.t-site-header__search-field {
  margin-bottom: 0;
  padding: calc(0.75em - var(--default-border-width));
}
.t-site-header__masthead{
    padding-top:1.5rem;
}

.t-site-header__masthead-links .t-global-account-toggle,
.t-site-header__basket-link{
    background-color:var(--white);
}
.t-site-header__masthead-links .t-global-account-toggle,
.t-site-header__masthead-links .t-global-account-toggle span,
.t-site-header__basket-link{
    color:var(--theme-secondary-color);
}
.t-site-header__basket-link{
    position:relative;
}

.u-mobile-account-basket{
  align-items: center;
    align-content: center;
    justify-content: flex-end;
    gap: 1rem;  
}
.t-global-account-mobile{
    padding:0;
}
.t-global-account-mobile img{
    width: 22px;
    padding-bottom: 2px;
    height:auto;
}
@media screen and (min-width: 60em) {
    .t-site-header__masthead-links .t-global-account-toggle{
        min-width:90px;
        padding: 0.5em calc(1em + var(--default-border-width));
    }  
}
/*
.t-site-header__search-form {
    border: none;
    border-radius: 0;
    margin-bottom: 0;
    position: relative;
}

.t-site-header__search-form input.focus,
.t-site-header__search-form input:focus,
.t-site-header__search-form .c-form-list__item,
.t-site-header__search-form .t-site-header__search-field{
  border-radius: 32px;
}
*/


/* HEADER
   =========================================== */
/*
.t-site-header__search-form .t-site-header__search-button {
    display: none;
}
*/
.t-site-header {
    width:100%;
    background-color:var(--white);
    border-bottom:none !important;
}
@media (min-width: 60em) {
     .t-site-header {
         position:relative;
         z-index:16;
    }
    
    .t-page-sfnt  .t-site-header {
    }
}
#header-logo{
    display:inline-block;
    max-width:220px;
    margin:0.5rem auto;
}
@media (min-width: 48em) {
#header-logo{
    max-width:280px;
}
}
@media (min-width: 60em) {
    #header-logo{
        max-width:356px;
    }
}
.t-site-header__search-icon {
  padding-right: 0.125em;
}
.t-site-header__basket-link .u-icon-cart-full + .t-site-header__basket-link-quantity {
    display: inline-block;
    max-width: 20px;
    max-width: 20px;
    min-width: 20px;
    opacity: 1;
    padding: 0;
    
    position: absolute;
    background-color: var(--theme-accent-color);
    color: var(--white);
    width: 20px;
    height: 20px;
    z-index: 10;
    font-size: 0.75rem;
    letter-spacing:-0.25pt;
    font-weight: 700;
    line-height: 20px;
    border-radius: 50%;
    top: -2px;
    left: 24px;
}



/* MAIN NAV
   =========================================== */
.t-site-navigation {
    margin-bottom: 0;
    border-top: var(--default-border-width) solid var(--gray-200);
}

.t-site-navigation__wrap{
    max-width: var(--default-content-width);
}
@media (min-width: 60em) {
    .t-site-navigation {
        border-bottom: none;
    }
}


.c-navigation {
    position: relative;
}
.t-site-navigation .c-navigation__link {
  background-color: transparent;
  color: var(--theme-body-color);
  display: block;
  padding: 0.75rem 0.75rem;
}



#primary_nav{
   margin:0;
   padding:0;
   list-style:none;

   display:flex;
   justify-content:flex-start;
   align-items:center;
   align-content:center;
   text-align:center;

}
#secondary_nav{
   margin:0;
   padding:0;
   list-style:none;

   display:flex;
   justify-content:flex-end;
   align-items:center;
   align-content:center;
   text-align:center;

}
#primary_nav li,
#secondary_nav li{
    margin:0;
    padding:0;
    list-style:none;
    flex-grow:1;
}
#primary_nav li a,
#secondary_nav li a{
    display:block;
    position:relative;
    margin:0;
    padding:1.25rem 2rem;

    font-size:1rem;
    line-height:1;
    font-weight:600;
    letter-spacing:0.2pt;
    text-decoration:none;
    font-family: var(--secondary-font-family);
    color:var(--theme-body-color);
    background-color:var(--white);

    transition: all 125ms ease-in-out;

    overflow:hidden;
}
#primary_nav li a span,
#secondary_nav li a span{
    display:block;
    position:relative;
    z-index:1;
}
#primary_nav li a:hover,
#secondary_nav li a:hover{
   /* background-color:#EEEAE4; */
    color:var(--theme-accent-color);
}
#primary_nav li a:before,
#secondary_nav li a:before{
    content:'';
    display:block;
    position:absolute;
    z-index:21;
    bottom:-1px;
    left:50%;
    transform:translateX(-50%);
    width:50%;
    height:1px;

    transition: all 125ms ease-in-out;
    opacity:0.001;
    background-color:var(--theme-accent-color);
}
#primary_nav li a:hover:before,
#primary_nav li.active a:before,
#secondary_nav li a:hover:before,
#secondary_nav li.active a:before{
    height:5px;
    bottom:0px;
    opacity:1;
    background-color:var(--theme-accent-color);
}
#secondary_nav li{
    border-left: var(--default-border-width) solid var(--gray-200);
}

/* Site Megamenus
    =========================================== */
.t-site-megamenu{
    display:none;
    position:absolute;
    z-index: 20;
    width:100%;
    padding:0;
    left: 0px;
    top:99.5%;
    background-color:var(--white);
}
.t-site-megamenu:before{
    content:'';
    display:block;
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    height:5px;
    background-color: var(--theme-accent-color);
}

.megamenu_layout{
    padding: 0;
}
@media screen and (min-width: 40em) {
    .megamenu_layout {
        padding: 0;
    }
}
@media screen and (min-width: 60em) {
    .megamenu_layout {
        padding: 0;
    }
}
.megamenu_item{

}
.megamenu_item-inner{
    padding:2rem 2rem 3rem 2rem;
}
.megamenu_nav_sep{
   display:block;
    margin:2rem 0 2rem 0;
    width:65%;
    background-color:rgba(136, 136, 136, 1);
    height:2px;
}


.megamenu_column_navset{


}
.megamenu_column_navset .navigation-set{
    display:block;
    margin:0;
    padding:0;
    list-style:none;
}
.megamenu_column_navset .navigation-set li{
    display:block;
    margin:0 0 0.5rem 0;
    padding:0;
}
.megamenu_column_navset .navigation-set li a{
    position:relative;
    display:inline-block;
    margin:0;
    padding:0.25rem 0.5rem 0.25rem 0.25rem;

    font-size:0.925rem;
    line-height:1.2;
    font-weight:600;
    letter-spacing:0;

    text-decoration:none;

    color:var(--theme-body-color);

    transition: all 125ms ease-in-out;
}

.megamenu_column_navset .navigation-set li a::after {
    content:'';
    position:absolute;
    right:-0.5rem;
    top:50%;
    transform:translateY(-50%);
    float:right;
    width:12px;
    height:8px;
    background-image:url('../../graphics/icons/chh-icon-arrow-red.png');
    background-repeat:no-repeat;
    background-position:center center;
    background-size:contain;
    opacity:0.001;
    transition: right 125ms ease-in-out, opacity 225ms ease-in-out;
} 


.megamenu_column_navset .navigation-set li a:hover{
    text-decoration:underline;
    padding:0.25rem 0.5rem 0.25rem 0.5rem;
    color:var(--theme-primary-color);
}
.megamenu_column_navset .navigation-set li a:hover::after {
    right:-0.75rem;
    opacity:1;
}


/* MOBILE NAV
   =========================================== */
#mobile-nav{
    background-color:var(--theme-secondary-color);
    
}
#mobile-nav,
#mobile-nav a{
    color:var(--white);
    font-weight:700;
}
.mm-navbar{
    border-color: rgba(255,255,255,0.7);
}

.mm-panel.mm-hasnavbar .mm-navbar{
}
.mm-panels>.mm-panel.mm-hasnavbar {
}
.mm-listview>li,
.mm-listview>li .mm-next,
.mm-listview>li .mm-next:before,
.mm-listview>li:after {
    border-color: rgba(255,255,255,0.7);
}
.mm-listview>li>a, .mm-listview>li>span {
    padding: 14px 14px 14px 22px;
}


#mobile-nav-trigger{
    display: inline-block;
    align-items: center;
    align-self: start;
    justify-content: center;
    position:relative;
    margin:0 0 0 12px;
        /*
        position:absolute;
        z-index:9999;
        float:right;
        right:1rem;
        top:50%;
        */

        width:26px;
        height:26px;
        text-decoration:none;
        /* transform:translateY(-50%); */
        background-color:transparent;
}
@media (min-width: 60em) {
    #mobile-nav-trigger{
        display:none;
    }
}
#mobile-nav-trigger span{
    display: block;
    position: absolute;
    height: 3px;
    width: 100%;
    left: 0;
    background-color: var(--theme-secondary-color);
    border-radius:999px;
    transform: rotate(0deg);
    transition: .2s ease-in-out;
}
#mobile-nav-trigger span:nth-child(1) {
    top: 0px;
}
#mobile-nav-trigger span:nth-child(2),
#mobile-nav-trigger span:nth-child(3){
     top: 9px;
}
#mobile-nav-trigger span:nth-child(4) {
    top: 18px;

}
#mobile-nav-trigger.open{
   background-color:transparent;
}
#mobile-nav-trigger.open span{
    background-color:var(--black);
}
#mobile-nav-trigger.open span:nth-child(1) {
                top: 8px;
                width: 0%;
                left: 50%;
}
#mobile-nav-trigger.open span:nth-child(2) {
                transform: rotate(45deg);
}
#mobile-nav-trigger.open span:nth-child(1) {
                top: 8px;
                width: 0%;
                left: 50%;
}
#mobile-nav-trigger.open span:nth-child(3) {
                transform: rotate(-45deg);
}
#mobile-nav-trigger.open span:nth-child(4) {
                  top: 8px;
                  width: 0%;
                  left: 50%;
}


.mm-navbar.mm-navbar-top{
    height:60px !important;
}
.mm-navbar.mm-navbar-top .mmenu-custom-header{

    padding:10px 0;
    display:flex;
    justify-content:space-between;
    align-items:center;
}
.mm-navbar.mm-navbar-top .mmenu-logo,
.mm-navbar.mm-navbar-top .mmenu-signin{
    display:block;
    flex-basis:49%;

}
.mm-navbar.mm-navbar-top .mmenu-logo{
 text-align:left;
}
.mm-navbar.mm-navbar-top .mmenu-signin{
text-align:right;
}
.mm-navbar.mm-navbar-top .mmenu-signin .mmenu-signin-link{
    position:relative;
    padding:0.25rem;
    margin:0.5rem;
    color:var(--white);
    font-size:0.75rem;
    line-height:1.2;
    text-transform:uppercase;
    font-weight:700;
    text-align:right;

}
.mm-navbar.mm-navbar-top .mmenu-logo-link{
    display:inline-block;
    margin:0.5rem;
}
.mm-navbar.mm-navbar-top .mmenu-logo-link img{
   height:30px;
    width:auto;
    max-width:none;
}
.mm-panels{
  top:60px;
  text-align:left;
}

.mm-hasnavbar-top-1 .mm-panels,
.mm-navbar-top-2 {
    top: 60px !important;
}
.mm-navbar a.mm-title{
    text-align:left;
}
.mm-navbar a.mm-title:first-of-type{
   margin-left: -20px;
}



/* FOOTER
   =========================================== */
.t-site-footer{
    background-color: var(--theme-secondary-color);
    color: var(--white);
}
#footer-logo{
    display:inline-block;
    max-width:180px;
    width:180px;
    margin:0.5rem auto;
}
@media (min-width: 48em) {
#footer-logo{
    max-width:240px;
    width:240px;
}
}
@media (min-width: 60em) {
    #footer-logo{
        max-width:325px;
        width:96%;
    }
}

.t-site-footer .c-menu__title,
.t-site-footer .c-collapsible-menu__label {
    font-size: var(--subheading-medium);
    font-weight: var(--font-medium);
    margin-bottom: 0.75rem;
    color:var(--theme-primary-color);
    text-transform:uppercase;
    letter-spacing:1.25pt;
}
.t-site-footer__content .c-menu__link:not([class*=" u-icon-"]),
.t-site-footer a.c-menu__link,
.t-site--footer-operations p,
.t-site--footer-operations p a{
    font-size: 0.825rem;
    font-weight: var(--font-medium);
    color: var(--white);
    text-decoration:none;
}
.t-site-footer a.c-menu__link:hover,
.t-site--footer-operations p a:hover{
    text-decoration:underline;
}


.t-site--footer-operations p{
    display:block;
    margin-bottom:1.5rem;
}
@media (min-width: 60em) {
    .t-site-footer .x-collapsible-content__item:not(#social_active):not(fieldset) {
        grid-template-rows: repeat(4, auto);
    }
}

.newsletter-description{
    color: var(--white);
    font-size: 0.66em;
    font-weight: var(--font-medium);
    display:block;
}
@media (min-width: 48em) {
   .newsletter-description{
    font-size: 0.8125rem;
    }
}

.newsletter-sep{
    display:block;
    width:100%;
    height:1.5rem;
}
.t-global-footer-social__list {
   width:100%;
}
.t-global-footer-social__link {
    padding: 0.5em;
    text-decoration: none;
    background-color: var(--gray-400);
    color: var(--theme-body-color);
    border-radius: var(--default-border-radius);
}
.t-global-footer-social__link:hover {
  border-radius: var(--default-border-radius);
  outline: var(--default-border-width) solid;
    text-decoration:none !important;
}

.t-site-footer__copyright {
    border-top: none;
    padding-bottom: 0.25rem;
    padding-top: 0.25rem;
}
.t-site-footer__copyright p{
    padding: 0.5rem;
}



/* CHH HOME HERO
   =========================================== */
#chh_hero .content-wrapper a{
   color:var(--theme-primary-color); 
}
#chh_hero .content-wrapper a:hover{
   color:var(--theme-primary-color-hover); 
}

#chh_iconbar{
    
}
#chh_iconbar .chh-icon{
    margin:0;
    padding:0 0 0 42px;
    display:inline-block;
    position:relative;
    
    
}
#chh_iconbar .chh-icon:before{
    content:'';
    display:block;
    position:absolute;
    left:0;
    top:50%;
    transform: translateY(-50%);
    
    width:32px;
    height:28px;
    
    background-repeat:no-repeat;
    background-positon:center center;
    background-size:contain;
    
}
#chh_iconbar .chh-icon-hondalogo:before{
    background-image:url('../../graphics/icons/chh-icon-hondalogo.png');
}
#chh_iconbar .chh-icon-truck:before{
    background-image:url('../../graphics/icons/chh-icon-truck.png');
}
#chh_iconbar .chh-icon-worldcart:before{
    background-image:url('../../graphics/icons/chh-icon-worldcart.png');
}


.two-column-content-image .image-column .o-layout-item-inner, 
.two-column-content-image .media-wrapper {
    height: 100%;
}



.c-button--new-window[target="_blank"]{
    position:relative;
    padding-right:56px;
}

.c-button--new-window[target="_blank"]:after{
    content:'\f08e';
    font-family: var(--font-awesome-family);
    font-size:clamp(0.925rem, 1.467rem + 3.913vw, 1rem);
    line-height:1.2;
    display:block;
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    right:12px;
    float:right;
    
    width:24px;
}



.chh-category-card .column-content-wrapper {
height:100%; 
}

.chh-category-card .column-content-wrapper-inner{
    
}

.chh-category-card .column-content-wrapper-inner-item{
    position:absolute !important;
    left:1rem;
    top:1rem;
    width:calc(100% - 2rem);
    height:calc(100% - 2rem);
}
.chh-category-card .column-content-wrapper-inner-item .heading-wrapper{
    position:absolute;
    left:0;
    bottom:40px;
    width:66%;
}
.chh-category-card .column-content-wrapper-inner-item .subheading-wrapper{
    position:absolute;
    left:0;
    bottom:0px;
    
}
.chh-category-card .column-content-wrapper-inner-item .content-wrapper{
    position:absolute;
    left:0;
    top:30px;
    opacity:0.01;
    transition: top 100ms, opacity 125ms ease-in-out;
}

.chh-category-card .carousel-item-inner:hover .column-content-wrapper-inner-item .content-wrapper{
    top:10px;
    opacity:1;
}
.chh-category-card .carousel-item-inner .media-wrapper-link {
    display: block;
    overflow: hidden;
    border-radius: 1.25rem;
}

.chh-category-card .carousel-item-inner .media-wrapper-link img{
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}
.chh-category-card .carousel-item-inner:hover .media-wrapper-link img{
transform: scale(1.12);
}

.chh-icon-card{
}
.chh-icon-card .o-layout-item-inner{
   border:solid 1px rgba(226, 226, 226, 1); 
   background-color:rgba(0, 50, 79, 0.8);
   border-radius:1.25rem; 
   padding:1.5rem 2.25rem;
}
.chh-icon-card .body-wrapper{
    min-height:120px;
}

#chh_trust_callout .chh-trust-footer .body-wrapper a{
    color:var(--theme-primary-color);
}
#chh_trust_callout .chh-trust-footer .body-wrapper a:hover{
    color:var(--theme-primary-color-hover);
}

#chh_authorized_callout .chh-honda-logo{
    max-width:84%;
}

.section-top-border-white--l{
    border-top:solid 2rem var(--white);
}

#chh_logo_bars .logo-bar .dwg-column-content-layout-item-inner{
    padding-top:2.5rem;
    padding-left:1.25rem;
    padding-right:1.25rem;
}
#chh_logo_bars .logo-bar .dwg-column-content-layout-item-inner .content-wrapper{
    position:absolute !important;
    top:0px;
    left:1.25rem;
}

@media (min-width: 60em) {
    #chh_logo_bars .dwg-column-content-layout:before{
        content:'';
        display:none;
        position:absolute;
        width:2px;
        height:66%;

        top:50%;
        transform:translateY(-50%);

        left:50%;

        background-color:rgba(185, 185, 185, 0.6);

    }

    #chh_logo_bars .logo-bar .dwg-column-content-layout-item-inner{
        display: inline-block;
    }
    #chh_logo_bars .logo-bar-left .dwg-column-content-layout-item-inner{
        float:right;
    }
    #chh_logo_bars .logo-bar-right .dwg-column-content-layout-item-inner{
        float:left;
    }
}
@media (min-width: 48em) {
    #chh_assistance_callout .dwg-column-content-layout:before{
        content:'';
        display:block;
        position:absolute;
        width:2px;
        height:56%;

        bottom:4%;

        left:50%;

        background-color:rgba(185, 185, 185, 0.6);

    }
}
    
.chh-category-footer-callout{
    padding-top:1rem;
}
.chh-category-footer-callout__item{
}
.chh-category-footer-callout__item-inner{
    
}
.chh-category-footer-callout__item .icon-item{
    position:absolute;
    left:0px;
    top:0px;
    
    
    width:42px;
    height:42px;
    padding:6px;
    border-radius:0.5rem;
    
    display:block;
    background-color:var(--theme-secondary-color);
}
.chh-category-footer-callout__item p{
    position:relative;
    color:var(--theme-secondary-color);
    font-size:1.125rem;
    font-weight:700;
    line-height:1.2;
    padding-left:58px;
}
.chh-category-footer-callout__item p span.small-font-item{
    display:block;
    font-size:0.775rem;
    color:rgba(77, 80, 84, 1);
    font-weight:400;
}

@media (min-width: 60em) {
    .border-white-lr--l{
        position:relative;
    }
    .border-white-lr--l:before,
    .border-white-lr--l:after{
        content:'';
        display:block;
        position:absolute;
        top:50%;
        transform: translateY(-50%);
        width:2px;
        height:94%;

        background-color:rgba(255,255,255,0.7);
    }
    .border-white-lr--l:before{
        float:left;
        left:0px;
    }
    .border-white-lr--l:after{
        float:right;
        right:0px;
    }
}

/* PRODUCT ITEM
   =========================================== */

.product-item{
    text-align:left;
}
.product-item .padding{
    padding:0 0 0 0;
    margin:1rem 0.5rem;
    position:relative;
    background-color:rgba(255,255,255,0.001);
    box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.001);
    -webkit-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.001);
    -moz-box-shadow: 0px 0px 3px 0px rgba(0,0,0,0.001);
    
    transition: background-color .2s ease, box-shadow .2s ease;
    
    /*
    background-color:rgba(0,0,0,0.001);
    transition: background-color .2s ease;
    */
}
.product-item .padding:hover{
    background-color:rgba(255,255,255,0.8);
    box-shadow: 0px 0px 12px 0px rgba(0,0,0,0.2);
    -webkit-box-shadow: 0px 0px 12px 0px rgba(0,0,0,0.2);
    -moz-box-shadow: 0px 0px 12px 0px rgba(0,0,0,0.2);
}
/*
.product-item .padding:hover .product-thumbnail{

    box-shadow: 0px 0px 14px 0px rgba(0,0,0,0.3);
    -webkit-box-shadow: 0px 0px 14px 0px rgba(0,0,0,0.3);
    -moz-box-shadow: 0px 0px 14px 0px rgba(0,0,0,0.3);

}
*/

.product-item .product-flag{
    display:inline-block;
    padding:0.375rem 1.25rem;
    border-radius:999px;
    background-color:var(--theme-accent-color);
    color:var(--white);
    font-size:0.75rem;
    text-transform:uppercase;
    letter-spacing:0.5pt;
    font-weight:700;
    
    position:absolute;
    top:1rem;
    right:1rem;
    
    float:right;
    z-index:5;
    
}
.product-item .product-details{
    position:relative;
    padding:0;
}
.product-item .product-thumbnail{
    padding:0;
    background-color:var(--white);
    
    /*
    transition: box-shadow .2s ease;
    position:relative;

    box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.1);
    -webkit-box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.1);
    -moz-box-shadow: 0px 0px 6px 0px rgba(0,0,0,0.1);
    */
}
.product-thumbnail .thumbnail-img-wrapper {
  display: block;
  width: 100%;
  aspect-ratio: 1 / 1;
  overflow: hidden;
  position:relative;
}
.product-thumbnail .thumbnail-img-wrapper:after{
    content:'';
    display:block;
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    
    background-color:rgba(0,0,0,0.01);
    transition: background-color .15s ease-in;
}
.product-item .padding:hover .product-thumbnail .thumbnail-img-wrapper:after{
    background-color:rgba(0,0,0,0.15);
}


.product-thumbnail .thumbnail-img-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.product-item .product-name,
.product-item .product-code,
.product-item .product-price,
.product-item .product-quantity{
    padding-left:1rem;
    padding-right:1rem;
}




.product-item .product-name{
    padding-top:1rem;
    padding-bottom:0rem;
    line-height:1.4;
}

.product-item .product-name a{
    font-size:var(--subheading-small);
    font-weight:var(--font-bold);
    font-family: var(--primary-font-family);
    letter-spacing:0;
    text-decoration:none;
    margin:0 0 0 0;
    padding:0 0 0 0;
}
@media (min-width: 48em) {
    .product-item .product-name a{
    font-size:var(--subheading-medium);
    }
}

.product-item .product-name a:hover{
    text-decoration:none;
}
.product-item .product-code{
    padding-top:0.25rem;
    padding-bottom:0.25rem;
    font-weight:700;
}
.product-item .product-code span{
    display:inline-block;
}
.product-item .product-code-label{

}
.product-item .product-code-value{
  font-weight:var(--font-bold);
}
.product-item .product-price{
    padding-top:0.125rem;
    padding-bottom:1rem;
}
.product-item .product-price span{
    display:inline-block;
}
.product-item .product-price .price-label{
    display:none;
}
.product-item .product-price-base_price{
    font-weight:var(--font-bold);
}

.product-item .product-price .x-product-list__price{
   font-weight:var(--font-bold); 
}

.product-item .product-quantity{
    padding-top:0.25rem;
    padding-bottom:0.25rem;
    display:none;
}

.product-item .purchase-buttons{
    
    /*
    padding-top:0rem;
    padding-bottom:0rem;

    display:flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content:space-between;
    align-items: center;
    */
    text-align:center;
    position:absolute;
    z-index:10;
    top:69%;
    left:50%;


    opacity:0.001;
    transform:translate(-50% , -50%);

    transition: opacity .2s ease-out, top .2s ease-out;
    
}
.product-item .padding:hover .purchase-buttons{
   
    top:60%;
    opacity:1;
}
/*
.u-grids-3--w .product-item .purchase-buttons{
  top:81%;
}
.u-grids-3--w .product-item .padding:hover .purchase-buttons{
  top:78%;  
}
.u-grids-5--w .product-item .purchase-buttons{
    top:73%;
}
.u-grids-5--w .product-item .padding:hover .purchase-buttons{
    top:68%;
}
*/


.product-item .purchase-buttons form{
    display:block;
    margin:0.75rem 0;
}

.product-item .purchase-buttons .c-button{
    /*
    width:100% !important;
    display:block;
    font-weight:var(--font-bold);
    border-radius:0px !important;


    background-color: var(--black);
    color: var(--white);

    border: none !important;
    outline:none !important;

    padding:0.75rem 1.375rem;
    */
}
.product-item .purchase-buttons .c-button:hover,
.product-item .purchase-buttons .c-button:focus,
.product-item .purchase-buttons .c-button:active{
    /*
    background-color: var(--gray-600);
    color: var(--white);
    */
}


/* ACCORDION ITEM
   =========================================== */
#fastfaqs{
    
}
#fastfaqs .fastfaqs{
    border-bottom:none !important;
    margin-bottom:0.5rem;
    
    border-radius:1rem;
    background-color: rgba(255, 255, 255, 1.00);
}
#fastfaqs .fastfaqs-question{
    position:relative;
    display:block;
    font-size: 18px;
    font-weight: 700;
    color: var(--theme-secondary-color);
    padding:0.5rem 1rem;
    
}
#fastfaqs .fastfaqs-question:hover{
    cursor: pointer;
}

#fastfaqs .fastfaqs-question:after{
    content:'\f078';
    font-family: var(--font-awesome-family);
    
    display:block;
    
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    float:right;
    right:1rem;
    transition: transform 0.25s ease;
}
#fastfaqs .fastfaqs.is-open .fastfaqs-question:after{
  -webkit-transform:translateY(-50%) rotate(-180deg);
  -moz-transform:translateY(-50%) rotate(-180deg);
  -ms-transform:translateY(-50%) rotate(-180deg);
  -o-transform:translateY(-50%) rotate(-180deg);
  transform:translateY(-50%) rotate(-180deg);
    
}
#fastfaqs .fastfaqs-answer{
   display:none; 
    padding:0.5rem 1rem;
}
#fastfaqs .fastfaqs.is-open .fastfaqs-answer {
  display: block;
}



/* Accordian Theme
   =========================================== */

.accordion-group .accordion-item{
    border-bottom:none !important;
    margin-bottom:0.5rem;
    
    border-radius:1rem;
    background-color: var(--white);
    border-color: var(--white);
}
.accordion-item .accordion-item-header{
}
.accordion-item .accordion-item-header-inner{
}
.accordion-item .accordion-item-trigger{
    display:flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content:space-between;
    align-items: center;
    gap:10px;

    text-decoration:none;

    padding:0.5rem 1rem;
}
.accordion-item .accordion-item-trigger:hover{
    text-decoration:none;
}

.accordion-item .accordion-item-trigger span{
    display:block;
    font-weight:700;
    color:var(--theme-secondary-color);
}
.accordion-item .accordion-item-trigger span.accordion-head-title{
}

.accordion-item .accordion-item-trigger span.accordion-head-icon{
    font-size:14px;
    width:22px;
    text-align:center;

    -webkit-transition:all 0.2s linear;
  -moz-transition:all 0.2s linear;
  -ms-transition:all 0.2s linear;
  -o-transition:all 0.2s linear;
  transition:all 0.2s linear;
    transform:rotate(0deg);
}

.accordion-item.a-u-icon-add .accordion-item-trigger span.accordion-head-icon{
    transform:rotate(0deg);
}

.accordion-item.active .accordion-item-trigger span.accordion-head-icon{
  -webkit-transform:rotate(-180deg);
  -moz-transform:rotate(-180deg);
  -ms-transform:rotate(-180deg);
  -o-transform:rotate(-180deg);
  transform:rotate(-180deg);
}
.accordion-item.a-u-icon-add.active .accordion-item-trigger span.accordion-head-icon{
    transform:rotate(-45deg);
}

.accordion-item .accordion-item-content-inner{
    padding:0.5rem 1rem 1rem 1rem;
    font-size:1.125rem;
}
.accordion-item .accordion-item-content {
  max-height: 0;
  overflow: hidden;
  -webkit-transition: max-height 0.2s ease-out;
  -moz-transition: max-height 0.2s ease-out;I’m
  -ms-transition: max-height 0.2s ease-out;
  -o-transition: max-height 0.2s ease-out;
  transition: max-height 0.2s ease-out;
}
.accordion-item.active .accordion-item-content {
  max-height:auto;
}

.accordion-item.u-left-icon .accordion-item-trigger{
    justify-content:flex-start;
}
.accordion-item.u-left-icon .accordion-item-trigger span.accordion-head-title{
    order:2;
}
.accordion-item.u-left-icon .accordion-item-trigger span.accordion-head-icon{
    order:1;
}
.accordion-item.u-left-icon .accordion-item-content-inner{
    padding:0.5rem 0.5rem 0.5rem 40px;
}



/* FAQ SECTION LIST
   =========================================== */
/* Nav column list */
#faq_nav_column .dwg-faqs-section-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
#faq_main_column .dwg-faqs-section-list {
    display:none !important;
}
#faq_main_column .dwg-faq-section-list-layout-item-inner{
    padding-bottom:1rem;
}

#faq_nav_column .dwg-faqs-section-list-select-wrapper{
    display:none;
}

#faq_nav_column .dwg-faq-section-list-layout-item{
   display:none; 
}
#faq_main_column .dwg-faq-section-list-layout-item{
    display:block;
} 
@media (min-width: 60em) {
#faq_nav_column .dwg-faq-section-list-layout-item{
   display:block; 
}
    
#faq_main_column .dwg-faq-section-list-layout-item{
    display:none;
}   
}


#faq_nav_column .dwg-faqs-section-list-item {
  margin-bottom: 4px;
}

#faq_nav_column .dwg-faqs-section-list-item-trigger {
  display: block;
  padding: 10px 16px;
  text-decoration: none;
  font-size: 0.9rem;
  border-left: 3px solid transparent;
  transition: background-color 0.2s ease, border-color 0.2s ease;
}

/* Active state */
#faq_nav_column .dwg-faqs-section-list-item-trigger.is-active {
  font-weight: 700;
  background-color: #eef4fb;
  border-left-color: #0099cc;
}

/* Hover */
#faq_nav_column .dwg-faqs-section-list-item-trigger:hover {
  background-color: #f5f9fd;
  border-left-color: #0099cc;
}


#chh_faqs .dwg-faq-section-items-heading-wrapper {
  display: flex;
  align-items: center;
    justify-content: space-between;
  border-bottom: 1px solid var(--gray-400);
  padding: 10px 0;
  margin-bottom: 0;
}

#chh_faqs .faq-question-count {
  font-size: 0.75rem;
  font-weight: 700;
  color: var(--theme-primary-color);
    padding:0.325rem 0.75rem;
    background-color:rgba(232, 244, 252, 1);
    border-radius:999px;
  margin-left: auto;
}
#chh_faqs .dwg-faq-section-items-heading-wrapper h3{
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
    padding:0.5rem 0.5rem 0.5rem 46px;
  margin: 0;
  color:var(--theme-secondary-color);
    
  position:relative;
}
#chh_faqs .dwg-faq-section-items-heading-wrapper h3:before{
    content:'';
    display:block;
    
    position:absolute;
    top:50%;
    left:0px;
    transform:translateY(-50%);
    
    width:36px;
    height:36px;
    background-color:rgba(232, 244, 252, 1);
    border-radius:6px;
}

#chh_faqs .dwg-faq-section-items-block {
  margin-bottom: 32px;
}

/* Override theme accordion item styles */
#chh_faqs .accordion-group .accordion-item {
  border-bottom: 1px solid var(--gray-400) !important;
  border-radius: 0 !important;
  margin-bottom: 0 !important;
}

/* Trigger row */
#chh_faqs .accordion-item .accordion-item-trigger {
  padding: 12px 0 0 0!important;
  width: 100%;
}

/* Override theme span color */
#chh_faqs .accordion-item .accordion-item-trigger span {
  color: inherit;
}

#chh_faqs .accordion-head-title {
  font-weight: 700;
  flex: 1;
  padding-right: 16px;
}

/* Circle toggle icon — override theme icon styles */
#chh_faqs .accordion-item .accordion-item-trigger span.accordion-head-icon {
  width: 22px;
  height: 22px;
  transform: none !important;
  font-size: inherit;
}

#chh_faqs .accordion-head-icon .u-icon-custom {
  display: block;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 2px solid var(--gray-400);
  flex-shrink: 0;
  transition: background-color 0.2s ease, border-color 0.2s ease;
}

/* Open state */
#chh_faqs .accordion-item.active .accordion-item-trigger .accordion-head-title {
  color: var(--theme-primary-color);
}

#chh_faqs .accordion-item.active .accordion-head-icon .u-icon-custom {
  background-color: var(--theme-primary-color);
  border-color: var(--theme-primary-color);
}

#chh_faqs .accordion-item .accordion-item-content{
    margin-bottom:12px !important;
}

#chh_faqs .accordion-item.active .accordion-item-content{
}

#chh_faqs .accordion-item .accordion-item-content-inner {
  border-left: 3px solid var(--theme-primary-color);
  padding: 8px 0 16px 16px !important;
  font-size: 0.9rem;
  line-height: 1.6;
}

#chh_faqs .accordion-item-content-inner p {
  margin: 0;
    
}
/*
.dwg-faqs-section-list{
    display:block;
    list-style:none;
    margin:0;
    padding:0;
    
}
.dwg-faqs-section-list-item{
    display:block;
    margin:0 0 0.5rem 0;
    padding:0 0 0 0;
}
.dwg-faqs-section-list-item .dwg-faqs-section-list-item-trigger{
    display:block;
    text-decoration:none;
    
    font-size:0.825rem;
    line-height:1.2;
    text-transform:uppercase;
    letter-spacing:1pt;
    font-weight:700;
    text-align:center;
    padding:0.75rem 1rem;
    margin:0;
    border-radius:999px;
    
    color:var(--white);
    background-color:var(--theme-body-color);
}
.dwg-faqs-section-list-item .dwg-faqs-section-list-item-trigger:hover{
    color:var(--white);
    background-color:var(--theme-primary-color);
}
.dwg-faqs-section-list-item .dwg-faqs-section-list-item-trigger.is-active,
.dwg-faqs-section-list-item .dwg-faqs-section-list-item-trigger.is-active:hover{
    background-color:var(--theme-primary-color);
}
*/

/* COLUMN CAROUSEL ITEM
   =========================================== */
.dwg-column-carousel-section{

}
.dwg-column-carousel-item{

}
.dwg-column-carousel-item-inner{

}
.dwg-column-carousel-item .column-media-wrapper{

}
.dwg-column-carousel-item .column-media-wrapper-inner{

}

.dwg-column-carousel-item .column-content-wrapper{

}
.dwg-column-carousel-item .column-content-wrapper-inner{
    padding:1rem;
}



/* TESTIMONIAL ITEM
   =========================================== */
.testimonial-item{

}
.testimonial-item .testimonial-item-inner{
    margin:0.5rem;
    padding:1rem;
}
.testimonial-item p{
    margin:0;
    padding:0;
}
.testimonial-item .testimonial-item-content{
    padding:0.5rem;
}
.testimonial-item .testimonial-item-desc{
    font-style:italic;
}
.testimonial-item .testimonial-item-desc .testimonial-desc-quote{
    display:inline-block;

}
.testimonial-item .testimonial-item-desc .testimonial-desc-quote-start{
    margin-right:0.065rem;
}
.testimonial-item .testimonial-item-desc .testimonial-desc-quote-end{
    margin-left:0.065rem;
}
.testimonial-item .testimonial-item-desc p{

}
.testimonial-item p.testimonial-item-name{
    font-weight:700;
}
.testimonial-item p.testimonial-item-title{
}
.testimonial-item p.testimonial-item-location{
}
.testimonial-item p.testimonial-item-date{
}
.testimonial-stars .testimonial-stars-row span{
    display:inline-block;
    margin:0 0.125rem;
}
.dwg-testimonials-content-layout-item-inner{
    padding-bottom:1.5rem;
}
.dwg-testimonials-button-layout-item-inner{
    padding-top:1.5rem;
}


/* FLEX TAB ITEM
   =========================================== */
.tab-header-list {
    display: none;
    gap: 0;
    list-style: none;
    margin: 0;
    padding: 0;
}

.tab-header-list a.tab-header-list-link {
    line-height:1;
    font-size: 0.85rem;
    font-weight:700;
    text-decoration: none;
    padding:0.875rem 1.675rem;
    display:block;
}
.tab-header-list-item.active a.tab-header-list-link {
    color:var(--theme-secondary-color);
    position:relative;
}
.tab-header-list-item.active a.tab-header-list-link:after {
    content:'';
    display:block;
    position:absolute;
    width:calc(100% - (1.675rem * 2));
    height:2px;
    background-color:var(--theme-primary-color);
    
    left:50%;
    transform:translateX(-50%);
    bottom:0px;
}
.tab-content a.tab-header-list-link--s{
   line-height:1;
    font-size: 0.85rem;
    text-decoration: none;
    display:flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content:space-between;
    align-items: center;
    gap:10px;

    text-decoration:none;

    padding:1rem 1.125rem 1rem 1.125rem;
}
.tab-content a.tab-header-list-link--s span{
    display:block;
}
.tab-content a.tab-header-list-link--s span.tab-header-list-link--title{
    font-size:1rem;
    font-weight:700;
    color:var(--theme-secondary-color);
}
.tab-content a.tab-header-list-link--s span.tab-header-list-link--icon{
    font-size:14px;
    width:22px;
    text-align:center;

    -webkit-transition:all 0.2s linear;
  -moz-transition:all 0.2s linear;
  -ms-transition:all 0.2s linear;
  -o-transition:all 0.2s linear;
  transition:all 0.2s linear;
    transform:rotate(0deg);
}
.tab-content a.tab-header-list-link--s.active span.tab-header-list-link--icon{
    transform:rotate(-45deg);
}

.tab-content{
}
.tab-content a.tab-header-list-link--s,
.tab-content .tab-content-item{
    border-bottom:solid 1px var(--gray-400);
}
.tab-content a.tab-header-list-link--s.active{
    border-bottom:solid 1px transparent;
}
.tab-content .tab-content-item-inner{
    padding:1rem 1.125rem;
}


@media (min-width: 48em) {
.tab-header-list {
    display:flex;
    }
.tab-content a.tab-header-list-link--s{
    display:none;
    }
.tab-header-list a.tab-header-list-link {
    font-size: 0.875rem;
    padding:0.875rem 1.675rem;
}
.tab-content .tab-content-item-inner{
    padding:1rem 1.675rem;
}
}

@media (min-width: 60em) {
    .tab-header-list a.tab-header-list-link {
        font-size: 1.25rem;
        padding:1rem 2.5rem;
    }
    .tab-content .tab-content-item-inner{
        padding:1.25rem 2rem;
    }
}


/***** HEADING BUTTON INLINE *********/
.u-heading-button-inline .section-header-layout-item-inner {
    display:flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content:space-between;
    /* align-items: center; */
    gap:1rem;
}
@media (min-width: 48em) {
    .u-heading-button-inline .section-header-layout-item-inner {
        flex-direction: row;
        flex-wrap: nowrap;
    }
}
.u-heading-button-inline .section-header-layout-item-inner > * {
    /*
    flex: 1;
    */
}
.u-heading-button-inline .heading-wrapper > *{
    line-height:1;
    margin: 0;
}
@media (min-width: 48em) {
.u-heading-button-inline .heading-wrapper{
    flex-grow: 2;
}
.u-heading-button-inline .button-wrapper{
    flex-grow: 1;
}
}



/***** TESTING FLEX HERO *********/
.dwg-hero-slider-section .dwg-carousel .owl-nav{
    margin:0;
}
.dwg-hero-slider-section .dwg-carousel .owl-nav button{
    display:block;
    position:absolute;
    z-index:10;
    top:50%;
    transform:translateY(-50%);

    text-decoration:none;

    font-size:1.25rem;
    line-height:50px;
    text-align:center;

    width:36px;
    height:48px;
    margin:0;
    padding:0;
    background:transparent;
    cursor: pointer;
    border-radius:0;

}
.dwg-hero-slider-section .dwg-carousel .owl-nav button:hover{
    background:transparent;
}
.dwg-hero-slider-section .dwg-carousel .owl-nav button.owl-prev{
     left:0px;
    float:left;
}
.dwg-hero-slider-section .dwg-carousel .owl-nav button.owl-next{
    right:0px;
    float:right;
}


/* CATEGORY FILTERING
    =========================================== */

.product_sorting_column{
  display:flex;  
  justify-content:flex-end;
  align-items:flex-start;
  gap:1rem;
}

.c-control-grid-toggle{
    border: solid 2px var(--theme-body-color) !important;
    border-radius:999px;
    width:120px;
}
button.c-button.grid-toggle{

    background-color:var(--white) !important;
    color: var(--theme-body-color) !important;

    padding:6px 6px 6px 6px;
    border:none !important;
    outline:none !important;
}

@media screen and (min-width: 60em) {
    button.c-button.grid-toggle{
    padding:10px 6px 8px 6px;
    }
}
button.c-button.grid-toggle.grid-toggle--1-col{
    border-bottom-left-radius: 999px;
    border-top-left-radius: 999px;

    border-bottom-right-radius: 0px;
    border-top-right-radius: 0px;
    
    border-right: solid 1px var(--theme-body-color) !important;
}
button.c-button.grid-toggle.grid-toggle--2-col{
    border-bottom-left-radius: 0px;
    border-top-left-radius: 0px;
    
    border-bottom-right-radius: 999px;
    border-top-right-radius: 999px;
    
    border-left: solid 1px var(--theme-body-color) !important;
}
button.c-button.grid-toggle.grid-toggle--3-col{
    border-bottom-left-radius: 999px;
    border-top-left-radius: 999px;

    border-bottom-right-radius: 0px;
    border-top-right-radius: 0px;
    
    border-right: solid 1px var(--theme-body-color) !important;
}
button.c-button.grid-toggle.grid-toggle--5-col{
    border-bottom-left-radius: 0px;
    border-top-left-radius: 0px;

    border-bottom-right-radius: 999px;
    border-top-right-radius: 999px;
    
    border-left: solid 1px var(--theme-body-color) !important;
}


button.c-button.grid-toggle.grid-toggle--s{
    display:block;
}
button.c-button.grid-toggle.grid-toggle--l{
    display:none;
}
@media screen and (min-width: 60em) {
    button.c-button.grid-toggle.grid-toggle--s{
        display:none;
    }
    button.c-button.grid-toggle.grid-toggle--l{
        display:block;
    }
}

button.c-button.grid-toggle:hover,
button.c-button.grid-toggle:focus{
    color:var(--theme-body-color) !important;
    background-color:var(--gray-200) !important;
}
button.c-button.grid-toggle.active,
button.c-button.grid-toggle.active:hover,
button.c-button.grid-toggle.active:focus{
    color:var(--gray-100) !important;
    background-color:var(--theme-primary-color) !important;
}


/*
button.c-button.c-button--filters{
    outline:none !important;
    position:relative;
    
    background-color:var(--white) !important;
    color: var(--theme-body-color) !important;
    
    font-size:0.725rem;
    padding:0.5rem 32px 0.5rem 0.5rem !important;
    border-radius:999px;
    border: solid 2px var(--theme-body-color) !important;
    min-width:auto !important;
}
button.c-button.c-button--filters:after{
    content:'';
    position:absolute;
    right:0.75rem;
    top:50%;
    transform:translateY(-50%);
    float:right;
    width:12px;
    height:12px;
    background-image:url('../../graphics/icons/ziel-icon-filter.png');
    background-repeat:no-repeat;
    background-position:center center;
    background-size:contain;
}

button.c-button.c-button--filters:hover,
button.c-button.c-button--filters:focus{
    outline:none !important;
    border-color:var(--theme-body-color) !important;
    color:var(--theme-body-color) !important;
    background-color:var(--gray-200) !important;
}
@media screen and (min-width: 60em) {
    button.c-button.c-button--filters{
        font-size:0.75rem;
        padding:0.75rem 48px 0.75rem 0.75rem !important;
    }
    #product_sorting .c-form-select::after {
        right:0.75rem;
        width:20px;
        height:16px;
    }
    
    button.c-button.c-button--filters:after{
        right:0.75rem;
        width:20px;
        height:20px;
    }
}
*/

/*
#product_grid.fade-out {
  opacity: 0;
  transition: opacity .25s ease;
}

#product_grid.fade-in {
  opacity: 1;
  transition: opacity .25s ease;
}
*/

#toggle_filters{
     position:relative;
    display:inline-block;
    
    font-size: 0.775rem;
    font-weight:700;
    letter-spacing:0.75pt;
    text-transform:uppercase;
    
    background-color:var(--gray-100) !important;
    
    color: var(--theme-primary-color) !important;
    
    
    padding:0.5rem 40px 0.5rem 0.5rem !important;
    border: none;
    border-radius: var(--default-border-radius);
    transition: background-color 100ms ease-in;
}
#toggle_filters:hover{
    background-color:var(--gray-200) !important;
    cursor:pointer;
}
#toggle_filters::after {
    content:'';
    position:absolute;
    right:0.75rem;
    top:50%;
    transform:translateY(-50%);
    float:right;
    width:20px;
    height:18px;
    background-image:url('../../graphics/icons/chh-icon-filter-blue.png');
    background-repeat:no-repeat;
    background-position:center center;
    background-size:contain;
    
}  
    
    
    
    
    
#product_grid{
    margin-left:0px;
    padding-right: 2rem;
    padding-left: 2rem;
}

#product_sorting{
    margin-left:0px;
    padding-right: 2rem;
    padding-left: 2rem;
}


#product_sorting form{
    margin-bottom:0;
    display:flex;
    gap:1rem;
}


#product_sorting .c-form-select{
    margin-bottom:0;
}

#product_sorting .c-form-select::before {
    display:none;
}
#product_sorting .c-form-select::after {
    
    content:'';
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    float:right;
    right:0.75rem;
    width:20px;
    height:16px;
    background-image:url('../../graphics/icons/chh-icon-sort-blue.png');
    background-repeat:no-repeat;
    background-position:center center;
    background-size:contain;
    
}

#product_sorting .c-form-select__dropdown--small {
    width: 100%;
    min-width:76px;
    font-size: 0.775rem;
    font-weight:700;
    letter-spacing:0.75pt;
    text-transform:uppercase;
    position:relative;
    
    background-color:var(--gray-100) !important;
    
    color: var(--theme-primary-color) !important;
    
    
    padding:0.75rem 48px 0.75rem 0.75rem !important;
    border: none !important;
    transition: background-color 100ms ease-in;
}
    
    

#product_sorting .c-form-select__dropdown--small:hover{
background-color:var(--gray-200) !important;
}



.js-filter-layout{
    min-height:860px;
}
.x-display-list-filtering{
    margin-bottom: 0 !important;
}
    
#product_filters{
background-color:#f0f5f8;
}
.product-filters-inner{
    padding:1rem;
    position:relative;
}
@media screen and (min-width: 60em) {
   .product-filters-inner{
    padding:0.5rem 0.5rem 0.5rem 0.125rem;
    }
}
.product-filters-header{
    display:flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
    align-items:center;
}
.product-filters-header span,
.product-filters-header a{
    display:block;
}
.product-filters-header span.product-filters-header-title{
    padding:0.25rem 1rem;
    margin:0 0 0 0.5rem;
    font-size:1.25rem;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:0.5pt;
    
    color:var(--theme-primary-color);
}


#product_filters_close{
    line-height:1;
    color:var(--white);
    background-color: var(--theme-primary-color);
    font-size:0.75rem;
    text-decoration:none;
    margin: 0 1rem 0 0;
    padding:0.5rem;
    border-radius:50%;
}
#product_filters_close:hover,
#product_filters_close:focus{
    color:var(--white);
    background-color: var(--theme-secondary-color);
}


.js-filter-sidebar {
  position: fixed;
  top: 0;
  left: 0;

  height: 100%;
  width: 100%;
  transform: translateX(-102%);
  transition: transform 0.3s ease;
  overflow-y: auto;
  z-index: 10;
}


/* When open */
.js-filter-sidebar.is-open {
  transform: translateX(0);
}
.js-products-col{
    padding-bottom:3rem;
}
/* Product column default (padding = 0) */
.js-products-col {
  transition: padding-left 0.35s ease;

}

.js-products-col.with-sidebar-padding {
  padding-left: 0px;
}
@media screen and (min-width: 60em) {
    .js-filter-sidebar {
      position: absolute;
      height: 100%;
      width: 320px;
    }
    .js-products-col.with-sidebar-padding {
      padding-left: 340px;
    }

}


/* Category Tree
    =========================================== */

/*
.x-category-tree .x-category-tree__title{
  display:block !important;
}
.x-category-tree__heading{
    padding:0 1rem;
    margin-bottom:0.25rem;
}

.x-category-tree__row{
    visibility: visible !important;
    max-height: none !important;
    opacity: 1 !important;
}
.x-category-tree__row li{
    display:block;
    margin:0;
    padding:0 1rem;
}
.x-category-tree__row li.x-category-tree__list--level-1{
}
.x-category-tree__row li.x-category-tree__list--level-2{

}

.x-category-tree__row li a.x-category-tree__link{
    padding:0.25rem 0.75rem;
    font-size:0.775rem;
    margin:0.25rem;
    border-bottom:solid 1px var(--theme-body-color);
    color:var(--theme-body-color);
}
.x-category-tree__row li:first-of-type a{
    border-top:solid 1px var(--theme-body-color);
}
.x-category-tree__row li a.x-category-tree__link:hover{
    text-decoration:none;
    color:var(--theme-primary-color);
}
li.x-category-tree__list--level-1 a{
    font-size:0.875rem;
}
li.x-category-tree__list--level-2 a{
    padding:0.25rem 0.5rem;
    font-size:0.775rem;
}

.x-category-tree__row li.x-category-tree__list--level-1 a.x-category-tree__link.x-category-tree__link--current{
    color:var(--theme-primary-color);
    text-decoration:none;
    font-weight:700;
}

.x-category-tree__row li.x-category-tree__list--level-2 a.x-category-tree__link.x-category-tree__link--current{
    color:var(--theme-body-color);
    text-decoration:none;
    font-weight:700;
}
.x-category-tree__row li a.x-category-tree__link:hover{
    color:var(--theme-primary-color);
}
*/
    
    
.x-category-tree{
   padding:0 1.5rem;
}
.x-category-tree .x-category-tree__title{
  display:block !important;
    font-size:1.125rem;
    margin-top:1rem;
}
.x-category-tree .x-category-tree__title .x-category-tree__heading{
    padding:0 0;
    margin:0;
}   
.c-category-left-row-width{
	width:100%;
	display: flex;
}  
.x-category-tree .c-keyline{
    margin-top:4px;
    margin-bottom:4px;
        
    }
    
.x-category-tree p.o-list-inline__item{
    margin:0;
    padding:0;
    line-height:1;
    }
.x-category-tree p.o-list-inline__item.u-icon-add{
    color:var(--theme-secondary-color);
        
    }    
.x-category-tree p.o-list-inline__item.u-icon-chevron-up{
    color:var(--theme-secondary-color);
    }
    
.x-category-tree p.o-list-inline__item:hover{
    cursor:pointer;
    }
.x-category-tree li.x-category-tree__list--level-1 a{
   padding:0.125rem 0.125rem 0.125rem 0.125rem;
    margin:0;
    font-size:0.925rem;
    font-weight:700;
    color:var(--theme-secondary-color);
}
.x-category-tree li.x-category-tree__list--level-2 a{
    padding:0.125rem 0.125rem 0.125rem 0.125rem;
    margin:0 0 0 0.5rem;
    font-size:0.85rem;
    font-weight:700;
    color:var(--theme-secondary-color);
}
.x-category-tree li.x-category-tree__list--level-3 a{
    padding:0.125rem 0.125rem 0.125rem 0.125rem;
    margin:0 0 0 1.125rem;
    font-size:0.775rem;
    font-weight:700;
    color:var(--theme-secondary-color);
}
.x-category-tree li.x-category-tree__list--level-4 a{
    padding:0.125rem 0.125rem 0.125rem 0.125rem;
    margin:0 0 0 1.5rem;
    font-size:0.75rem;
    font-weight:700;
    color:var(--theme-secondary-color);
}
.x-category-tree li.x-category-tree__list--level-1 a.x-category-tree__link--current,
.x-category-tree li.x-category-tree__list--level-1 a.x-category-tree__link--current:hover,
.x-category-tree li.x-category-tree__list--level-2 a.x-category-tree__link--current,
.x-category-tree li.x-category-tree__list--level-2 a.x-category-tree__link--current:hover,
.x-category-tree li.x-category-tree__list--level-3 a.x-category-tree__link--current,
.x-category-tree li.x-category-tree__list--level-3 a.x-category-tree__link--current:hover,
.x-category-tree li.x-category-tree__list--level-4 a.x-category-tree__link--current,
.x-category-tree li.x-category-tree__list--level-4 a.x-category-tree__link--current:hover{
    color:var(--theme-primary-color);
}
/* Facets Tree
    =========================================== */

.facets-tree{
    margin-bottom:1.5rem;
    padding: 0.5rem 1rem;
}
.facets-tree .facet-item{
    padding:0.125rem 0.125rem;
    margin-bottom:0.25rem;
}
.facet-item .facet-header{
    margin:0;
    padding:0.5rem 0.75rem;
    border-radius:1rem;
    background-color:rgba(211, 201, 184, 1);

}
.facet-item .facets-name{
    display:block;
    font-size:0.875rem;
    line-height: 1.2;
    margin:0px;
    padding:0px 30px 0px 0px;
    position:relative;
    color: var(--gray-600);

}
.facet-item .facets-name:hover{
    cursor:pointer;
}

.facet-item .facets-name:after{
    content: "\31";
    font-family:"ReadyTheme Icons", sans-serif;
    display: block;
    position: absolute;
    z-index: 1;
    top: 0px;
    right: 0px;
    width: 20px;
    height: 20px;
    float: right;
    text-align: center;
    font-size:0.775rem;
    line-height: 20px;
    transform: rotate(0deg);
    transition: all .2s ease-in-out;

    color:var(--theme-body-color);

}
.facets-tree .facet-item.active .facets-name:after{
    transform: rotate(180deg);
}
.facet-item .facet-content{
    margin:0;
    padding:0rem 0.25rem;
    display:none;
}
.facet-item .facet-content label,
.facet-item .facet-content a{
    display:block;
    padding:0.25rem 0.75rem;
    font-size:0.775rem;
    margin-bottom:0.25rem;
    border-bottom:solid 1px var(--theme-body-color);
    text-decoration:none;
}
.facet-item .facet-content label:last-of-type{
    border-bottom:none;
}

.facet-item .facet-content label:hover,
.facet-item .facet-content a:hover,
.facet-item .facet-content label:has(input[type="checkbox"]:checked){
    color:var(--theme-primary-color);
    text-decoration:none;
}

.facet-item .facet-content input[type="checkbox"]{
    position: relative;
    top:2px;
    margin-right:0.5rem;
}
.facets-wrapper{

}
.facets-wrapper a.facets-view-trigger{
    display:block;
    font-size:1rem;
    text-transform:uppercase;
    line-height:1.2;
    font-weight:700;
    margin:0 0 1rem 0;
    padding:0.75rem;

    color:var(--theme-primary-color);
    text-decoration:none;

}


/* Category Header
    =========================================== */
.o-category-header-wrapper{
}
.o-category-header-layout{
}

.o-category-header-layout__item{

}
.o-category-header-layout__item-inner{
    padding:0;
}



/* ==========================================================================
   EXTENSIONS / PAGINATION
   ========================================================================== */
/**
 * Pagination is for use in product list as well as any place a pageable batch
 * list or data is used.
 */
.x-pagination {
  margin-bottom:0;
  max-width: 16rem;
  padding:2rem 0 2.5rem 0;
}

.x-pagination--centered {
  justify-content: center;
  margin-left: auto;
  margin-right: auto;
}

.x-pagination--right {
  margin-left: auto;
}

.x-pagination__list {
  align-items: center;
  display: flex;
  gap: var(--default-spacing-unit);
  justify-content: space-between;
  list-style: none;
  margin: 0;
  width: 100%;
}

.x-pagination__link {
  border-color: var(--transparent);
  border-radius: 50%;
  color: var(--white);
  height: 2rem;
  padding: 0;
  width: 2rem;
}
}
.x-pagination .c-button.x-pagination__link{
    padding:0.75rem 0.75rem;
}
.x-pagination .c-form-select {
  margin-bottom: 0;
}
.x-pagination .c-form-select .c-form-select__dropdown{
    padding: 0.5rem 1.75rem 0.5rem 0.75rem;
}

/* SINGLE PRODUCT LAYOUT
    =========================================== */
#product_main{
    background-color:rgba(243, 243, 243, 1);
}

.product_main-wrapper{
   padding-top:2.25rem; 
}

#product_tabs{
    background-color:rgba(223, 223, 223, 1);
}

 .x-product-layout {
     margin:0;
     padding:0;
    }

@media (min-width: 60em) {
    .x-product-layout {
     margin:0;
     padding:0;
    }
}

.c-form-list__item--description{
    
}
.c-form-list__item--flag{
    
}
.product-page-flag{
    display:inline-block;
    padding:0.375rem 1.25rem;
    border-radius:999px;
    background-color:var(--theme-accent-color);
    color:var(--white);
    font-size:0.75rem;
    text-transform:uppercase;
    letter-spacing:0.5pt;
    font-weight:700;
    
}
.c-form-list__item--title{
    padding-top:1rem;
    padding-bottom: 1.25rem;
}
.c-form-list__item--title h1{
    font-size:var(--title-two);
    font-weight:700;
    letter-spacing:-0.25pt;
    line-height:1.4;
    margin:0;
    padding:0;
    
    color:var(--theme-secondary-color);
    
}
.c-form-list__item--reviews{
}

.c-form-list__item--meta{
    padding-bottom: 0.5rem;
}
.c-form-list__item--meta span{
    display:block;
    font-size:0.875rem;
    line-height:1.4;
    font-weight:700;
    margin:0;
    padding:0;
}

.c-form-list__item--pricing{
}
.x-product-layout-purchase__product-discounts {
    margin-bottom:0;
}
.x-product-layout-purchase__name span{
    display:block;
}
.x-product-layout-purchase__name span.x-product-layout-purchase__title{
    display:block;
    line-height:1.1;
}
.x-product-layout-purchase__name {
    margin-bottom: 0.75rem;
}
.x-product-layout-purchase__pricing {
    margin-bottom: var(--message-one);
}
.small-price-display .price-description-label{
    
}
.small-price-display td{
    font-size:0.875rem;
    margin:0;
    padding:0 0 0.15rem 0;
}
.current-price-font{
    font-size:1rem;
    font-weight:700;
    margin:0;
    padding:0;
}
.current-price-font span{
    color:var(--theme-accent-color);
}


.x-product-layout-purchase__cta,
.x-social-icon-menu,
.c-form-list__item--description,
.c-form-list__item--vehicle-applications,
.c-form-list__item--installation-instructions,
.c-form-list__item--additional-notes{
    padding-bottom:1rem;
    border-bottom:solid 1px var(--gray-400);
    margin-bottom:0.875rem;
}

.c-form-list__item--content{
    
}
.c-form-list__item--content h3.c-form-list__item--block-header{
    font-size:var(--paragraph-large);
    color:var(--theme-secondary-color);
    font-weight:700;
    line-height:1.2;
    margin:0 0 1.25rem 0;
    padding:0;
}

.x-social-icon-menu{
    padding:0.5rem 0 1rem 0;
    align-items:center;
}
.x-social-icon-menu span.x-share-label{
    font-size: var(--paragraph-large);
    color: var(--theme-secondary-color);
    font-weight: 700;
    line-height: 1.2;
    margin: 0 0.25rem 0 0;
    padding: 0;
    
}

.c-form-list__item--warning{
    
}
.c-form-list__item--warning span.x-warning-label{
   padding:0.5rem;
    font-size:0.725rem;
    font-weight:700;
    line-height:1.4;
}


@media (min-width: 75em) {
  .x-product-layout-purchase__pricing,
  .x-product-layout-purchase__inventory-message,
  .x-product-layout-purchase__options,
  .x-product-layout-purchase__cta {
    max-width: none;
    width: 100%;
  }
}

.x-product-layout-purchase__cta .x-quantify{
    height: calc(3em - var(--default-border-width)) !important;
}
.x-product-layout-add-to-wishlist{
    padding-top:0.5rem;
}
#add-to-wishlist{
    font-size:0.775rem;
}
@media (min-width: 60em) {
    .x-product-detail__item-inner{
        padding-left:1rem;
    }
}

.x-product-layout .x-messages {
    font-size: 0.75rem !important;
    font-weight:700;
}

/* SINGLE PRODUCT MEDIA
    =========================================== */
 .x-product-media__item{
    flex-direction:column;
     margin-bottom:1.5rem;
} 
.x-main-image-thumbnails{
    list-style:none;
    flex-basis:100%;
}
.x-product-layout-images__thumbnail-image{
    margin:0;
    
}
.x-product-layout-images__thumbnail-image img{
    width: 100%;
    height: 80%;
    object-fit: cover;
}
.x-main-image-container{
    display:block;
    flex-basis:100%;
}

@media screen and (min-width: 60em) {
 .x-product-media__item{
    flex-direction:row;
     justify-content:space-between;
} 
.x-main-image-thumbnails{
    flex-basis:20%;
 }
.x-main-image-container{
    flex-basis:78%;
}   
}



/* PRODUCT PAGE ADDITIONAL CAROUSELS
    =========================================== */
#product_additional{
    padding-top:2.25rem;
    padding-bottom:2.25rem;
    background-color: rgba(243, 243, 243, 1);
}


/* REVIEWS
    =========================================== */
.c-form-list__item--reviews{
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    justify-content: flex-end;
    align-items: flex-end;
    gap: 0;
    flex-basis: 40%;
}
.tgreviews-average {
}

#product-header-reviews .tgreviews-average__star,
#product-header-reviews .tgreviews-average__star-overlay {
    position: relative;
}
#product-header-reviews .tgreviews-average__star,
#product-header-reviews .tgreviews-average__star-overlay,
#product-header-reviews .tgreviews-rating-stars{
    font-size: 0.875rem;
    margin-top:0;
    text-align:left;
}

#product-header-reviews .tgreviews-average__star-overlay,
#product-header-reviews .tgreviews-average__star-overlay span{
    margin-top:0 !important;
}

#product-header-reviews .tgreviews-average__star{
    color: var(--gray-400);
    display: inline-block;
    position: relative;
}
#product-header-reviews .tgreviews-average__star-overlay {
    color: var(--theme-primary-color);
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden;
}

#product-header-reviews .tgreviews-average__text {
    font-weight: 600;
    text-transform:uppercase;
    font-size:0.625rem;
}


/* ==========================================================================
   SELECT DROPDOWN STYLES
   ========================================================================== */
.o-select-wrap{
  position: relative;
  display: flex;
    width:100%;
  min-width: 200px;
  height: 56px;
  overflow: hidden;
    padding: 0.5rem 0.5rem;
    font-size: 0.875rem;
    letter-spacing:0.5pt;
    font-weight: 600;
    line-height:1.2;
    text-decoration: none;
    text-transform:uppercase;
  margin:0;
  border-radius: 6px;
   border:solid 1px var(--theme-body-color);
    background-color:#fff;
    }

.o-select-wrap:after {
    content: "\31";
    font-family:"ReadyTheme Icons", sans-serif;
    position: absolute;
    z-index:5;
    top: 50%;
    transform: translateY(-50%);
    right: 1rem;
    padding: 0;
    height: 1.25rem;
    background-color: #fff;
    transition: .25s all ease;
    pointer-events: none;
    font-size: 1.125rem;
    width:1.5rem;
    color:var(--theme-body-color);
    }

/*
.o-select-wrap:hover:after {
      content: '\25BC';
      position: absolute;
      top: 0;
      right: 0;
      padding: 12px;
        height:100%;
      background-color:rgb(239, 239, 239);
      transition: .25s all ease;
      pointer-events: none;
    }
*/
.o-select-wrap select{
      /* Reset Select */
      appearance: none;
      border: 0;
      box-shadow: none;
       flex-grow: 1;
      padding: 0 1em;
      color: #000;
      background-color: #fff;
      background-image: none;
      cursor: pointer;
    position:relative;
    z-index:1;
    }
    /* Remove IE arrow */
.o-select-wrap select::-ms-expand{
      display: none;
    }


/* RECAPTCHA BADGE
    =========================================== */
.grecaptcha-badge{
    z-index:900;
}
    
/* APPLE PAY
    =========================================== */
.apple-pay-button-black-with-text{
    width:100% !important;
    height:36px !important;
    max-width:420px !important;
    margin:6px auto !important;
}

/* FANCYBOX
    =========================================== */
/* https://fancyapps.com/fancybox/3/docs/#usage */

body.compensate-for-scrollbar {
    overflow: hidden;
}

.fancybox-active {
    height: auto;
}

.fancybox-is-hidden {
    left: -9999px;
    margin: 0;
    position: absolute !important;
    top: -9999px;
    visibility: hidden;
}

.fancybox-container {
    -webkit-backface-visibility: hidden;
    height: 100%;
    left: 0;
    outline: none;
    position: fixed;
    -webkit-tap-highlight-color: transparent;
    top: 0;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    transform: translateZ(0);
    width: 100%;
    z-index: 99992;
}

.fancybox-container * {
    box-sizing: border-box;
}

.fancybox-outer,
.fancybox-inner,
.fancybox-bg,
.fancybox-stage {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
}

.fancybox-outer {
    -webkit-overflow-scrolling: touch;
    overflow-y: auto;
}

.fancybox-bg {
    background: rgb(30, 30, 30);
    opacity: 0;
    transition-duration: inherit;
    transition-property: opacity;
    transition-timing-function: cubic-bezier(.47, 0, .74, .71);
}

.fancybox-is-open .fancybox-bg {
    opacity: .9;
    transition-timing-function: cubic-bezier(.22, .61, .36, 1);
}

.fancybox-infobar,
.fancybox-toolbar,
.fancybox-caption,
.fancybox-navigation .fancybox-button {
    direction: ltr;
    opacity: 0;
    position: absolute;
    transition: opacity .25s ease, visibility 0s ease .25s;
    visibility: hidden;
    z-index: 99997;
}

.fancybox-show-infobar .fancybox-infobar,
.fancybox-show-toolbar .fancybox-toolbar,
.fancybox-show-caption .fancybox-caption,
.fancybox-show-nav .fancybox-navigation .fancybox-button {
    opacity: 1;
    transition: opacity .25s ease 0s, visibility 0s ease 0s;
    visibility: visible;
}

.fancybox-infobar {
    color: #ccc;
    font-size: 13px;
    -webkit-font-smoothing: subpixel-antialiased;
    height: 44px;
    left: 0;
    line-height: 44px;
    min-width: 44px;
    mix-blend-mode: difference;
    padding: 0 10px;
    pointer-events: none;
    top: 0;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.fancybox-toolbar {
    right: 0;
    top: 0;
}

.fancybox-stage {
    direction: ltr;
    overflow: visible;
    transform: translateZ(0);
    z-index: 99994;
}

.fancybox-is-open .fancybox-stage {
    overflow: hidden;
}

.fancybox-slide {
    -webkit-backface-visibility: hidden; /* Using without prefix would break IE11 */
    display: none;
    height: 100%;
    left: 0;
    outline: none;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    padding: 44px;
    position: absolute;
    text-align: center;
    top: 0;
    transition-property: transform, opacity;
    white-space: normal;
    width: 100%;
    z-index: 99994;
}

.fancybox-slide::before {
    content: '';
    display: inline-block;
    font-size: 0;
    height: 100%;
    vertical-align: middle;
    width: 0;
}

.fancybox-is-sliding .fancybox-slide,
.fancybox-slide--previous,
.fancybox-slide--current,
.fancybox-slide--next {
    display: block;
}

.fancybox-slide--image {
    overflow: hidden;
    padding: 44px 0;
}

.fancybox-slide--image::before {
    display: none;
}

.fancybox-slide--html {
    padding: 6px;
}

.fancybox-content {
    background: #fff;
    display: inline-block;
    margin: 0;
    max-width: 100%;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    padding: 44px;
    position: relative;
    text-align: left;
    vertical-align: middle;
}

.fancybox-slide--image .fancybox-content {
    animation-timing-function: cubic-bezier(.5, 0, .14, 1);
    -webkit-backface-visibility: hidden;
    background: transparent;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    left: 0;
    max-width: none;
    overflow: visible;
    padding: 0;
    position: absolute;
    top: 0;
    -ms-transform-origin: top left;
    transform-origin: top left;
    transition-property: transform, opacity;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    z-index: 99995;
}

.fancybox-can-zoomOut .fancybox-content {
    cursor: zoom-out;
}

.fancybox-can-zoomIn .fancybox-content {
    cursor: zoom-in;
}

.fancybox-can-swipe .fancybox-content,
.fancybox-can-pan .fancybox-content {
    cursor: -webkit-grab;
    cursor: grab;
}

.fancybox-is-grabbing .fancybox-content {
    cursor: -webkit-grabbing;
    cursor: grabbing;
}

.fancybox-container [data-selectable='true'] {
    cursor: text;
}

.fancybox-image,
.fancybox-spaceball {
    background: transparent;
    border: 0;
    height: 100%;
    left: 0;
    margin: 0;
    max-height: none;
    max-width: none;
    padding: 0;
    position: absolute;
    top: 0;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    width: 100%;
}

.fancybox-spaceball {
    z-index: 1;
}

.fancybox-slide--video .fancybox-content,
.fancybox-slide--map .fancybox-content,
.fancybox-slide--pdf .fancybox-content,
.fancybox-slide--iframe .fancybox-content {
    height: 100%;
    overflow: visible;
    padding: 0;
    width: 100%;
}

.fancybox-slide--video .fancybox-content {
    background: #000;
}

.fancybox-slide--map .fancybox-content {
    background: #e5e3df;
}

.fancybox-slide--iframe .fancybox-content {
    background: #fff;
}

.fancybox-video,
.fancybox-iframe {
    background: transparent;
    border: 0;
    display: block;
    height: 100%;
    margin: 0;
    overflow: hidden;
    padding: 0;
    width: 100%;
}

/* Fix iOS */
.fancybox-iframe {
    left: 0;
    position: absolute;
    top: 0;
}

.fancybox-error {
    background: #fff;
    cursor: default;
    max-width: 400px;
    padding: 40px;
    width: 100%;
}

.fancybox-error p {
    color: #444;
    font-size: 16px;
    line-height: 20px;
    margin: 0;
    padding: 0;
}

/* Buttons */

.fancybox-button {
    background: rgba(30, 30, 30, .6);
    border: 0;
    border-radius: 0;
    box-shadow: none;
    cursor: pointer;
    display: inline-block;
    height: 44px;
    margin: 0;
    padding: 10px;
    position: relative;
    transition: color .2s;
    vertical-align: top;
    visibility: inherit;
    width: 44px;
}

.fancybox-button,
.fancybox-button:visited,
.fancybox-button:link {
    color: #ccc;
}

.fancybox-button:hover {
    color: #fff;
}

.fancybox-button:focus {
    outline: none;
}

.fancybox-button.fancybox-focus {
    outline: 1px dotted;
}

.fancybox-button[disabled],
.fancybox-button[disabled]:hover {
    color: #888;
    cursor: default;
    outline: none;
}

/* Fix IE11 */
.fancybox-button div {
    height: 100%;
}

.fancybox-button svg {
    display: block;
    height: 100%;
    overflow: visible;
    position: relative;
    width: 100%;
}

.fancybox-button svg path {
    fill: currentColor;
    stroke-width: 0;
}

.fancybox-button--play svg:nth-child(2),
.fancybox-button--fsenter svg:nth-child(2) {
    display: none;
}

.fancybox-button--pause svg:nth-child(1),
.fancybox-button--fsexit svg:nth-child(1) {
    display: none;
}

.fancybox-progress {
    background: #ff5268;
    height: 2px;
    left: 0;
    position: absolute;
    right: 0;
    top: 0;
    -ms-transform: scaleX(0);
    transform: scaleX(0);
    -ms-transform-origin: 0;
    transform-origin: 0;
    transition-property: transform;
    transition-timing-function: linear;
    z-index: 99998;
}
/* Close button on the top right corner of html content */

.fancybox-close-small {
    background: transparent;
    border: 0;
    border-radius: 0;
    color: #ccc;
    cursor: pointer;
    opacity: .8;
    padding: 8px;
    position: absolute;
    right: -12px;
    top: -44px;
    z-index: 401;
}

.fancybox-close-small:hover {
    color: #fff;
    opacity: 1;
}

.fancybox-slide--html .fancybox-close-small {
    color: currentColor;
    padding: 10px;
    right: 0;
    top: 0;
}

.fancybox-slide--image.fancybox-is-scaling .fancybox-content {
    overflow: hidden;
}

.fancybox-is-scaling .fancybox-close-small,
.fancybox-is-zoomable.fancybox-can-pan .fancybox-close-small {
    display: none;
}

/* Navigation arrows */

.fancybox-navigation .fancybox-button {
    background-clip: content-box;
    height: 100px;
    opacity: 0;
    position: absolute;
    top: calc(50% - 50px);
    width: 70px;
}

.fancybox-navigation .fancybox-button div {
    padding: 7px;
}

.fancybox-navigation .fancybox-button--arrow_left {
    left: 0;
    //left: env(safe-area-inset-left);
    padding: 31px 26px 31px 6px;
}

.fancybox-navigation .fancybox-button--arrow_right {
    padding: 31px 6px 31px 26px;
    right: 0;
    //right: env(safe-area-inset-right);
}

/* Caption */

.fancybox-caption {
    background: linear-gradient(
    to top,
    rgba(0, 0, 0, .85) 0%,
    rgba(0, 0, 0, .3) 50%,
    rgba(0, 0, 0, .15) 65%,
    rgba(0, 0, 0, .075) 75.5%,
    rgba(0, 0, 0, .037) 82.85%,
    rgba(0, 0, 0, .019) 88%,
    rgba(0, 0, 0, 0) 100%
    );
    bottom: 0;
    color: #eee;
    font-size: 14px;
    font-weight: 400;
    left: 0;
    line-height: 1.5;
    padding: 75px 44px 25px 44px;
    pointer-events: none;
    right: 0;
    text-align: center;
    z-index: 99996;
}

@supports (padding: max(0px)) {
    .fancybox-caption {
        //padding: 75px max(44px, env(safe-area-inset-right)) max(25px, env(safe-area-inset-bottom)) max(44px, env(safe-area-inset-left));
    }
}

.fancybox-caption--separate {
    margin-top: -50px;
}

.fancybox-caption__body {
    max-height: 50vh;
    overflow: auto;
    pointer-events: all;
}

.fancybox-caption a,
.fancybox-caption a:link,
.fancybox-caption a:visited {
    color: #ccc;
    text-decoration: none;
}

.fancybox-caption a:hover {
    color: #fff;
    text-decoration: underline;
}

/* Loading indicator */

.fancybox-loading {
    animation: fancybox-rotate 1s linear infinite;
    background: transparent;
    border: 4px solid #888;
    border-bottom-color: #fff;
    border-radius: 50%;
    height: 50px;
    left: 50%;
    margin: -25px 0 0 -25px;
    opacity: .7;
    padding: 0;
    position: absolute;
    top: 50%;
    width: 50px;
    z-index: 99999;
}

@keyframes fancybox-rotate {
    100% {
        transform: rotate(360deg);
    }
}

/* Transition effects */

.fancybox-animated {
    transition-timing-function: cubic-bezier(0, 0, .25, 1);
}

/* transitionEffect: slide */

.fancybox-fx-slide.fancybox-slide--previous {
    opacity: 0;
    transform: translate3d(-100%, 0, 0);
}

.fancybox-fx-slide.fancybox-slide--next {
    opacity: 0;
    transform: translate3d(100%, 0, 0);
}

.fancybox-fx-slide.fancybox-slide--current {
    opacity: 1;
    transform: translate3d(0, 0, 0);
}

/* transitionEffect: fade */

.fancybox-fx-fade.fancybox-slide--previous,
.fancybox-fx-fade.fancybox-slide--next {
    opacity: 0;
    transition-timing-function: cubic-bezier(.19, 1, .22, 1);
}

.fancybox-fx-fade.fancybox-slide--current {
    opacity: 1;
}

/* transitionEffect: zoom-in-out */

.fancybox-fx-zoom-in-out.fancybox-slide--previous {
    opacity: 0;
    transform: scale3d(1.5, 1.5, 1.5);
}

.fancybox-fx-zoom-in-out.fancybox-slide--next {
    opacity: 0;
    transform: scale3d(.5, .5, .5);
}

.fancybox-fx-zoom-in-out.fancybox-slide--current {
    opacity: 1;
    transform: scale3d(1, 1, 1);
}

/* transitionEffect: rotate */

.fancybox-fx-rotate.fancybox-slide--previous {
    opacity: 0;
    -ms-transform: rotate(-360deg);
    transform: rotate(-360deg);
}

.fancybox-fx-rotate.fancybox-slide--next {
    opacity: 0;
    -ms-transform: rotate(360deg);
    transform: rotate(360deg);
}

.fancybox-fx-rotate.fancybox-slide--current {
    opacity: 1;
    -ms-transform: rotate(0deg);
    transform: rotate(0deg);
}

/* transitionEffect: circular */

.fancybox-fx-circular.fancybox-slide--previous {
    opacity: 0;
    transform: scale3d(0, 0, 0) translate3d(-100%, 0, 0);
}

.fancybox-fx-circular.fancybox-slide--next {
    opacity: 0;
    transform: scale3d(0, 0, 0) translate3d(100%, 0, 0);
}

.fancybox-fx-circular.fancybox-slide--current {
    opacity: 1;
    transform: scale3d(1, 1, 1) translate3d(0, 0, 0);
}

/* transitionEffect: tube */

.fancybox-fx-tube.fancybox-slide--previous {
    transform: translate3d(-100%, 0, 0) scale(.1) skew(-10deg);
}

.fancybox-fx-tube.fancybox-slide--next {
    transform: translate3d(100%, 0, 0) scale(.1) skew(10deg);
}

.fancybox-fx-tube.fancybox-slide--current {
    transform: translate3d(0, 0, 0) scale(1);
}

/* Styling for Small-Screen Devices */
@media all and (max-height: 576px) {
    .fancybox-slide {
        padding-left: 6px;
        padding-right: 6px;
    }

    .fancybox-slide--image {
        padding: 6px 0;
    }

    .fancybox-close-small {
        right: -6px;
    }

    .fancybox-slide--image .fancybox-close-small {
        background: #4e4e4e;
        color: #f2f4f6;
        height: 36px;
        opacity: 1;
        padding: 6px;
        right: 0;
        top: 0;
        width: 36px;
    }

    .fancybox-caption {
        padding-left: 12px;
        padding-right: 12px;
    }

    @supports (padding: max(0px)) {
        .fancybox-caption {
        }
    }
}

/* Share */

.fancybox-share {
    background: #f4f4f4;
    border-radius: 3px;
    max-width: 90%;
    padding: 30px;
    text-align: center;
}

.fancybox-share h1 {
    color: #222;
    font-size: 35px;
    font-weight: 700;
    margin: 0 0 20px 0;
}

.fancybox-share p {
    margin: 0;
    padding: 0;
}

.fancybox-share__button {
    border: 0;
    border-radius: 3px;
    display: inline-block;
    font-size: 14px;
    font-weight: 700;
    line-height: 40px;
    margin: 0 5px 10px 5px;
    min-width: 130px;
    padding: 0 15px;
    text-decoration: none;
    transition: all .2s;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    white-space: nowrap;
}

.fancybox-share__button:visited,
.fancybox-share__button:link {
    color: #fff;
}

.fancybox-share__button:hover {
    text-decoration: none;
}

.fancybox-share__button--fb {
    background: #3b5998;
}

.fancybox-share__button--fb:hover {
    background: #344e86;
}

.fancybox-share__button--pt {
    background: #bd081d;
}

.fancybox-share__button--pt:hover {
    background: #aa0719;
}

.fancybox-share__button--tw {
    background: #1da1f2;
}

.fancybox-share__button--tw:hover {
    background: #0d95e8;
}

.fancybox-share__button svg {
    height: 25px;
    margin-right: 7px;
    position: relative;
    top: -1px;
    vertical-align: middle;
    width: 25px;
}

.fancybox-share__button svg path {
    fill: #fff;
}

.fancybox-share__input {
    background: transparent;
    border: 0;
    border-bottom: 1px solid #d7d7d7;
    border-radius: 0;
    color: #5d5b5b;
    font-size: 14px;
    margin: 10px 0 0 0;
    outline: none;
    padding: 10px 15px;
    width: 100%;
}

/* Thumbs */

.fancybox-thumbs {
    background: #ddd;
    bottom: 0;
    display: none;
    margin: 0;
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    padding: 2px 2px 4px 2px;
    position: absolute;
    right: 0;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    top: 0;
    width: 212px;
    z-index: 99995;
}

.fancybox-thumbs-x {
    overflow-x: auto;
    overflow-y: hidden;
}

.fancybox-show-thumbs .fancybox-thumbs {
    display: block;
}

.fancybox-show-thumbs .fancybox-inner {
    right: 212px;
}

.fancybox-thumbs__list {
    font-size: 0;
    height: 100%;
    list-style: none;
    margin: 0;
    overflow-x: hidden;
    overflow-y: auto;
    padding: 0;
    position: absolute;
    position: relative;
    white-space: nowrap;
    width: 100%;
}

.fancybox-thumbs-x .fancybox-thumbs__list {
    overflow: hidden;
}

.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar {
    width: 7px;
}

.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-track {
    background: #fff;
    border-radius: 10px;
    box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
}

.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-thumb {
    background: #2a2a2a;
    border-radius: 10px;
}

.fancybox-thumbs__list a {
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    background-color: rgba(0, 0, 0, .1);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    cursor: pointer;
    float: left;
    height: 75px;
    margin: 2px;
    max-height: calc(100% - 8px);
    max-width: calc(50% - 4px);
    outline: none;
    overflow: hidden;
    padding: 0;
    position: relative;
    -webkit-tap-highlight-color: transparent;
    width: 100px;
}

.fancybox-thumbs__list a::before {
    border: 6px solid #ff5268;
    bottom: 0;
    content: '';
    left: 0;
    opacity: 0;
    position: absolute;
    right: 0;
    top: 0;
    transition: all .2s cubic-bezier(.25, .46, .45, .94);
    z-index: 99991;
}

.fancybox-thumbs__list a:focus::before {
    opacity: .5;
}

.fancybox-thumbs__list a.fancybox-thumbs-active::before {
    opacity: 1;
}

/* Styling for Small-Screen Devices */
@media all and (max-width: 576px) {
    .fancybox-thumbs {
        width: 110px;
    }
    .fancybox-show-thumbs .fancybox-inner {
        right: 110px;
    }
    .fancybox-thumbs__list a {
        max-width: calc(100% - 10px);
    }
}



/* ==========================================================================
   EXTENSIONS / MINI-BASKET / MINI-BASKET
   ========================================================================== */
/**
 * This is an extension to use the mini-basket functionality of Miva in an
 * off-canvas method.
 */
.x-mini-basket {
  background-color: rgba(34, 34, 34, 0.8);
  bottom: 0;
  display: flex;
  justify-content: flex-end;
  left: 0;
  opacity: 0;
  position: fixed;
  right: 0;
  top: 0;
  transition: all ease-in-out 0.2s;
  z-index: 500;
}

.x-mini-basket--open {
  opacity: 1;
}

.x-mini-basket__empty-icon {
  align-items: center;
  border-radius: 50%;
  display: inline-flex;
  height: 4.5rem;
  justify-content: center;
  margin-top: 1.875rem;
  width: 4.5rem;
}

.x-mini-basket__content {
  display: flex;
  flex: 1 1 100%;
  flex-direction: column;
  max-width: 25rem;
  padding: 1.25rem 0;
  width: 100vw;
}

.x-mini-basket__content :is(header, footer),
.x-mini-basket__list {
  padding: 0 1rem;
}

.x-mini-basket__header,
.x-mini-basket__subtotal {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding-bottom: 0.75rem;
}

.x-mini-basket__header {
  margin-bottom: 0.75rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.08);
}

.x-mini-basket__summary {
  color: var(--theme-secondary-color);
  font-weight: var(--font-bold);
}

.x-mini-basket__subtotal {
  padding-bottom: 0.75rem;
  margin-bottom: 0.25rem;
  color: var(--theme-secondary-color);
  font-weight: var(--font-semibold);
}

.x-mini-basket__header button {
  background-color: transparent;
  border: 0 none;
  cursor: pointer;
  color: var(--theme-body-color);
  font-size: 0.75rem;
}

.x-mini-basket__header button:hover {
  color: var(--theme-accent-color);
}

.x-mini-basket__list {
  flex-grow: 1;
  margin-bottom: 0.5rem;
  overflow-y: auto;
}

.x-mini-basket__line {
  border-top: var(--default-input-border);
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  font-size: 0.875rem;
  padding: 0.75rem 0;
}

.x-mini-basket__line:last-of-type {
  padding: 0.75rem 0;
}

.x-mini-basket__image {
  height: 3rem;
  overflow: hidden;
  text-align: center;
  width: 3rem;
}

.x-mini-basket__item {
  display: flex;
  flex: 1 1 0;
  flex-direction: column;
  justify-content: space-between;
  text-decoration: none;
}

.x-mini-basket__item:hover {
  text-decoration: none;
}

.x-mini-basket__item-name,
.x-mini-basket__item-attributes {
  display: block;
  margin-bottom: 0.25rem;
}

.x-mini-basket__item-name {
  color: var(--theme-primary-color);
  font-weight: var(--font-bold);
}

.x-mini-basket__item-attributes {
  line-height: 1.4;
  color: var(--theme-body-color);
}

.x-mini-basket__subscription {
  flex-basis: 100%;
}

.x-mini-basket__item-price {
  width: 100%;
  max-width: 300px;
}

.x-mini-basket__item-total {
  align-items: center;
  display: flex;
  justify-content: space-between;
  gap: 1rem;
}

/* Order line-item price — sale total in accent red, struck was-price a touch smaller.
   Scoped to .x-mini-basket__item-price so it covers the header mini basket AND any
   checkout order-summary that reuses the same item markup (e.g. OINF).
   (TG · 2026-07-28 / 2026-07-30 · GCH #203870 / #203872 / #203874) */
.x-mini-basket__item-price .t-product-charge__amount-total {
  color: var(--theme-accent-color);
  font-weight: 600;
  letter-spacing: -0.02em;
}

.x-mini-basket__item-price .t-product-charge__amount-original {
  font-size: 12px;
}

.x-mini-basket__charges,
.x-mini-basket__total {
  display: flex;
  flex: 1 0 100%;
  justify-content: space-between;
}

.x-mini-basket__total {
  padding-top: 0.5rem;
  /* border-top: 1px solid rgba(0, 0, 0, 0.08); */
  color: var(--theme-secondary-color);
  font-weight: var(--font-bold);
}

.x-mini-basket__charges {
  flex-direction: column;
  font-size: 0.875rem;
  margin-bottom: 0.5rem;
}

.x-mini-basket__charge-item {
  display: flex;
  justify-content: space-between;
}

.x-mini-basket__cta {
  display: grid;
  gap: 0.5rem 0;
}

/* ==========================================================================
   CART PAGE (BASK) — line items themed to match the mini-basket
   Blue bold product name, themed attributes, tightened name/attr/save spacing.
   ========================================================================== */
.t-basket__product-name {
  color: var(--theme-primary-color);
  font-weight: var(--font-bold);
  line-height: 1.3;
  margin-bottom: 4px;
}

.t-basket__product-attributes {
  color: var(--theme-body-color);
  line-height: 1.4;
  margin-bottom: 4px;
}

.t-basket__product-attr-options {
  padding-top: 2px;
  padding-bottom: 2px;
}

.t-basket__product-save {
  line-height: 1.3;
}

.t-basket__product-price .x-product-list__price_formatted {
  color: var(--theme-secondary-color);
  font-weight: var(--font-semibold);
}

/* Cart line price — match the mini-basket treatment: sale total in accent red +
   600 weight + tightened tracking, struck was-price a touch smaller
   (TG · 2026-07-28 · GCH #203870 / #203872 / #203874) */
.t-basket__product-price .t-product-charge__amount-total {
  color: var(--theme-accent-color);
  font-weight: 600;
  letter-spacing: -0.02em;
  font-size: 16px;
}

.t-basket__product-price .t-product-charge__amount-original {
  font-size: 14px;
}

.t-basket__order-total,
.t-basket__order-total * {
  color: var(--theme-secondary-color);
  font-weight: var(--font-bold);
}

/* =========================================================
   PRODUCT OPTIONS — radio attributes as outlined buttons
   Adapted from ZLP "Size" pills. Applies to ALL radio option
   attributes (Color, Size, etc.) — no swatches. Hides the
   native radio and styles the existing .attribute-radio-buttons
   label as the clickable outlined button.
   ========================================================= */
.x-product-layout-purchase__options-attribute .attribute-input[type="radio"]{
  position:absolute;
  opacity:0;
  width:0;
  height:0;
}
.x-product-layout-purchase__options-attribute .attribute-input[type="radio"] ~ .attribute-label.attribute-radio-buttons{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  width:100%;
  min-height:46px;
  padding:.65rem .75rem;
  border:1px solid rgba(0,0,0,.3);
  border-radius:8px;
  background-color:rgba(255,255,255,.75);
  font-size:.8125rem;
  line-height:1.2;
  text-align:center;
  cursor:pointer;
  opacity:.95;
  transition:transform .18s ease, border-color .18s ease, background-color .18s ease, opacity .18s ease;
}
/* the gray "(code)" sub-line inside the button */
.x-product-layout-purchase__options-attribute .attribute-input[type="radio"] ~ .attribute-label.attribute-radio-buttons p{
  font-size:.7rem;
}
/* hover */
.x-product-layout-purchase__options-attribute .attribute-input[type="radio"] ~ .attribute-label.attribute-radio-buttons:hover{
  transform:translateY(-2px);
  background-color:#fff;
}
/* selected */
.x-product-layout-purchase__options-attribute .attribute-input[type="radio"]:checked ~ .attribute-label.attribute-radio-buttons{
  border-color:#000;
}
/* keyboard focus */
.x-product-layout-purchase__options-attribute .attribute-input[type="radio"]:focus-visible ~ .attribute-label.attribute-radio-buttons{
  outline:1px solid #000;
  outline-offset:3px;
}
/* disabled */
.x-product-layout-purchase__options-attribute .attribute-input[type="radio"]:disabled ~ .attribute-label.attribute-radio-buttons{
  opacity:.45;
  cursor:not-allowed;
}
/* options grid — 2-up mobile, 4-up tablet & up, .5rem gap all around.
   Wrapper = .x-attribute-button-grid (added in the attribute template). */
.x-attribute-button-grid{
  display:flex;
  flex-wrap:wrap;
  gap:.5rem;
}
.x-product-layout-purchase__options-attribute .x-attribute-button-container{
  flex:0 0 calc(50% - .25rem);
  max-width:calc(50% - .25rem);
}
@media (min-width:768px){
  .x-product-layout-purchase__options-attribute .x-attribute-button-container{
    flex:0 0 calc(25% - .375rem);
    max-width:calc(25% - .375rem);
  }
}

/* =========================================================
   PRODUCT GALLERY — Owl main carousel + thumbnail nav
   Replaces the Miva ImageMachine thumbnail/main-image setup.
   Zoom/modal handled by Fancybox v3 (data-fancybox).
   ========================================================= */
.x-product-media__item .x-product-gallery{
  flex:1 1 100%;
  width:100%;
  min-width:0;            /* lets owl size correctly inside the flex parent */
}
/* stage = relative context so the blue circular .dwg-carousel prev/next
   buttons (absolute, top:50%) center over the main image, one each side */
.x-product-gallery__stage{ position:relative; }
.x-product-gallery .owl-carousel-prev-trigger{ left:.5rem; }
.x-product-gallery .owl-carousel-next-trigger{ right:.5rem; }
.x-product-gallery__main a{ display:block; cursor:zoom-in; }
.x-product-gallery__main .x-product-gallery__image{ display:block; width:100%; height:auto; border-radius:8px; }
.x-product-gallery__thumbs{ margin-top:.5rem; }
.x-product-gallery__thumb{
  cursor:pointer;
  border:1px solid transparent;
  border-radius:6px;
  overflow:hidden;
  opacity:.8;
  transition:opacity .15s ease, border-color .15s ease;
}
.x-product-gallery__thumb:hover{ opacity:1; }
.x-product-gallery__thumb.is-active{ border-color:#000; opacity:1; }
.x-product-gallery__thumb img{ display:block; width:100%; height:70px; object-fit:cover; }   /* uniform thumbnail size */


/* =====================================================================
   Mini-basket recommendations — compact row layout
   Scoped to #mb-also-bought + #mb-related-products ONLY (related products
   is the fallback when there's no also-bought). The shared .product-item
   card styles used on category/listing pages are intentionally untouched.
   Goal: recommendations read like the basket line-items above them —
   small thumbnail left, name / part # / price stacked beside it.
   ===================================================================== */
#mb-also-bought,
#mb-related-products { display:block; margin-top:4px; }

/* each recommendation = a horizontal row */
#mb-also-bought .product-item,
#mb-also-bought .product-item-hover-thumb,
#mb-related-products .product-item,
#mb-related-products .product-item-hover-thumb {
  width:100%; margin:4px 0; background:#fff; border:0; box-shadow:none; border-radius:10px;
  cursor:pointer; transition:background-color .15s ease;   /* default white; whole row clickable via existing [data-url] handler */
}
#mb-also-bought .product-item:hover,
#mb-related-products .product-item:hover { background-color:#f2f3f5; }   /* hover = soft light grey (rounded corners read on hover) */
#mb-also-bought .product-item .padding:hover,
#mb-related-products .product-item .padding:hover { background:transparent; box-shadow:none; }   /* kill the shared card's white overlay + hover glow so the clean grey hover shows through */
#mb-also-bought .product-item .padding,
#mb-related-products .product-item .padding {
  display:grid;
  grid-template-columns:56px 1fr;
  column-gap:12px;
  align-items:start;
  padding:10px;            /* internal padding so the rounded hover has breathing room */
}

/* drop the loud "Sale" ribbon inside the drawer */
#mb-also-bought .product-flag,
#mb-related-products .product-flag { display:none; }

/* small fixed thumbnail in column 1, spanning the stacked text rows */
#mb-also-bought .product-thumbnail,
#mb-related-products .product-thumbnail {
  grid-column:1; grid-row:1 / span 5;
  width:56px; margin:0; padding:0;
}
#mb-also-bought .product-thumbnail a,
#mb-also-bought .product-thumbnail .thumbnail-img-wrapper,
#mb-related-products .product-thumbnail a,
#mb-related-products .product-thumbnail .thumbnail-img-wrapper { display:block; }
#mb-also-bought .product-thumbnail img,
#mb-related-products .product-thumbnail img {
  width:56px; height:56px; object-fit:contain; border-radius:4px; background:#f7f7f7;
}

/* name / details / button stack in column 2 */
#mb-also-bought .product-name,
#mb-also-bought .product-details,
#mb-also-bought .purchase-buttons,
#mb-related-products .product-name,
#mb-related-products .product-details,
#mb-related-products .purchase-buttons { grid-column:2; }

#mb-also-bought .product-name,
#mb-related-products .product-name { margin:0; padding-top:0; }
#mb-also-bought .product-name a,
#mb-related-products .product-name a {
  font-size:14px; line-height:1.3; font-weight:700;
  color:#2198dc; text-decoration:underline;          /* match basket item-name */
}
#mb-also-bought .product-code,
#mb-related-products .product-code { font-size:11px; color:#6b7280; margin:1px 0 0; }
#mb-also-bought .product-code .label,
#mb-related-products .product-code .label { font-weight:600; }
#mb-also-bought .product-price,
#mb-related-products .product-price { display:flex; align-items:baseline; gap:6px; margin-top:0; font-size:14px; padding-bottom:0; }
#mb-also-bought .x-product-list__price_formatted_base s,
#mb-related-products .x-product-list__price_formatted_base s { color:#9aa0a6; font-size:13px; }
#mb-also-bought .x-product-list__price_formatted,
#mb-related-products .x-product-list__price_formatted { font-weight:600; }
#mb-also-bought .purchase-buttons,
#mb-related-products .purchase-buttons { display:none; }   /* hide absolute hover-button (was overlapping the text) */
/* ===== end mini-basket recommendations ===== */


/* BASK related-products carousel — same red price treatment: sale in accent red +
   600 weight + tight tracking, struck was-price a step smaller. Sized to the
   mini-basket tier (14/12) so recommendations read below the cart line (16/14).
   (TG · 2026-07-28 · GCH #203870 / #203872 / #203874) */
#related_products_carousel .x-product-list__price_formatted {
  color: var(--theme-accent-color);
  font-weight: 600;
  letter-spacing: -0.02em;
  font-size: 14px;
}
#related_products_carousel .x-product-list__price_formatted_base,
#related_products_carousel .x-product-list__price_formatted_base s {
  font-size: 12px;
}


/* ---------------------------------------------------------------------
   Mini-basket CART line thumbnails — match the Also-Bought thumb size.
   Was 48x48 figure with the image squished to 40x22 (object-fit:fill).
   --------------------------------------------------------------------- */
.x-mini-basket__line .x-mini-basket__image {
  width:56px; height:56px; flex:0 0 56px; margin:0 6px 0 0;   /* small extra gap to the copy block (on top of the 12px flex gap) */
  border-radius:4px; background:#f7f7f7; overflow:hidden;
  display:flex; align-items:center; justify-content:center;
}
.x-mini-basket__line .x-mini-basket__image img {
  width:56px; height:56px; object-fit:contain; border-radius:4px;
}

/* #203383 — About Us icon bar: on mobile, stack the 3 items as a left-aligned
   column centered as a group so the icons line up (fixes the jumbled/staggered look) */
@media screen and (max-width: 47.99em) {
  #chh_iconbar .dwg-column-content-wrapper { text-align: center; }
  #chh_iconbar .dwg-column-content-layout { display: inline-flex; flex-direction: column; align-items: flex-start; width: auto; gap: 0.35rem; }
  #chh_iconbar .dwg-column-content-layout-item { width: auto; text-align: left; }
  #chh_iconbar .chh-icon { display: flex; align-items: center; gap: 0.6rem; margin: 0; justify-content: flex-start; }
}
/* ===========================================
   MOBILE HEADER  (< 60em) — walkthrough (TG · 2026-07-23)
   Large (min-width:60em) is finalized & perfect — all mobile header
   work is scoped inside this one media query so desktop is untouched.
   =========================================== */
@media (max-width: 59.999em) {

  /* 1. Search visible on mobile + tablet (override Shadows collapse height:0/opacity:0) */
  .t-site-header__search { height: auto; opacity: 1; overflow: visible; }

  /* 2. Search icon visible on mobile (Shadows hides it under 60em) */
  .t-site-header__search-icon { display: inline-block; }

  /* 3. Search form shorter on mobile + tablet. Height is driven by the SUBMIT
        BUTTON (align-items:stretch pulls the field up to match it), so trim BOTH.
        NOTE: shadows-main.css has @media (pointer:coarse) ->
        `.t-site-header__search-form .t-site-header__search-button { padding:1rem }`
        (specificity 0,2,0) that re-inflates the button on TOUCH devices. We MATCH
        that specificity below so our trim wins on touch, not just mouse/inspector. */
  .t-site-header__search-field { padding-top: 0.5em; padding-bottom: 0.5em; }
  .t-site-header__search-form .t-site-header__search-button { padding-top: 0.5em; padding-bottom: 0.5em; }

  /* 4. Lift the header above page content so the search preview (.x-search-preview,
        z-index:999) — which is trapped inside the header's stacking context — isn't
        covered. Shadows sets .t-site-header{z-index:1} here; page content sits ~12-20.
        50 clears content and stays below the mini-basket drawer (z-index:500). */
  .t-site-header { z-index: 50; }

  /* 5. Remove the framework's left + right margin on the search form (Shadows
        sets margin: 0 1rem 1rem here). Bottom margin left intact. */
  .t-site-header__search-form { margin-left: 0; margin-right: 0; }

}

/* ── Mobile only (< 48em) — banner full-width centered (tablet+ flows as-is) ── */
@media (max-width: 47.99em) {
  .t-site-header__top-navigation .t-site-header__banner {
    flex: 0 0 100%;
    max-width: 100%;
    text-align: center;
  }

  /* search block LAST on mobile */
  .t-site-header__search { order: 99; }

  /* masthead top padding */
  .t-site-header__masthead { padding-top: 0.5rem; }

  /* search form full width (release the 280px cap) — mobile only */
  .t-site-header__search-form { max-width: none; }

  /* search preview: almost full width + centered on mobile (spans the form
     edge-to-edge instead of a fixed 360px anchored left). Tablet keeps its own. */
  .x-search-preview.x-search-preview--open {
    left: 0;
    right: 0;
    width: auto;
    max-width: none;
  }
}

/* ── Tablet only (48–59.99em) — dial in here ── */
@media (min-width: 48em) and (max-width: 59.99em) {
  /* search block FIRST again on tablet */
  .t-site-header__search { order: 0; }

  /* masthead top padding */
  .t-site-header__masthead { padding-top: 0.75rem; }

  /* search form capped at 220px on tablet */
  .t-site-header__search-form { max-width: 220px; }
}

/* ===========================================
   CART COUNT BADGE (TG · 2026-07-23)
   Combined framework CSS hides the count (max-width:0; opacity:0). Show it
   for now as a small circle (white count) overlaying the cart icon's top-left.
   =========================================== */
.t-site-header__basket-link { position: relative; }
.t-site-header__basket-link-quantity {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  top: -0.4rem;
  right: -0.4rem;
  width: 1.1rem;
  height: 1.1rem;
  min-width: 1.1rem;
  max-width: none;
  padding: 0;
  border-radius: 50%;
  background-color: var(--theme-accent-color);
  color: #fff;
  font-size: 0.62rem;
  font-weight: 700;
  line-height: 1;
  opacity: 1;
  overflow: visible;
  pointer-events: none;   /* keep clicks going to the cart link */
  text-align: center;
}

/* ── Mobile nav (mmenu) — style refinements (TG · 2026-07-23) ──
   #mobile-nav prefix raises specificity so these win over the base rules
   without !important. */
/* Softer divider lines (base rules use rgba(255,255,255,0.7)) */
#mobile-nav .mm-listview > li,
#mobile-nav .mm-listview > li .mm-next,
#mobile-nav .mm-listview > li .mm-next:before,
#mobile-nav .mm-listview > li:after,
#mobile-nav .mm-navbar { border-color: rgba(255,255,255,0.14); }
/* Crisp white chevrons (mmenu's default next/back arrows are dark → invisible on navy) */
#mobile-nav .mm-next:after,
#mobile-nav .mm-prev:before { border-color: rgba(255,255,255,0.9); }
/* Logo aligned to the menu-text indent (~22px) */
.mm-navbar.mm-navbar-top .mmenu-custom-header { padding-left: 14px; }