body,
.card,
.card-header,
.hero {
    background-color: var(--skin-background-color-1);
    font-family: var(--skin-body-font);
    color: var(--skin-main-text-color-1)
}

.hero {
    border-bottom-color: var(--skin-background-color-1)
}

.main-menu {
    background-color: var(--skin-banner-background-color-1)
}

.banner-color {
    background-color: var(--skin-banner-background-color-1)
}

.header-banner {
    background-color: var(--skin-banner-background-color-2);
    color: var(--skin-banner-text-color-1)
}

.header-banner .close-button .close {
    background-color: var(--skin-primary-color-1)
}

h1.header.page-title,
h1.header.page-title::before {
    background-color: var(--skin-heading-color-1);
    color: var(--skin-heading-color-1-invert)
}

.product-tile {
    background-color: var(--skin-background-color-1);
    border: 10px solid var(--skin-border-color-1)
}

.refinements ul li button {
    color: var(--skin-primary-color-1)
}

.custom-select {
    background-color: var(--skin-selectbox-background-color-1);
    color: var(--skin-selectbox-text-color-1)
}

a {
    color: var(--skin-primary-color-1)
}

header~#maincontent .container a:not(.btn-primary, .btn-outline-primary) {
    color: var(--skin-primary-color-1)
}

.price {
    color: var(--skin-price-1)
}

.navbar,
.navbar .nav-item,
.navbar .nav-item a,
.navbar .nav-item.dropdown,
.navbar .nav-item.dropdown a,
.dropdown-menu,
.dropdown-menu a {
    color: var(--skin-menu-color-1)
}

@media (min-width: 769px) {

    .navbar,
    .navbar .nav-item,
    .navbar .nav-item a,
    .navbar .nav-item.dropdown,
    .navbar .nav-item.dropdown a,
    .dropdown-menu,
    .dropdown-menu a {
        color: var(--skin-menu-color-1-invert)
    }
}

.navbar .nav-item.dropdown,
.navbar .nav-item.dropdown .dropdown-menu.show {
    color: var(--skin-selectbox-text-color-1)
}

.navbar .nav-item.dropdown .dropdown-menu.show {
    background-color: var(--skin-selectbox-background-color-1)
}

.navbar .nav-item.dropdown .dropdown-menu.show a,
.navbar .nav-item.dropdown .dropdown-menu.show .nav-item {
    color: var(--skin-selectbox-text-color-1)
}

.nav-item .nav-link:hover,
.nav-item .nav-link:focus,
.nav-item.show .nav-link {
    background-color: var(--skin-menu-color-1-invert);
    color: var(--skin-menu-color-1) !important
}

.btn-primary {
    background-color: var(--skin-primary-color-1);
    border-color: var(--skin-primary-color-1);
    color: var(--skin-primary-color-invert-1)
}

.btn-primary:hover {
    color: var(--skin-primary-color-1);
    border-color: var(--skin-primary-color-1);
    background-color: var(--skin-primary-color-invert-1)
}

.btn-primary.disabled,
.btn-primary:disabled {
    background-color: var(--skin-primary-color-1);
    border-color: var(--skin-primary-color);
    color: var(--skin-primary-color-invert-1);
    opacity: 0.5
}

.btn-outline-primary {
    color: var(--skin-primary-color-1);
    border-color: var(--skin-primary-color-1)
}

.btn-outline-primary:hover {
    color: var(--skin-primary-color-invert-1);
    background-color: var(--skin-primary-color-1);
    border-color: var(--skin-primary-color-1)
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--skin-header-font), sans-serif
}

a {
    color: var(--skin-link-color-1)
}

