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


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

.master-wrapper-page {
    width: 100%;
    max-width: 1400px;
    margin: 0px auto;
    display: block;
    position: relative;
}

.master-wrapper-content {
    max-width: 1400px;
    position: relative;
    
}

.adminWrapper body {
    margin: 0px auto 0;
}

.standardMargin {
    padding: 0 3%;
}

.smallerMargin {
    padding: 0 1.5%;
}

.clearFloat {
    clear: both;
}
.clearfix:after {
    clear: both;
    content: ' ';
    display: table;
}

.contentWrapper,
.home-page-product-grid,
.order-details-page {
    padding: 3rem 3% 6rem 3%;
}

/*.fixedHeaderWrapper {
    position: fixed;
    z-index: 101;
    top: 0;
    margin: 0 auto;
    width: 100%;
    max-width: 1400px;
}*/

.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;
        }


.required {
    display: none;
}


.darkBackground p,
.darkBackground div,
.darkBackground span {
    color: #fff;
}

/* #endregion */



/* #region Typography ******************************************************************************************************************************************************************************/

/*paragraphs*/

p { /* default paragraph */
    font-size: 1.6rem;
    line-height: 1.6;
    margin-top: 0;
    font-weight: 400;
}

.darkBackground p,
.darkBackground p1,
.darkBackground p2,
.darkBackground p3,
.darkBackground p4,
.darkBackground p5,
.darkBackground p6,
.darkBackground p7 {
    color: #fff;
}

.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;
}


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

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

.darkBackground a,
.darkBackground l1,
.darkBackground l2,
.darkBackground l3,
.darkBackground l4,
.darkBackground l5,
.darkBackground l6,
.darkBackground l7 {
    color: #fff;
}

.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;
}


/*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 {
    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;
}



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*/


/*#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
    }

.common-buttons {
    text-align: right
}









.required {
    display: none;
}


input {
    outline: none;
}

.inputs {
    margin: 1rem 0;
}

.largeFormWrapper .inputs {
    margin: 3rem 0;
}

label {
    font-size: 1.6rem;
    color: #333;
    font-weight: 700;
    display: inline-block;
    margin-right: 1.5rem;
}
    .attributes dt,
    label.large,
    .largeFormWrapper label {
        font-size: 1.8rem;
        display: inline-block;
        margin-bottom: .7rem;
    }

input[type='file'] {
    width: 100%;
    padding: 0px;
    font-size: 1.6rem;
    color: #333;
    height: 50px;
    border-radius: 5px;
    font-weight: 600;
    font-family: 'Open Sans', sans-serif;
    transition: all 0.3s ease;
}

input:read-only {
    text-indent: 0;
    border: none;
    box-shadow: none !important;
}

/*textarea:focus,
select:focus,
input[type='text']:focus,
input[type='search']:focus,
input[type='number']:focus,
input[type='email']:focus,
input[type='date']:focus,
input[type='tel']:focus,
input[type='password']:focus {
    -webkit-box-shadow: 1px 4px 6px -2px rgba(0,0,0,0.3);
    -moz-box-shadow: 1px 4px 6px -2px rgba(0,0,0,0.3);
    box-shadow: 1px 4px 6px -2px rgba(0,0,0,0.3);
    transition: all 0.3s ease;
}*/


.textarea {
    padding: 2rem 0;
}

/*input.large, textarea.large, select.large,
.largeFormWrapper select,
input[type='text'].large,
.largeFormWrapper input[type='text'],
input[type='number'].large,
.largeFormWrapper input[type='number'],
input[type='tel'].large,
.largeFormWrapper input[type='tel'],
input[type='email'].large,
.largeFormWrapper input[type='email'],
input[type='date'].large,
.largeFormWrapper input[type='date'],
input[type='password'].large,
.largeFormWrapper input[type='password'],
.largeFormWrapper button,
.largeFormWrapper input[type='button'] {
    height:auto;
    padding:1.3rem;
    display: block;
    line-height:1.6;
}*/

