/*
@media(min-width: 1025px) {
    .section-footer {
        padding-top: 96px
    }
}

#footer {
    z-index: 200
}

#footer .footer-breadcrumbs>ul {
    align-items: center
}

@media(max-width: 767px) {
    #footer .footer-breadcrumbs>ul .footer-polar-logo {
        margin-right: 20px;
        margin-bottom: -10px
    }
}

#footer .footer-breadcrumbs>ul li.crumb {
    line-height: 17px;
    padding-right: 50px;
    background-image: url(../img/footer/icon-arrow-forward.svg);
    background-repeat: no-repeat;
    background-position: 81%
}

@media(max-width: 767px) {
    #footer .footer-breadcrumbs>ul li.crumb {
        margin-top: 17px;
        padding-right: 37px
    }
}

#footer .footer-breadcrumbs>ul li.crumb a {
    text-decoration: none
}

#footer .footer-breadcrumbs>ul li.crumb img {
    margin-top: -4px
}

#footer .footer-breadcrumbs>ul li.crumb:last-child {
    background-image: none
}

#footer .footer-breadcrumbs>ul li.crumb:last-child a {
    color: #eee
}

@media(min-width: 768px) {
    #footer .footer-newsletter,
    #footer .footer-links {
        margin-top: 0
    }
}

#footer .footer-newsletter .title,
#footer .footer-links .title {
    font-family: "staff-variable";
    color: #fff;
    font-weight: 500;
    font-size: 32px;
    line-height: 32px
}

@media(min-width: 1025px) {
    #footer .footer-newsletter {
        margin-right: 80px;
        margin-bottom: 0
    }
}

#footer .footer-newsletter .subtitle {
    color: #7e7e7e;
    font-size: 16px;
    line-height: 22px
}

@media(min-width: 768px) {
    #footer .footer-newsletter form {
        max-width: 417px
    }
}

#footer .footer-newsletter form select,
#footer .footer-newsletter form .text-input {
    border-radius: 4px;
    background: none;
    color: #fff;
    border: 1px solid #7e7e7e;
    padding-left: 25px;
    box-sizing: border-box
}

#footer .footer-newsletter form .submit-button {
    padding-left: 20px
}

#footer .footer-newsletter form .submit-button .button[type=submit] {
    width: 100%;
    box-sizing: border-box;
    text-align: center;
    border: none
}

#footer .footer-newsletter form .submit-button .button[type=submit]:hover {
    background: #fff !important
}

#footer .footer-newsletter form .text-input {
    position: relative;
    width: 100%
}

#footer .footer-newsletter form select {
    appearance: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url(../img/footer/select-arrow.svg);
    background-repeat: no-repeat;
    background-position: 92%
}

#footer .footer-newsletter form select option {
    color: #313131
}

#footer .footer-newsletter form .checkbox-container .checkbox {
    background: none;
    border-color: #7e7e7e
}

#footer .footer-newsletter form .checkbox-container .checkbox::after {
    left: 7px
}

#footer .footer-newsletter form .checkbox-container .title {
    font-size: 15px;
    margin-left: 13px;
    border-color: #7e7e7e;
    color: #7e7e7e
}

#footer .footer-newsletter form .checkbox-container .title a {
    color: #fff;
    text-decoration: none
}

@media(max-width: 767px) {
    #footer .footer-links:nth-child(n+4) {
        margin-top: 60px
    }
    #footer .footer-links .title {
        font-size: 24px
    }
}

#footer .footer-links .footer-menu li a {
    text-decoration: none;
    font-size: 15px
}

#footer .footer-back-to-top-wrapper {
    display: none
}

@media(min-width: 1025px) {
    #footer .footer-back-to-top-wrapper {
        display: block
    }
}

@media(min-width: 1025px) {
    #footer .footer-back-to-top-wrapper {
        text-align: right
    }
}

#footer .footer-back-to-top-wrapper .button {
    height: 40px;
    line-height: 40px;
    background-image: url(../img/footer/icon-arrow-up.svg);
    background-repeat: no-repeat;
    background-position: 15px 12px;
    padding-left: 40px;
    padding-right: 17px;
    font-weight: 500
}

#footer .footer-back-to-top-wrapper .button:hover {
    background-color: #fff !important
}

#footer .social-icons {
    order: 0
}

@media(min-width: 768px) {
    #footer .social-icons {
        text-align: right;
        order: initial
    }
}

#footer .social-icons a {
    text-decoration: none
}

#footer .payment-methods {
    order: 1
}

@media(min-width: 768px) {
    #footer .payment-methods {
        order: initial
    }
}

.location {
    font-weight: bold;
    font-size: 14px
}

.location img {
    width: 18px
}

.polar-footer {
    font-size: 14px
}

@media(max-width: 767px) {
    .polar-footer {
        margin-left: 0 !important;
        margin-bottom: 10px
    }
}

.bottom-footer-links {
    font-size: 14px
}

@media(min-width: 768px) {
    .bottom-footer-links {
        text-align: right
    }
}

.bottom-footer-links a {
    text-decoration: none;
    line-height: 2.5
}

@media only screen and (max-width: 767px) {
    .bottom-footer-links a:after {
        content: " /"
    }
}
*/
.gray-divider {
    height: 1px;
    background: #7e7e7e;
    width: 100%
}

@media(max-width: 767px) {
    .hide-small {
        display: none
    }
}

@media(min-width: 768px) {
    .hide-medium {
        display: none
    }
}

@media(max-width: 767px) {
    .polar-footer,
    .bottom-footer-links {
        padding-left: 16px
    }
}

.global-change-region-select {
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    border: none;
    background-color: #313131;
    color: #fff;
    background-image: url(../img/footer/pin.svg);
    background-size: 22px 22px;
    background-repeat: no-repeat;
    background-position: left center;
    padding-left: 24px;
    height: 24px
}

.global-change-region-select.light {
    background-color: #fff;
    color: #000;
    background-image: url(../img/footer/pin-bl.svg)
}

.global-change-region-select.light option {
    background: #fff;
    color: #000
}

.global-change-region-select option {
    background: #313131;
    color: #fff
}

.js-prevent-body-scroll {
    overflow: hidden
}
/*
header.mobile {
    background: #fff;
    position: fixed;
    top: 0px;
    width: 100%;
    z-index: 1000;
    overflow: hidden
}

header.mobile.nav-open {
    overflow: visible
}

@media only screen and (min-width: 1200px) {
    header.mobile {
        display: none !important
    }
}

header.mobile nav {
    display: flex;
    justify-content: space-between;
    align-items: center
}

header.mobile .menu-bar {
    height: 48px;
    display: flex;
    align-items: center
}

header.mobile .menu-bar .item {
    margin-left: 12px;
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer
}

header.mobile .menu-baseline {
    width: 90%;
    position: absolute;
    overflow-x: hidden;
    top: 0px;
    left: 0px;
    height: 100vh;
    padding-bottom: 150px;
    z-index: 800;
    background: #fff;
    transition: all .25s;
    transform: translateX(115%)
}

header.mobile .menu-baseline.open {
    transform: translateX(11%)
}

header.mobile .menu-links-mobile {
    width: 100%;
    position: absolute;
    display: flex;
    flex-wrap: wrap;
    align-items: flex-start;
    top: 0px;
    right: 0px;
    background: #fff;
    padding-bottom: 150px;
    z-index: 800;
    transition: all .3s ease-in-out;
    transform: translateX(0%)
}

header.mobile .menu-links-mobile.aside {
    transform: translateX(-100%)
}

header.mobile .menu-links-mobile .actions {
    text-align: right;
    padding-left: 24px;
    padding-right: 24px;
    padding-top: 16px;
    width: 100%
}

header.mobile .menu-links-mobile .primary {
    width: 100%;
    padding-left: 24px;
    padding-right: 24px
}

header.mobile .menu-links-mobile .primary a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding-top: 16px;
    padding-bottom: 16px;
    font-size: 20px;
    line-height: 100%;
    letter-spacing: -0.02em;
    color: #000;
    font-weight: 460;
    text-decoration: none
}

header.mobile .menu-links-mobile .primary a:last-child {
    border: none
}

header.mobile .menu-links-mobile .primary .search-input {
    height: 48px;
    border: none;
    border-radius: 8px;
    width: 100%;
    background: #f7f7f7;
    padding-left: 48px;
    background-image: url(../../img/icon-search-light.svg);
    background-repeat: no-repeat;
    background-size: 24px 24px;
    background-position: 12px center;
    margin-bottom: 20px
}

header.mobile .menu-links-mobile .secondary {
    width: 100%;
    background: #f7f7f7;
    justify-content: space-between;
    padding: 28px 32px 28px 32px;
    margin-top: 32px
}

header.mobile .menu-links-mobile .secondary a {
    font-size: 16px;
    line-height: 22px;
    letter-spacing: -0.01em;
    color: #969696;
    display: block;
    text-decoration: none;
    min-height: 24px;
    margin-bottom: 16px;
    background-image: url(../img/icon-plus-light.svg);
    background-repeat: no-repeat;
    background-position: center right
}

header.mobile .menu-links-mobile .secondary a:last-child {
    margin-bottom: 0px
}

header.mobile .menu-links-mobile .region {
    width: 100%;
    justify-content: space-between;
    padding: 13px 32px 13px 32px
}

header.mobile .menu-links-mobile .region a {
    text-decoration: none;
    color: #000;
    font-size: 14px;
    line-height: 32px;
    letter-spacing: -0.005em;
    display: flex;
    width: 100%;
    justify-content: space-between
}

header.mobile .category-menu {
    width: 100%;
    position: absolute;
    padding-bottom: 150px;
    top: 0px;
    right: 0px;
    background: #fff;
    z-index: 801;
    transition: all .3s ease-in-out;
    transform: translateX(100%)
}

header.mobile .category-menu.open {
    transform: translateX(0%)
}

header.mobile .category-menu .actions {
    padding: 24px;
    padding-bottom: 12px
}

header.mobile .category-menu .actions .panel-head {
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin-bottom: 24px
}

header.mobile .category-menu .actions .panel-name {
    font-weight: 520;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: -0.02em;
    color: #aaa
}

header.mobile .category-menu .actions a {
    font-weight: 560;
    font-size: 20px;
    line-height: 100%;
    letter-spacing: -0.02em;
    padding-bottom: 12px;
    padding-top: 12px;
    display: block;
    text-decoration: none;
    color: #000
}

header.mobile .category-menu .actions a.caret {
    background-image: url(../img/icon-caret-open.svg);
    background-repeat: no-repeat;
    background-position: center right
}

header.mobile .category-menu .content {
    padding-left: 24px;
    padding-right: 24px
}

header.mobile .category-menu .content.no-padding {
    padding-left: 0px;
    padding-right: 0px
}

header.mobile .category-menu h2 {
    font-weight: 480;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: -0.02em;
    margin-bottom: 12px;
    color: #999;
    padding-top: 24px;
    margin-top: 12px;
    border-top: 1px solid #f6f6f6
}

header.mobile .category-menu .link-title {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 32px
}

header.mobile .category-menu .link-title h2 {
    margin: 0px;
    padding: 0px
}

header.mobile .category-menu .link-title a {
    border: 1px solid #313131;
    background: #fff;
    color: #313131
}

header.mobile .category-menu .sub-links a {
    font-weight: 480;
    font-size: 16px;
    line-height: 100%;
    letter-spacing: -0.01em;
    display: block;
    padding-top: 12px;
    padding-bottom: 12px;
    color: #000;
    text-decoration: none
}

header.mobile .menu-overlay-mask {
    background: rgba(0, 0, 0, 0);
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 799;
    display: none
}

header.mobile .menu-overlay-mask.active {
    display: block;
    transition: all .6s
}

header.mobile .menu-overlay-mask.active.fill {
    background: rgba(0, 0, 0, .8)
}

header.mobile a.main-product {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    color: #000;
    text-decoration: none;
    padding-top: 13px;
    padding-bottom: 13px
}

header.mobile a.main-product img {
    margin-left: -16px
}

header.mobile a.main-product img.mr {
    margin-right: 16px
}

header.mobile a.main-product span.name {
    font-weight: 480;
    font-size: 20px;
    line-height: 100%;
    letter-spacing: -0.02em
}

header.mobile a.main-product .tag {
    margin-left: auto;
    background: #e51d34;
    border-radius: 41px;
    color: #fff;
    font-size: 12px;
    line-height: 100%;
    letter-spacing: .012em;
    padding: 4px 8px
}

header.mobile .promotion {
    width: 100%;
    color: #fff;
    text-decoration: none;
    margin-left: 24px;
    margin-right: 24px;
    margin-top: 24px;
    border-radius: 16px;
    overflow: hidden;
    position: relative
}

header.mobile .promotion img {
    width: 100%;
    height: auto;
    max-width: 100%;
    position: relative;
    z-index: 1
}

header.mobile .promotion .text {
    padding: 24px;
    position: absolute;
    z-index: 1;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center
}

header.mobile .promotion h2 {
    line-height: 100%;
    font-size: 32px;
    letter-spacing: .012em;
    font-weight: 580;
    margin-bottom: 8px
}

header.mobile .promotion p {
    font-size: 16px;
    line-height: 100%
}

.js-summerpromo {
    display: none
}

html.site-has-promotion header.desktop.scroll-hide {
    top: -100px
}

header.desktop {
    background-color: #fff;
    position: sticky;
    position: -webkit-sticky;
    top: 0px;
    z-index: 1000;
    transition: all .4s
}

@media only screen and (max-width: 1199px) {
    header.desktop {
        display: none !important
    }
}

header.desktop.scroll-hide {
    top: -60px
}

header.desktop .global .promo-section {
    height: 40px;
    padding-top: 9px;
    padding-bottom: 11px;
    background-color: #000
}

header.desktop .global .promo-section.summer {
    background-color: #e66747
}

header.desktop .global .promo-section.summer a {
    color: #fff0e0
}

header.desktop .global .promo-section.theme-gift-guide {
    background-color: #55040e
}

header.desktop .global .promo-section.theme-gift-guide a {
    color: #fff0e0
}

header.desktop .global .promo-section a {
    display: block;
    font-weight: 560;
    font-size: 16px;
    line-height: 125%;
    text-align: center;
    letter-spacing: -0.01em;
    color: #fff;
    text-decoration: none
}

header.desktop .primary {
    min-height: 60px
}

header.desktop .primary a {
    font-size: 16px;
    font-weight: 440;
    line-height: 20px;
    letter-spacing: -0.01em;
    text-decoration: none;
    color: #313131;
    transition: all .35s;
    margin-right: 36px;
    position: relative;
    display: inline-block
}

header.desktop .primary a.expand-link:after {
    content: "";
    right: -24px;
    top: -5px;
    position: absolute;
    width: 28px;
    height: 28px;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url("../img/icon-arrow-hover-navigation.svg");
    opacity: 0;
    transition: all .3s;
    transform: scale(1) translateX(-10px)
}

header.desktop .primary a.out-link:after {
    content: "";
    right: -24px;
    top: -5px;
    position: absolute;
    width: 28px;
    height: 28px;
    background-repeat: no-repeat;
    background-position: center center;
    background-image: url("../img/icon-link-hover-navigation.svg");
    opacity: 0;
    transition: all .3s;
    transform: scale(1) translateX(-10px)
}

header.desktop .primary a.logo {
    margin-right: 67px
}

header.desktop .primary a.shop {
    margin-right: 0px
}

header.desktop .primary a:hover {
    font-weight: 560;
    letter-spacing: -0.02em
}

header.desktop .primary a:hover:after {
    opacity: 1;
    transform: scale(1) translateX(0px)
}

@media only screen and (max-width: 1441px) {
    header.desktop .primary a {
        font-size: 14px;
        line-height: 20px
    }
    header.desktop .primary a.logo {
        margin-right: 60px
    }
}

header.desktop .primary a.flow-icon {
    position: relative;
    margin-left: 36px
}

header.desktop .primary a.flow-icon:before {
    content: "";
    left: -36px;
    top: -6px;
    position: absolute;
    width: 28px;
    height: 28px;
    box-shadow: 0px 1px 3px rgba(0, 0, 0, .1), 0px 4px 8px 7px rgba(0, 0, 0, .04);
    border-radius: 5px;
    background-image: url("../img/icon-flow-navigation.png");
    background-repeat: no-repeat;
    background-position: center center
}

header.desktop .sections {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    min-height: 60px
}

header.desktop .sections nav:last-child {
    margin-left: auto
}
*/
#desktop-product-panel {
    z-index: 1001;
    position: absolute
}

