:root {
    --cart-badge-right: 0;
    --cart-badge-bottom: 20px;
    --cart-badge-background-hsl: var(--button-color-h), calc(var(--button-color-s)*1%), calc(var(--button-color-l)*1%);
    --cart-badge-background: hsla(var(--cart-badge-background-hsl), 1);
    --cart-badge-foreground-hsl: var(--button-color-h), calc(var(--button-color-s)*1%), calc((var(--button-color-l) - 75)*-100%);
    --cart-badge-foreground: hsla(var(--cart-badge-foreground-hsl), var(--button-color-a))
}

.has-swmp {
    --cart-badge-bottom: calc(var(--swmp-height, 0px) + 20px)
}

@font-face {
    font-family: Source Sans Pro;
    font-style: normal;
    font-weight: 700;
    src: url(../source-sans-pro-v21-latin-700-a1051903.woff2) format("woff2"), url(../source-sans-pro-v21-latin-700-a4921a50.woff) format("woff")
}

@keyframes showCartBadge {
    0% {
        opacity: 0;
        pointer-events: none
    }
    to {
        opacity: 1
    }
}

.cart-badge {
    display: block;
    position: fixed;
    bottom: 20px;
    bottom: var(--cart-badge-bottom);
    right: 0;
    background: transparent !important;
    z-index: 9900;
    animation-fill-mode: both;
    animation-name: showCartBadge;
    animation-duration: .25s;
    animation-timing-function: ease-in-out
}

.cart-badge[data-cart--badge-tally="0"] {
    animation-direction: reverse
}

.cart-badge.-empty-on-load {
    display: none
}

.cart-badge__button {
    display: flex;
    background-color: hsla(var(--button-color-h), calc(var(--button-color-s)*1%), calc(var(--button-color-l)*1%), .5);
    background-color: hsla(var(--cart-badge-background-hsl), .5);
    color: hsla(var(--button-color-h), calc(var(--button-color-s)*1%), calc((var(--button-color-l) - 75)*-100%), var(--button-color-a));
    color: var(--cart-badge-foreground);
    width: 62px;
    height: 62px;
    align-items: center;
    justify-content: center;
    border-radius: 0 !important;
    border: none !important;
    transition: background-color .25s ease-in-out
}

.cart-badge__button:hover {
    background-color: hsla(var(--button-color-h), calc(var(--button-color-s)*1%), calc(var(--button-color-l)*1%), 1);
    background-color: var(--cart-badge-background)
}

.cart-badge__button svg {
    fill: hsla(var(--button-color-h), calc(var(--button-color-s)*1%), calc((var(--button-color-l) - 75)*-100%), var(--button-color-a));
    fill: var(--cart-badge-foreground)
}

.cart-badge__icon {
    width: 38px;
    height: 38px;
    position: relative;
    margin-top: .5ch;
    font-weight: 600;
    font-size: 14px;
    font-family: Source Sans Pro
}

.cart-badge__bubble,
.cart-badge__icon {
    display: flex;
    align-items: center;
    justify-content: center
}

.cart-badge__bubble {
    position: absolute;
    top: -1ch;
    left: 10px;
    background-color: hsla(var(--button-color-h), calc(var(--button-color-s)*1%), calc((var(--button-color-l) - 75)*-100%), var(--button-color-a));
    background-color: var(--cart-badge-foreground);
    color: hsla(var(--button-color-h), calc(var(--button-color-s)*1%), calc(var(--button-color-l)*1%), 1);
    color: var(--cart-badge-background);
    min-height: 24px;
    min-width: 24px;
    text-align: center;
    border-radius: 999em;
    border: 2px solid var(--cart-badge-background);
    letter-spacing: 0;
    padding: 0 .25em;
    box-sizing: border-box !important
}

:root {
    --cart-summary-width: 100vw;
    --cart-summary-bottom: 0
}

@media(min-width:760px) {
    :root {
        --cart-summary-width: 375px
    }
}

@keyframes hideCartContent {
    0% {
        opacity: 1
    }
    to {
        opacity: 0
    }
}

@keyframes showCartContent {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

@keyframes openNewCart {
    0% {
        transform: translateX(100%);
        opacity: 1
    }
    to {
        transform: translateX(0);
        opacity: 1
    }
}

@keyframes openExistingCart {
    0% {
        overflow: hidden;
        pointer-events: none;
        top: 100%;
        bottom: 20px;
        bottom: var(--cart-badge-bottom);
        width: 0
    }
    to {
        overflow: hidden;
        pointer-events: all;
        top: 0;
        bottom: 0;
        bottom: var(--cart-summary-bottom);
        width: 100vw;
        width: var(--cart-summary-width)
    }
}

@keyframes closeCart {
    0% {
        overflow: hidden;
        pointer-events: none;
        top: 0;
        bottom: 0;
        bottom: var(--cart-summary-bottom);
        width: 100vw;
        width: var(--cart-summary-width)
    }
    to {
        overflow: hidden;
        pointer-events: none;
        top: 100%;
        bottom: 20px;
        bottom: var(--cart-badge-bottom);
        width: 0
    }
}

#usersite-container .cart-summary {
    font-size: clamp(12px, var(--content-typeface-size-number), 16px);
    position: fixed;
    top: 0;
    right: 0;
    right: var(--cart-badge-right);
    bottom: 0;
    bottom: var(--cart-summary-bottom);
    width: 100vw;
    width: var(--cart-summary-width);
    z-index: 9901;
    animation-name: openNewCart;
    animation-delay: 0;
    animation-duration: .4s;
    display: flex;
    flex-direction: column;
    padding: var(--section-padding-x-small) 0
}