/*.CategoryFiltersWrapper select,
.k-dropdown.small,
.k-multiselect.small,
input.small,
textarea.small,
select.small,
input[type='text'].small,
input[type='tel'].small,
input[type='number'].small,
input[type='email'].small,
input[type='date'].small,
input[type='password'].small {
    height: 40px;
    font-size: 1.4rem;
    padding: 0 6rem 0 1.5rem;
}*/
/*input[type='number'] {
    -moz-appearance: textfield;
}
input[type='number']::-webkit-inner-spin-button,
input[type='number']::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0;
}*/
/*input.qty-input {
    width: 60px;
    text-align: center;
    padding: 0;
    text-indent: 0;
}*/




.CityStateZipWrapper {display: flex}
    .CityStateZipWrapper > div:nth-child(1) > input {width: 280px;margin-right: 40px}
    .CityStateZipWrapper > div:nth-child(2) > select {width: 113px; margin-right:40px}
    .CityStateZipWrapper > div:nth-child(3) > input {width: 100%;}

.label-info {font-style: italic; color: #666;}
#formAccountApplication .s4 {margin: 20px -25px 0px -25px;}
#formAccountApplication .option-list {display: flex;}



.k-dropdown,
.k-multiselect,
select {
    /*text-indent: 0;
    padding: 0 6rem 0 2rem;*/
    padding-right: 6rem;
    cursor: pointer;
    position: relative;
}
.largeFormWrapper select {
    padding-right: 6rem;
}
select {
    -webkit-appearance: none;
    -moz-appearance: none;
    background: url('/Themes/Cokesbury/Content/images/filter_dropdown_arrow.svg') #fff right 2rem center no-repeat;
}

.k-dropdown .k-icon,
.k-multiselect .k-icon {
    background: url('/Themes/Cokesbury/Content/images/filter_dropdown_arrow.svg') center center no-repeat;
    position: absolute;
    right: 1.4rem;
    height: 2rem;
    width: 2rem;
    top: 1.4rem;
}

.k-dropdown,
.k-multiselect {
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    position: relative;
    transition: all 0.3s ease;
    outline: none;
}
   
    .k-multiselect:hover,
    .k-multiselect:focus,
    .k-multiselect:active,
    .k-dropdown:hover,
    .k-dropdown:focus,
    .k-dropdown:active {
        -webkit-box-shadow: 1px 4px 6px -2px rgba(0,0,0,0.3);
        -moz-box-shadow: 1px 4px 6px -2px rgba(0,0,0,0.3);
        box-shadow: 1px 4px 6px -2px rgba(0,0,0,0.3);
        transition: all 0.3s ease;
    }

    .k-multiselect.large,
    .largeFormWrapper .k-multiselect,
    .k-dropdown.large,
    .largeFormWrapper .k-dropdown {
        height: 60px;
    }


.k-list-scroller .k-list {
    background-color: #fff;
    border-radius: 5px;
    border: 1px solid #ccc;
    padding: 1.5rem 0;
    margin: 1rem 0 0;
    cursor: pointer;
    -webkit-box-shadow: 1px 4px 6px -2px rgba(0,0,0,0.3);
    -moz-box-shadow: 1px 4px 6px -2px rgba(0,0,0,0.3);
    box-shadow: 1px 4px 6px -2px rgba(0,0,0,0.3);
    transition: all 0.3s ease;
    overflow-y: auto;
    height: 100%;
}

.k-list-scroller .k-list .k-item {
    line-height: 3rem;
    padding: 0 2rem;
    font-size: 1.6rem;
    font-weight: 400;
}

        .k-list-scroller .k-list .k-item.k-state-hover {
            background-color: #eee;
        }

    .k-list-scroller .k-list .k-state-selected {
        display: none;
    }
    .checkoutBody .k-list-scroller .k-list .k-state-selected {
        display: block;
    }



.fixedWidthInputs input {
    width: calc(100% - 18rem);
}

.fixedWidthInputs label {
    width: 16rem;
    margin: 0;
    padding: 0;
}


.inputs.date-of-birth .date-picker-wrapper {
    width: 100%;
    display: flex;
    justify-content: space-between;
}


/* 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;
}


/* #region centered Form  */
/*.focusedLargeForm input[type='text'],
.focusedLargeForm input[type='password'],
.focusedLargeForm input[type='email'],
.focusedLargeForm input[type='tel'],
.focusedLargeForm select,
.focusedLargeForm .k-dropdown,
.focusedLargeForm .k-multiselect,
.focusedLargeForm input[type='submit'],
.focusedLargeForm input[type='button'],
.focusedLargeForm a.button {
    width: 100%;
}*/

.focusedLargeForm .fieldset,
.focusedLargeForm .page-title,
.focusedLargeForm .buttons,
.focusedLargeForm.address-edit-page {
    max-width: 600px;
    margin: 0 auto;
}

.password-recovery-page .fieldset {
    max-width: 600px !important;
    margin: 0 auto;
}

.password-recovery-page .result {
    font-size: 1.6rem;
    line-height: 1.4;
    font-family: 'Open Sans', sans-serif;
}

.centeredStackedFormFields {
    text-align: center;
}

    .centeredStackedFormFields .inputs { /* registration form radio buttons */
        width: 40%;
        text-align: center;
        display: inline-block;
    }

    .centeredStackedFormFields .checkboxLabelText {
        display: block;
    }

    .centeredStackedFormFields label {
        margin: 0 0 1rem;
    }



.segmentedControl {
    border: 2px solid var(--main-color);
    border-radius: 5px;
    color: var(--main-color);
    cursor: pointer;
    font-size: 2rem;
    font-weight: bold;
    height: 60px;
    text-align: center;
    text-decoration: none;
    white-space: nowrap;
    margin: 2rem 0;
    transition: all 0.3s ease;
    display: flex;
    width: 536px;
}
    .segmentedControl:hover {
        color: var(--main-color-darken);
    }
    .segmentedControl > div {
        width: 50%;
        background: #fff;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
    .segmentedControl > div.firstButton {
        border-radius: 4px 0 0 4px;
    }
    .segmentedControl > div.secondButton {
        border-radius: 0 4px 4px 0;
    }
    .segmentedControl > div.active {
        background: var(--main-color);
        color:#fff;
    }



.fullWidthStackedForm .inputs {
    width: 100%;
    margin: 2rem 0;
}
.fullWidthStackedForm label {
    margin-bottom: .3rem;
    display: block;
}
.fullWidthStackedForm input,
.fullWidthStackedForm select {
    width: 100%;
}

.fullWidthStackedForm .multiInputLine select {
    width: auto;
}

/*#endregion*/
/* #region Error Handling  */
input.input-validation-error,
.has-error {
    color: #cc0d33;
    border: 1px solid #cc0d33;
}

.warning {
    color: #cc0d33;
    font-weight: bold;
    font-style: normal;
}

.registrationErrorWrapper {
width: 100%;
text-align: center;
}

.message-failure,
.message-error,
.field-validation-error,
.username-not-available-status,
.poll-vote-error,
.password-error {
    display: inline-block;
    padding: 1rem 2rem;
    background: #cc0d33;
    margin: 1.5rem 0;
    color: #fff;
    border-radius: 5px;
    position: relative;
    transition: all 0.3s ease;
}
    .message-failure:after,
    .message-error:after,
    .field-validation-error:after {
        bottom: 100%;
        left: 2rem;
        border: solid transparent;
        content: " ";
        position: absolute;
        border-color: rgba(204, 13, 51, 0);
        border-bottom-color: #cc0d33;
        border-width: 10px;
        transition: all 0.3s ease;
    }

.registrationErrorWrapper .message-failure:after,
.registrationErrorWrapper .message-error:after,
.registrationErrorWrapper .field-validation-error:after {
    bottom: 100%;
    left: 2rem;
    border: none;
    content: " ";
    position: absolute;
    border-color: transparent;
    border-bottom-color: transparent;
    border-width: 0px;
    transition: all 0.3s ease;
}

    .message-error ul {
        padding: 0;
        margin: 0;
    }
    .message-error a {
        color: #fff;
    }

    .message-success {
        display: inline-block;
        padding: 1rem 2rem;
        background: #5ab500;
        margin: 1.5rem 0;
        color: #fff;
        border-radius: 5px;
        position: relative;
        transition: all 0.3s ease;
    }

    .message-success:after {
        bottom: 100%;
        left: 2rem;
        border: solid transparent;
        content: " ";
        position: absolute;
        border-color: rgba(204, 13, 51, 0);
        border-bottom-color: #5ab500;
        border-width: 10px;
        transition: all 0.3s ease;
    }


.login-page .message-error:after, .order-summary-content .message-error:after, .divCheckOutWrapper .message-error:after, .registration-page .message-error:after {
    content: none;
}

.divCheckOutWrapper .pickup-points .message-error {
    display: none;
}

.ModalQuantityError {
    position: absolute;
}
    .ModalQuantityError ul {padding: 0px;}

.message-warning {
    display: block;
    padding: 1rem 2rem;
    background: #EFF227;
    margin: 1.5rem 0;
    color: #000;
    border-radius: 5px;
    position: relative;
    transition: all 0.3s ease;
    text-align: center;
    font-weight: bold;
}
/*#endregion*/

/*#endregion*/



/*#endregion*/
/*#region Header ******************************************************************************************************************************************************************************/
/*.header {
    background: #005596;
    background: var(--main-color);
    width: 100%;
    height: 100px;
    text-align: left;
    display: flex;
    flex-wrap: nowrap;
    position: relative;
}

.logoWrapper {
    max-width: 260px;
    min-width: 220px;
    width: 30%;
    display: flex;
    padding: 0 2rem;
    flex-direction: column;
    height: 100%;
    justify-content: space-around;
}

    .logoWrapper a {
        display: block;
    }

    .logoWrapper img {
        width: 100%;
        border: 0;
    }

.searchBoxWrapper {
    display: inline-block;
    height: 60px;
    margin: 25px 20px 0px 25px;
    position: relative;
    width: 100%;
}

.headerLinksWrapper {
    height: 30px;
    margin: 3rem 3rem 0 auto;
    display: inline-block;
    white-space: nowrap;
}

.headerLinks > ul {
    list-style: none;
    margin: 0px;
    padding: 0px;
    text-align: left;
    width: 100%;
}

    .headerLinks > ul > li {
        display: inline-block;
        margin: 1rem 1rem 0;
        padding: 0;
        position: relative;
        height: 30px;
        vertical-align: top;
    }

.headerLinks a {
    font-size: 1.4rem;
    font-weight: 600;
    display: block;
    text-align: left;
    text-decoration: none;
    text-transform: uppercase;
    cursor: pointer;
}

    .headerLinks a.dropdown {
        pointer-events: none;
        cursor: default;
    }

.headerLinks > ul > li > a.dropDown svg {
    vertical-align: bottom;
}

.headerLinks > ul > li > a.dropDown .icon {
    fill: #FFFFFF;
}

.headerLinks > ul > li > a.dropDown:hover .icon {
    fill: #CDCDCD;
}

.headerLinks > ul > li:active > a {
    color: #CDCDCD;
}

.headerLinks > ul > li > ul {
    background: #FFFFFF;
    min-width: 100%;
    padding: 0px;
    left: 0;
    position: absolute;
    opacity:0;
    top: 1rem;
    visibility:hidden;
    z-index: 99999;
    border: 1px solid #ccc;
    border-radius: 5px;
    -webkit-box-shadow: 1px 4px 6px -2px rgba(0,0,0,0.3);
    -moz-box-shadow: 1px 4px 6px -2px rgba(0,0,0,0.3);
    box-shadow: 1px 4px 6px -2px rgba(0,0,0,0.3);
    transition: all 0.3s ease;
    padding: 1rem 0;
}


.headerLinks > ul > li.active ul {
    opacity:1;
    top: 3rem;
    visibility: visible;
}
.headerLinks > ul > li.fade ul {
    top: 3rem;
}

.headerLinks li ul li {
    width: 100%;
    display: block;
    padding: 1rem 4rem 1rem 2rem;
}

    .headerLinks li ul li:hover {
        background: #eeeeee;
    }

.headerLinks li ul a,
.headerLinks li ul span.wishlist-qty {
    color: #333333;
    margin: 0px;
    text-align: left;
    text-decoration: none;
    text-transform: uppercase;
}

    .headerLinks li ul a:hover {
        color: #333333;
        text-decoration: underline;
    }*/

#topcartlink {
    position: relative;
    text-align: center;
    width: 60px;
    height: 60px;
    margin-top: 0;
}


    #topcartlink.jiggle {
        animation: shake 0.7s cubic-bezier(.36,.07,.19,.97) both;
        transform: translate3d(0, 0, 0);
        transform: rotate(0deg);
        backface-visibility: hidden;
        perspective: 1000px;
        animation-iteration-count: 1;
    }

