.before-after-image{padding-top:var(--padding-top-mobile, 60px);padding-bottom:var(--padding-bottom-mobile, 60px)}@media(min-width:992px){.before-after-image{padding-top:var(--padding-top-desktop, 110px);padding-bottom:var(--padding-bottom-desktop, 110px)}}.before-after-image .before-after-image__container{position:relative;overflow:hidden;display:flex;min-height:596px;border-radius:calc(var(--border-radius-section-images, 100px) / 2)}@media(min-width:992px){.before-after-image .before-after-image__container{min-height:740px;border-radius:calc(var(--border-radius-section-images, 100px))}}.before-after-image .before-after-image__resize{position:absolute;top:0;left:0;overflow:hidden;width:50%;height:50%;background-color:var(--primary-background, #ffffff)}@media(min-width:992px){.before-after-image .before-after-image__resize{height:100%}}.before-after-image .before-after-image__image{position:absolute;object-fit:cover;max-width:initial;width:100%;height:100%;border-radius:calc(var(--border-radius-section-images, 100px) / 2 + 1px)}@media(min-width:992px){.before-after-image .before-after-image__image{border-radius:calc(var(--border-radius-section-images, 100px) + 1px)}}@media(min-width:992px){.before-after-image .before-after-image__image:not(.before-after-image__image--cover){width:100%}}.before-after-image .before-after-image__image.before-after-image__image--cover{z-index:1}@media(min-width:992px){.before-after-image .before-after-image__image.before-after-image__image--cover{min-width:100%}}.before-after-image .before-after-image__thumb{position:absolute;z-index:5;top:0;left:0;display:flex;align-items:center;width:100%;height:100%;overflow:hidden}.before-after-image .before-after-image__range{width:100%;height:100%;cursor:pointer;opacity:0;background-color:transparent;-webkit-appearance:none;transform:scaleY(-1);display:none;writing-mode:vertical-lr;direction:rtl}@media(min-width:992px){.before-after-image .before-after-image__range{transform:scaleY(1);display:block;writing-mode:horizontal-tb;direction:ltr}}.before-after-image .before-after-image__button{position:absolute;top:50%;left:50%;display:flex;align-items:center;justify-content:center;width:100%;height:48px;transform:translate(-50%,-50%);pointer-events:none;background-color:transparent}@media(min-width:992px){.before-after-image .before-after-image__button{width:48px;height:100%}}.before-after-image .before-after-image__button:before{position:absolute;top:50%;left:50%;width:48px;height:48px;content:"";transform:translate(-50%,-50%);border-radius:50%;background-color:var(--primary-background, #ffffff);z-index:1;border:1px solid var(--primary-color, #000000)}.before-after-image .before-after-image__button:after{position:absolute;content:"";background-color:var(--primary-color, #000000);top:50%;left:0;width:100%;height:3px;transform:translateY(-50%)}@media(min-width:992px){.before-after-image .before-after-image__button:after{top:0;left:50%;width:3px;height:100%;transform:translate(-50%)}}.before-after-image .before-after-image__range:focus-visible~.before-after-image__button:before{outline:-webkit-focus-ring-color auto 1px}.before-after-image .before-after-image__button-arrows{position:relative;display:inline-flex;align-items:center;justify-content:center;z-index:2;rotate:90deg}@media(min-width:992px){.before-after-image .before-after-image__button-arrows{rotate:0deg}}.before-after-image .before-after-image__button-arrow{display:flex;width:24px;height:24px}.before-after-image .before-after-image__button-arrow.before-after-image__button-arrow--left svg{rotate:90deg}.before-after-image .before-after-image__button-arrow svg{width:100%;height:100%;rotate:-90deg}.before-after-image .before-after-image__button-arrow svg path{stroke:var(--primary-color, #000000)}.before-after-image .before-after-image__label{position:absolute;padding:4px 10px;z-index:5;text-transform:uppercase;border-width:1px;border-style:solid;transition-property:background-color,color,border-color;transition-duration:.3s;transition-timing-function:ease;line-height:1.5;border-radius:calc(var(--border-radius-buttons, 30px) * .3)}@media(-moz-touch-enabled:0),(hover:hover){.before-after-image .before-after-image__label:hover{cursor:pointer}}.before-after-image .before-after-image__label:not(.before-after-image__label--second){top:calc(10px + var(--border-radius-section-images, 100px) * .3);left:calc(10px + var(--border-radius-section-images, 100px) * .3);background-color:var(--button-primary-background);color:var(--button-primary-text);border-color:transparent}@media(min-width:992px){.before-after-image .before-after-image__label:not(.before-after-image__label--second){bottom:calc(20px + var(--border-radius-section-images, 100px) * .3);left:calc(20px + var(--border-radius-section-images, 100px) * .3);top:initial}}@media(-moz-touch-enabled:0),(hover:hover){.before-after-image .before-after-image__label:not(.before-after-image__label--second):hover{background-color:var(--button-primary-text);color:var(--button-primary-background);border-color:var(--button-primary-background)}}.before-after-image .before-after-image__label.before-after-image__label--second{bottom:calc(10px + var(--border-radius-section-images, 100px) * .3);right:calc(10px + var(--border-radius-section-images, 100px) * .3);background-color:var(--button-primary-text);color:var(--button-primary-background);border-color:var(--button-primary-background)}@media(min-width:992px){.before-after-image .before-after-image__label.before-after-image__label--second{bottom:calc(20px + var(--border-radius-section-images, 100px) * .3);right:calc(20px + var(--border-radius-section-images, 100px) * .3)}}@media(-moz-touch-enabled:0),(hover:hover){.before-after-image .before-after-image__label.before-after-image__label--second:hover{background-color:var(--button-primary-background);color:var(--button-primary-text);border-color:transparent}}.before-after-image .transition{transition-property:top,transform,height;transition-duration:.3s;transition-timing-function:ease}@media(min-width:992px){.before-after-image .transition{transition-property:left,transform,width}}
/*# sourceMappingURL=/cdn/shop/t/27/assets/before-after-image.css.map */