@media only screen and (max-width: 1199px) {
    #desktop-product-panel {
        display: none !important
    }
}

#desktop-product-panel .product-panel {
    position: fixed;
    top: 0px;
    left: 0px;
    height: 100%;
    width: 440px;
    background: #f5f5f5;
    z-index: 1005;
    transition: all .4s;
    transform: translateX(-440px)
}

#desktop-product-panel .product-panel.open {
    transform: translateX(0px)
}

#desktop-product-panel .product-panel .content {
    padding-left: 80px;
    padding-right: 40px;
    overflow-y: auto;
    max-height: 88vh;
    padding-bottom: 42px
}

#desktop-product-panel .product-panel .main-category-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    margin-bottom: 20px
}

#desktop-product-panel .product-panel .main-category-link span {
    font-size: 18px;
    line-height: 22px;
    letter-spacing: -0.01em;
    color: #a3a3a3
}

#desktop-product-panel .product-panel .main-category-link a {
    margin: 0px;
    font-size: 15px;
    line-height: 16px;
    letter-spacing: -0.01em;
    padding-left: 18px;
    padding-right: 18px;
    padding-bottom: 9px;
    padding-top: 9px;
    text-align: center;
    border: 1px solid #313131;
    display: inline-block;
    border-radius: 81px;
    width: auto;
    font-weight: 440
}

#desktop-product-panel .product-panel a {
    width: 100%;
    display: flex;
    align-items: center;
    font-size: 26px;
    line-height: 30px;
    letter-spacing: -0.01em;
    color: #313131;
    text-decoration: none;
    margin-bottom: 20px;
    transition: all .15s
}

#desktop-product-panel .product-panel a:hover {
    font-weight: 580;
    letter-spacing: -0.024em
}

@media only screen and (max-width: 1441px) {
    #desktop-product-panel .product-panel a {
        font-size: 22px;
        margin-bottom: 12px
    }
}

#desktop-product-panel .product-panel a span.inline-note {
    border-radius: 2px;
    font-size: 14px;
    line-height: 20px;
    text-align: center;
    color: #e51d34;
    padding-left: 8px;
    padding-right: 8px;
    padding-top: 5px;
    padding-bottom: 5px;
    margin-left: 16px
}

#desktop-product-panel .product-panel .category-wrap {
    align-self: flex-end
}

#desktop-product-panel .product-panel .category-link a {
    font-weight: 440;
    font-size: 18px;
    line-height: 24px;
    letter-spacing: -0.01em;
    color: #313131;
    margin-bottom: 12px
}

@media only screen and (max-width: 1441px) {
    #desktop-product-panel .product-panel .category-link a {
        font-size: 16px;
        line-height: 22px;
        margin-bottom: 8px
    }
}

#desktop-product-panel .product-panel h4 {
    font-weight: 440;
    font-size: 18px;
    line-height: 24px;
    letter-spacing: -0.01em;
    color: #7e7e7e;
    margin-bottom: 32px;
    margin-top: 80px
}

@media only screen and (max-width: 1441px) {
    #desktop-product-panel .product-panel h4 {
        margin-top: 60px;
        margin-bottom: 20px
    }
}

#desktop-product-panel .product-panel .panel-heading {
    padding-left: 80px;
    padding-right: 24px;
    padding-top: 42px;
    margin-bottom: 42px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%
}

#desktop-product-panel .product-panel .panel-heading .close {
    width: 64px;
    height: 64px;
    background-color: #f2f2f2;
    border-radius: 100%;
    background-image: url(../img/icon-panel-close.svg);
    background-size: 32px 32px;
    background-repeat: no-repeat;
    background-position: center center;
    margin-left: auto;
    cursor: pointer
}

#desktop-product-panel .desktop-menu-overlay-mask {
    background: rgba(0, 0, 0, 0);
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 799;
    display: none
}

#desktop-product-panel .desktop-menu-overlay-mask.active {
    display: block;
    transition: all .6s
}

#desktop-product-panel .desktop-menu-overlay-mask.active.fill {
    background: rgba(0, 0, 0, .8)
}

#desktop-product-panel .hover-panel {
    position: fixed;
    top: 0px;
    left: 0px;
    height: 100%;
    width: 440px;
    background: #fff;
    z-index: 1002;
    transition: all .4s;
    transform: translateX(-440px);
    overflow: hidden
}

#desktop-product-panel .hover-panel.active {
    transform: translateX(440px)
}

#desktop-product-panel .hover-panel h3 {
    font-size: 32px;
    line-height: 42px;
    letter-spacing: -0.02em;
    margin-bottom: 12px;
    font-weight: 560
}

#desktop-product-panel .hover-panel p {
    font-size: 15px;
    line-height: 20px;
    letter-spacing: -0.01em;
    color: #7e7e7e
}

#desktop-product-panel .hover-panel img {
    max-width: 100%;
    height: auto
}

#desktop-product-panel .product {
    height: 100%;
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    opacity: 0;
    position: absolute;
    transition: all .1s
}

#desktop-product-panel .product.active {
    opacity: 1
}

#desktop-product-panel .product div:first-child {
    align-self: flex-start;
    width: 100%;
    padding-left: 52px;
    padding-top: 130px;
    padding-right: 52px
}

#desktop-product-panel .product div:last-child {
    align-self: flex-end;
    width: 100%
}

main.blur {
    filter: blur(10px)
}

.js-modalbox-resource {
    display: none !important
}

body.modal-is-open {
    overflow: hidden !important
}

section.overlay-modalbox {
    position: fixed;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    z-index: 1001;
    width: 100%;
    max-height: 100vh;
    justify-content: center;
    display: none;
    transition: all .6s
}

section.overlay-modalbox.open {
    display: flex;
    opacity: 1
}

section.overlay-modalbox.animate {
    opacity: 1;
    background: rgba(0, 0, 0, .9)
}

section.overlay-modalbox .rail {
    display: flex;
    align-self: flex-start;
    align-items: flex-start;
    height: 100%;
    max-height: 100%;
    width: 100%;
    overflow-y: auto;
    flex-direction: row
}

section.overlay-modalbox .content-area {
    background: #fff;
    background: linear-gradient(180deg, #F5F6FA 0%, #FFFFFF 100%);
    width: 100%;
    max-width: 860px;
    border-radius: 4px;
    transition: all .5s;
    opacity: 0;
    transform: scale(1) translateY(5%);
    margin: 16px
}

@media only screen and (min-width: 860px) {
    section.overlay-modalbox .content-area {
        margin: auto
    }
}

section.overlay-modalbox .content-area.open {
    opacity: 1;
    transform: scale(1) translateY(0px)
}

section.overlay-modalbox .close {
    position: absolute;
    top: 24px;
    right: 24px;
    width: 32px;
    height: 32px;
    border: 1px solid #ddd;
    border-radius: 100%;
    background-image: url(../img/close-menu.svg);
    background-position: center center;
    background-repeat: no-repeat;
    cursor: pointer;
    box-shadow: 0px 0px 4px rgba(0, 0, 0, .1);
    transition: all .3s
}

section.overlay-modalbox .close:hover {
    box-shadow: none;
    background-color: #e4e4e4
}

section.overlay-modalbox .contain-padding {
    padding-left: 24px;
    padding-right: 24px;
    padding-bottom: 5vh;
    padding-top: 10vh;
    min-height: 420px
}

@media only screen and (min-width: 415px) {
    section.overlay-modalbox .contain-padding {
        padding-left: 40px;
        padding-right: 40px
    }
}

@media only screen and (min-width: 1367px) {
    section.overlay-modalbox .contain-padding {
        padding-left: 64px;
        padding-right: 64px
    }
}

@media only screen and (min-width: 1921px) {
    section.overlay-modalbox .contain-padding {
        padding-left: 64px;
        padding-right: 64px
    }
}

section.overlay-modalbox .contain-padding h4 {
    font-size: 28px;
    line-height: 95%;
    letter-spacing: -0.04em;
    color: #433737;
    margin-bottom: 42px;
    font-weight: 560
}

@media only screen and (min-width: 415px) {
    section.overlay-modalbox .contain-padding h4 {
        font-size: 40px
    }
}

@media only screen and (min-width: 1367px) {
    section.overlay-modalbox .contain-padding h4 {
        font-size: 40px
    }
}

@media only screen and (min-width: 1921px) {
    section.overlay-modalbox .contain-padding h4 {
        font-size: 54px
    }
}

section.overlay-modalbox .contain-padding p {
    font-size: 16px;
    line-height: 24px;
    color: #a3a3a3
}

@media only screen and (min-width: 415px) {
    section.overlay-modalbox .contain-padding p {
        font-size: 16px;
        line-height: 24px
    }
}

@media only screen and (min-width: 1367px) {
    section.overlay-modalbox .contain-padding p {
        font-size: 16px;
        line-height: 24px
    }
}

@media only screen and (min-width: 1921px) {
    section.overlay-modalbox .contain-padding p {
        font-size: 19px;
        line-height: 26px
    }
}

section.overlay-modalbox .contain-padding .feature-link {
    color: #323232;
    font-weight: 560;
    margin-top: 48px;
    margin-bottom: 60px;
    display: block
}

section.overlay-modalbox .contain-padding .feature-link:hover {
    text-decoration: none
}

section.overlay-modalbox .contain-padding figure {
    width: 59px;
    height: 59px;
    background: #fff;
    box-shadow: 0px 4px 14px rgba(0, 0, 0, .14);
    border-radius: 12px;
    margin-bottom: 2em;
    display: flex;
    align-items: center;
    justify-content: center
}

@media only screen and (min-width: 1367px) {
    section.overlay-modalbox .contain-padding figure {
        width: 118px;
        height: 118px;
        border-radius: 24px
    }
}

section.overlay-modalbox .contain-padding figure svg {
    fill: #e51d34;
    max-width: 24px;
    height: auto
}

@media only screen and (min-width: 1367px) {
    section.overlay-modalbox .contain-padding figure svg {
        max-width: 48px
    }
}

section.overlay-modalbox .contain-padding .list {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-top: 48px;
    border-top: 1px solid #a3a3a3;
    padding-bottom: 40px
}

section.overlay-modalbox .contain-padding .list li {
    font-size: 18px;
    line-height: 24px;
    letter-spacing: -0.02em;
    color: #313131;
    width: 100%;
    font-weight: 480;
    margin-bottom: 24px
}

@media only screen and (min-width: 415px) {
    section.overlay-modalbox .contain-padding .list li {
        font-size: 18px
    }
}

@media only screen and (min-width: 1367px) {
    section.overlay-modalbox .contain-padding .list li {
        font-size: 18px
    }
}

@media only screen and (min-width: 1921px) {
    section.overlay-modalbox .contain-padding .list li {
        font-size: 21px;
        width: 31%
    }
}

section.overlay-modalbox[data-themename=modaltheme-video] .header {
    padding: 25px;
    text-align: right;
    position: sticky;
    top: 0px
}

section.overlay-modalbox[data-themename=modaltheme-video] .content-area {
    background: none
}

section.overlay-modalbox[data-themename=modaltheme-video] .close {
    position: relative;
    width: 32px;
    height: 32px;
    top: 0;
    left: 0;
    display: inline-block;
    border-radius: 100%;
    font-size: 10px;
    text-align: center;
    line-height: 34px;
    background: #e51d34;
    color: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    margin-left: auto
}

section.overlay-modalbox[data-themename=modaltheme-video] .close:after {
    content: "X";
    color: #fff
}

@media only screen and (max-width: 1025px) {
    section.overlay-modalbox[data-themename=modaltheme-video] .content-area {
        max-width: 100%
    }
}

.utils-embed-video {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
    overflow: hidden
}

.utils-embed-video iframe,
.utils-embed-video video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%
}