.headerLinksCart {
    margin-left: 1rem;
    display: inline-block;
    position: absolute;
    text-indent: 0px;
    content: "";
    width: 56px;
    height: 48px;
    background:transparent url('/Themes/Cokesbury/Content/images/icon_nav_cart_2x.png') no-repeat;
    background-size: 56px 48px;
}

.headerLinksCartQty {
    display: inline-block;
    border-radius: 50%;
    font-size: 1.6rem;
    font-weight: 600;
    color: #333333 !important;
    width: 30px;
    height: 30px;
    position: absolute;
    left: 7px;
    top: -4px;
    background: #ffb32c;
    z-index: 1000;
    text-align: center;
    line-height: 2.8rem;
    overflow: hidden;
}


.flyout-cart.active {
    visibility: visible;
    opacity: 1;
    top: 8.5rem;
    transition: all 0.3s ease;
}

.flyout-cart.fade {
    top: 8.5rem;
}

.flyout-cart {
    border: 1px solid #ccc;
    border-radius: 5px;
    position: absolute;
    right: 2rem;
    top: 6rem;
    z-index: 100;
    width: 550px;
    -webkit-box-shadow: 1px 4px 6px -2px rgba(0,0,0,0.3);
    -moz-box-shadow: 1px 4px 6px -2px rgba(0,0,0,0.3);
    box-shadow: 1px 4px 6px -2px rgba(0,0,0,0.3);
    transition: all 0.3s ease;
    background-color: #fff;
    visibility: hidden;
    opacity: 0;
}

