.before-after-image--container{display:block;position:relative;overflow:visible;border:none!important;margin-bottom:10px}.before-after-image{border:none!important}.before-after-image .section-header h2{font-size:2rem;font-weight:700}@media only screen and (min-width: 768px){.before-after-image .section-header h2{font-size:2.5rem}}.before-after-image .row,.before-after-image--media,.before-after-image--image,.before-after-image--image img{border:none!important}.before-after-image--media{display:block;position:relative;overflow:hidden}.before-after-image--media:after{content:"";display:block;position:absolute;top:0;left:0;width:100%;height:100%;z-index:1;pointer-events:none;background:rgba(var(--color-overlay-rgb),var(--overlay-opacity))}.before-after-image--image .thb-placeholder,.before-after-image--image img{position:absolute;top:0;left:0;width:100%;height:100%}.before-after-image--image .thb-placeholder svg,.before-after-image--image img svg{object-fit:contain}.before-after-image--image img{object-fit:cover}@media only screen and (max-width: 767px){.before-after-image--image.mobile-height-image{aspect-ratio:var(--image-aspect);min-height:unset}.before-after-image--image.mobile-height-square{aspect-ratio:1 / 1;min-height:unset}}@media only screen and (min-width: 768px){.before-after-image--image.desktop-height-image{aspect-ratio:var(--image-aspect);min-height:unset}.before-after-image--image.desktop-height-square{aspect-ratio:1 / 1;min-height:unset}}.before-after-image--2{clip-path:inset(0px 0px 0px var(--percent));position:absolute;z-index:3;top:0;left:0;width:100%;height:100%;overflow:hidden}.before-after-image--2 .before-after-image--content{justify-content:flex-end}.before-after-image--content{position:absolute;z-index:2;top:0;left:0;width:100%;height:100%;display:flex;padding:15px}@media only screen and (min-width: 768px){.before-after-image--content{padding:30px}}@media only screen and (min-width: 1068px){.before-after-image--content{padding:45px}}.before-after-image--content-center{align-items:center}.before-after-image--content-bottom{align-items:flex-end}.before-after-image--content h4{color:var(--color-body, #151515);border-bottom:1px solid var(--color-body, #151515);padding-bottom:8px;margin-bottom:0}.before-after-image--slider{position:absolute;top:50%;width:100%;left:0;z-index:1000;transform:translateY(-50%);opacity:0;height:54px;cursor:pointer;pointer-events:auto}.before-after-image--divider{position:absolute;top:0;bottom:0;z-index:10;width:2px;left:calc(var(--percent) - 1px);background:var(--color-line, --bg-body);box-shadow:none;overflow:visible}.before-after-image--divider svg{display:none!important}.before-after-image--pill{position:absolute!important;top:50%!important;left:calc(var(--percent) - 1px)!important;transform:translate(-50%,-50%)!important;z-index:999!important;display:flex!important;flex-direction:row!important;flex-wrap:nowrap!important;align-items:center!important;justify-content:center!important;gap:10px!important;padding:10px 18px!important;background:#00000080!important;backdrop-filter:blur(20px)!important;-webkit-backdrop-filter:blur(20px)!important;border-radius:50px!important;box-shadow:none!important;cursor:pointer!important;min-width:70px!important;width:auto!important;height:auto!important;min-height:auto!important;max-height:none!important;transition:all .2s ease;border:.5px solid rgba(255,255,255,.3)!important;white-space:nowrap!important;visibility:visible!important;opacity:1!important;overflow:visible!important;pointer-events:auto!important}.before-after-image--pill:hover{background:#000000a6!important;box-shadow:none!important}.before-after-image--arrow{color:#fffaf5!important;font-size:18px!important;font-weight:600!important;line-height:1!important;display:inline-block!important;text-shadow:0px 1px 3px rgba(0,0,0,.2)!important;-webkit-user-select:none!important;user-select:none!important;pointer-events:none!important;visibility:visible!important;opacity:1!important;transform:rotate(0)!important;white-space:nowrap!important}.before-after-image--mobile{display:block}@media only screen and (min-width: 768px){.before-after-image--mobile{display:none}}.before-after-image--desktop{display:none}@media only screen and (min-width: 768px){.before-after-image--desktop{display:block}}
/*# sourceMappingURL=/cdn/shop/t/32/assets/before-after-image.css.map */