#usersite-container .cart-summary__body,
#usersite-container .cart-summary__footer,
#usersite-container .cart-summary__heading {
    padding: 0 var(--section-padding-x-small)
}

#usersite-container .cart-summary#cart-summary {
    background-color: var(--section-background-color) !important
}

#usersite-container .cart-summary__heading {
    display: flex;
    align-items: center
}

#usersite-container .cart-summary__heading h2 {
    flex: 1 1;
    margin: 0
}

#usersite-container .cart-summary__close,
#usersite-container .cart-summary__close:hover {
    text-decoration: none !important
}

#usersite-container .cart-summary__close:hover {
    text-decoration: none;
    transform: rotate(1turn)
}

#usersite-container .cart-summary__body {
    flex: 1 1;
    overflow: auto;
    overscroll-behavior: none
}

#usersite-container .cart-summary__body table {
    margin: 0
}

#usersite-container .cart-summary input[name=quantity][type=tel] {
    width: 5.5ch
}

#usersite-container .cart-summary__content {
    animation-duration: .15s
}

#usersite-container .cart-summary__footer {
    text-align: center
}

#usersite-container .cart-summary__subtotal {
    text-align: right
}

#usersite-container .cart-summary,
#usersite-container .cart-summary__content {
    animation-fill-mode: both;
    animation-timing-function: ease-in-out
}

#usersite-container .cart-summary[data-cart--cart-open=false] {
    animation-name: closeCart;
    animation-delay: .05s
}

#usersite-container .cart-summary[data-cart--cart-open=false] .cart-summary__content {
    animation-name: hideCartContent
}

#usersite-container .cart-summary.-existing[data-cart--cart-open=true] {
    animation-name: openExistingCart
}

#usersite-container .cart-summary.-existing[data-cart--cart-open=true] .cart-summary__content {
    animation-name: showCartContent;
    animation-delay: .3s
}

#usersite-container .cart-items {
    border-collapse: collapse
}

#usersite-container .cart-item>td {
    padding-top: 1.5em;
    padding-bottom: 1.5em
}

#usersite-container .cart-item>td,
#usersite-container .cart-item__bundle-item>td {
    border-width: 0 0 1px;
    border-style: solid
}

#usersite-container .cart-item.-borderless>td,
#usersite-container .cart-item__bundle-item.-borderless>td {
    border-width: 0
}

#usersite-container .cart-item .cart-image,
#usersite-container .cart-item__details {
    padding: 1em 0 1em 1em !important
}

#usersite-container .cart-item__product-options {
    display: flex;
    flex-wrap: wrap
}

#usersite-container .cart-item__product-option {
    font-weight: 700 !important
}

#usersite-container .cart-item__product-option:last-child .delimiter {
    display: none
}

#usersite-container .cart-item__product-option+.cart-item__product-option {
    margin-left: 1em
}

#usersite-container .cart-item__actions {
    margin-top: .25em;
    display: flex;
    align-items: center;
    justify-content: flex-start
}

#usersite-container .cart-item__action {
    margin-right: .5em
}

#usersite-container .cart-item__price {
    margin-left: auto;
    text-align: right
}

#usersite-container .cart-item__price [class*=-price] {
    display: block
}

#usersite-container .cart-item__price .old-price {
    padding-right: 0
}

#usersite-container .cart-item__bundle-item>td {
    padding-top: 1em;
    padding-bottom: 1em
}

#usersite-container .cart-item__bundle-item .cart-item__product-options {
    flex-direction: column
}

#usersite-container .cart-item__bundle-item .cart-item__product-options .delimiter {
    display: none
}

media-background {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: hidden
}

media-background img {
    vertical-align: bottom
}

media-background[mode=cropped]:not(:defined) img {
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: center center;
    object-position: center center;
    width: 100%;
    height: 100%
}

media-background[mode=cropped]:defined img {
    position: absolute;
    top: 0;
    top: calc(var(--y, 0)*-1px);
    left: 0;
    left: calc(var(--x, 0)*-1px);
    width: auto;
    width: var(--width, auto);
    height: auto;
    height: var(--height, auto)
}

media-background[mode=contained] {
    background-color: transparent;
    background-color: var(--media-background-color, transparent)
}

media-background[mode=contained] media-background-content,
media-background[mode=contained] picture {
    width: 100%;
    height: 100%
}

media-background[mode=contained] picture {
    display: flex;
    align-items: center;
    justify-content: center
}

media-background[mode=contained] img {
    width: auto;
    height: 100%
}

media-background[mode=contained][fit=horizontal] img {
    height: 100%
}