.mini-shopping-cart {
    padding: 3rem 4rem 4rem;
}

.miniCartnoItemsMessageWrapper {
    padding: 1rem 0 0;
    display: block;
}

.miniCartItemsMessageWrapper {
    display: flex;
    justify-content: space-between;
    padding: 0 0 1rem;
    border-bottom: 1px solid #ccc;
}

    .miniCartItemsMessageWrapper span {
        margin: 0;
        padding: 0;
    }

        .miniCartItemsMessageWrapper span a {
            font-size: 2rem;
        }


.mini-shopping-cart .totals .flyoutSubTotalLabel {
    font-size: 2.8rem;
    float: left;
}

.mini-shopping-cart .totals .flyoutSubTotal {
    font-size: 2.8rem;
    float: right;
    font-weight: 700;
}

.mini-shopping-cart .checkout-button {
    width: 100%;
}

.namePriceWrapper {
    display: flex;
    justify-content: space-between;
    width: 100%;
}

    .namePriceWrapper .name a {
        text-transform: none;
    }

    .namePriceWrapper .price {
        margin: 0 0 0 3rem;
    }




.mini-shopping-cart .items {
    margin: 0 0 2rem;
    border-bottom: 1px solid #ccc;
}

    .mini-shopping-cart .items .item {
        display: flex;
        padding: 2rem 0;
    }


