body {
  max-width: 1400px;
  margin: 0 auto;
  margin: 0px auto 0;
}


dt,dd {
    margin:0;
    padding:0;
}
li {
    list-style: none;
}

/*links*/
a {
  color: var(--link-color);
  text-decoration: none;
  font-weight: 400;
  cursor: pointer;
}

  a:focus, a:hover {
    text-decoration: underline;
  }




.breadcrumb {
  padding: 4rem 3%;
  font-size: 1.5rem;
}

  .breadcrumb > ul {
    margin: 0;
    padding: 0;
  }

    .breadcrumb > ul li {
      display: inline-block;
    }

      .breadcrumb > ul li > * {
        display: inline-block;
        margin: 0 .5rem;
      }




/*headers*/
h1, h2 {
  font-family: 'Corda-Medium', serif;
  font-weight: normal;
  margin-bottom: 1.5rem;
  margin-top: 0;
}

h3, h4, h5, h6, .h7 {
  font-family: 'Corda-Regular', serif;
  font-weight: normal;
  margin-bottom: 1.5rem;
  margin-top: 0;
}

.darkBackground h1,
.darkBackground h2,
.darkBackground h3,
.darkBackground h4,
.darkBackground h5,
.darkBackground h6,
.darkBackground div,
.darkBackground span,
.darkBackground p,
.darkBackground p1,
.darkBackground p2,
.darkBackground p3,
.darkBackground p4,
.darkBackground p5,
.darkBackground p6,
.darkBackground p7 {
  color: #fff;
}

h1 { /* Homepage Top Carousel (Featured Promo) */
  font-size: 6.4rem;
  line-height: 1.2;
}

.product-details-page h1,
.category-page h1,
.manufacturerPageWrapper h1,
.search-page .page-body h1 { /* Product Detail Page & Category Page h1 */
  font-family: 'Corda-Regular', serif;
  font-weight: normal;
  margin-bottom: 0;
  margin-top: 0;
  font-size: 3.2rem;
  letter-spacing: -.05rem;
  line-height: 1.3;
}

h3, h4, h5, h6, .h7 {
  font-family: 'Corda-Regular', serif;
  font-weight: normal;
  margin-bottom: 1.5rem;
  margin-top: 0;
}

h4 {
  font-size: 5.4rem;
  letter-spacing: -.08rem;
  line-height: 1.3;
}


.p1 { /* About Cokesbury (Intro Copy) */
  font-size: 2.0rem;
  line-height: 1.5;
}

.p2 { /* About Cokesbury (Timeline stats) */
  font-size: 1.8rem;
}

.p3 { /* Standard Body Copy Size */
  font-size: 1.6rem;
}

.p4 { /* Price Large (product detail page) */
  font-size: 3.2rem;
  line-height: 1.3;
  font-weight: 600;
}

.p5 { /* Strikethrough Price Large (product detail page) */
  font-size: 2.4rem;
  line-height: 1.4;
  color: #767676;
  text-decoration: line-through;
}

.p6 { /* Price Small */
  font-size: 2.4rem;
  line-height: 1.4;
}

.p7 { /* Strikethrough Price Small / Timestamp (Reviews) */
  font-size: 1.6rem;
  color: #767676;
  text-decoration: line-through;
}

.p8 { /* Input directions */
  font-size: 1.6rem;
  color: #767676;
  font-style: italic;
  margin-top: 1rem;
}

.p9 { /* special notes */
  font-size: 1.6rem;
  color: #767676;
  margin-top: 1rem;
}

h2 { /* Homepage Top Carousel (Company Quote) */
  font-style: italic;
  font-size: 6.4rem;
  line-height: 1.25;
}

h3 { /* Page Titles */
  font-size: 6.0rem;
  line-height: 1.3;
}

h4 { /* Promo Quotes, Promo Headlines */
  font-size: 5.4rem;
  letter-spacing: -.08rem;
  line-height: 1.3;
}

h5 { /* Section Headers, Product Detail Page Titles, Search Results Title */
  font-size: 4.4rem;
  letter-spacing: -.05rem;
  line-height: 1.3;
}

h6 {
  font-size: 1.6rem;
  letter-spacing: 0;
  line-height: 1.4;
}

.h7 { /* Section Headers, Product Detail Page Titles, Search Results Title */
  font-size: 2.2rem;
  letter-spacing: -.05rem;
  line-height: 1.3;
  color: #767676;
}

/*secondary headers*/
.s1,
.s2 {
  margin-top: 0;
  margin-bottom: 2.0rem;
  font-weight: 600;
}

.s3,
.s4,
.s5,
.s6 {
  margin-top: 0;
  margin-bottom: 2.0rem;
  font-weight: 700;
}