:root {
    --color-benefit-pink: #ff0064;
    --color-medium-pink: #fc91dc;
    --color-light-pink: #fccad9;
    --color-warm-white: #fcead8;
    --color-warm-white-3: #fff4eb;
    --color-dark-red: #b30202;
    --color-yellow: #ff9e10;
    --color-green: #004c00;
    --color-navy: #250070;
    --color-light-blue: #6d91f9;
    --color-light-green: #efffef;
    --color-orange: #ff5346;
    --color-maroon: #8c0144;
    --color-white: #fff;
    --bg-color-benefit-pink: #ff0064;
    --bg-color-medium-pink: #fc91dc;
    --bg-color-warm-white-3: #fff4eb;
    --bg-color-warm-white-2: #fceadb;
    --color-benefit-pink-text-smaller: #e6005c;
    --color-neutral-gray-200: #e9e9e9
}

:root .highContrast {
    --color-benefit-pink: #000;
    --color-medium-pink: #000
}

:root {
    --skin-header-font: Roslindale, Arial, Helvetica, sans-serif;
    --skin-body-font: Obviously, Arial, Helvetica, sans-serif;
    --skin-body-font-medium: Obviously-Medium, Arial, Helvetica, sans-serif;
    /* --skin-body-font-condensed: Obviously-Condensed, Arial, Helvetica, sans-serif; */
    --skin-body-font-condensed: 'Bebas Neue', sans-serif;;
    --skin-body-font-medium-condensed: Obviously-Medium-Condensed, Arial, Helvetica, sans-serif;
    --skin-body-font-bold: Obviously-Bold, Arial, Helvetica, sans-serif;
    --skin-body-font-expanded: Obviously-Expanded, Arial, Helvetica, sans-serif;
    --skin-primary-color-1: #000;
    --skin-primary-color-invert-1: #fff;
    --skin-link-color-1: #000;
    --skin-link-color-2: #000;
    --skin-menu-color-1: #000;
    --skin-menu-color-1-invert: #000;
    --skin-banner-background-color-1: #fff
}

body,
.card,
.card-header,
.hero {
    background-color: var(--skin-background-color-1);
    font-family: var(--skin-body-font);
    color: var(--skin-main-text-color-1)
}

.hero {
    border-bottom-color: var(--skin-background-color-1)
}

.main-menu {
    background-color: var(--skin-banner-background-color-1)
}

.banner-color {
    background-color: var(--skin-banner-background-color-1)
}

.header-banner {
    background-color: var(--skin-banner-background-color-2);
    color: var(--skin-banner-text-color-1)
}

.header-banner .close-button .close {
    background-color: var(--skin-primary-color-1)
}

h1.header.page-title,
h1.header.page-title::before {
    background-color: var(--skin-heading-color-1);
    color: var(--skin-heading-color-1-invert)
}

.product-tile {
    background-color: var(--skin-background-color-1);
    border: 10px solid var(--skin-border-color-1)
}

.refinements ul li button {
    color: var(--skin-primary-color-1)
}

.custom-select {
    background-color: var(--skin-selectbox-background-color-1);
    color: var(--skin-selectbox-text-color-1)
}

a {
    color: var(--skin-primary-color-1)
}

header~#maincontent .container a:not(.btn-primary, .btn-outline-primary) {
    color: var(--skin-primary-color-1)
}

.price {
    color: var(--skin-price-1)
}

.navbar,
.navbar .nav-item,
.navbar .nav-item a,
.navbar .nav-item.dropdown,
.navbar .nav-item.dropdown a,
.dropdown-menu,
.dropdown-menu a {
    color: var(--skin-menu-color-1)
}

@media (min-width: 769px) {

    .navbar,
    .navbar .nav-item,
    .navbar .nav-item a,
    .navbar .nav-item.dropdown,
    .navbar .nav-item.dropdown a,
    .dropdown-menu,
    .dropdown-menu a {
        color: var(--skin-menu-color-1-invert)
    }
}

.navbar .nav-item.dropdown,
.navbar .nav-item.dropdown .dropdown-menu.show {
    color: var(--skin-selectbox-text-color-1)
}

.navbar .nav-item.dropdown .dropdown-menu.show {
    background-color: var(--skin-selectbox-background-color-1)
}

.navbar .nav-item.dropdown .dropdown-menu.show a,
.navbar .nav-item.dropdown .dropdown-menu.show .nav-item {
    color: var(--skin-selectbox-text-color-1)
}

