.media{aspect-ratio:inherit;height:100%;position:relative;width:100%}.media--shadow{box-shadow:0 0 20px var(--color-grey-medium)}.media--rounded .media__image,.media--rounded .media__video{border-radius:.8rem}.media--square,.media--landscape,.media--portrait{height:auto}.media--square{aspect-ratio:1/1}.media--landscape{aspect-ratio:376/220}.media--portrait{aspect-ratio:9/16}.media__container,.media__video,.media__image{aspect-ratio:inherit;display:block;height:100%;width:100%}.media__video,.media__image{object-fit:cover}.media__video img{height:100%;width:100%}.media__controls{align-items:center;bottom:0;display:flex;gap:1.2rem;justify-content:flex-end;padding:1.6rem;position:absolute;right:0;z-index:2}.media__icons{height:1.6rem;position:relative;width:1.8rem}.media__icons .icon{left:0;opacity:0;position:absolute;top:0;transition:opacity var(--duration-default) ease-in-out}.media__icons .icon--progress{left:unset;right:0;transform:rotate(-90deg)}.media__icons .icon--progress .circle{transition:all var(--duration-default) ease}.hidden{display:none}.media__icons-center--active{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display:flex;align-items:center;justify-content:center;opacity:1;width:7.5rem;height:7.5rem;border-radius:50%;background-color:#ffffff80;transition:scale var(--duration-short) ease,color var(--duration-short) ease;pointer-events:all;cursor:pointer;z-index:1}.media__icons-center--active .icon path{stroke:none;fill:var(--color-text)}.media__icons .icon--progress,.media__icons:not(.media__icons--active) .icon--unmute,.media__icons:not(.media__icons--active) .icon--play,.media__icons--active .icon--mute,.media__icons--active .icon--pause{opacity:1}@media screen and (max-width: 749px){.media--square-mobile,.media--landscape-mobile,.media--portrait-mobile{height:auto}.media--square-mobile{aspect-ratio:1/1}.media--landscape-mobile{aspect-ratio:376/220}.media--portrait-mobile{aspect-ratio:9/16}.media__video--mobile~.media__video,.media__image--mobile~.media__container{display:none}}@media screen and (max-width: 989px){.media__icons .icon{height:1.6rem;width:1.8rem}}@media screen and (min-width: 750px){.media__video--mobile,.media__image--mobile{display:none}}@media screen and (min-width: 990px){.media__controls{gap:1.6rem;padding:3.2rem}.media__icons{height:2.2rem;width:2.6rem}}
/*# sourceMappingURL=/cdn/shop/t/44/assets/media.css.map */