.mini-shopping-cart .picture {
    display: inline-block;
    text-align: center;
}

.mini-shopping-cart .product {
    display: inline-block;
    text-align: left;
    vertical-align: top;
    padding-left: 2rem;
    white-space: normal;
    width: 100%;
}

.mini-shopping-cart .authorName {
    margin-bottom: 2rem;
}

.mini-shopping-cart .buttons {
    clear: both;
}

    .mini-shopping-cart .buttons .checkout-button {
        margin-bottom: 0;
    }

.mini-shopping-cart .picture a {
    display: block;
    overflow: visible;
}

    .mini-shopping-cart .picture a img {
        top: 0;
        left: 0;
        margin: auto;
        width: 10rem;
    }


div.floating-cart {
    box-sizing: border-box;
    position: absolute;
    opacity: .9;
}

    div.floating-cart img {
        max-width: 100%;
        max-height: 100%;
    }

    div.floating-cart.moveToCart {
        width: 30px !important;
        height: 45px !important;
        -webkit-transition: all 800ms ease-in-out;
        -moz-transition: all 800ms ease-in-out;
        -ms-transition: all 800ms ease-in-out;
        -o-transition: all 800ms ease-in-out;
        transition: all 800ms ease-in-out;
        z-index: 1111;
        opacity: .6;
    }