.nav-item .nav-link:hover,
.nav-item .nav-link:focus,
.nav-item.show .nav-link {
    background-color: var(--skin-menu-color-1-invert);
    color: var(--skin-menu-color-1) !important
}

.btn-primary {
    background-color: var(--skin-primary-color-1);
    border-color: var(--skin-primary-color-1);
    color: var(--skin-primary-color-invert-1)
}

.btn-primary:hover {
    color: var(--skin-primary-color-1);
    border-color: var(--skin-primary-color-1);
    background-color: var(--skin-primary-color-invert-1)
}

.btn-primary.disabled,
.btn-primary:disabled {
    background-color: var(--skin-primary-color-1);
    border-color: var(--skin-primary-color);
    color: var(--skin-primary-color-invert-1);
    opacity: 0.5
}

.btn-outline-primary {
    color: var(--skin-primary-color-1);
    border-color: var(--skin-primary-color-1)
}

.btn-outline-primary:hover {
    color: var(--skin-primary-color-invert-1);
    background-color: var(--skin-primary-color-1);
    border-color: var(--skin-primary-color-1)
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--skin-header-font), sans-serif
}

a {
    color: var(--skin-link-color-1)
}

.lazy {
    transition: opacity 0.6s ease
}

.entered {
    opacity: 0
}

.entered.loaded {
    opacity: 1
}

.product-tile .secondary-tile-image {
    opacity: 0
}

.text-primary {
    color: var(--color-benefit-pink)
}

.highContrast .text-primary {
    color: #000
}

.text-benefit-pink {
    color: var(--color-benefit-pink)
}

.highContrast .text-benefit-pink {
    color: #000
}

.text-secondary-red {
    color: #f10303
}

.highContrast .text-secondary-red {
    color: #000
}

.text-red {
    color: #f10303
}

.highContrast .text-red {
    color: #000
}

.text-secondary-medium-pink {
    color: var(--color-medium-pink)
}

.highContrast .text-secondary-medium-pink {
    color: #000
}

.text-medium-pink {
    color: #fc91dc
}

.highContrast .text-medium-pink {
    color: #000
}

.text-secondary-light-pink {
    color: #fccad9
}

.highContrast .text-secondary-light-pink {
    color: #000
}

.text-light-pink {
    color: #fccad9
}

.highContrast .text-light-pink {
    color: #000
}

.text-green {
    color: #004c00
}

.highContrast .text-green {
    color: #000
}

.text-navy {
    color: #250070
}

.highContrast .text-navy {
    color: #000
}

.text-yellow {
    color: #ff9e10
}

.highContrast .text-yellow {
    color: #000
}

.text-maroon {
    color: #8c0144
}

.highContrast .text-maroon {
    color: #000
}

.text-warm-white {
    color: #fcead8
}

.highContrast .text-warm-white {
    color: #000
}

.text-orange {
    color: #ff5346
}

.highContrast .text-orange {
    color: #000
}

.text-light-blue {
    color: #6d91f9
}

.highContrast .text-light-blue {
    color: #000
}

.text-black {
    color: #000
}

.highContrast .text-black {
    color: #000
}

.text-light-gray {
    color: #cdcdcd
}

.highContrast .text-light-gray {
    color: #000
}

.text-charcoal {
    color: #313131
}

.highContrast .text-charcoal {
    color: #000
}

.bg-primary {
    background-color: var(--bg-color-benefit-pink)
}

.btn-primary {
    background-color: var(--bg-color-benefit-pink)
}

.bg-benefit-pink {
    background-color: var(--bg-color-benefit-pink)
}

.btn-benefit-pink {
    background-color: var(--bg-color-benefit-pink)
}

.bg-secondary-red {
    background-color: #f10303
}

.btn-secondary-red {
    background-color: #f10303
}

.bg-red {
    background-color: #f10303
}

.btn-red {
    background-color: #f10303
}

.bg-secondary-medium-pink {
    background-color: var(--bg-color-medium-pink)
}

