.it-text-media > [class*=it-container] {
display: grid;
align-items: start;
row-gap: var(--it-spacing-content);
}
.it-text-media__image {
max-height: 30rem;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
border-radius: var(--it-border-radius-small);
}
.it-text-media__media {
position: relative;
border-radius: var(--it-border-radius-small);
overflow: hidden;
}
.it-text-media__video {
display: block;
width: 100%;
max-height: 30rem;
-o-object-fit: cover;
object-fit: cover;
background-color: var(--it-color-black);
}
.it-text-media__play {
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: clamp(3rem, calc(3rem + (1vw - 6.4px) * 1.5), 3.75rem);
height: clamp(3rem, calc(3rem + (1vw - 6.4px) * 1.5), 3.75rem);
border: none;
border-radius: 50%;
background-color: var(--it-color-white);
cursor: pointer;
transition: transform var(--it-transition);
}
.it-text-media__play:after {
content: "";
position: absolute;
top: 50%;
left: 53%;
transform: translate(-50%, -50%);
width: 0;
height: 0;
border-style: solid;
border-width: 0.5625rem 0 0.5625rem 0.9375rem;
border-color: transparent transparent transparent var(--it-color-brand);
}
.it-text-media__play:hover {
transform: translate(-50%, -50%) scale(1.08);
}
.it-text-media__play.is-hidden {
display: none;
}
.editor > .it-text-media__counters {
margin-top: clamp(1.5rem, calc(1.5rem + (1vw - 6.4px) * 2), 2.5rem);
}
.it-text-media__counters {
list-style: none;
margin: 0;
padding: 0;
display: flex;
flex-direction: column;
gap: clamp(1rem, calc(1rem + (1vw - 6.4px) * 1), 1.5rem);
}
.it-text-media__counter {
font-size: var(--it-h3-font-size);
line-height: 1.2;
color: var(--it-color-brand);
}
.it-text-media.has-bg-dark .it-text-media__counter {
color: inherit;
}
.it-text-media--no-media .editor {
font-size: var(--it-size-large);
}
.it-text-media--no-media .it-title-group + .editor {
margin-top: 1rem;
}
.it-text-media--no-media .editor > * + * {
margin-top: 1.5rem;
}
@media (min-width: 1024px) {
.it-text-media--default .it-text-media__image,
.it-text-media--default .it-text-media__media {
order: 1;
}
.it-text-media--reversed .it-text-media__image,
.it-text-media--reversed .it-text-media__media {
order: -1;
}
.it-text-media > [class*=it-container] {
grid-template-columns: 1fr 1fr;
-moz-column-gap: 6.25rem;
column-gap: 6.25rem;
}
.it-text-media--no-media > [class*=it-container] {
grid-template-columns: 1fr;
}
}