body.MakeFloatingCart div.floating-cart.moveToCart {
    width: 20px !important;
    height: 30px !important;
    box-shadow: 0px 5px 31px -1px rgba(0, 0, 0, 0);
    -webkit-transition: all 200ms ease-out;
    -moz-transition: all 200ms ease-out;
    -ms-transition: all 200ms ease-out;
    -o-transition: all 200ms ease-out;
    transition: all 200ms ease-out;
    opacity: 0;
}


.searchBoxWrapper .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;
}

/* move x from search box*/
.search-box-text::-ms-clear,
.search-box-text::-ms-reveal,
.search-box-text::-webkit-search-decoration,
.search-box-text::-webkit-search-cancel-button,
.search-box-text::-webkit-search-results-button,
.search-box-text::-webkit-search-results-decoration {
    margin-right: 40px;
}

    /* Hide the mobile close button */
    #search-input-wrapper .CloseSearchIcon {display: none;}


.ui-widget {
    font-family: 'Open Sans', sans-serif;
}

.ui-autocomplete {
    z-index: 102;
    border: 1px solid #cccccc;
    border-top: none;
    overflow: hidden;
    background-color: #fff;
    text-align: left; /*override jQuery UI styles, do not delete doubled properties*/
    border-radius: 5px;
    padding: 20px;
    -webkit-box-shadow: 1px 4px 6px -2px rgba(0,0,0,0.3);
    -moz-box-shadow: 1px 4px 6px -2px rgba(0,0,0,0.3);
    box-shadow: 1px 4px 6px -2px rgba(0,0,0,0.3);
    position: fixed;
}

    .ui-autocomplete a {
        display: block;
        padding: 15px;
        font-size: 1.6rem; /*override jQuery UI styles, do not delete doubled properties*/
        margin: 0 !important;
        border: none !important;
        background: none !important;
        padding: 7px !important;
        line-height: normal !important;
        color: #333333 !important;
    }

        .ui-autocomplete a:hover,
        .ui-autocomplete a.ui-state-focus {
            text-decoration: underline;
        }

    .ui-autocomplete img {
        display: none;
        min-width: 20px;
        margin: 0 10px 0 0;
        vertical-align: middle;
    }

/*#endregion*/


/*#endregion*/
/*#region LIVE CHAT  */
.livechat_button {
    position: fixed;
    bottom: 2rem;
    right: calc((100% - 1680px) / 2);
    box-shadow: 1px 1px 14px 0px rgba(0,0,0,0.3);
    border-radius: 50%;
    height: 122px;
    width: 120px;
    transition: all 0.3s ease;
    cursor: pointer;
    z-index: 100;
    background: #fff;
}

    .livechat_button:hover {
        box-shadow: 1px 1px 14px 0px rgba(0,0,0,0.5);
        transition: all 0.3s ease;
    }

#livechat-compact-container {
    display: none;
}

/*#endregion*/



/* laoding */



.search-loader-effect .spinner,
.panel-loader-effect .spinner {
    color: var(--main-color);
    font-size: 60px;
    text-indent: -9999em;
    overflow: hidden;
    width: 1em;
    height: 1em;
    border-radius: 50%;
    position: -webkit-sticky;
    position: sticky;
    -webkit-transform: translateZ(0);
    -ms-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-animation: load6 1.7s infinite ease;
    animation: load6 1.7s infinite ease;
    top: calc(50% - 30px);
    left: calc(50% - 30px);
    z-index: 1000002;
    background: none; /* For browsers that do not support gradients */
}