.embed-video-player-overlay {
    position: fixed;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .97);
    z-index: 1000;
    display: flex;
    align-items: center;
    justify-content: center;
    display: none;
    cursor: pointer
}

.embed-video-player-overlay.active {
    display: flex
}

.embed-video-player-overlay .video-mount {
    width: 100%;
    max-width: 100%;
    height: auto;
    opacity: 0;
    transition: all .4s;
    transform: scale(0.75) translateY(15%)
}

@media only screen and (min-width: 1280px) {
    .embed-video-player-overlay .video-mount {
        max-width: 90%
    }
}

@media only screen and (min-width: 1700px) {
    .embed-video-player-overlay .video-mount {
        max-width: 60%
    }
}

.embed-video-player-overlay .video-mount.fade {
    opacity: 1;
    transform: scale(1) translateY(0px)
}

.embed-video-player-overlay .js-close-video-modal {
    position: absolute;
    top: 32px;
    right: 32px;
    z-index: 1001;
    width: 40px;
    height: 40px;
    border: 2px solid #fff;
    background: #000;
    cursor: pointer;
    font-weight: 700;
    color: #fff;
    border-radius: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
    transition: all .3s
}

.embed-video-player-overlay .js-close-video-modal:hover {
    background: #fff;
    color: #000;
    transform: scale(1.1)
}

.product-page-model-view {
    padding-top: 8vh
}

@media screen and (min-width: 1025px) {
    .product-model-selector {
        padding-left: 32px
    }
}

.product-model-selector .meta-data {
    margin-bottom: 24px
}

.product-model-selector .meta-data .title {
    font-weight: 600;
    font-size: 32px;
    line-height: 36px;
    letter-spacing: -0.015em;
    margin-bottom: 8px
}

@media screen and (min-width: 1679px) {
    .product-model-selector .meta-data .title {
        font-size: 40px;
        line-height: 42px;
        letter-spacing: -0.02em;
        font-weight: 580
    }
}

.product-model-selector .meta-data .lead {
    font-size: 24px;
    line-height: 100%;
    color: #bebdbd;
    margin-bottom: 32px
}

@media screen and (min-width: 1679px) {
    .product-model-selector .meta-data .lead {
        font-size: 32px;
        line-height: 36px;
        letter-spacing: -0.01em
    }
}

.product-model-selector .meta-data .copy {
    font-size: 15px;
    line-height: 20px;
    letter-spacing: -0.01em;
    color: #7e7e7e
}

@media screen and (min-width: 1679px) {
    .product-model-selector .meta-data .copy {
        font-size: 15px;
        line-height: 20px;
        letter-spacing: -0.01em
    }
}

.product-model-selector .meta-data .price {
    font-weight: 500;
    font-size: 18px;
    line-height: 133%;
    letter-spacing: -0.01em;
    color: #313131;
    margin-bottom: 16px;
    font-weight: 460;
    display: none
}

.product-model-selector .title-line {
    margin-bottom: 16px
}

.product-model-selector .title-line p {
    font-weight: 400;
    font-size: 17px;
    line-height: 24px;
    margin-bottom: 4px
}

.product-model-selector .variant-color-selector {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between
}

.product-model-selector .variant-color-selector label {
    width: 48%;
    margin-bottom: 4%;
    border: 1px solid #e8e8e8;
    border-radius: 5px
}

.product-model-selector .variant-color-selector label .wrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding: 19px 24px;
    text-align: center;
    position: relative;
    min-height: 98px;
    border: 2px solid rgba(0, 0, 0, 0);
    border-radius: 5px;
    cursor: pointer;
    transition: all .3s
}

.product-model-selector .variant-color-selector label .wrap:hover {
    box-shadow: 0px 1px 3px rgba(0, 0, 0, .07), 0px 4px 8px 7px rgba(0, 0, 0, .03)
}

.product-model-selector .variant-color-selector label input {
    position: absolute;
    opacity: 0
}

.product-model-selector .variant-color-selector label input:checked+span {
    border: 2px solid #313131;
    font-weight: 560
}

.product-model-selector .variant-color-selector label .dot {
    width: 32px;
    height: 32px;
    display: inline-block;
    border-radius: 100%;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    overflow: hidden
}

.product-model-selector .variant-color-selector label .slice {
    width: 100%;
    height: 50%
}

.product-model-selector .variant-color-selector label .name,
.product-model-selector .variant-color-selector label .price {
    width: 100%;
    font-size: 15px;
    line-height: 20px;
    letter-spacing: -0.01em;
    color: #313131;
    padding-top: 8px
}

.product-model-selector .variant-color-selector label .price {
    padding-top: 4px;
    color: #7e7e7e;
    display: none
}

.product-model-selector .common-input-group {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between
}

.product-model-selector .common-input-group.checkbox .dot {
    border-radius: 0px
}

.product-model-selector .common-input-group.checkbox input:checked+.wrap {
    border: 2px solid #313131
}

.product-model-selector .common-input-group.checkbox input:checked+.wrap .dot:before {
    content: "";
    position: absolute;
    border-radius: 0px;
    transform: rotate(45deg);
    height: 16px;
    width: 10px;
    border-bottom: 3px solid #313131;
    border-right: 3px solid #313131;
    border-left: none;
    border-top: none;
    background: rgba(0, 0, 0, 0);
    top: 4px;
    left: 12px
}

.product-model-selector .common-input-group label {
    width: 48%;
    margin-bottom: 4%;
    border: 1px solid #e8e8e8;
    border-radius: 5px
}

.product-model-selector .common-input-group label .wrap {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 100%;
    padding: 19px 24px;
    position: relative;
    border: 2px solid rgba(0, 0, 0, 0);
    border-radius: 5px;
    cursor: pointer;
    transition: all .3s
}

.product-model-selector .common-input-group label .wrap:hover {
    box-shadow: 0px 1px 3px rgba(0, 0, 0, .07), 0px 4px 8px 7px rgba(0, 0, 0, .03)
}

.product-model-selector .common-input-group label input {
    position: absolute;
    opacity: 0
}

.product-model-selector .common-input-group label input:checked+.wrap {
    border: 2px solid #313131
}

.product-model-selector .common-input-group label input:checked+.wrap .dot {
    border-color: #313131
}

.product-model-selector .common-input-group label input:checked+.wrap .dot:before {
    content: "";
    position: absolute;
    width: 16px;
    height: 16px;
    background: #313131;
    border-radius: 100%;
    top: 7px;
    left: 7px
}

.product-model-selector .common-input-group label .dot {
    width: 32px;
    height: 32px;
    border-radius: 100%;
    border: 1px solid #ddd;
    flex-shrink: 0;
    margin-right: 16px;
    position: relative;
    transition: all .3s
}

.product-model-selector .common-input-group label .name {
    width: 100%;
    font-size: 15px;
    line-height: 20px;
    letter-spacing: -0.01em;
    color: #313131
}

.product-model-selector .product-bundle-selector label {
    width: 100%;
    margin-bottom: 4%;
    border: 1px solid #e8e8e8;
    border-radius: 5px;
    display: block
}

.product-model-selector .product-bundle-selector label .wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding: 19px 24px;
    text-align: center;
    position: relative;
    min-height: 98px;
    border: 2px solid rgba(0, 0, 0, 0);
    border-radius: 5px;
    cursor: pointer;
    transition: all .3s
}

.product-model-selector .product-bundle-selector label .wrap:hover {
    box-shadow: 0px 1px 3px rgba(0, 0, 0, .07), 0px 4px 8px 7px rgba(0, 0, 0, .03)
}

.product-model-selector .product-bundle-selector label input {
    position: absolute;
    opacity: 0
}

.product-model-selector .product-bundle-selector label input:checked+span {
    border: 2px solid #313131;
    font-weight: 560
}

.product-media-block {
    position: relative;
    width: 100%
}

.product-media-block .primary {
    width: 100%;
    margin-bottom: 8px;
    background: #f6f6f6;
    display: flex;
    align-items: center
}

@media screen and (min-width: 1025px) {
    .product-media-block .primary {
        min-height: 800px
    }
}

.product-media-block .media-container {
    width: 100%
}

.product-media-block .secondary {
    width: 100%
}

.product-media-block .media {
    width: 100%;
    display: flex;
    justify-content: center
}

.product-media-block .media img {
    max-width: 100%;
    height: auto
}

.product-media-block .media-nav {
    width: 100%
}

.product-media-block .media-nav img {
    max-width: 100px;
    height: auto
}

.product-media-block .media-nav .item {
    width: 100px;
    height: 100px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: 4px;
    margin-right: 4px;
    background-color: #f7f7f7
}

@media screen and (min-width: 1025px) {
    .product-media-block .media-nav .item {
        width: 140px;
        height: 140px
    }
}

.product-widget .select-block {
    border: 1px solid #e8e8e8;
    border-radius: 4px;
    background-image: url(../img/arrow-down-bl-menu.svg);
    background-repeat: no-repeat;
    background-position: 97% center
}

.product-widget .select-block select {
    width: 100%;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: rgba(0, 0, 0, 0);
    border: none;
    font-size: 16px;
    line-height: 20px;
    letter-spacing: -0.01em;
    color: #313131;
    padding: 20px 16px
}

.product-widget h5 {
    font-size: 15px;
    line-height: 147%;
    letter-spacing: -0.015em;
    color: #a3a3a3;
    margin-bottom: 16px
}

@media screen and (max-width: 1025px) {
    .product-widget .product-lead {
        padding-top: 40px
    }
}

.product-widget .product-lead h1 {
    font-size: 54px;
    font-size: calc(26px + 28*(100vw - 320px)/2560);
    line-height: 104%;
    letter-spacing: -1px;
    font-weight: 480;
    margin-bottom: 8px
}

.product-widget .product-lead h2 {
    font-size: 18px;
    line-height: 133%;
    letter-spacing: -0.01em;
    color: #a3a3a3;
    margin-bottom: 22px;
    margin-bottom: 38px
}

.product-widget .product-lead p {
    font-weight: 400;
    font-size: calc(15px + 3*(100vw - 320px)/2560);
    line-height: 133%;
    letter-spacing: -0.01em;
    color: #a3a3a3;
    margin-bottom: 38px
}