.btn-secondary-medium-pink {
    background-color: var(--bg-color-medium-pink)
}

.bg-medium-pink {
    background-color: #fc91dc
}

.btn-medium-pink {
    background-color: #fc91dc
}

.bg-secondary-light-pink {
    background-color: #fccad9
}

.btn-secondary-light-pink {
    background-color: #fccad9
}

.bg-light-pink {
    background-color: #fccad9
}

.btn-light-pink {
    background-color: #fccad9
}

.bg-green {
    background-color: #004c00
}

.btn-green {
    background-color: #004c00
}

.bg-navy {
    background-color: #250070
}

.btn-navy {
    background-color: #250070
}

.bg-yellow {
    background-color: #ff9e10
}

.btn-yellow {
    background-color: #ff9e10
}

.bg-maroon {
    background-color: #8c0144
}

.btn-maroon {
    background-color: #8c0144
}

.bg-warm-white {
    background-color: #fcead8
}

.btn-warm-white {
    background-color: #fcead8
}

.bg-orange {
    background-color: #ff5346
}

.btn-orange {
    background-color: #ff5346
}

.bg-light-blue {
    background-color: #6d91f9
}

.btn-light-blue {
    background-color: #6d91f9
}

.bg-black {
    background-color: #000
}

.btn-black {
    background-color: #000
}

.bg-light-gray {
    background-color: #cdcdcd
}

.btn-light-gray {
    background-color: #cdcdcd
}

.bg-charcoal {
    background-color: #313131
}

.btn-charcoal {
    background-color: #313131
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: var(--skin-header-font), Arial, Helvetica, sans-serif;
    font-weight: 900
}

h1 {
    font-size: 5.9375rem;
    line-height: 5.9375rem
}

h2 {
    font-size: 4.6875rem;
    line-height: 4.6875rem
}

h3 {
    font-size: 3.4375rem;
    line-height: 3.4375rem
}

h4 {
    font-size: 2.8125rem;
    line-height: 2.8125rem
}

h5 {
    font-size: 2.1875rem;
    line-height: 2.1875rem
}

h6 {
    font-size: 1.5625rem;
    line-height: 1.5625rem
}

@media (max-width: 991.96px) {
    h1 {
        font-size: 3rem;
        line-height: 3rem
    }

    h2 {
        font-size: 35px;
        line-height: 35px
    }

    h3 {
        font-size: 30px;
        line-height: 30px
    }

    h4 {
        font-size: 25px;
        line-height: 25px
    }

    h5 {
        font-size: 20px;
        line-height: 20px
    }
}

.display-1 {
    font-family: var(--skin-body-font), Arial, Helvetica, sans-serif;
    font-size: 28px;
    font-weight: 600;
    font-stretch: condensed;
    line-height: 28px;
    text-transform: uppercase
}

.display-2 {
    font-family: var(--skin-body-font), Arial, Helvetica, sans-serif;
    font-size: 24px;
    font-weight: 600;
    font-stretch: condensed;
    line-height: 24px;
    text-transform: uppercase
}

.display-3 {
    font-family: var(--skin-body-font), Arial, Helvetica, sans-serif;
    font-size: 18px;
    font-weight: 600;
    font-stretch: condensed;
    line-height: 18px;
    text-transform: uppercase
}

.display-4 {
    font-family: var(--skin-body-font), Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: 600;
    font-stretch: condensed;
    line-height: 16px;
    text-transform: uppercase
}

@media (max-width: 991.96px) {
    .display-1 {
        font-size: 16px;
        line-height: 16px
    }

    .display-2 {
        font-size: 14px;
        line-height: 14px
    }
}

p {
    font-family: var(--skin-body-font), Arial, Helvetica, sans-serif;
    font-size: 0.875rem;
    font-weight: 400;
    line-height: 25px
}

.large-outline,
.medium-outline,
.small-outline,
.x-small-outline {
    font-family: var(--skin-body-font-expanded);
    color: #000;
    letter-spacing: -0.75px
}

.large-outline {
    font-size: 250px;
    line-height: 250px;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 3px
}