.search-loader-effect {
    opacity: 0;
    display: none;
}

.search-loader-effect.active {
    opacity: 1;
    position: relative;
    width: 100%;
    background: rgba(255, 255, 255, 0.8);
    display: inherit;
}
    

.k-loading-text {
    display: none;
}

.panel-loader-effect {
    position: absolute;
    top: -1px;
    left: -1px;
    z-index: 100001;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.8);
}
    .panel-loader-effect.order-total-content-loader {
        background: rgba(238, 238, 238, 0.8);
    }
    





/* paging */

.pager {
    border-top: 1px solid #ccc;
    padding: 2rem 0 0 2rem;
}
.k-pager-wrap,
.pager {
    margin-top: 4rem;
    display: flex;
    flex-direction: row;
}

    .k-pager-numbers,
    .pager ul {
        margin: 0;
        padding: 0 1rem;
    }

    .k-pager-numbers li,
    .pager li {
        display: inline-block;
        padding: 0 1rem;
        font-size: 2rem;
        text-align: center;
        font-weight: 700;
        line-height: 5rem;
    }

        .k-pager-numbers li.k-current-page {
            display: none;
        }

.k-pager-nav.k-state-disabled {
    opacity: .2;
}

.k-pager-nav {
    padding: 1.6rem 1rem;
}
.pager li {
    vertical-align:middle;
}
.k-i-arrow-end-left,
.pager li.first-page a {
    transform: rotate(90deg);
    width: 1.4rem;
    height: 1.6rem;
    background: url('/Themes/Cokesbury/Content/images/filter_dropdown_arrow.svg');
    display: block;
    font-size: 0;
}

.k-i-arrow-60-left,
.pager li.previous-page a {
    transform: rotate(90deg);
    width: 2rem;
    height: 1.6rem;
    background: url('/Themes/Cokesbury/Content/images/filter_dropdown_arrow.svg') center center no-repeat;
    display: block;
    font-size: 0;
}

.k-i-arrow-60-right,
.pager li.next-page a {
    transform: rotate(-90deg);
    width: 2rem;
    height: 1.6rem;
    background: url('/Themes/Cokesbury/Content/images/filter_dropdown_arrow.svg') center center no-repeat;
    display: block;
    font-size: 0;
}

.k-i-arrow-end-right,
.pager li.last-page a {
    transform: rotate(-90deg);
    width: 1.4rem;
    height: 1.6rem;
    background: url('/Themes/Cokesbury/Content/images/filter_dropdown_arrow.svg');
    display: block;
    font-size: 0;
}

.k-pager-sizes {
    display: flex;
    line-height: 5rem;
    margin-left: 4rem;
}

    .k-pager-sizes .k-dropdown {
        margin-right: 1rem;
    }

.k-pager-info {
    margin-left: auto;
    line-height: 5rem;
}



/* end paging */


.unavailableFitersMessage {
    display: none;
    padding: 2rem 0 0;
    margin: 0rem 2rem 2rem;
}

/* kendo tooltip */
.k-tooltip.k-popup {
    top: -8px;
}

.helpIcon,
.helpIconWithTemplate {
    background: url('/Themes/Cokesbury/Content/images/helpIcon.svg') center center var(--main-color) no-repeat;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    padding: 0;
    margin: 0;
    background-size: 12px 12px;
    display: inline-block;
    cursor: pointer;
    vertical-align: top;
}
.k-tooltip {
    /*background: url('/Themes/Cokesbury/Content/images/bank-routing-number.gif') center center no-repeat;*/
}

label.labelHint,
.inputs label.labelHint {
    display: inline-block;
}

.k-tooltip-content {
    padding: 1rem 1.5rem;
    border-radius: 5px;
    background: #fff;
    border: 1px solid #ccc;
    -webkit-box-shadow: 1px 4px 6px -2px rgba(0,0,0,0.3);
    -moz-box-shadow: 1px 4px 6px -2px rgba(0,0,0,0.3);
    box-shadow: 1px 4px 6px -2px rgba(0,0,0,0.3);
    transition: all 0.3s ease;
    text-align:center;
}

.k-callout {
    position: absolute;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 8px;
    border-color: transparent;
    transition: all 0.3s ease;
}