.product-widget .product-lead .more {
    font-weight: 700;
    font-size: 20px;
    display: block;
    margin-top: 8px;
    margin-bottom: 24px;
    cursor: pointer;
    display: none
}

.product-widget .set-selection {
    margin-bottom: 40px;
    padding-bottom: 40px;
    border-bottom: 1px solid #e0e0e0
}

.product-widget .set-selection .note {
    width: 100%;
    padding-top: 16px;
    padding-bottom: 8px;
    display: block;
    color: #7e7e7e
}

.product-widget .set-selection .set_stock_status {
    position: absolute;
    top: 10px;
    left: 20px;
    color: #a3a3a3;
    z-index: 5;
    display: none
}

.product-widget .set-selection label {
    width: 100%;
    margin-bottom: 2%;
    border: 1px solid #e8e8e8;
    border-radius: 5px;
    display: block;
    position: relative
}

.product-widget .set-selection label .wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding-top: 28px;
    padding-bottom: 28px;
    padding-left: 20px;
    padding-right: 20px;
    position: relative;
    border: 1px solid rgba(0, 0, 0, 0);
    border-radius: 5px;
    cursor: pointer;
    transition: all .3s;
    background-color: #fff
}

.product-widget .set-selection label .wrap .name {
    font-weight: 560
}

.product-widget .set-selection label .wrap span:last-child {
    width: 100px;
    text-align: right
}

.product-widget .set-selection label .wrap:hover {
    background-color: #f6f6f6
}

.product-widget .set-selection label input {
    position: absolute;
    opacity: 0
}

.product-widget .set-selection label input:checked+.wrap {
    border: 1px solid #212121;
    background-color: #212121;
    color: #fff
}

.product-widget .size-selection {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid #e0e0e0;
    padding-bottom: 40px
}

.product-widget .size-selection .note {
    color: #7e7e7e;
    font-size: 13px;
    width: 100%;
    padding-top: 16px;
    width: 100%
}

.product-widget .size-selection label {
    width: 48%;
    position: relative;
    text-align: center;
    text-align: center;
    padding-top: 15px;
    padding-bottom: 15px;
    cursor: pointer;
    font-weight: 500;
    font-size: 18px;
    line-height: 111%;
    letter-spacing: -0.3px;
    margin-bottom: 15px
}

.product-widget .size-selection label input {
    opacity: 0;
    position: absolute
}

.product-widget .size-selection label input:checked+.dot {
    border-color: #000
}

.product-widget .size-selection label .dot {
    width: 100%;
    height: 100%;
    border: 2px solid #e8e8e8;
    border-radius: 8px;
    position: absolute;
    transition: all .4s;
    left: 0px;
    top: 0px
}

.product-widget .color-select-grid {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 16px;
    padding-bottom: 16px;
    border-bottom: 1px solid #e0e0e0;
    padding-top: 26px;
    padding-bottom: 40px
}

.product-widget .color-select-grid h5 {
    margin-bottom: 4px
}

.product-widget .color-selection {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end
}

.product-widget .color-selection label {
    width: 40px;
    height: 40px;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    cursor: pointer;
    margin-left: 8px
}

.product-widget .color-selection input {
    opacity: 0;
    position: absolute;
    left: 0px;
    top: 0px
}

.product-widget .color-selection input:checked+.dot:after {
    border-color: #313131
}

.product-widget .color-selection .dot {
    width: 20px;
    height: 20px;
    border-radius: 100%
}

.product-widget .color-selection .dot:after {
    transition: all .4s;
    position: absolute;
    content: "";
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    border: 2px solid #ddd;
    border-radius: 100%
}

.product-widget .footer {
    padding-top: 16px
}

.product-widget .footer p {
    font-size: 13px;
    line-height: 16px;
    letter-spacing: -0.01em;
    color: #7e7e7e;
    margin-bottom: 8px;
    display: flex;
    align-items: center
}

.product-widget .footer p span {
    display: inline-block;
    width: 24px;
    height: 24px;
    margin-right: 16px;
    flex-shrink: 0
}

.product-widget .footer p.stock-green span {
    background-image: url(../img/icon-checkmark-green.svg)
}

.product-widget .footer p.note span {
    background-image: url(../img/icon-delivery.svg)
}

.product-widget .form-block.cta {
    padding-top: 32px;
    padding-bottom: 32px
}

.product-widget .form-block.cta .total-price {
    margin-bottom: 27px;
    line-height: 133%
}

.product-widget .form-block.cta .total-price span:first-child {
    font-size: 15px;
    letter-spacing: -0.01em;
    color: #a3a3a3;
    margin-right: 8px
}

.product-widget .form-block.cta .total-price span.cart-price {
    font-size: 18px;
    letter-spacing: -0.02em;
    font-weight: 420;
    margin-right: 8px
}

.product-widget .form-block.cta .total-price span.cart-price-old {
    font-size: 18px;
    letter-spacing: -0.02em;
    font-weight: 420;
    color: #a3a3a3
}

.product-widget .form-block.cta .total-price .outlet-note {
    border-radius: 40px;
    font-size: 12px;
    line-height: 1;
    letter-spacing: .02em;
    text-transform: uppercase;
    color: #000;
    padding-top: 4px;
    padding-bottom: 3px;
    padding-left: 6px;
    padding-right: 6px;
    background-color: #eaab29;
    border-color: #eaab29;
    margin-left: 1rem;
    position: absolute;
    margin-top: -2px
}

.product-widget .form-block.cta .button {
    width: 100%;
    text-align: center;
    box-sizing: border-box;
    font-weight: 480;
    font-size: 16px;
    letter-spacing: -0.01em;
    border-radius: 8px
}

.buy-now-block-container {
    position: fixed;
    background: rgba(0, 0, 0, .6);
    top: 0%;
    left: 0%;
    right: 0%;
    bottom: 0px;
    z-index: 1001;
    padding-top: 64px;
    display: none
}

.buy-now-block-container.open {
    display: flex;
    align-items: stretch
}

.buy-now-block-container .close {
    position: absolute;
    right: 16px;
    top: 16px;
    color: #fff;
    width: 32px;
    height: 32px;
    background-image: url(../img/close-popup.svg);
    background-size: 32px 32px;
    background-repeat: no-repeat;
    background-position: center center;
    cursor: pointer
}

.buy-now-block-container .mount {
    background: #fff;
    width: 100%;
    border-top-left-radius: 8px;
    border-top-right-radius: 8px;
    padding-top: 5vh;
    overflow-y: scroll
}

.buy-now-block-container .mount.loaded {
    animation-name: slide-in-bottom;
    -webkit-animation: slide-in-bottom .5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both;
    animation: slide-in-bottom .5s cubic-bezier(0.25, 0.46, 0.45, 0.94) both
}

.prevent-buy-ui-scroll {
    overflow: hidden !important
}

@-webkit-keyframes slide-in-bottom {
    0% {
        -webkit-transform: translateY(1000px);
        transform: translateY(1000px);
        opacity: 0
    }
    100% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
        opacity: 1
    }
}

.embed-shop-ui {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding-top: 2vh;
    padding-bottom: 2vh
}

@media screen and (max-width: 1025px) {
    .embed-shop-ui {
        margin-top: 70px
    }
}

.embed-shop-ui .media-block {
    width: 100%;
    position: relative
}

@media screen and (min-width: 1025px) {
    .embed-shop-ui .media-block {
        width: 66%
    }
}

.embed-shop-ui .media-block .variant-name {
    position: absolute;
    top: -26px;
    left: 0px;
    z-index: 20;
    font-weight: 480
}

@media screen and (min-width: 1025px) {
    .embed-shop-ui .media-block .variant-name {
        top: 36px;
        left: 80px
    }
}

.embed-shop-ui .media-block .variant-select {
    position: absolute;
    z-index: 100;
    border-radius: 32px;
    top: 8px;
    left: 8px;
    background: #fff;
    padding: 8px;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, .05)
}

@media screen and (min-width: 1025px) {
    .embed-shop-ui .media-block .variant-select {
        top: 20px;
        left: 20px
    }
}

.embed-shop-ui .media-block .variant-select .options {
    overflow: hidden;
    max-height: 0px;
    transition: all .3s
}

.embed-shop-ui .media-block .variant-select .options.open {
    max-height: 500px
}

.embed-shop-ui .media-block .variant-select .color-options {
    width: 32px;
    height: 32px;
    display: block;
    cursor: pointer;
    transition: all .6s ease-out;
    border-radius: 100%
}

.embed-shop-ui .media-block .variant-select .color-options.active {
    transform: rotate(180deg)
}

.embed-shop-ui .media-block .variant-select label {
    margin: 0px;
    margin-bottom: 16px;
    margin-top: 16px
}

.embed-shop-ui .product-block {
    width: 100%;
    flex-shrink: 0
}

@media screen and (min-width: 1025px) {
    .embed-shop-ui .product-block {
        width: 30%
    }
}

.block-product-store .accessories {
    background-color: #f6f6f6;
    border-radius: 8px
}

.block-product-store .accessories .trigger {
    font-weight: 480;
    font-size: 15px;
    line-height: 56px;
    letter-spacing: -0.015em;
    height: 56px;
    padding-left: 32px;
    padding-right: 32px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between
}

.block-product-store .accessories .trigger .js-acs-total {
    padding-left: 8px;
    color: #888
}

.block-product-store .accessories .trigger img {
    transform: rotate(90deg);
    transition: all .4s
}

.block-product-store .accessories .trigger.open img {
    rotate: -180deg
}

.block-product-store .accessories .items {
    overflow: hidden;
    max-height: 0px;
    overflow-y: scroll;
    transition: all .4s;
    padding-left: 32px;
    padding-right: 32px;
    position: relative
}

.block-product-store .accessories .items.open {
    max-height: 560px
}

.block-product-store .accessories label {
    cursor: pointer
}

.block-product-store .accessories label:last-child .wrap {
    border: none
}

.block-product-store .accessories label:hover .add {
    color: #e51d34
}

.block-product-store .accessories label .wrap {
    display: flex;
    justify-content: space-between;
    padding-top: 24px;
    padding-bottom: 24px;
    transition: all .3s;
    border-bottom: 1px solid #e0e0e0
}

.block-product-store .accessories label input {
    position: absolute;
    opacity: 0
}

.block-product-store .accessories label input:checked~span .add {
    display: none
}

.block-product-store .accessories label input:checked~span .remove {
    display: inline
}

.block-product-store .accessories label .remove {
    display: none;
    font-weight: 480;
    color: #e51d34;
    transition: all .3s
}

.block-product-store .accessories label .add {
    font-weight: 480;
    transition: all .3s;
    color: #000
}

.block-product-store .accessories label .media {
    width: 20%
}

.block-product-store .accessories label .media img {
    width: 100%;
    max-width: 100%;
    height: auto
}

.block-product-store .accessories label .price {
    font-weight: 580;
    display: block;
    padding-top: 16px;
    color: #000
}

.block-product-store .accessories label .name {
    font-weight: 580;
    display: block;
    color: #000
}

.block-product-store .accessories label .content {
    width: 70%;
    font-size: 15px;
    line-height: 120%;
    letter-spacing: -0.005em;
    color: #424242
}

.block-product-store .accessories label .content .cta {
    display: block;
    padding-top: 2px
}

.product-show-case {
    display: none
}

.product-show-case.active {
    display: block
}

@media screen and (min-width: 1025px) {
    .product-show-case {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        display: none
    }
    .product-show-case.active {
        display: flex
    }
}

.product-show-case .flickity-page-dots {
    display: flex;
    justify-content: center;
    bottom: -16px
}

.product-show-case .flickity-page-dots li {
    width: 8px;
    height: 8px;
    margin-left: 4px;
    margin-right: 4px;
    border-radius: 100%;
    background: #888
}

.product-show-case .flickity-page-dots li.is-selected {
    background: #000
}

.product-show-case .image-row {
    width: 100%;
    margin-bottom: 2%;
    margin-right: 8px;
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
    position: relative;
    border-radius: 10px;
    overflow: hidden
}

.product-show-case .image-row.ext {
    width: 100%
}

@media screen and (min-width: 568px) {
    .product-show-case .image-row.ext {
        width: 568px
    }
}

@media screen and (min-width: 1025px) {
    .product-show-case .image-row.ext {
        width: 49%
    }
}

.product-show-case .image-row.ext img {
    padding: 0px
}

@media screen and (min-width: 1025px) {
    .product-show-case .image-row {
        width: 49%;
        margin-right: 0px;
        background: rgba(0, 0, 0, 0);
        border-radius: 20px
    }
    .product-show-case .image-row:first-of-type {
        width: 100%;
        background: #f6f6f6
    }
    .product-show-case .image-row:first-of-type img {
        max-width: 568px
    }
}