.medium-outline {
    font-size: 150px;
    line-height: 150px;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 2px
}

.small-outline {
    font-size: 95px;
    line-height: 95px;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 1px
}

.x-small-outline {
    font-size: 75px;
    line-height: 75px;
    -webkit-text-fill-color: transparent;
    -webkit-text-stroke: 1px
}

@media (max-width: 991.96px) {
    .large-outline {
        font-size: 75px;
        line-height: 75px;
        -webkit-text-stroke: 1px
    }

    .medium-outline {
        font-size: 55px;
        line-height: 55px;
        -webkit-text-stroke: 1px
    }

    .small-outline {
        font-size: 45px;
        line-height: 45px
    }

    .x-small-outline {
        font-size: 35px;
        line-height: 35px
    }
}

.btn:focus {
    box-shadow: 0 0 0 0.2rem black
}

.btn-primary {
    color: #fff;
    font-family: var(--font-family-bebas); font-weight:100;
    font-size: 20px;
    font-weight: 470;
    font-style: normal;
    font-stretch: condensed;
    text-transform: uppercase;
    line-height: 30px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    background-color: #000;
    border: none;
    padding: 11px 40px 15px;
    border-radius: 30px;
    letter-spacing: 0.64px
}

.btn-primary:hover {
    background-color: #000
}

@media (max-width: 991.96px) {
    .btn-primary {
        padding: 6px 30px 10px;
        font-size: 14px;
        letter-spacing: 0.7px
    }
}

.btn-primary:focus {
    box-shadow: 0 0 0 0.2rem #000;
    border-color: #000
}

.btn-secondary {
    color: #000;
    font-size: 12px;
    font-weight: 470;
    background-color: #fccad9;
    border: none;
    height: 40px;
    text-transform: uppercase;
    padding: 0 25px;
    border-radius: 20px;
    font-family: var(--font-family-bebas);
    line-height: 38.5px
}

