.banner__content{transform:translate(-50%,-50%);position:absolute;top:50%;left:50%;text-align:center;width:100%}.banner{position:relative}.banner img{width:100%;height:100%;object-fit:cover}.banner--height-small{height:200px}.banner--height-medium{height:250px}.banner--height-large{height:420px}.banner--height-exlarge{height:560px}.banner-title{font-family:Roboto,sans-serif;font-style:normal;font-weight:900;font-size:60px;line-height:120%;text-align:center;text-transform:uppercase;color:rgba(var(--color-heading));margin-bottom:24px}.play-button{background-color:rgba(var(--color-secondary-button));color:rgba(var(--color-secondary-button-text));padding:22px 30px;gap:30px;display:inline-flex;align-items:center;border-radius:4px;transition:.3s ease}.play-button svg{transition:.3s ease}.play-button:hover,.play-button:focus{background-color:rgba(var(--color-secondary-button-hover),.8);color:rgba(var(--color-secondary-button-hover-text))}.play-button:hover svg{transform:rotate(120deg);transition:.3s ease}.play-button>span{text-align:left;font-family:Roboto;font-style:normal;font-weight:500;font-size:16px;line-height:22px;letter-spacing:2px;text-transform:uppercase}.banner:before{content:"";position:absolute;left:0;top:0;width:100%;height:100%}[data-opacity="1"]:before{background-color:#0000001a}[data-opacity="2"]:before{background-color:#0003}[data-opacity="3"]:before{background-color:#0000004d}[data-opacity="4"]:before{background-color:#0006}[data-opacity="5"]:before{background-color:#00000080}[data-opacity="6"]:before{background-color:#0009}[data-opacity="7"]:before{background-color:#000000b3}[data-opacity="8"]:before{background-color:#000c}[data-opacity="9"]:before{background-color:#000000e6}[data-opacity="10"]:before{background-color:#000}@media screen and (min-width: 768px){.banner--height-small{height:450px}.banner--height-medium{height:600px}.banner--height-large{height:720px}.banner--height-exlarge{height:860px}}@media screen and (max-width: 1280px){.banner-title{font-size:56px}}@media screen and (max-width: 991px){.banner-title{font-size:32px}.play-button{padding:8px;gap:8px}.play-button>span{font-size:16px}}@media screen and (max-width: 768px){.banner-title{font-size:24px}.play-button{padding:8px;gap:8px}.play-button>span{font-size:12px}.banner__content{width:75%}}
/*# sourceMappingURL=/cdn/shop/t/22/assets/section-banner.css.map */