.product-show-case .image-row img {
    width: 100%;
    max-width: 568px;
    height: auto;
    border-radius: 8px
}

@media screen and (min-width: 1025px) {
    .product-show-case .image-row img {
        max-width: 100%;
        border-radius: 20px;
        padding: 0px;
        background: #f6f6f6
    }
}

.js-at-glance-thumbnails:after {
    content: "flickity";
    display: none
}

@media screen and (min-width: 1025px) {
    .js-at-glance-thumbnails:after {
        content: ""
    }
}

@media screen and (min-width: 1025px) {
    html.site-has-promotion .embed-navigation {
        top: 100px
    }
}

html.site-has-promotion .embed-navigation.top {
    top: 0px
}

header.desktop .primary,
header.desktop .global {
    transition: all .3s
}

header.mobile {
    transition: all .5s
}

header.mobile.scroll-hide {
    transform: translateY(-100%)
}

.embed-navigation {
    background: #fff;
    box-shadow: 0px 4px 60px rgba(243, 243, 249, .5);
    position: -webkit-sticky;
    position: sticky;
    top: 48px;
    z-index: 10;
    transition: all .4s;
    z-index: 101;
    border-top: 1px solid #f0f0f0;
    border-bottom: 1px solid #f0f0f0
}

.embed-navigation.top {
    top: 0px;
    border-top-color: rgba(0, 0, 0, 0)
}

.embed-navigation.mobile-open .embed-toggle {
    transform: rotate(180deg)
}

.embed-navigation.mobile-open .collapse-menu {
    display: block
}

@media screen and (min-width: 768px) {
    .embed-navigation.mobile-open .collapse-menu {
        display: flex
    }
}

@media screen and (min-width: 1200px) {
    .embed-navigation {
        top: 60px
    }
}

.embed-navigation .embed-toggle {
    margin-right: 8px;
    cursor: pointer;
    width: 32px;
    height: 32px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .3s
}

@media screen and (min-width: 767px) {
    .embed-navigation .embed-toggle {
        display: none
    }
}

.embed-navigation .shop-button {
    box-sizing: border-box;
    font-weight: 440;
    border-radius: 38px;
    padding-top: 8px;
    padding-bottom: 8px;
    padding-right: 16px;
    padding-left: 16px;
    text-align: center;
    line-height: 100%;
    background-color: #e51d34;
    color: #fff;
    transition: all .3s;
    cursor: pointer
}

.embed-navigation .shop-button:hover {
    background-color: #d1182d
}

.embed-navigation .collapse-menu {
    position: absolute;
    top: 54px;
    background-color: #fff;
    left: 0px;
    padding-left: 28px;
    border-bottom: 1px solid #d2d2d7;
    padding-bottom: 24px;
    width: 100%;
    display: none;
    padding-top: 32px
}

@media screen and (min-width: 768px) {
    .embed-navigation .collapse-menu {
        top: 0px;
        position: relative;
        box-shadow: none;
        background: rgba(0, 0, 0, 0);
        display: flex;
        align-items: center;
        width: auto;
        padding: 0px;
        border: none
    }
}

.embed-navigation .collapse-menu a {
    color: #000;
    text-decoration: none
}

.embed-navigation .collapse-menu a img {
    margin-left: 8px;
    transform: rotate(-90deg);
    margin-top: -2px;
    opacity: .8
}

.embed-navigation .collapse-menu li {
    font-size: 17px;
    line-height: 106%;
    padding-top: 12px;
    padding-bottom: 12px
}

.embed-navigation .collapse-menu li:last-child {
    border-top: 1px solid #d2d2d7;
    margin-top: 10px;
    margin-bottom: 4px;
    padding-top: 20px
}

@media screen and (min-width: 768px) {
    .embed-navigation .collapse-menu li {
        margin: 0px;
        padding: 0px;
        width: auto;
        border: none;
        margin-right: 32px;
        font-weight: 500;
        font-size: 15px
    }
    .embed-navigation .collapse-menu li:last-child {
        margin: 0px;
        padding: 0px;
        border: none;
        margin-right: 32px
    }
}

.embed-navigation .collapse-menu li:hover {
    color: #000;
    cursor: pointer
}

.embed-navigation .lay-max-xl {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 54px
}

.embed-navigation .lay-max-xl div:last-child {
    flex-shrink: 0;
    display: flex;
    align-items: center
}

.embed-navigation .lay-max-xl div:first-child {
    font-weight: 500;
    font-size: 18px;
    line-height: 100%;
    letter-spacing: -0.015em;
    color: #313131;
    display: flex;
    align-items: center
}

@media screen and (min-width: 1025px) {
    .embed-navigation .lay-max-xl div:first-child {
        font-weight: 560;
        font-size: 18px;
        line-height: 100%;
        letter-spacing: -0.025em
    }
}

.global-search-container {
    position: fixed;
    top: 0px;
    height: 100%;
    width: 100%;
    z-index: 1000;
    background: rgba(0, 0, 0, .6);
    align-items: stretch;
    justify-content: flex-end;
    display: none
}

.global-search-container.active {
    display: flex
}

.global-search-container .search-area {
    background: #fff;
    width: 100%;
    max-width: 90%;
    transition: all .4s;
    transform: translateX(100%);
    overflow-y: scroll
}

@media only screen and (min-width: 1025px) {
    .global-search-container .search-area {
        max-width: 860px
    }
}

.global-search-container .search-area.active {
    transform: translateX(0%)
}

.global-search-container .search-bar {
    padding-left: 40px;
    padding-right: 40px;
    background: #fff;
    display: flex;
    justify-content: space-between;
    align-items: center;
    position: sticky;
    z-index: 1001;
    top: 0px
}

.global-search-container .search-bar input[type=text] {
    width: 100%;
    padding: 1em;
    transition: all .4s;
    border: none;
    border-bottom: 1px solid #ddd;
    font-size: 16px;
    line-height: 20px;
    color: #313131;
    background-image: url(../img/icon-search-light.svg);
    background-position: left center;
    background-repeat: no-repeat;
    padding-left: 40px
}

.global-search-container .sticky-block {
    position: fixed;
    top: 0px;
    border: 2px solid red
}

.global-search-container .aa-suggestion {
    width: 100%
}

.global-search-container .aa-dropdown-menu {
    width: 100%;
    padding-bottom: 150px
}

.global-search-container .aa-dropdown-menu .product-block {
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    margin-bottom: 24px;
    text-decoration: none
}

@media only screen and (max-width: 767px) {
    .global-search-container .aa-dropdown-menu .product-block {
        flex-wrap: wrap
    }
}

.global-search-container .aa-dropdown-menu .product-block .image {
    width: 140px;
    height: 160px;
    background: #f6f6f6;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    margin-right: 32px;
    border-radius: 8px
}

@media only screen and (max-width: 767px) {
    .global-search-container .aa-dropdown-menu .product-block .image {
        width: 100%;
        margin-bottom: 32px;
        margin-right: 0px
    }
}

.global-search-container .aa-dropdown-menu .product-block .data {
    flex-basis: 80%
}

@media only screen and (max-width: 767px) {
    .global-search-container .aa-dropdown-menu .product-block .data {
        flex-basis: 100%
    }
}

.global-search-container .aa-dropdown-menu .product-block span.title {
    font-size: 16px;
    line-height: 125%;
    letter-spacing: -0.005em;
    color: #a3a3a3;
    width: 100%;
    display: block;
    margin-bottom: 8px
}

@media only screen and (min-width: 1025px) {
    .global-search-container .aa-dropdown-menu .product-block span.title {
        font-size: 20px;
        line-height: 30px;
        letter-spacing: -0.005em
    }
}

.global-search-container .aa-dropdown-menu .product-block span.desc {
    font-size: 18px;
    line-height: 22px;
    letter-spacing: -0.015em;
    color: #313131;
    width: 100%;
    display: block;
    font-weight: 480
}

@media only screen and (min-width: 1025px) {
    .global-search-container .aa-dropdown-menu .product-block span.desc {
        font-size: 28px;
        line-height: 34px;
        letter-spacing: -0.015em
    }
}

.global-search-container .aa-dropdown-menu .document-block {
    padding-top: 2em;
    padding-bottom: 2em;
    display: block;
    border-bottom: 1px solid #e8e8e8
}

.global-search-container .aa-dropdown-menu .document-block a {
    font-size: 18px;
    line-height: 30px;
    letter-spacing: -0.015em;
    width: 100%;
    color: #000;
    text-decoration: none
}

@media only screen and (min-width: 1025px) {
    .global-search-container .aa-dropdown-menu .document-block a {
        font-size: 30px;
        line-height: 40px;
        letter-spacing: -0.015em
    }
}

.global-search-container .aa-dropdown-menu .topic {
    font-size: 16px;
    line-height: 150%;
    letter-spacing: -0.01em;
    color: #a3a3a3;
    margin-top: 32px;
    margin-bottom: 32px
}

.global-search-container .close {
    width: 32px;
    height: 32px;
    border-radius: 100%;
    background-color: #f2f2f7;
    margin-left: -2em;
    background-image: url(../img/sidebar-menu-close.svg);
    background-position: center center;
    background-size: 16px 16px;
    background-repeat: no-repeat;
    cursor: pointer
}

.global-search-container .algolia-autocomplete {
    width: 100%
}

.legal-page {
    position: relative;
    margin-top: 100px;
    width: 100%
}

.legal-page h1 {
    font-size: calc(36px + 12*(100vw - 320px)/1920);
    line-height: 100%;
    letter-spacing: -0.02em;
    margin-bottom: .84em;
    font-weight: 580
}

.legal-page h2 {
    font-size: calc(24px + 8*(100vw - 320px)/1920);
    line-height: 115%;
    letter-spacing: -0.02em;
    margin-bottom: 1em;
    font-weight: 520;
    padding-top: .8em
}

.legal-page h2 span[id] {
    margin-top: -80px;
    padding-top: 80px;
    pointer-events: none
}

.legal-page h3 {
    font-size: calc(20px + 4*(100vw - 320px)/1920);
    line-height: 115%;
    letter-spacing: -0.02em;
    margin-bottom: 2em;
    font-weight: 520;
    padding-top: .8em
}

.legal-page h4 {
    font-size: calc(18px + 4*(100vw - 320px)/1920);
    line-height: 115%;
    letter-spacing: -0.02em;
    margin-bottom: 2em;
    font-weight: 520;
    padding-top: .8em
}

.legal-page p {
    font-size: calc(16px + 4*(100vw - 320px)/1920);
    line-height: 150%;
    letter-spacing: -0.02em;
    margin-bottom: 1.2em;
    color: #323232
}

.legal-page a {
    font-weight: 520;
    word-break: break-all;
    position: relative
}

.legal-page a:hover {
    text-decoration: none
}

.legal-page b,
.legal-page strong {
    color: #000;
    font-weight: 580
}

.legal-page ul {
    padding-left: 1em
}

.legal-page ul li {
    font-size: calc(16px + 4*(100vw - 320px)/1920);
    line-height: 150%;
    letter-spacing: -0.02em;
    margin-bottom: 1.2em;
    color: #323232;
    list-style-type: disc
}

.legal-page ol {
    padding-left: 1em
}

.legal-page ol li {
    font-size: calc(16px + 2*(100vw - 320px)/1920);
    line-height: 150%;
    letter-spacing: -0.02em;
    margin-bottom: 1.2em;
    color: #323232;
    list-style-type: decimal
}

.legal-page table {
    width: 100%
}

.legal-page table td,
.legal-page table p,
.legal-page table tr p {
    margin: 0px
}

.legal-page table td,
.legal-page table th {
    border: 1px solid #ddd
}

.legal-page table th {
    text-align: left;
    padding: .5em;
    background: #f7f7f7
}

.legal-page table td {
    padding: .5em;
    vertical-align: middle;
    font-size: calc(14px + 4*(100vw - 320px)/1920);
    text-align: left
}

.legal-page table td p {
    font-size: calc(14px + 4*(100vw - 320px)/1920)
}

.legal-page img {
    width: 100%;
    max-width: 100%;
    height: auto;
    margin-bottom: 3em
}

.legal-page .accordion {
    margin-top: 1em;
    margin-bottom: 1em;
    display: block
}

.legal-page .accordion .accordion-head a {
    text-decoration: none;
    font-size: calc(14px + 4*(100vw - 320px)/1920);
    font-weight: 560;
    position: relative;
    display: block;
    color: inherit;
    transition: all .5s;
    padding: 1em;
    border: 1px solid #ddd;
    background-color: #f9f9f9;
    cursor: pointer;
    transition: all .3s;
    border-radius: 8px;
    outline: none;
    display: flex;
    justify-content: space-between
}

.legal-page .accordion .accordion-head a:hover,
.legal-page .accordion .accordion-head a.open {
    background-color: #333;
    border-color: #333;
    color: #fff
}