.btn-secondary span {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    text-transform: uppercase;
    line-height: inherit;
    display: flex;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.btn-secondary:hover {
    color: #000;
    background-color: #fccad9
}

@media (max-width: 991.96px) {
    .btn-secondary {
        font-size: 10px;
        padding: 0 20px;
        height: 32.51px
    }

    .btn-secondary span {
        font-size: inherit
    }
}

.btn-secondary:disabled {
    background-color: #fccad9;
    color: #000
}

.btn-small {
    color: #fff;
    font-family: var(--skin-body-font), Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: 600;
    font-stretch: condensed;
    text-transform: uppercase;
    line-height: 12px;
    background-color: #000;
    border: none;
    padding: 14px 30px;
    border-radius: 30px
}

.btn-checkout {
    color: #000;
    font-family: var(--skin-body-font), Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: 600;
    font-stretch: condensed;
    text-transform: uppercase;
    line-height: 16px;
    background-color: var(--color-benefit-pink);
    border: none;
    padding: 15px 40px;
    border-radius: 30px;
    width: 50%
}

.btn-primary {
    background-color: var(--skin-primary-color-1);
    border-color: transparent;
    color: var(--skin-primary-color-invert-1);
    transition: scale 0.5s
}

.btn-primary:not(.disabled, :disabled):hover {
    background-color: var(--skin-primary-color-1);
    border-color: transparent;
    color: var(--skin-primary-color-invert-1);
    scale: 1.05
}

.btn-primary.disabled,
.btn-primary:disabled {
    background-color: var(--skin-primary-color-1);
    border-color: transparent;
    color: var(--skin-primary-color-invert-1);
    opacity: 0.3;
    transition: none
}

.btn-primary.disabled:hover,
.btn-primary:disabled:hover {
    background-color: var(--skin-primary-color-1);
    border-color: transparent;
    color: var(--skin-primary-color-invert-1);
    opacity: 0.5
}

.btn-outline-primary {
    color: var(--skin-primary-color-1);
    border-color: var(--skin-primary-color-1)
}

a {
    color: var(--skin-link-color-1);
    text-decoration: none
}

.nav-item .nav-link:focus,
.nav-item .nav-link:hover,
.nav-item.show .nav-link {
    background-color: transparent;
    color: var(--skin-link-color-1)
}

.dropdown-item:hover {
    background-color: inherit
}

.rounded {
    border-radius: 1rem !important
}

.btn-circle {
    width: 45px;
    height: 45px;
    border-radius: 60px;
    display: -ms-flexbox;
    display: flex;
    background-color: #ff0064;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center
}

.highContrast .btn-circle {
    background-color: #000
}

.highContrast .btn-circle .svg-icon {
    fill: #fff
}

.btn-circle .svg-icon.youtube-icon-contrast,
.btn-circle .svg-icon.youtube-icon {
    width: 41px;
    height: 41px
}

.p-large {
    font-size: 1.125rem
}

.p-medium {
    font-size: 1rem
}

.p-small {
    font-size: 0.75rem
}

.p-xsmall {
    font-size: 0.625rem
}

.link-large {
    font-family: var(--skin-body-font), Arial, Helvetica, sans-serif;
    font-size: 16px;
    font-weight: 600;
    font-stretch: condensed;
    text-transform: uppercase;
    text-decoration: underline
}

.copy-link-medium {
    font-family: var(--skin-body-font), Arial, Helvetica, sans-serif;
    font-size: 14px;
    font-weight: 400;
    text-decoration: underline
}

.copy-link-small {
    font-family: var(--skin-body-font), Arial, Helvetica, sans-serif;
    font-size: 12px;
    font-weight: 400;
    text-decoration: underline
}

@media (max-width: 991.96px) {
    .link-large {
        font-size: 12px;
        font-weight: 470
    }

    .copy-link-medium {
        font-size: 12px;
        font-weight: 540
    }

    .copy-link-small {
        font-size: 11px;
        font-weight: 540
    }
}

.input-group>.custom-file .custom-file-input:focus~.custom-file-label,
.input-group>.custom-select:focus,
.input-group>.form-control:focus {
    z-index: 0
}

.product-tile {
    border-radius: 20px;
    border: none;
    background-color: #fff;
    padding: 0;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%
}

.container .breadcrumb {
    border-bottom: none;
    padding: 20px 0;
    margin-bottom: 0
}

.container .breadcrumb .breadcrumb-item {
    display: -ms-flexbox;
    display: flex
}

.container .breadcrumb .breadcrumb-item a {
    font-size: 14px;
    font-weight: 540;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: end;
    justify-content: end;
    -ms-flex-align: center;
    align-items: center
}

.container .breadcrumb .breadcrumb-item a.first-element {
    font-family: var(--skin-body-font-medium);
    font-weight: 550
}

.container .breadcrumb .breadcrumb-item::before {
    color: #000
}

.breadcrumb-item+.breadcrumb-item::before {
    content: "\2022"
}

@media (max-width: 991.96px) {
    .breadcrumb-item {
        font-size: 8px
    }
}

.color-attribute {
    display: inline-block
}

.circle {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: inline-block;
    vertical-align: middle;
    margin: 7.5px;
    position: relative
}

@media (max-width: 991.96px) {
    .circle {
        margin: 12px
    }
}

.circle.active,
.circle:hover {
    border: 1px solid #303e48;
    width: 38px;
    height: 38px
}

.circle.active::before,
.circle:hover::before {
    display: block;
    content: " ";
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 4px solid #fff;
    position: absolute
}

.circle.disabled {
    pointer-events: none
}

.circle.disabled::after {
    display: block;
    content: " ";
    width: 38px;
    height: 1px;
    position: absolute;
    left: 0;
    top: 50%;
    background-color: #000;
    transform: rotate(-45deg);
    outline: 2px solid white
}

.circle.disabled.active::after {
    width: 28px;
    left: 4px
}

.size-button {
    border: 1px solid #cdcdcd;
    border-radius: 8px;
    text-align: center;
    padding: 15px 0;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    height: 100%;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center;
    width: 100%;
    background-color: #fff
}

.size-button.selected {
    border: 1px solid #000;
    cursor: pointer
}

.size-button.unselectable {
    position: relative;
    cursor: auto !important;
    opacity: 0.5
}

.size-button.unselectable::after {
    content: "";
    background: linear-gradient(to top left, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) calc(50% - 1px), #cdcdcd 50%, rgba(0, 0, 0, 0) calc(50% + 1px), rgba(0, 0, 0, 0) 100%);
    width: 100%;
    position: absolute;
    bottom: 0;
    height: 100%
}

.size-button span {
    font-size: 15px
}

.size-button .price {
    line-height: 11px
}

.size-button .price>span {
    display: block
}

.size-button .price del {
    text-decoration: none
}

.size-button .price .strike-through {
    margin: 0;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: center;
    justify-content: center;
    -ms-flex-align: center;
    align-items: center
}

.size-button .price .strike-through::after {
    content: "\A0";
    display: inline-block
}

.form-control {
    padding: 15px 25px;
    border-radius: 30px;
    font-size: 12px;
    height: 56px
}

.form-control:focus {
    border-color: #000;
    box-shadow: none
}

.form-place-over {
    position: relative
}

.form-place-over label {
    position: absolute;
    font-size: 10px;
    top: 12px;
    left: 25px;
    font-weight: 600
}

.form-place-over .form-control {
    padding: 20px 25px 10px
}

.form-control.is-invalid:focus,
.was-validated .form-control:invalid:focus {
    border-color: var(--bs-form-invalid-border-color);
    box-shadow: none
}

.form-control.is-invalid,
.was-validated .form-control:invalid {
    background-image: none
}

.invalid-feedback {
    font-size: 12px
}

@media (max-width: 991.96px) {
    .form-control {
        height: 46px
    }

    .form-place-over label {
        top: 6px
    }
}

.quantity-select-container {
    border: 1px solid #303e48;
    margin-right: 16px;
    text-align: center;
    height: 56px;
    -ms-flex: 0 0 100px;
    flex: 0 0 100px;
    max-width: 116px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-pack: distribute;
    justify-content: space-around;
    -ms-flex-align: center;
    align-items: center;
    position: relative;
    border-radius: 30px
}

.quantity-select-container .quantity-select {
    display: none
}

@media (pointer: coarse) {
    .quantity-select-container .quantity-select {
        display: block;
        position: absolute;
        width: 100%;
        background: rgba(0, 0, 0, 0);
        padding-left: 43%;
        z-index: 1
    }

    .quantity-select-container input {
        display: none
    }
}

.quantity-select-container select {
    padding: 10px 0;
    border: none;
    -webkit-appearance: none;
    appearance: none;
    margin: 0
}

.quantity-select-container input {
    border: none;
    width: 1rem;
    -webkit-appearance: textfield;
    appearance: textfield;
    background-color: transparent
}

.quantity-select-container input::-webkit-inner-spin-button,
.quantity-select-container input::-webkit-outer-spin-button {
    -webkit-appearance: none
}

.quantity-select-container button {
    background-color: transparent;
    border: none;
    padding: 0 16px;
    font-family: var(--skin-body-font)
}

.quantity-select-container button:focus-visible {
    outline-offset: 0
}

ul {
    list-style: none;
    padding: 0
}

li {
    margin-bottom: 1em
}

.checkcontainer {
    display: -ms-flexbox;
    display: flex;
    cursor: pointer
}

.checkcontainer input[type="checkbox"] {
    opacity: 0;
    position: absolute;
    left: 0;
    width: 20px;
    height: 20px;
    cursor: pointer
}

.checkcontainer input[type="checkbox"]+span {
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: #fff;
    border: 3px solid #000;
    width: 23px;
    height: 23px;
    cursor: pointer;
    position: absolute;
    top: 4px;
    left: 0
}

.checkcontainer input[type="checkbox"]:checked+span::before {
    content: "";
    background-color: #000;
    width: 15px;
    height: 15px
}

input[type="radio"] {
    opacity: 0;
    position: absolute;
    width: 20px;
    height: 20px;
    cursor: pointer
}

input[type="radio"] {
    margin: 4px 0 0;
    line-height: normal;
    width: 100%;
    height: 100%
}

input[type="radio"]+span {
    display: -ms-flexbox;
    display: flex;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
    background: #fff;
    border: 3px solid #434343;
    width: 28px;
    height: 28px;
    padding: 5px;
    margin-right: 10px;
    vertical-align: middle;
    transition: 0.4s
}

input[type="radio"]+span {
    border-radius: 50%
}

input[type="radio"]:checked+span,
li:hover input[type="radio"]+span {
    background: #434343;
    border: 3px solid #fff;
    box-shadow: 0 0 0 2px #434343
}

li:active input[type="radio"]+span {
    background-color: rgba(0, 111, 81, 0.2);
    box-shadow: 0 0 0 2px rgba(0, 111, 81, 0.2)
}

.tag-filter {
    background-color: #fff;
    padding: 6px 12px;
    border-radius: 15px;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-align: center;
    align-items: center
}

.tag-filter span {
    font-size: 10px;
    margin-right: 5px
}

.select {
    position: relative;
    display: -ms-flexbox;
    display: flex;
    border-radius: 0.25em;
    overflow: hidden;
    height: 56px;
    width: 278px
}

select {
    -webkit-appearance: none;
    appearance: none;
    outline: 0;
    border: 1px solid #cdcdcd;
    border-radius: 30px;
    box-shadow: none;
    -ms-flex: 1;
    flex: 1;
    padding: 0 25px;
    background-image: none;
    cursor: pointer
}

select::-ms-expand {
    display: none
}

.select::after {
    content: "\25BC";
    position: absolute;
    top: 0;
    right: 0;
    padding: 15px 25px 15px 0;
    transition: 0.25s all ease;
    pointer-events: none
}

.iti .iti__selected-flag {
    padding: 0 0 0 25px
}

.iti input {
    padding-left: 70px !important;
    height: 56px;
    border-radius: 30px;
    border: 1px solid #cdcdcd
}

.rounded-1 {
    border-radius: 10px
}

.rounded-2 {
    border-radius: 20px
}

.rounded-3 {
    border-radius: 30px
}

.rounded-4 {
    border-radius: 40px
}

textarea {
    border: 1px solid #cdcdcd;
    border-radius: 10px;
    padding: 16px
}

@media (min-width: 544px) {
    textarea {
        border-radius: 20px
    }
}

.svg-icon {
    width: 20px;
    height: 20px;
    fill: #000;
    font-size: 18px;
}

.svg-icon path {
    width: 20px;
    height: 20px
}

.dots-circle {
    position: absolute;
    width: 500px;
    height: 500px;
    -webkit-mask: url("../../images/common/circles.svg");
    mask: url("../../images/common/circles.svg");
    -webkit-mask-repeat: repeat;
    mask-repeat: repeat;
    background-color: #fcead8;
    opacity: 0.2;
    top: -50%;
    right: -63%;
    border-radius: 100%
}

.alert {
    z-index: 3000
}

.swiper-wrapper {
    height: auto
}

.request-password-title {
    font-size: 40px
}

.horizontal-line {
    height: 1px;
    width: 100%;
    background-color: rgba(0, 0, 0, 0.2)
}

.picture-include {
    display: block;
    width: 100%
}

.highContrast h1,
.highContrast h2,
.highContrast h3,
.highContrast h4,
.highContrast h5,
.highContrast p,
.highContrast span {
    opacity: 1 !important;
    color: #000
}

.highContrast .product-tile__footer__wrapper .cart-and-ipay span.sales .value {
    color: #fff !important
}

.highContrast .product-tile__footer__wrapper .cart-and-ipay .add-to-cart-global .separator {
    color: #fff
}

.highContrast .hero .page-title {
    color: #fff
}

.highContrast a:not(.btn-primary) {
    color: #000
}

.highContrast .forgot-password__button {
    color: #fff
}