media-background[mode=contained][fit=vertical] img {
    width: 100%;
    height: auto
}

media-background[mode=contained] picture,
media-background[mode=cropped] picture {
    opacity: 1%;
    opacity: var(--media-background-opacity, 1%)
}

media-background[mode=fixed],
media-background[mode=parallax] {
    opacity: 1%;
    opacity: var(--media-background-opacity, 1%);
    background-image: none;
    background-image: var(--media-background-background-image, none);
    background-repeat: no-repeat;
    background-position: 0 0;
    background-position: var(--media-background-background-position, 0 0);
    background-size: auto auto;
    background-size: var(--media-background-background-size, auto auto)
}

media-background[mode=fixed] picture,
media-background[mode=parallax] picture {
    display: none
}

media-background[mode=fixed] {
    background-attachment: fixed;
    background-size: cover
}

media-background[background-style=image] picture:before {
    content: "";
    position: absolute;
    z-index: 1;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    transform: scale(1.2);
    background-image: none;
    background-image: var(--image-url, none);
    background-position: 50%;
    background-size: cover;
    filter: blur(5px)
}

media-background[background-style=image] img {
    z-index: 2
}

media-background[overflow] {
    overflow: visible
}

media-background[mode=contained][vignette=start][fit=horizontal] img {
    -webkit-mask: linear-gradient(90deg, transparent 1%, #fff 12% 99%);
    mask: linear-gradient(90deg, transparent 1%, #fff 12% 99%)
}

media-background[mode=contained][vignette=start][fit=vertical] img {
    -webkit-mask: linear-gradient(180deg, transparent 1%, #fff 12% 99%);
    mask: linear-gradient(180deg, transparent 1%, #fff 12% 99%)
}

media-background[mode=contained][vignette=both][fit=horizontal] img {
    -webkit-mask: linear-gradient(90deg, transparent 1%, #fff 12% 88%, transparent 99%);
    mask: linear-gradient(90deg, transparent 1%, #fff 12% 88%, transparent 99%)
}

media-background[mode=contained][vignette=both][fit=vertical] img {
    -webkit-mask: linear-gradient(180deg, transparent 1%, #fff 12% 88%, transparent 99%);
    mask: linear-gradient(180deg, transparent 1%, #fff 12% 88%, transparent 99%)
}

media-background[mode=contained][vignette=end][fit=horizontal] img {
    -webkit-mask: linear-gradient(90deg, #fff 0 88%, transparent 99%);
    mask: linear-gradient(90deg, #fff 0 88%, transparent 99%)
}

media-background[mode=contained][vignette=end][fit=vertical] img {
    -webkit-mask: linear-gradient(180deg, #fff 0 88%, transparent 99%);
    mask: linear-gradient(180deg, #fff 0 88%, transparent 99%)
}

media-background[mode=contained][image-align=top] picture {
    align-items: flex-start
}

media-background[mode=contained][image-align=top] picture:before {
    background-position-y: top
}

media-background[mode=contained][image-align=bottom] picture {
    align-items: flex-end
}

media-background[mode=contained][image-align=bottom] picture:before {
    background-position-y: bottom
}

media-background[mode=contained][image-justify=left] picture {
    justify-content: flex-start
}

media-background[mode=contained][image-justify=left] picture:before {
    background-position-x: left
}

media-background[mode=contained][image-justify=right] picture {
    justify-content: flex-end
}

media-background[mode=contained][image-justify=right] picture:before {
    background-position-y: right
}

@keyframes mediaBackgroundFadeIn {
    0% {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

@keyframes mediaBackgroundSlideLeft {
    0% {
        transform: translateX(0)
    }
    to {
        transform: translateX(-100%)
    }
}

@keyframes mediaBackgroundSlideRight {
    0% {
        transform: translateX(0)
    }
    to {
        transform: translateX(100%)
    }
}

media-background-container {
    --media-background-duration: 0.5s;
    display: block;
    position: relative;
    overflow: hidden
}

media-background-container media-background {
    z-index: 1;
    animation-duration: var(--media-background-duration);
    animation-timing-function: ease-in-out;
    animation-fill-mode: forwards
}

media-background-container media-background.-is-active,
media-background-container media-background.-transition-out {
    z-index: 2
}

media-background-container media-background.-transition-in {
    z-index: 3;
    animation-name: mediaBackgroundFadeIn
}

media-background-container[speed=slow] {
    --media-background-duration: 1s
}

media-background-container[speed=fast] {
    --media-background-duration: 0.2s
}

media-background-container[transition=slide-left] media-background.-transition-in,
media-background-container[transition=slide-right] media-background.-transition-in {
    z-index: 3;
    animation-name: none
}

media-background-container[transition=slide-left] media-background.-transition-out,
media-background-container[transition=slide-right] media-background.-transition-out {
    z-index: 4
}

media-background-container[transition=slide-left] media-background.-transition-out {
    animation-name: mediaBackgroundSlideLeft
}

media-background-container[transition=slide-right] media-background.-transition-out {
    animation-name: mediaBackgroundSlideRight
}