.legal-page .accordion .accordion-head a.open {
    border-bottom-left-radius: 0px;
    border-bottom-right-radius: 0px
}

.legal-page .accordion .accordion-head a:after {
    position: absolute;
    content: "+";
    right: 20px;
    top: 15px;
    font-weight: 700;
    display: flex;
    align-items: center;
    justify-content: center
}

.legal-page .accordion .accordion-head a.open:after {
    content: "-"
}

.legal-page .accordion .accordion-body {
    padding: 2em;
    border: 1px solid #ddd;
    border-top: none;
    display: none
}

.legal-page .accordion .accordion-body.open {
    display: block;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px
}

.legal-page .centered-minimal-content {
    display: flex;
    justify-content: center;
    align-items: center;
    min-height: 42vh
}

@media only screen and (min-width: 800px) {
    .legal-page .centered-minimal-content {
        min-height: 56vh
    }
}

.legal-page .form-flex {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between
}

.legal-page .form-flex .flex-100 {
    width: 100%
}

.legal-page .form-flex .flex-50 {
    width: 100%;
    margin-bottom: 16px
}

@media only screen and (min-width: 800px) {
    .legal-page .form-flex .flex-50 {
        width: 48%
    }
}

.legal-page .clean-select {
    width: 100%;
    box-sizing: border-box;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: #fff;
    border: 0;
    outline: 0;
    height: 60px;
    color: #000;
    border: 1px solid #888;
    padding-right: 16px;
    padding-left: 16px;
    font-weight: 420;
    font-size: 16px;
    border-radius: 4px;
    background-image: url(../img/arrow-down-bl-menu.svg);
    background-repeat: no-repeat;
    background-position: 98% center;
    background-size: 16px 16px
}

.legal-page .lg-grid-titled-column {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    padding-top: 40px;
    padding-bottom: 40px;
    border-top: 1px solid #f6f6f6
}

@media only screen and (min-width: 800px) {
    .legal-page .lg-grid-titled-column {
        padding-top: 5vh;
        padding-bottom: 5vh
    }
}

.legal-page .lg-grid-titled-column div:first-child {
    width: 100%
}

@media only screen and (min-width: 800px) {
    .legal-page .lg-grid-titled-column div:first-child {
        width: 30%
    }
}

.legal-page .lg-grid-titled-column div:last-child {
    width: 100%
}

@media only screen and (min-width: 800px) {
    .legal-page .lg-grid-titled-column div:last-child {
        width: 60%
    }
}

.legal-page .lg-grid-titled-column a {
    font-weight: 400 !important
}

.legal-page .lg-grid-titled-column h3 {
    padding-top: 0px
}

.legal-page .lg-custom-table {
    width: 100%;
    margin-bottom: 4vh
}

.legal-page .lg-custom-table table.table-extend {
    width: 100%
}

.legal-page .lg-custom-table table.table-extend th {
    background: none;
    border: none;
    font-weight: 480;
    text-align: center;
    font-size: calc(15px + 4*(100vw - 320px)/1920);
    min-height: 0vh
}

@media only screen and (max-width: 560px) {
    .legal-page .lg-custom-table table.table-extend th {
        display: none
    }
}

.legal-page .lg-custom-table table.table-extend th span {
    background: #f7f7f7;
    display: block;
    padding-top: 20px;
    padding-bottom: 20px;
    padding-left: 10px;
    padding-right: 10px;
    border-radius: 20px
}

.legal-page .lg-custom-table table.table-extend tr td:nth-child(3) {
    font-size: calc(14px + 4*(100vw - 320px)/1920)
}

.legal-page .lg-custom-table table.table-extend td {
    border: none;
    border-bottom: 1px solid #f7f7f7;
    padding-top: 20px;
    padding-bottom: 20px;
    vertical-align: top;
    line-height: 115%;
    color: #000;
    font-weight: 420;
    width: auto;
    text-align: left;
    font-size: calc(15px + 4*(100vw - 320px)/1920);
    min-height: 0vh
}

@media only screen and (min-width: 560px) {
    .legal-page .lg-custom-table table.table-extend td {
        text-align: center
    }
}

.legal-page .lg-custom-table table.table-extend td span {
    display: block;
    margin-bottom: 10px;
    color: #999;
    font-size: 12px
}

@media only screen and (min-width: 560px) {
    .legal-page .lg-custom-table table.table-extend td span {
        display: none
    }
}

.business-thank-you-page {
    min-height: 700px;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    width: 100%
}

.business-thank-you-page p {
    font-size: 21px;
    line-height: 1.25;
    color: #7a7a82;
    max-width: 560px;
    margin: 30px auto
}

.business-thank-you-page h1 {
    font-size: 48px;
    color: #000;
    line-height: 1;
    max-width: 500px;
    margin: 0 auto;
    font-weight: 500
}

.business-thank-you-page h1 span {
    color: #9f9f9f
}

.section-404 {
    background: #000;
    color: #fff
}

.section-404 h1 {
    font-weight: 540;
    font-size: calc(38px + 38*(100vw - 320px)/2560);
    line-height: 100%;
    letter-spacing: -0.028em;
    padding-top: 10vh;
    max-width: 960px;
    margin-bottom: 5vh
}

.section-404 .content {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding-bottom: 10vh;
    padding-top: 5vh
}

@media only screen and (max-width: 1025px) {
    .section-404 .content {
        text-align: center;
        justify-content: center
    }
}

.section-404 img {
    margin-bottom: 2vh;
    max-width: 60%;
    height: auto
}

@media only screen and (min-width: 1921px) {
    .section-404 img {
        max-width: 80%
    }
}

.section-404 .button:hover {
    background: #e51d34;
    color: #fff
}

.tech-spec-group strong {
    font-weight: bold;
    color: #222
}

.buy-ui .form-color-picker .dot.orange {
    background: #fc754f
}

.buy-ui .form-color-picker .dot.black {
    background: #000
}

.buy-ui .form-color-picker .dot.blue {
    background: #2a57bc
}

.buy-ui .form-color-picker .dot.blue2 {
    background: #434561
}

.buy-ui .form-color-picker .dot.blue3 {
    background: #425a70
}

.buy-ui .form-color-picker .dot.red {
    background: #d10027
}

.buy-ui .form-color-picker .dot.pink {
    background: #f13b6e
}

.buy-ui .form-color-picker .dot.yellow {
    background: #f7df3d
}

.buy-ui .form-color-picker .dot.grey {
    background: #babcbb
}

.buy-ui .form-color-picker .dot.gray {
    background: #babcbb
}

.buy-ui .form-color-picker .dot.green {
    background: #4c6208
}

.buy-ui .form-color-picker .dot.neongreen {
    background: #6ee23c
}

.buy-ui .form-color-picker .dot.violet {
    background: #5d4092
}

.buy-ui .form-color-picker .dot.ivory {
    background: #eeedeb
}

.buy-ui .form-color-picker .dot.ruby {
    background: #c4376a
}

.buy-ui .form-color-picker .dot.petrol {
    background: #3e6466
}

.buy-ui .form-color-picker .dot.turquoise {
    background: #699
}

.buy-ui .form-color-picker .dot.aqua {
    background: #00b1be
}

.buy-ui .form-color-picker .dot.leather {
    background: #5b5352
}

.buy-ui .form-color-picker .dot.havu {
    background: #6a735a
}

.buy-ui .form-color-picker .dot.black-tundra {
    background: #484848
}

.buy-ui .form-color-picker .dot.green-tundra {
    background: #a3a79e
}

.buy-ui .form-color-picker .dot.brown {
    background: #3c312d
}