.s1 { /* Date Established (Hero Promo) */
  font-family: 'Corda-Medium', serif;
  font-size: 3.6rem;
  line-height: 1.2;
  text-transform: uppercase;
}

.s2 { /* Name of Author (Hero promo quotes) */
  font-family: 'Corda-Regular', serif;
  font-size: 3.6rem;
  line-height: 1.25;
}

.s3 { /* Tertiary Promo Headers */
  font-size: 3.2rem;
  line-height: 1.3;
  text-transform: uppercase;
}

.s4 { /* Promo Description Header */
  font-size: 2.4rem;
  line-height: 1.35;
  text-transform: uppercase;
}

.s5 { /* Section Headers Large */
  font-size: 2.4rem;
  line-height: 1.5;
}

.s6 { /* Section Headers Small */
  font-size: 1.6rem;
  line-height: 1.4;
  text-transform: uppercase;
}

.s7 { /* Section Headers Small */
  font-size: 1.6rem;
  font-weight: 600;
  line-height: 1.4;
  text-transform: uppercase;
}


blockquote {
  border-left: 0.3rem solid #d1d1d1;
  margin-left: 0;
  margin-right: 0;
  padding: 1rem 1.5rem;
}

  blockquote *:last-child {
    margin-bottom: 0;
  }

code {
  background: #f4f5f6;
  border-radius: .4rem;
  font-size: 86%;
  margin: 0 .2rem;
  padding: .2rem .5rem;
  white-space: nowrap;
}

pre {
  background: #f4f5f6;
  border-left: 0.3rem solid #9b4dca;
  overflow-y: hidden;
}

  pre > code {
    border-radius: 0;
    display: block;
    padding: 1rem 1.5rem;
    white-space: pre;
  }

hr {
  border: 0;
  border-top: 1px solid #ccc;
  margin: 8rem 0;
  position: relative;
}

  hr.noIcon {
    margin: 2rem 0;
  }

  hr:after {
    content: url('/Themes/Cokesbury/Content/images/cokesbury_divider_line_icon.svg');
    padding: 0 15px;
    background-color: #fff;
    position: absolute;
    top: -34px;
    left: calc(50% - 42px);
    max-width: 67px;
  }

  hr.alt1:after {
    content: url('/Themes/Cokesbury/Content/images/flame_divider_line_icon.svg');
  }

  hr.noIcon:after {
    content: none;
  }



/*#endregion*/

.darkBackground h1,
.darkBackground h2,
.darkBackground h3,
.darkBackground h4,
.darkBackground h5,
.darkBackground h6 {
  color: #fff;
}
.darkBackground a,
.darkBackground span,
.darkBackground l1,
.darkBackground l2,
.darkBackground l3,
.darkBackground l4,
.darkBackground l5,
.darkBackground l6,
.darkBackground l7 {
  color: #fff;
}

h1 { /* Homepage Top Carousel (Featured Promo) */
  font-size: 6.4rem;
  line-height: 1.2;
}


.l1 { /* Product Detail Page */
  font-size: 2rem;
  color: var(--link-color);
}


.l2 { /* Standard Link Size */
  font-size: 1.6rem;
  color: var(--link-color);
}

.l3 { /* Left Rail Link Navigation for Help and Contact Pages */
  font-size: 1.8rem;
  color: var(--link-color);
}

.l4 { /* Product Title Links */
  color: #333;
  font-size: 1.6rem;
  font-weight: 600;
}

.l5 { /* Product Title Links */
  color: #333;
  font-size: 1.6rem;
  font-weight: 700;
  text-transform: uppercase;
}

.l6 { /* Product Title Links */
  color: #333;
  font-size: 1.6rem;
  text-transform: uppercase;
}

.l7 { /* Product Title Links */
  font-size: 1.6rem;
  color: #333;
}

.l8 {
  font-size: 1.6rem;
  color: #767676;
}

.l9 { /* Product Detail Take a look */
  font-size: 1.8rem;
  color: var(--link-color);
  font-weight: 600;
  text-transform: uppercase;
}

















#small-search-box-form .search-box-text {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: #ffffff;
  border: 1px solid #d1d1d1;
  box-shadow: none;
  box-sizing: inherit;
  width: 100%;
  position: relative;
  font-size: 1.6rem;
  color: #767676;
  font-weight: 400;
  font-family: 'Open Sans', sans-serif;
  border-radius: 5px;
}

.search-box-button {
  display: none !important;
}

.searchBoxIcon {
  position: absolute;
  top: 1.2rem;
  right: 1.4rem;
  z-index: 1;
}

/*#region Form Elements ******************************************************************************************************************************************************************************/

