.wpyg-gallery {
max-width: 100%;
margin: 0 0 1.5rem;
}
.wpyg-featured {
margin-bottom: 1.5rem;
}
.wpyg-video-facade {
position: relative;
display: block;
width: 100%;
aspect-ratio: 16 / 9;
overflow: hidden;
background: #000;
cursor: pointer;
border: 0;
padding: 0;
} @supports not (aspect-ratio: 16 / 9) {
.wpyg-video-facade {
height: 0;
padding-top: 56.25%;
}
}
.wpyg-video-thumb {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
object-fit: cover;
display: block;
}
.wpyg-play-button {
position: absolute;
top: 50%;
left: 50%;
width: 68px;
height: 48px;
margin: -24px 0 0 -34px;
background-color: rgba(0, 0, 0, 0.7);
border-radius: 12px;
transition: background-color 0.15s ease;
}
.wpyg-video-facade:hover .wpyg-play-button,
.wpyg-video-facade:focus-visible .wpyg-play-button {
background-color: rgba(210, 0, 0, 0.85);
}
.wpyg-play-button::after {
content: '';
position: absolute;
top: 50%;
left: 50%;
transform: translate(-40%, -50%);
border-style: solid;
border-width: 10px 0 10px 18px;
border-color: transparent transparent transparent #fff;
}
.wpyg-video-title {
position: absolute;
left: 0;
right: 0;
bottom: 0;
padding: 0.75rem 1rem;
color: #fff;
font-size: 0.95rem;
line-height: 1.3;
background: linear-gradient(to top, rgba(0, 0, 0, 0.75), rgba(0, 0, 0, 0));
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
}
.wpyg-video-facade--featured .wpyg-video-title {
font-size: 1.15rem;
}
.wpyg-video-facade--loaded .wpyg-play-button,
.wpyg-video-facade--loaded .wpyg-video-title {
display: none;
}
.wpyg-video-facade iframe {
position: absolute;
inset: 0;
width: 100%;
height: 100%;
border: 0;
}
.wpyg-grid {
display: grid;
grid-template-columns: 1fr;
gap: 1.25rem;
}
@media (min-width: 640px) {
.wpyg-grid {
grid-template-columns: repeat(2, 1fr);
}
}
@media (min-width: 1024px) {
.wpyg-grid {
grid-template-columns: repeat(3, 1fr);
}
}
.wpyg-notice {
padding: 1rem;
border-left: 4px solid #d63638;
background: #fcf0f1;
}
.wpyg-notice-empty {
border-left-color: #8c8f94;
background: #f6f7f7;
}