.buy-ui .form-color-picker .dot.red-black {
    background: #d10027;
    background: linear-gradient(135deg, #d10027 0%, #d10027 50%, #000000 50%, #000000 100%);
    border: none
}

.buy-ui .form-color-picker .dot.black-red {
    background: #000;
    background: linear-gradient(135deg, #000000 0%, #000000 50%, #d10027 50%, #d10027 100%);
    border: none
}

.buy-ui .form-color-picker .dot.black-silver {
    background: #000;
    background: linear-gradient(135deg, #000000 0%, #000000 50%, #999999 50%, #999999 100%);
    border: none
}

.buy-ui .form-color-picker .dot.black-copper {
    background: #000;
    background: linear-gradient(135deg, #000000 0%, #000000 50%, #8f6143 50%, #8f6143 100%);
    border: none
}

.buy-ui .form-color-picker .dot.brown-copper {
    background: #3c312d;
    background: linear-gradient(135deg, #3c312d 0%, #3c312d 50%, #8f6143 50%, #8f6143 100%);
    border: none
}

.buy-ui .form-color-picker .dot.pink-rose {
    background: #fadbd2;
    background: linear-gradient(135deg, #fadbd2 0%, #fadbd2 50%, #f4c4b1 50%, #f4c4b1 100%);
    border: none
}

.buy-ui .form-color-picker .dot.white-steel {
    background: #fff;
    background: linear-gradient(135deg, #ffffff 0%, #ffffff 50%, #c2c3c5 50%, #6a6b6d 100%);
    border-color: #999
}

.buy-ui .form-color-picker .dot.havu-steel {
    background: #6a735a;
    background: linear-gradient(135deg, #6a735a 0%, #6a735a 50%, #c2c3c5 50%, #6a6b6d 100%);
    border: none
}

.buy-ui .form-color-picker .dot.mint {
    background: #95b48a
}

.buy-ui .form-color-picker .dot.blush {
    background: #dbc6bd
}

.buy-ui .form-color-picker .dot.havu-black {
    background: #6a735a;
    background: linear-gradient(135deg, #6a735a 0%, #6a735a 50%, #000000 50%, #000000 100%);
    border: none
}

.buy-ui .form-color-picker .dot.plum {
    background: #dbc6bd
}

.buy-ui .form-color-picker .dot.plum2 {
    background: #5f4247
}

.buy-ui .form-color-picker .dot.lime {
    background: #dee054
}

.buy-ui .form-color-picker .dot.champagne {
    background: #fdf5dc
}

.buy-ui .form-color-picker .dot.gold {
    background: #fdf5dc
}

.buy-ui .form-color-picker .dot.gold-champagne {
    background: #fdf5dc;
    background: linear-gradient(135deg, #fdf5dc 0%, #fdf5dc 50%, #d7bb95 50%, #d7bb95 100%);
    border: none
}

.buy-ui .form-color-picker .dot.gray-yellow {
    background: #3d3c3a;
    background: linear-gradient(135deg, #3d3c3a 0%, #3d3c3a 50%, #eba200 50%, #eba200 100%);
    border: none
}

.buy-ui .form-color-picker .dot.stone-camo {
    background: #2b2b2b
}

.buy-ui .form-color-picker .dot.black-crush {
    background: #000
}

.buy-ui .form-color-picker .dot.darkred {
    background: #7b1d2e
}

.buy-ui .form-color-picker .dot.bronze {
    background: #9b5e45
}

.product-variant-radio {
    display: flex;
    margin-right: 1em;
    cursor: pointer
}

.product-variant-radio input {
    position: absolute;
    opacity: 0
}

.product-variant-radio input:checked+span .state {
    box-shadow: inset 0px 0px 8px rgba(0, 0, 0, .4)
}

.product-variant-radio .content {
    display: flex
}

.product-variant-radio .state {
    position: absolute;
    width: 32px;
    height: 32px;
    border-radius: 100%;
    z-index: 5
}

.product-variant-radio .color {
    display: flex;
    flex-wrap: wrap;
    width: 32px;
    height: 32px;
    border-radius: 100%;
    overflow: hidden;
    border: 1px solid #ddd;
    transition: all .3s;
    position: relative
}

.product-variant-radio .color-block {
    width: 100%;
    height: 50%
}

.max-image {
    width: 100%;
    max-width: 100%;
    height: auto
}

.fa-center {
    display: flex;
    align-items: center
}

.fj-center {
    display: flex;
    justify-content: center
}

.product-intro {
    background: linear-gradient(180deg, #000000 0%, #2A3133 100%);
    padding-top: 80px;
    overflow: hidden
}

@media screen and (min-width: 1024px) {
    .product-intro {
        padding-top: 20vh
    }
}

.product-intro .lead-row {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    text-align: center
}

.product-intro .lead-row img {
    margin-bottom: 10vh
}

.product-intro h2 {
    line-height: 100%;
    margin-bottom: 1em;
    letter-spacing: -0.015em;
    color: #a3a3a3
}

.product-intro h2 {
    font-size: 22px
}

@media screen and (min-width: 375px) {
    .product-intro h2 {
        min-height: 0vh;
        font-size: calc(22px + 10 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .product-intro h2 {
        font-size: 32px
    }
}

.product-intro h3 {
    font-weight: 520;
    line-height: 100%;
    letter-spacing: -0.035em;
    color: #fff;
    margin-bottom: 1em
}

.product-intro h3 {
    font-size: 36px
}

@media screen and (min-width: 375px) {
    .product-intro h3 {
        min-height: 0vh;
        font-size: calc(36px + 40 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .product-intro h3 {
        font-size: 76px
    }
}

.product-intro p {
    font-weight: 460;
    line-height: 133%;
    letter-spacing: -0.005em;
    color: #a3a3a3
}

.product-intro p {
    font-size: 16px
}

@media screen and (min-width: 375px) {
    .product-intro p {
        min-height: 0vh;
        font-size: calc(16px + 8 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .product-intro p {
        font-size: 24px
    }
}

.product-intro .copy-row {
    margin-left: auto
}

.product-intro .zoom-image {
    width: 100%;
    height: auto;
    max-width: 1740px;
    margin: auto
}

.section-tech {
    background: #272727;
    padding-top: 80px;
    padding-bottom: 80px;
    overflow: hidden
}

@media screen and (min-width: 1024px) {
    .section-tech {
        padding-top: 20vh;
        padding-bottom: 15vh
    }
}

.section-tech .lead-block h3 {
    font-weight: 520;
    margin-bottom: .5em;
    line-height: 100%;
    letter-spacing: -0.035em;
    color: #fff
}

.section-tech .lead-block h3 {
    font-size: 36px
}

@media screen and (min-width: 375px) {
    .section-tech .lead-block h3 {
        min-height: 0vh;
        font-size: calc(36px + 40 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .section-tech .lead-block h3 {
        font-size: 76px
    }
}

.section-tech .lead-block p {
    font-weight: 460;
    line-height: 130%;
    letter-spacing: -0.015em;
    color: #a3a3a3;
    margin-bottom: 2em
}

.section-tech .lead-block p {
    font-size: 16px
}

@media screen and (min-width: 375px) {
    .section-tech .lead-block p {
        min-height: 0vh;
        font-size: calc(16px + 8 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .section-tech .lead-block p {
        font-size: 24px
    }
}

.section-tech .lead-block p span {
    color: #fff
}

.section-tech .modes {
    text-align: center;
    padding-top: 32px;
    padding-bottom: 32px
}

@media screen and (min-width: 1024px) {
    .section-tech .modes {
        padding-top: 10vh;
        padding-bottom: 15vh
    }
}

.section-tech .modes h4 {
    font-weight: 520;
    line-height: 100%;
    letter-spacing: -0.028em;
    color: #fff;
    word-break: break-word;
    hyphens: auto;
    margin: auto;
    margin-bottom: 1em
}

.section-tech .modes h4 {
    font-size: 32px
}

@media screen and (min-width: 375px) {
    .section-tech .modes h4 {
        min-height: 0vh;
        font-size: calc(32px + 10 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .section-tech .modes h4 {
        font-size: 42px
    }
}

.section-tech .modes p {
    line-height: 130%;
    letter-spacing: -0.01em;
    color: #fff;
    max-width: 300px;
    margin: auto
}

.section-tech .modes p {
    font-size: 16px
}

@media screen and (min-width: 375px) {
    .section-tech .modes p {
        min-height: 0vh;
        font-size: calc(16px + 2 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .section-tech .modes p {
        font-size: 18px
    }
}

.section-tech .ksp-item {
    margin-bottom: 40px
}

.section-tech .ksp-item h3 {
    font-weight: 520;
    line-height: 100%;
    letter-spacing: -0.04em;
    color: #e51d34;
    margin-bottom: .25em
}

.section-tech .ksp-item h3 {
    font-size: 32px
}

@media screen and (min-width: 375px) {
    .section-tech .ksp-item h3 {
        min-height: 0vh;
        font-size: calc(32px + 8 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .section-tech .ksp-item h3 {
        font-size: 40px
    }
}

.section-tech .ksp-item p {
    line-height: 110%;
    letter-spacing: -0.03em;
    color: #86868b
}

.section-tech .ksp-item p {
    font-size: 18px
}

@media screen and (min-width: 375px) {
    .section-tech .ksp-item p {
        min-height: 0vh;
        font-size: calc(18px + 0 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .section-tech .ksp-item p {
        font-size: 18px
    }
}

.section-tech .disclaimer {
    font-weight: 420;
    font-size: 14px;
    line-height: 100%;
    letter-spacing: -0.015em;
    color: dimgray
}

.section-ohr {
    background: #f6f6f6;
    padding-top: 80px;
    position: relative
}

@media screen and (min-width: 1024px) {
    .section-ohr {
        padding-top: 20vh
    }
}

.section-ohr .ohr-media {
    display: block
}

.section-ohr .ohr-media img,
.section-ohr .ohr-media source {
    width: 100%;
    max-width: 100%;
    height: auto
}

.section-ohr .lead-block {
    text-align: center
}

.section-ohr .lead-block h3 {
    font-weight: 520;
    line-height: 100%;
    letter-spacing: -0.035em
}

.section-ohr .lead-block h3 {
    font-size: 32px
}

@media screen and (min-width: 375px) {
    .section-ohr .lead-block h3 {
        min-height: 0vh;
        font-size: calc(32px + 44 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .section-ohr .lead-block h3 {
        font-size: 76px
    }
}

.section-ohr .lead-block p {
    line-height: 100%;
    letter-spacing: -0.015em;
    color: #e51d34;
    margin-bottom: .5em
}

.section-ohr .lead-block p {
    font-size: 16px
}

@media screen and (min-width: 375px) {
    .section-ohr .lead-block p {
        min-height: 0vh;
        font-size: calc(16px + 16 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .section-ohr .lead-block p {
        font-size: 32px
    }
}

.section-ohr .content-block {
    text-align: center;
    padding-top: 10vh;
    padding-bottom: 10vh
}

.section-ohr .content-block p {
    font-weight: 460;
    line-height: 130%;
    letter-spacing: -0.005em;
    margin-bottom: 1.25em
}

.section-ohr .content-block p {
    font-size: 20px
}

@media screen and (min-width: 375px) {
    .section-ohr .content-block p {
        min-height: 0vh;
        font-size: calc(20px + 12 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .section-ohr .content-block p {
        font-size: 32px
    }
}

.section-ohr .tech-lead {
    padding: 32px;
    background: #fff;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    border-radius: 20px;
    flex-direction: column-reverse
}

@media screen and (min-width: 1024px) {
    .section-ohr .tech-lead {
        padding: 62px;
        flex-direction: row
    }
}

.section-ohr .tech-lead .col {
    width: 100%;
    display: flex;
    align-items: center
}

@media screen and (min-width: 1024px) {
    .section-ohr .tech-lead .col {
        width: 50%
    }
}

.section-ohr .tech-lead h3 {
    font-weight: 520;
    line-height: 100%;
    letter-spacing: -0.028em;
    margin-bottom: .85em
}

.section-ohr .tech-lead h3 {
    font-size: 36px
}

@media screen and (min-width: 375px) {
    .section-ohr .tech-lead h3 {
        min-height: 0vh;
        font-size: calc(36px + 18 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .section-ohr .tech-lead h3 {
        font-size: 54px
    }
}

.section-ohr .tech-lead p {
    font-weight: 400;
    line-height: 120%;
    letter-spacing: -0.005em;
    max-width: 370px
}

.section-ohr .tech-lead p {
    font-size: 16px
}

@media screen and (min-width: 375px) {
    .section-ohr .tech-lead p {
        min-height: 0vh;
        font-size: calc(16px + 2 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .section-ohr .tech-lead p {
        font-size: 18px
    }
}

.section-swimming {
    background: #3f5683;
    position: relative;
    padding-bottom: 6vh;
    overflow: hidden
}

.section-swimming .bg {
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center center;
    position: absolute;
    width: 100%;
    height: 100%;
    display: block;
    object-fit: cover;
    top: 0px;
    left: 0px;
    z-index: 1
}

.section-swimming .content-block {
    min-height: 500px;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column;
    justify-content: space-between;
    text-align: center;
    color: #fff;
    z-index: 2;
    position: relative;
    padding-top: 40px
}

@media screen and (min-width: 1280px) {
    .section-swimming .content-block {
        min-height: 100vh;
        padding-top: 80px
    }
}

@media screen and (min-width: 1800px) {
    .section-swimming .content-block {
        min-height: 80vh;
        padding-top: 160px
    }
}

.section-swimming .content-top h3 {
    font-weight: 520;
    line-height: 100%;
    letter-spacing: -0.035em;
    max-width: 600px;
    margin: auto;
    margin-bottom: .5em
}

.section-swimming .content-top h3 {
    font-size: 44px
}

@media screen and (min-width: 375px) {
    .section-swimming .content-top h3 {
        min-height: 0vh;
        font-size: calc(44px + 32 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .section-swimming .content-top h3 {
        font-size: 76px
    }
}

.section-swimming .content-top p {
    font-weight: 460;
    line-height: 130%;
    letter-spacing: -0.015em;
    margin: auto;
    max-width: 560px
}

.section-swimming .content-top p {
    font-size: 16px
}

@media screen and (min-width: 375px) {
    .section-swimming .content-top p {
        min-height: 0vh;
        font-size: calc(16px + 9 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .section-swimming .content-top p {
        font-size: 25px
    }
}

.section-swimming .content-bottom h3 {
    font-weight: 520;
    font-size: 76px;
    line-height: 100%;
    letter-spacing: -0.035em;
    margin-bottom: .5em
}

.section-swimming .content-bottom p {
    font-weight: 460;
    font-size: 24px;
    line-height: 130%;
    letter-spacing: -0.015em
}

.sport-profiles-lead {
    padding-top: 8vh;
    margin: auto;
    text-align: center
}

.sport-profiles-lead h3 {
    font-weight: 520;
    line-height: 100%;
    letter-spacing: -0.035em;
    max-width: 600px;
    margin: auto;
    margin-bottom: .5em;
    color: #fff
}

.sport-profiles-lead h3 {
    font-size: 36px
}

@media screen and (min-width: 375px) {
    .sport-profiles-lead h3 {
        min-height: 0vh;
        font-size: calc(36px + 40 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .sport-profiles-lead h3 {
        font-size: 76px
    }
}

.sport-profiles-lead p {
    font-weight: 460;
    line-height: 130%;
    letter-spacing: -0.015em;
    margin: auto;
    max-width: 560px;
    color: dimgray;
    margin-bottom: 2em
}

.sport-profiles-lead p {
    font-size: 16px
}

@media screen and (min-width: 375px) {
    .sport-profiles-lead p {
        min-height: 0vh;
        font-size: calc(16px + 8 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .sport-profiles-lead p {
        font-size: 24px
    }
}

.section-multisport {
    background: #121212;
    min-height: 100vh;
    padding-top: 5vh
}

.section-multisport .profiles-image {
    width: 100%;
    max-width: 1424px;
    height: auto;
    margin: auto;
    margin-bottom: 5vh;
    display: block
}

.section-multisport .profiles-image img,
.section-multisport .profiles-image source {
    width: 100%;
    max-width: 100%;
    height: auto
}

.section-connectivity {
    background: #16181e;
    min-height: 100vh;
    padding-top: 10vh;
    padding-bottom: 5vh;
    position: relative;
    overflow: hidden
}

.section-connectivity .sensor {
    width: 100%;
    max-width: 769px;
    height: auto;
    margin: 0 auto;
    display: block;
    position: relative;
    z-index: 2
}

.section-connectivity .flare-1 {
    background: #2c3a63;
    opacity: .7;
    filter: blur(323px);
    width: 800px;
    height: 800px;
    border-radius: 100%;
    position: absolute;
    top: 20%;
    left: 38%;
    z-index: 1
}

.section-connectivity .flare-2 {
    background: #2c3a63;
    opacity: .7;
    filter: blur(323px);
    width: 800px;
    height: 800px;
    border-radius: 100%;
    position: absolute;
    top: 20%;
    right: 30%;
    z-index: 1;
    display: none
}

.section-design {
    background: #fff;
    min-height: 100vh;
    padding-top: 10vh;
    padding-bottom: 5vh
}

.section-design .materials {
    width: 100%;
    max-width: 800px;
    height: auto;
    margin: auto;
    display: block;
    overflow: hidden;
    margin-bottom: 32px
}

.section-design .materials img,
.section-design .materials source {
    width: 100%;
    max-width: 100%;
    height: auto
}

.section-design .disclaimer {
    font-weight: 420;
    font-size: 14px;
    line-height: 100%;
    text-align: center;
    letter-spacing: -0.015em;
    color: dimgray
}

.section-sdk {
    background: #f6f6f6;
    padding-top: 10vh;
    pading-bottom: 10vh
}

.section-sdk .api {
    width: 100%;
    max-width: 1191px;
    height: auto;
    margin: auto;
    display: block;
    border-radius: 20px
}

.section-sdk .device {
    margin: auto;
    position: relative;
    width: 100%;
    max-width: 675px;
    height: auto;
    margin-top: -25%;
    text-align: center;
    display: block
}

.section-sdk .logo {
    margin-bottom: 1.5em;
    width: 100%;
    max-width: 155px;
    height: auto
}

.vh-padt {
    padding-top: 10vh
}

.vh-padb {
    padding-bottom: 10vh
}

.vh-small-pad {
    padding-top: 8vh;
    padding-bottom: 8vh
}

.opening-title {
    text-align: center;
    padding-left: 24px;
    padding-right: 24px;
    position: relative;
    z-index: 5
}

.opening-title h3 {
    font-weight: 520;
    line-height: 100%;
    letter-spacing: -0.035em;
    margin-bottom: .5em;
    color: #fff
}

.opening-title h3 {
    font-size: 44px
}

@media screen and (min-width: 375px) {
    .opening-title h3 {
        min-height: 0vh;
        font-size: calc(44px + 32 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .opening-title h3 {
        font-size: 76px
    }
}

.opening-title h3 span {
    display: block
}

.opening-title h3 span:first-child {
    color: #aaa
}

.opening-title .bl {
    color: #000
}

.opening-title p {
    font-weight: 460;
    font-size: 24px;
    line-height: 130%;
    letter-spacing: -0.015em;
    color: #a3a3a3;
    max-width: 560px;
    margin: auto
}

.opening-title p {
    font-size: 18px
}

@media screen and (min-width: 375px) {
    .opening-title p {
        min-height: 0vh;
        font-size: calc(18px + 6 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .opening-title p {
        font-size: 24px
    }
}

.sub-title {
    text-align: center;
    padding-left: 24px;
    padding-right: 24px;
    color: #000
}

.sub-title h3 {
    font-weight: 520;
    line-height: 100%;
    letter-spacing: -0.028em;
    margin-bottom: .85em
}

.sub-title h3 {
    font-size: 36px
}

@media screen and (min-width: 375px) {
    .sub-title h3 {
        min-height: 0vh;
        font-size: calc(36px + 18 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .sub-title h3 {
        font-size: 54px
    }
}

.sub-title h3 span {
    display: block
}

.sub-title p {
    line-height: 120%;
    letter-spacing: -0.005em;
    max-width: 560px;
    margin: auto
}

.sub-title p {
    font-size: 16px
}

@media screen and (min-width: 375px) {
    .sub-title p {
        min-height: 0vh;
        font-size: calc(16px + 2 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .sub-title p {
        font-size: 18px
    }
}

.sub-title p.bolder {
    line-height: 130%;
    letter-spacing: -0.005em;
    max-width: 560px;
    margin: auto;
    color: dimgray
}

.sub-title p.bolder {
    font-size: 16px
}

@media screen and (min-width: 375px) {
    .sub-title p.bolder {
        min-height: 0vh;
        font-size: calc(16px + 8 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .sub-title p.bolder {
        font-size: 24px
    }
}

.sub-title p.lead {
    line-height: 100%;
    letter-spacing: -0.015em;
    color: dimgray;
    margin-bottom: .25em
}

.sub-title p.lead {
    font-size: 18px
}

@media screen and (min-width: 375px) {
    .sub-title p.lead {
        min-height: 0vh;
        font-size: calc(18px + 14 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .sub-title p.lead {
        font-size: 32px
    }
}

.portrait-banner {
    min-height: 480px;
    position: relative;
    border-radius: 20px;
    overflow: hidden;
    width: 100%
}

@media screen and (min-width: 1025px) {
    .portrait-banner {
        min-height: 640px
    }
}

.portrait-banner.align-right {
    display: flex;
    align-items: center;
    justify-content: flex-end
}

.portrait-banner h3 {
    font-weight: 520;
    line-height: 100%;
    letter-spacing: -0.028em;
    margin-bottom: .75em;
    font-weight: 520
}

.portrait-banner h3 {
    font-size: 36px
}

@media screen and (min-width: 375px) {
    .portrait-banner h3 {
        min-height: 0vh;
        font-size: calc(36px + 18 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .portrait-banner h3 {
        font-size: 54px
    }
}

.portrait-banner p {
    line-height: 130%;
    letter-spacing: -0.01em;
    max-width: 360px
}

.portrait-banner p {
    font-size: 16px
}

@media screen and (min-width: 375px) {
    .portrait-banner p {
        min-height: 0vh;
        font-size: calc(16px + 2 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .portrait-banner p {
        font-size: 18px
    }
}

.portrait-banner .content {
    position: relative;
    z-index: 2;
    color: #fff;
    padding: 24px;
    padding-top: 61px
}

@media screen and (min-width: 1025px) {
    .portrait-banner .content {
        padding: 60px
    }
}

.portrait-banner p.lead {
    line-height: 100%;
    letter-spacing: -0.015em;
    color: dimgray;
    margin-bottom: .25em
}

.portrait-banner p.lead {
    font-size: 18px
}

@media screen and (min-width: 375px) {
    .portrait-banner p.lead {
        min-height: 0vh;
        font-size: calc(18px + 14 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .portrait-banner p.lead {
        font-size: 32px
    }
}

.portrait-banner picture {
    position: absolute;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    overflow: hidden;
    z-index: 1
}

.portrait-banner picture source,
.portrait-banner picture img {
    position: absolute;
    min-height: 100%;
    min-width: 100%;
    height: auto;
    width: auto;
    max-width: 100%;
    max-height: 100%;
    display: block;
    object-fit: cover;
    object-position: 50% 50%
}

.portrait-banner .modal {
    width: 40px;
    height: 40px;
    z-index: 5;
    position: absolute;
    bottom: 40px;
    right: 40px;
    background: #fff;
    border-radius: 100%;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center
}

.portrait-banner .modal:before {
    content: "+";
    font-size: 40px;
    line-height: 40px
}

.section-flow {
    background: #fff;
    padding-top: 80px;
    padding-bottom: 124px
}

.section-flow .heading {
    max-width: 760px;
    margin: auto;
    margin-bottom: 40px;
    text-align: center;
    padding: 24px
}

.section-flow .heading .lead {
    line-height: 110%;
    letter-spacing: -0.024em;
    color: dimgray
}

.section-flow .heading .lead {
    font-size: 28px
}

@media screen and (min-width: 375px) {
    .section-flow .heading .lead {
        min-height: 0vh;
        font-size: calc(28px + 11 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .section-flow .heading .lead {
        font-size: 39px
    }
}

.section-flow .heading h3 {
    font-weight: 520;
    line-height: 100%;
    letter-spacing: -0.04em;
    color: #000;
    margin-bottom: 19px
}

.section-flow .heading h3 {
    font-size: 28px
}

@media screen and (min-width: 375px) {
    .section-flow .heading h3 {
        min-height: 0vh;
        font-size: calc(28px + 28 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .section-flow .heading h3 {
        font-size: 56px
    }
}

.section-flow .heading .copy {
    font-weight: 400;
    font-size: 28px;
    line-height: 130%;
    letter-spacing: -0.015em;
    color: #4b4b4b
}

.section-flow .heading .copy {
    font-size: 16px
}

@media screen and (min-width: 375px) {
    .section-flow .heading .copy {
        min-height: 0vh;
        font-size: calc(16px + 12 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .section-flow .heading .copy {
        font-size: 28px
    }
}

.section-flow .badges {
    padding-bottom: 120px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center
}

.section-flow .badges img {
    width: 100%;
    max-width: 100%;
    height: auto
}

.section-flow .badges a {
    margin-left: 16px;
    margin-right: 16px;
    text-align: center;
    margin-bottom: 32px;
    width: 150px
}

@media only screen and (min-width: 767px) {
    .section-flow .badges a {
        width: 30%
    }
}

@media only screen and (min-width: 1024px) {
    .section-flow .badges a {
        width: 20%
    }
}

@media only screen and (min-width: 1200px) {
    .section-flow .badges a {
        width: auto
    }
}

.flow-cards {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    text-align: center;
    max-width: 1200px;
    margin: auto
}

@media only screen and (min-width: 801px) {
    .flow-cards {
        justify-content: space-between;
        flex-wrap: nowrap
    }
}

.flow-cards .card {
    width: 400px;
    padding-left: 20px;
    padding-right: 20px;
    margin-bottom: 48px
}

@media only screen and (min-width: 801px) {
    .flow-cards .card {
        width: 370px
    }
}

.flow-cards .icon {
    width: 118px;
    height: 118px;
    margin: auto;
    margin-bottom: 40px
}

.flow-cards h4 {
    font-weight: 520;
    line-height: 105%;
    letter-spacing: -0.04em;
    color: #161616;
    max-width: 220px;
    margin: auto;
    margin-bottom: 24px
}

.flow-cards h4 {
    font-size: 28px
}

@media screen and (min-width: 375px) {
    .flow-cards h4 {
        min-height: 0vh;
        font-size: calc(28px + 4 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .flow-cards h4 {
        font-size: 32px
    }
}

.flow-cards p {
    line-height: 130%;
    letter-spacing: -0.005em;
    color: #4b4b4b
}

.flow-cards p {
    font-size: 16px
}

@media screen and (min-width: 375px) {
    .flow-cards p {
        min-height: 0vh;
        font-size: calc(16px + 2 * ((100vw - 375px) / 1365))
    }
}

@media screen and (min-width: 1740px) {
    .flow-cards p {
        font-size: 18px
    }
}

.accordion-mount-block {
    margin-top: 80px;
    margin-bottom: 80px
}

.accordion-mount-block .trigger {
    font-size: calc(36px + 28*(100vw - 320px)/2560);
    line-height: 100%;
    letter-spacing: -0.02em;
    padding-bottom: 2vh;
    padding-top: 2vh;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #ddd;
    cursor: pointer
}

.accordion-mount-block .trigger.open {
    border-color: rgba(0, 0, 0, 0)
}

.accordion-mount-block .trigger.open span:last-of-type {
    transform: rotate(45deg)
}

.accordion-mount-block .trigger span:last-of-type {
    transition: all .4s
}

.accordion-mount-block .folder {
    display: none
}

.accordion-mount-block .folder.open {
    display: block
}

.accordion-mount-block .content {
    min-height: 50vh
}

.tech-spec-group {
    display: flex;
    padding-top: 4vh;
    padding-bottom: 4vh;
    border-bottom: 1px solid #e2e3e6
}

@media only screen and (max-width: 1025px) {
    .tech-spec-group {
        flex-wrap: wrap;
        padding-top: 2vh;
        padding-bottom: 2vh
    }
}

.tech-spec-group dt {
    width: 30%;
    font-size: calc(26px + 10*(100vw - 320px)/2560);
    font-weight: 520;
    line-height: 111%;
    letter-spacing: -0.02em
}

@media only screen and (max-width: 1025px) {
    .tech-spec-group dt {
        width: 100%;
        margin-bottom: 24px
    }
}

.tech-spec-group dd {
    font-size: 19px;
    line-height: 125%;
    color: #86868b;
    margin-bottom: 8px
}

.tech-spec-group div {
    width: 70%
}

@media only screen and (max-width: 1025px) {
    .tech-spec-group div {
        width: 100%
    }
}

.tech-spec-group div dt {
    font-size: 19px;
    line-height: 125%;
    margin-bottom: 8px;
    color: #000;
    font-weight: 400;
    margin-top: 32px
}

.tech-spec-group div dt:first-of-type {
    margin-top: 0px
}

.image-row.video-gallery-container {
    position: relative
}

.image-row.video-gallery-container img.video-thumbnail {
    display: block;
    width: 100%;
    max-width: 100%;
    height: auto;
    position: relative;
    z-index: 1
}

.image-row.video-gallery-container .trigger-mask {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    z-index: 2;
    transition: all 1s;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center
}

.image-row.video-gallery-container .trigger-mask svg {
    width: 100%;
    max-width: 64px;
    height: auto;
    background: rgba(0, 0, 0, 0);
    border-radius: 0px;
    transition: all .5s
}

.image-row.video-gallery-container .trigger-mask svg path:first-of-type {
    stroke: #a3a3a3;
    fill: rgba(0, 0, 0, .7)
}

.image-row.video-gallery-container .trigger-mask svg path:last-of-type {
    fill: #a3a3a3
}

.image-row.video-gallery-container .trigger-mask:hover {
    background: rgba(0, 0, 0, .5)
}

.image-row.video-gallery-container .trigger-mask:hover svg {
    width: 100%;
    max-width: 96px
}

.image-row.video-gallery-container .trigger-mask:hover svg path:first-of-type {
    stroke: #e51d34;
    fill: rgba(0, 0, 0, .4)
}

.image-row.video-gallery-container .trigger-mask:hover svg path:last-of-type {
    fill: #e51d34
}