.k-callout-s {
    left: 50%;
    bottom: -12px;
    margin-left: -8px;
    pointer-events: none;
    border-top-color: #fff;
}

.k-tooltip.k-popup.favoriteAuthorKendoText {
    top: -2px;
    left: 15px;
}
    .k-tooltip.k-popup.favoriteAuthorKendoText .k-tooltip-content {
        text-align:left;
    }
.k-callout-w {
    left: -19px;
    bottom: initial;
    top: calc(50% - 8px);
    margin-left: 4px;
    pointer-events: none;
    border-right-color: #ccc;
}
    .k-callout-w:after {
        content: '';
        display: block;
        position: absolute;
        width: 0;
        height: 0;
        border-style: solid;
        border-width: 8px;
        border-color: transparent;
        transition: all 0.3s ease;
        left: -7px;
        bottom: initial;
        top: calc(50% - 8px);
        margin-left: 0;
        pointer-events: none;
        border-right-color: #fff;
    }

.ui-dialog .ui-dialog-titlebar-close {
    position: absolute;
    width: 3rem;
    height: 3rem;
}

.ui-button-text {
    display: none;
}
.ui-button-icon-only {
    white-space: nowrap;
    overflow: hidden;
}
/* #endregion */
/* #region keyframes ******************************************************************************************************************************************************************************/
@keyframes shake { /* used on minicart */
    10% {
        transform: translate3d(2px, 0, 0) rotate(7deg);
    }

    30% {
        transform: translate3d(-1px, 0, 0) rotate(-4deg);
    }

    40%, 60% {
        transform: translate3d(0, 0, 0) rotate(-2deg);
    }

    50%, 80% {
        transform: translate3d(0, 0, 0) rotate(1deg);
    }
}

@-webkit-keyframes load6 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
        box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
    }

    5%, 95% {
        box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
    }

    10%, 59% {
        box-shadow: 0 -0.83em 0 -0.4em, -0.087em -0.825em 0 -0.42em, -0.173em -0.812em 0 -0.44em, -0.256em -0.789em 0 -0.46em, -0.297em -0.775em 0 -0.477em;
    }

    20% {
        box-shadow: 0 -0.83em 0 -0.4em, -0.338em -0.758em 0 -0.42em, -0.555em -0.617em 0 -0.44em, -0.671em -0.488em 0 -0.46em, -0.749em -0.34em 0 -0.477em;
    }

    38% {
        box-shadow: 0 -0.83em 0 -0.4em, -0.377em -0.74em 0 -0.42em, -0.645em -0.522em 0 -0.44em, -0.775em -0.297em 0 -0.46em, -0.82em -0.09em 0 -0.477em;
    }

    100% {
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
        box-shadow: 0 -0.83em 0 -0.4em, 0 -0.83em 0 -0.42em, 0 -0.83em 0 -0.44em, 0 -0.83em 0 -0.46em, 0 -0.83em 0 -0.477em;
    }
}

/* #endregion */






/******************************************************* web accessability ********************************************************************   */

.skip {
    position: fixed;
    z-index: 101;
    margin:0;
    bottom: 100px;
}
    .skip li a {
        position: absolute;
        background: #fff;
        border-radius: 5px;
        white-space: nowrap;
        padding: 1rem 2rem;
        font-size: 1.6rem;
        left:-9999px;
        top: 2rem;
    }
        .skip li a:focus {
            left: 2rem;
        }

.mce-content-body ul, .mce-content-body ul li {
    list-style-type: disc;
}

.mce-content-body ol, .mce-content-body ol li {
    list-style-type: decimal;
}

.cc-expired, .cc-expired p {
    color: #cc0d33;
    font-weight: normal;
    font-style: normal;
    display: inline-block !important;
    margin-top: 7px;
}

.cc-expired::after {
  content: " - Expired";
}


/* Move reCAPTCHA v3 badge to the left */

.grecaptcha-badge {
    width: 70px !important;
    overflow: hidden !important;
    transition: all 0.3s ease !important;
    left: 4px !important;
}

    .grecaptcha-badge:hover {
        width: 256px !important;
    }