.linkStyling, input[type='button'].linkStyling, input[type='submit'].linkStyling, button.linkStyling {
  background-color: initial;
  border: 1px solid var(--link-color);
  border-radius: 2px;
  color: var(--link-color);
  cursor: pointer;
  display: inline-block;
  font-size: 2rem;
  font-weight: normal;
  height: auto;
  width: auto;
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  padding: .5rem 2rem .5rem 2rem;
  margin: 1rem;
}

  input[type='button'].linkStyling:focus, input[type='button'].linkStyling:hover, input[type='submit'].linkStyling:focus, input[type='submit'].linkStyling:hover, button.linkStyling:focus, button.linkStyling:hover {
    text-decoration: underline;
    background-color: initial;
    border-color: none;
    outline: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none
  }

label {
  font-size: 1.6rem;
  color: #333;
  font-weight: 700;
  display: inline-block;
  margin-right: 1.5rem;
}


/* radio buttons and checkbox */
.largeFormWrapper label.customInputWrapper {
    width: 30px;
    height: 30px;
}

label.customInputWrapper {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
    line-height: 1rem;
    display: inline-block;
}
    label.customInputWrapper.selectableRadioWrapper {
        line-height: normal;
    }

    .customInputWrapper.disabled {
        opacity: .4;
    }

/* Hide the browser's default checkbox */
label.customInputWrapper input {
    position: absolute;
    opacity: 0;
    z-index: -1;
    cursor: pointer;
}

/* Create a custom checkbox */
.checkmark {
    width: 20px;
    height: 20px;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 5px;
    display: inline-block;
    position: relative;
    flex-shrink: 0;
    flex-grow: 0;
}

    .checkmark.radio {
        border-radius: 50%;
    }

.largeFormWrapper .checkmark {
    width: 30px;
    height: 30px;
}

label.customInputWrapper:hover input ~ .checkmark {
    background-color: #eee;
}

label.customInputWrapper.facet-selected:hover .checkmark,
label.customInputWrapper.facet-selected .checkmark,
label.customInputWrapper:hover input:checked ~ .checkmark,
label.customInputWrapper input:checked ~ .checkmark {
    background-color: var(--main-color);
}

.filtersPanelsWrapper label.customInputWrapper:hover input ~ .checkmark {
    background-color: #fff;
}

.filtersPanelsWrapper label.customInputWrapper:hover input:checked ~ .checkmark {
    background-color: var(--main-color);
}

label.customInputWrapper .checkmark:after {
    content: '';
    position: absolute;
    color: #fff;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
    
}

label.customInputWrapper.facet-selected .checkmark:after,
label.customInputWrapper input:checked ~ .checkmark:after {
    content: url('/Themes/Cokesbury/Content/images/checkbox_checkmark_sm.svg');
    max-width: 14px;
}

.largeFormWrapper label.customInputWrapper.facet-selected .checkmark:after,
.largeFormWrapper label.customInputWrapper input:checked ~ .checkmark:after {
    content: url('/Themes/Cokesbury/Content/images/checkbox_checkmark_lg.svg');
    max-width: 22px;
}

.radioButton {
    position: relative;
    display: inline-block;
    width: 20px;
    height: 20px;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 50%;
    flex-shrink: 0;
    flex-grow: 0;
}

label.customInputWrapper:hover:not(.selectableRadioWrapper) input ~ .radioButton {
    background-color: #eee;
}
label.customInputWrapper.selectableRadioWrapper:hover input ~ .radioButton {
    border-color: #767676;
}

label.customInputWrapper .radioButton:after {
    content: '';
    color: transparent;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%,-50%);
    -moz-transform: translate(-50%,-50%);
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%,-50%);
}

.largeFormWrapper .radioButton,
.radioButton.large {
    width: 30px;
    height: 30px;
}

    .largeFormWrapper .radioButton:after,
    .radioButton.large:after {
        width: 30px;
        height: 30px;
    }


.selectableRadioWrapper {
    border: 1px solid #ccc;
    border-radius: 5px;
    background: #fff;
    padding: 1rem;
}
    .selectableRadioWrapper:hover {
        border: 1px solid #767676;
    }
/* Show the circle when selected */
label.customInputWrapper .radioButton.checked:after,
label.customInputWrapper input:checked ~ .radioButton:after {
    content: '';
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background-color: var(--main-color);
}

.largeFormWrapper label.customInputWrapper .radioButton.checked:after,
.largeFormWrapper label.customInputWrapper input:checked ~ .radioButton:after,
label.customInputWrapper .radioButton.large.checked:after,
label.customInputWrapper input:checked ~ .radioButton.large:after {
    content: '';
    width: 18px;
    height: 18px;
    border-radius: 50%;
    background-color: var(--main-color);
}

span.checkboxLabelText {
    margin: 0;
    vertical-align: top;
}