.block-video-gallery {
    overflow: hidden;
    position: relative;
    /* Tallest a video may render: viewport height minus ~300px reserved for
       the fixed main menu, the caption and the nav arrows below the video.
       Floored at 280px so videos stay usable on very short windows. */
    --video-max-height: max(100vh - 300px, 280px);
}
.block-video-gallery .row {
    margin-bottom:30px;
}
.block-video-gallery.whitebgit {
    background: linear-gradient(108deg,rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 70%, rgba(242, 242, 242, 1) 70%, rgba(242, 242, 242, 1) 100%);
}
.block-video-gallery.dark {
    background-color:var(--dark-gray);
}
.bpadleft { padding-left:80px; padding-top:20px; padding-bottom:40px;}
.videolabel {
    font-family: "Montserrat", sans-serif;
    font-size:2.188rem;
    text-transform:uppercase;
    font-weight:500;
    text-align: left;
    color:var(--black);
    line-height: 1.2;
    margin-top:10px;
    padding-left:20px;
    padding-right:20px;
}
.dark .videolabel {
    color:var(--yellow);
}
.sidecontent p, .sidecontent ul, .sidecontent ol, .sidecontent li {
    font-family: "Montserrat", sans-serif;
    font-weight: 300;
    font-size: 1rem;
    line-height: 1.5;
    margin-top: 5px;
    
} 
.video-embed {
    position: relative;
    overflow: hidden;
    aspect-ratio: 16 / 9;
    /* Height follows the element's own width via aspect-ratio, so capping the
       width at --video-max-height * 16/9 keeps the video within the viewport
       budget. On tall screens the 100% - 40px term wins, which matches the
       original 20px side margins. */
    max-width: min(calc(100% - 40px), calc(var(--video-max-height) * 16 / 9));
    margin-left: auto;
    margin-right: auto;
}
.block-video-gallery video {
    max-height: var(--video-max-height);
}
.youtube-facade {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: block;
    padding: 0;
    border: 0;
    background: #000;
    cursor: pointer;
}
.youtube-facade img {
    display: block;
    width: 100%;
    height: 100%;
    /* YouTube thumbnails are 4:3 with baked-in letterbox bars; cover-cropping
       them inside the 16:9 box hides the bars. */
    object-fit: cover;
}
.youtube-facade-play {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 72px;
    height: 50px;
    border-radius: 12px;
    background: rgba(0, 0, 0, 0.75);
    transition: background 0.2s ease;
}
.youtube-facade-play::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-40%, -50%);
    border-style: solid;
    border-width: 11px 0 11px 19px;
    border-color: transparent transparent transparent #fff;
}
.youtube-facade:hover .youtube-facade-play,
.youtube-facade:focus-visible .youtube-facade-play {
    background: var(--yellow);
}
.youtube-facade:hover .youtube-facade-play::before,
.youtube-facade:focus-visible .youtube-facade-play::before {
    border-left-color: #000;
}
.block-video-gallery .videolabel {
    /* Track the video's width so the label stays aligned with its left edge
       when the height cap shrinks and centers the video. On tall screens this
       renders identically to the old 20px side paddings. */
    max-width: min(calc(100% - 40px), calc(var(--video-max-height) * 16 / 9));
    margin-left: auto;
    margin-right: auto;
    padding-left: 0;
    padding-right: 0;
}
.block-video-gallery .slick-prev:before {
    content: ''; /* Clear default content */
    background-image: url('/wp-content/uploads/2025/09/yeleft.svg');
    background-repeat: no-repeat;
    background-size: contain; /* Adjust as needed */
    display: block;
    width: 35px; /* Adjust size */
    height: 35px; /* Adjust size */
    opacity: 1;
}

.block-video-gallery .slick-next:before {
    content: ''; /* Clear default content */
    background-image: url('/wp-content/uploads/2025/09/yright.svg');
    background-repeat: no-repeat;
    background-size: contain; /* Adjust as needed */
    display: block;
    width: 35px; /* Adjust size */
    height: 35px; /* Adjust size */
    opacity: 1;
}
.block-video-gallery .slick-prev {
    position: absolute;
    top: calc(100% + 0px);
    left: calc(100% - 170px);
}
.block-video-gallery .slick-next {
    position: absolute;
    top: calc(100% + 0px);
    left: calc(100% - 110px);
}
.padvg { padding: 0px 0px 50px; }
@media (max-width:1399.96px){
    .videolabel {
        font-size:2rem;
    }
}
@media (max-width:1199.96px){
    .videolabel {
        font-size:1.8rem;
    }
}
@media (max-width:991.96px){
    .videolabel {
        font-size:1.65rem;
    }
}
@media (max-width:991.96px){
    .videolabel {
        font-size:1.5rem;
    }
}
@media (max-width:767.96px){
    .videolabel {
        font-size:1.375rem;
    }
}
@media (max-width:575.96px){
    .bpadleft {
        padding-left: 0;
        padding-top: 70px;
        padding-bottom: 40px;
        text-align: center;
    }
    .block-video-gallery .slick-prev {
        left: calc(45% - 50px);
    }
    .block-video-gallery .slick-next {
        right: calc(45% - 50px);
        left:unset;
    }
}