.modula-mov-object > .modula-fancybox-content {
height: auto !important;
width: auto !important;
}
html body .modula-fancybox-container video {
visibility: visible;
}
html body .modula .modula-items .modula-item .modula-video-content {
opacity: 1;
}
html body .modula .modula-items .modula-video-content youtube-video iframe,
html body .modula .modula-items .modula-video-content vimeo-video iframe {
width: 100%;
height: 100%;
}
html body .modula .modula-items .modula-video-content video,
html body .modula .modula-items .modula-video-content youtube-video,
html body .modula .modula-items .modula-video-content vimeo-video {
margin: 0 !important;
display: block;
background-color: #000;
}
html body .modula .modula-items .modula-video-content a {
z-index: 9;
cursor: pointer;
}
html body .modula .modula-items .modula-item.modula-video-content .jtg-social {
z-index: 12;
}
html body .modula .modula-items .modula-video-content {
width: 100%;
}
html body .modula .modula-items .modula-video-content picture.pic,
html body .modula .modula-items .modula-video-content img.pic {
opacity: 0;
z-index: 9;
}
html
body
.modula
.modula-items
.modula-video-content
.modula_video_preview_element {
position: absolute;
left: 0;
top: 0;
height: 100%;
width: 100%;
z-index: 8;
pointer-events: none;
cursor: pointer;
}
html body .modula .modula-items .modula-video-content:hover picture.pic,
html body .modula .modula-items .modula-video-content:hover img.pic {
opacity: 0;
z-index: 8;
}
html
body
.modula
.modula-items
.modula-video-content:hover
.modula_video_preview_element {
z-index: 9;
}
html
body
.modula
.modula-items
.modula-video-content
video.modula_video_preview_element {
max-width: 100%;
max-height: 100%;
object-fit: cover;
}
html body .modula .modula-items .modula-item .modula-video-icon {
pointer-events: none;
z-index: 11;
}
html body .modula .modula-items .modula-video-content:hover .modula-video-icon {
z-index: 8;
}
html body .modula .modula-items .modula-hosted-video-content:hover .figc {
z-index: 99;
pointer-events: none;
}
html
body
.modula
.modula-items
.modula-hosted-video-content:hover
.figc
.jtg-social,
html
body
.modula
.modula-items
.modula-hosted-video-content:hover
.figc
.jtg-social
a {
pointer-events: all;
}
body
.modula-gallery.modula-columns
.modula-items
.modula-video-content.modula-item
.modula-item-content
picture.pic
img,
body
.modula-gallery.modula-columns
.modula-items
.modula-video-content.modula-item
.modula-item-content
picture.pic,
body
.modula-gallery.modula-columns
.modula-items
.modula-video-content.modula-item
.modula-item-content
img.pic {
max-width: 100%;
}
html
body
.modula.modula-creative-gallery
.modula-items
.modula-item
.modula-item-content
picture.pic
img,
html
body
.modula.modula-custom-grid
.modula-items
.modula-item
.modula-item-content
picture.pic
img {
width: 100%;
} body
.modula-gallery.modula-columns
.modula-items
.modula-video-content.effect-under
.modula-item-content {
z-index: 11;
} html body .modula-slider .modula-items .modula-item .modula-video-content {
opacity: 1;
}
html
body
.modula-slider
.modula-items
.modula-video-content
youtube-video
iframe,
html
body
.modula-slider
.modula-items
.modula-video-content
vimeo-video
iframe {
width: 100%;
height: 100%;
}
html body .modula-slider .modula-items .modula-video-content video,
html body .modula-slider .modula-items .modula-video-content youtube-video,
html body .modula-slider .modula-items .modula-video-content vimeo-video {
margin: 0 !important;
display: block;
background-color: #000;
}
html body .modula-slider .modula-items .modula-video-content a {
z-index: 10;
cursor: pointer;
}
html
body
.modula-slider
.modula-items
.modula-item.modula-video-content
.jtg-social {
z-index: 12;
}
html body .modula-slider .modula-items .modula-video-content {
width: 100%;
}
html body .modula-slider .modula-items .modula-video-content picture.pic,
html body .modula-slider .modula-items .modula-video-content img.pic {
position: relative;
width: 100%;
opacity: 1;
z-index: 9;
}
html
body
.modula-slider
.modula-items
.modula-video-content
.modula_video_preview_element {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
z-index: 8;
pointer-events: none;
cursor: pointer;
}
html body .modula-slider .modula-items .modula-video-content:hover picture.pic,
html body .modula-slider .modula-items .modula-video-content:hover img.pic {
opacity: 0;
z-index: 8;
}
html
body
.modula-slider
.modula-items
.modula-video-content:hover
.modula_video_preview_element {
z-index: 9;
}
html
body
.modula-slider
.modula-items
.modula-video-content
video.modula_video_preview_element {
max-width: 100%;
max-height: 100%;
object-fit: cover;
}
html body .modula-slider .modula-items .modula-item .modula-video-icon {
pointer-events: none;
z-index: 11;
}
html
body
.modula-slider
.modula-items
.modula-video-content:hover
.modula-video-icon {
z-index: 8;
}
html
body
.modula-slider
.modula-items
.modula-hosted-video-content:hover
.figc {
z-index: 99;
}
html
body
.modula-slider
.modula-slider-nav
.modula-slider-nav-item
.modula-video-icon
img {
max-width: 100%;
}
html body .modula .modula-items .modula-item img.modula_video_poster,
html body .modula .modula-items .modula-item picture.modula_video_poster img {
inset: unset !important;
width: unset !important;
object-fit: cover;
display: block;
pointer-events: none;
cursor: pointer;
}
html body .modula .modula-items .modula-item picture.modula_video_poster img {
display: block;
pointer-events: none;
cursor: pointer;
} .modula-video-player-wrap {
position: relative;
}
.modula-video-player-wrap.playlist_right {
display: flex;
flex-direction: row;
gap: 10px;
}
.modula-video-player-wrap.playlist_right .modula-video-main-item {
width: 80%;
position: relative;
}
.modula-video-player-wrap.playlist_right .modula-video-items-wrap {
width: 20%;
position: relative;
overflow: hidden;
}
.modula-video-player-wrap.playlist_bottom .modula-video-main-item,
.modula-video-player-wrap.playlist_bottom .modula-video-items-wrap {
width: 100%;
position: relative;
}
.modula-video-player-wrap.playlist_right .modula-video-items {
display: flex;
flex-direction: column;
gap: 10px;
position: absolute;
right: 0;
left: 0;
height: 100%;
overflow-y: scroll;
padding-right: 10px;
padding-bottom: 10px;
}
.modula-video-player-wrap.playlist_bottom .modula-video-items {
display: flex;
flex-direction: row;
column-gap: 10px;
width: 100%;
overflow-x: scroll;
}
.modula-video-player-wrap.playlist_bottom .modula-video-item {
flex: 0 0 calc(20% - 8px);
box-sizing: border-box;
margin-bottom: 10px;
}
.modula-video-player-wrap.playlist_bottom .modula-video-items-wrap {
margin-top: 10px;
}
.modula-video-player-wrap.playlist_bottom
.modula-video-item
picture.pic
.modula-video-player-wrap.playlist_bottom
.modula-video-item
img.pic {
display: block;
}
.modula-video-items .modula-item-content {
background-color: #fff;
position: relative;
}
html
body
.modula
.modula-video-items
.modula-video-content
youtube-video.modula_video_preview_element
iframe,
html
body
.modula
.modula-video-items
.modula-video-content
vimeo-video.modula_video_preview_element
iframe,
html
body
.modula
.modula-video-items
.modula-video-content
video.modula_video_preview_element {
width: 100%;
height: 100%;
}
.modula-video-items .modula_video_preview_element {
position: absolute;
left: 0;
right: 0;
top: 0;
width: 100%;
bottom: 0;
z-index: 5;
}
.modula-video-items .modula-item-content:hover .modula_video_preview_element {
z-index: 15;
}
html
body
.modula
.modula-video-items
.modula-video-content
.modula-item-content:hover
picture.pic,
html
body
.modula
.modula-video-items
.modula-video-content
.modula-item-content:hover
img.pic {
opacity: 0;
z-index: 8;
}
html
body
.modula
.modula-video-items
:not(.modula-video-content)
.modula-item-content:hover
picture.pic,
html
body
.modula
.modula-video-items
:not(.modula-video-content)
.modula-item-content:hover
img.pic {
opacity: 0.8;
}
.modula-video-items .modula_video_poster {
z-index: 10;
position: relative;
object-fit: cover;
width: 100%;
max-width: 100vw;
aspect-ratio: 16 / 9;
}
.modula-video-items .modula-video-icon {
z-index: 10;
}
.modula-video-main-item #modula-video-player,
.modula-video-main-item #modula-video-player iframe {
width: 100%;
height: 100%;
}
.modula-video-list-overlay {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
cursor: pointer;
z-index: 20;
}
html
body
.modula
.modula-video-main-item
.modula-video-main-item-content
img.modula_video_preview_image,
html
body
.modula
.modula-video-main-item
.modula-video-main-item-content
picture.modula_video_preview_image
img {
position: absolute;
width: 100%;
height: 100%;
object-fit: cover;
z-index: 15;
cursor: pointer;
}
html body .modula .modula-video-items-wrap .modula-video-items picture.pic {
width: 100%;
display: block;
}
html body .modula .modula-video-items-wrap .modula-video-items picture.pic img {
height: auto;
max-width: 100%;
display: block;
height: auto;
max-width: 100%;
display: block;
aspect-ratio: 16 / 9;
object-fit: cover;
}
html
body
.modula
.modula-video-items-wrap
.modula-video-items
picture.pic
source {
height: 0;
display: block;
}
html
body
.modula
.modula-video-main-item
.modula-video-main-item-content
.modula-video-icon {
z-index: 16;
cursor: pointer;
} html body .modula .modula-video-items::-webkit-scrollbar {
width: 12px; }
html body .modula .modula-video-items::-webkit-scrollbar-track {
background: #000; }
html body .modula .modula-video-items::-webkit-scrollbar-thumb {
background: #000; border: 2px solid rgba(255, 255, 255, 0.5); border-radius: 10px; } html body .modula .modula-video-items {
scrollbar-width: thin; scrollbar-color: #000 rgba(255, 255, 255, 0.5); } html body .modula .modula-video-items::-ms-scrollbar {
width: 12px; }
.modula-video-items::-ms-scrollbar-track {
background: #000; }
html body .modula .modula-video-items::-ms-scrollbar-thumb {
background: #000; border: 2px solid rgba(255, 255, 255, 0.5); border-radius: 10px; } html body .modula .modula-video-items {
scrollbar-color: #000 rgba(255, 255, 255, 0.5);
scrollbar-width: thin;
} html body .modula-slider .modula-items .modula_video_slider_positioner {
position: relative;
margin: 0 15px;
}
html
body
.modula-slider
.modula-items
.modula-video-slider-item
.slider-image-info {
margin: 0 15px;
}
html
body
.modula-slider
.modula-items
.modula-video-content.autoplay
.modula_video_slider_positioner
picture.pic
html
body
.modula-slider
.modula-items
.modula-video-content.autoplay
.modula_video_slider_positioner
img.pic {
opacity: 0 !important;
}
html
body
.modula-slider
.modula-items
.modula-video-slider-item
.modula_video_slider_overlay {
position: absolute;
width: 100%;
height: 100%;
z-index: 99;
}.tribuna-lineup {
--tl-grass-a: #2c7a44;
--tl-grass-b: #266b3c;
--tl-line: rgba(255, 255, 255, 0.6);
--tl-frame: #101a14;
--tl-frame-2: #16241b;
--tl-ink: #eef4ee;
--tl-muted: #9db3a3;
--tl-gold: #e8c35a;
--tl-red: #e0483e;
--tl-yellow: #f2ce3a;
--tl-green-on: #5fd882;
--tl-font: "Oswald", "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
max-width: 560px;
margin: 1.75em auto;
border-radius: 16px;
overflow: hidden;
background: linear-gradient(180deg, var(--tl-frame-2), var(--tl-frame));
box-shadow: 0 18px 40px -18px rgba(4, 12, 7, 0.55), 0 0 0 1px rgba(255, 255, 255, 0.06);
font-family: var(--tl-font);
color: var(--tl-ink);
line-height: 1.25;
container-type: inline-size;
}
.tribuna-lineup * {
box-sizing: border-box;
margin: 0;
padding: 0;
}
.tribuna-lineup img {
border: 0;
max-width: 100%;
} .tl-loading,
.tl-empty {
padding: 34px 18px;
text-align: center;
font-size: 15px;
letter-spacing: 0.06em;
text-transform: uppercase;
color: var(--tl-muted);
} .tl-head {
display: grid;
grid-template-columns: 1fr auto 1fr;
align-items: center;
gap: 10px;
padding: 14px 16px 12px;
background:
radial-gradient(140% 160% at 50% -40%, rgba(94, 175, 118, 0.28), transparent 60%),
linear-gradient(180deg, #182a1e, #121f17);
border-bottom: 1px solid rgba(255, 255, 255, 0.07);
}
.tl-team {
display: flex;
flex-direction: column;
align-items: center;
gap: 6px;
text-align: center;
min-width: 0;
}
.tl-team-logo {
width: 44px;
height: 44px;
object-fit: contain;
filter: drop-shadow(0 4px 8px rgba(0, 0, 0, 0.45));
}
.tl-team-name {
font-size: 15px;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.05em;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
max-width: 100%;
}
.tl-team-formation {
font-size: 12px;
font-weight: 500;
letter-spacing: 0.22em;
color: var(--tl-gold);
}
.tl-mid {
display: flex;
flex-direction: column;
align-items: center;
gap: 2px;
padding: 0 6px;
}
.tl-score {
font-size: 30px;
font-weight: 600;
letter-spacing: 0.04em;
font-variant-numeric: tabular-nums;
white-space: nowrap;
}
.tl-score-sep {
color: var(--tl-muted);
padding: 0 2px;
}
.tl-state {
font-size: 11px;
font-weight: 500;
text-transform: uppercase;
letter-spacing: 0.18em;
color: var(--tl-muted);
}
.tl-state--live {
color: var(--tl-green-on);
} .tl-pitch {
position: relative;
aspect-ratio: 100 / 130;
margin: 12px;
border-radius: 10px;
overflow: hidden;
box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08), inset 0 14px 34px rgba(0, 0, 0, 0.32);
}
.tl-pitch svg {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
display: block;
}
.tl-pitch::after {
content: "";
position: absolute;
inset: 0;
pointer-events: none;
background:
radial-gradient(130% 55% at 50% 0%, rgba(255, 255, 255, 0.08), transparent 55%),
radial-gradient(160% 80% at 50% 115%, rgba(0, 0, 0, 0.34), transparent 55%);
} .tl-player {
position: absolute;
transform: translate(-50%, -50%);
display: flex;
flex-direction: column;
align-items: center;
gap: 3px;
z-index: 2;
width: 21%;
}
.tl-avatar {
position: relative;
width: 46px;
height: 46px;
}
@supports (width: 1cqw) {
.tl-avatar {
width: clamp(36px, 10.5cqw, 52px);
height: clamp(36px, 10.5cqw, 52px);
}
}
.tl-avatar-img,
.tl-avatar-fallback {
width: 100%;
height: 100%;
border-radius: 50%;
background: #dfe7df;
object-fit: cover;
object-position: top center;
box-shadow: 0 3px 8px rgba(0, 0, 0, 0.45), 0 0 0 2px rgba(255, 255, 255, 0.85);
}
.tl-avatar--captain .tl-avatar-img,
.tl-avatar--captain .tl-avatar-fallback {
box-shadow: 0 3px 8px rgba(0, 0, 0, 0.45), 0 0 0 2px var(--tl-gold);
}
.tl-avatar-fallback {
display: flex;
align-items: center;
justify-content: center;
font-size: 15px;
font-weight: 600;
color: #45584a;
letter-spacing: 0.03em;
}
.tl-num {
position: absolute;
right: -4px;
bottom: -3px;
min-width: 18px;
height: 18px;
padding: 0 4px;
border-radius: 9px;
background: #0d150f;
color: #fff;
font-size: 11px;
font-weight: 600;
line-height: 18px;
text-align: center;
font-variant-numeric: tabular-nums;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
}
.tl-cap {
position: absolute;
left: -4px;
top: -3px;
width: 16px;
height: 16px;
border-radius: 50%;
background: var(--tl-gold);
color: #21200f;
font-size: 10px;
font-weight: 600;
line-height: 16px;
text-align: center;
}
.tl-goal {
position: absolute;
right: -6px;
top: -5px;
height: 17px;
min-width: 17px;
padding: 0 3px;
border-radius: 9px;
background: #fff;
color: #111;
font-size: 11px;
line-height: 17px;
text-align: center;
box-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
}
.tl-goal--og {
background: var(--tl-red);
color: #fff;
font-size: 9px;
font-weight: 600;
letter-spacing: 0.02em;
}
.tl-card {
position: absolute;
left: -3px;
bottom: 0;
width: 9px;
height: 13px;
border-radius: 2px;
transform: rotate(-8deg);
box-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
}
.tl-card--y { background: var(--tl-yellow); }
.tl-card--r { background: var(--tl-red); }
.tl-card--yr {
background: linear-gradient(135deg, var(--tl-yellow) 45%, var(--tl-red) 55%);
}
.tl-pname {
max-width: 100%;
padding: 2px 7px;
border-radius: 8px;
background: rgba(8, 18, 11, 0.72);
font-size: 11px;
font-weight: 500;
letter-spacing: 0.04em;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
color: #f2f7f2;
}
@supports (width: 1cqw) {
.tl-pname { font-size: clamp(9px, 2.5cqw, 12px); }
.tl-num { font-size: clamp(10px, 2.4cqw, 12px); }
}
.tl-off {
color: var(--tl-red);
font-weight: 600;
} .tl-bench {
padding: 4px 14px 16px;
}
.tl-bench-title {
padding: 10px 2px 8px;
font-size: 12px;
font-weight: 600;
text-transform: uppercase;
letter-spacing: 0.24em;
color: var(--tl-muted);
text-align: center;
}
.tl-bench-cols {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 0 14px;
}
.tl-bench-row {
display: flex;
align-items: center;
gap: 8px;
padding: 4px 2px;
border-bottom: 1px solid rgba(255, 255, 255, 0.05);
min-width: 0;
}
.tl-bench-row:last-child {
border-bottom: 0;
}
.tl-bench-img,
.tl-bench-fallback {
flex: 0 0 26px;
width: 26px;
height: 26px;
border-radius: 50%;
background: #dfe7df;
object-fit: cover;
object-position: top center;
}
.tl-bench-fallback {
display: inline-flex;
align-items: center;
justify-content: center;
font-size: 10px;
font-weight: 600;
color: #45584a;
}
.tl-bench-num {
flex: 0 0 20px;
font-size: 12px;
font-weight: 600;
color: var(--tl-muted);
text-align: right;
font-variant-numeric: tabular-nums;
}
.tl-bench-name {
font-size: 13px;
font-weight: 500;
letter-spacing: 0.03em;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
min-width: 0;
}
.tl-bench-goal {
margin-left: auto;
font-size: 11px;
white-space: nowrap;
}
.tl-bench-goal + .tl-bench-in,
.tl-bench-goal + .tl-bench-pos {
margin-left: 6px;
}
.tl-bench-in {
margin-left: auto;
font-size: 11px;
font-weight: 600;
color: var(--tl-green-on);
white-space: nowrap;
}
.tl-bench-pos {
margin-left: auto;
font-size: 10px;
letter-spacing: 0.08em;
color: var(--tl-muted);
}
.tl-bench-in + .tl-bench-pos {
margin-left: 6px;
}
.tl-coach-label {
flex: 0 0 auto;
font-size: 10px;
text-transform: uppercase;
letter-spacing: 0.14em;
color: var(--tl-gold);
} .tl-credit {
padding: 8px 14px 12px;
text-align: center;
font-size: 10px;
letter-spacing: 0.22em;
text-transform: uppercase;
color: rgba(157, 179, 163, 0.55);
}
@media (max-width: 420px) {
.tl-bench-cols {
grid-template-columns: 1fr;
}
.tl-team-logo {
width: 36px;
height: 36px;
}
.tl-team-name {
font-size: 13px;
}
.tl-score {
font-size: 24px;
}
}