/* Tab Image Grid Style */
.sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content {
    display: grid;
    grid-gap: 10px;
    grid-template-columns: repeat(4, 1fr);
}

.sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content img.sp-tab__image {
    width: 100%;
}

.sp-tab__tab-content .sp-tab__image-wrapper .sp-tab__caption {
    font-size: 12px;
    text-align: center;
}

/* Video Iframe style */
iframe.sp_tabs-video-iframe,
iframe.sp_tabs-video-iframe-wrapper.sp_tabs-inline-video-youtube {
    height: 100% !important;
    width: 100% !important;
    position: absolute;
    top: 0;
    left: 0;
    background: #000;
    z-index: 999;
}

video.sp_tabs-video-iframe {
    max-width: 100%;
}

.tabs-video-wrapper.sp_tabs-video-inline-mode .tabs-iframe-wrapper {
    width: 100%;
    position: relative;
    line-height: 0;
}

.tabs-video-wrapper.sp_tabs-video-inline-mode .tabs-iframe-wrapper>button {
    padding: 0;
    background: 0 0;
    cursor: pointer;
    outline: 0;
    border: none;
    z-index: 10;
    border-radius: 6px;
    top: 50%;
    color: #fff;
    left: 50%;
    width: 100%;
    height: 100%;
    font-size: 36px;
    transform: translate3d(-50%, -50%, 0);
    position: absolute;
}

.tabs-video-thumbnail {
    width: 100%;
}

.sp-tab-remove-thumb .tabs-iframe-wrapper.video-active .tabs-video-thumbnail.fadeout {
    display: none;
}

/* Responsive Columns for the Image Grid. */
@media (max-width: 480px) {
    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-xs-1 {
        grid-template-columns: repeat(1, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-xs-2 {
        grid-template-columns: repeat(2, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-xs-3 {
        grid-template-columns: repeat(3, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-xs-4 {
        grid-template-columns: repeat(4, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-xs-5 {
        grid-template-columns: repeat(5, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-xs-6 {
        grid-template-columns: repeat(6, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-xs-7 {
        grid-template-columns: repeat(7, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-xs-8 {
        grid-template-columns: repeat(8, 1fr);
    }
}

@media (min-width: 481px) and (max-width: 735px) {
    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-sm-1 {
        grid-template-columns: repeat(1, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-sm-2 {
        grid-template-columns: repeat(2, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-sm-3 {
        grid-template-columns: repeat(3, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-sm-4 {
        grid-template-columns: repeat(4, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-sm-5 {
        grid-template-columns: repeat(5, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-sm-6 {
        grid-template-columns: repeat(6, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-sm-7 {
        grid-template-columns: repeat(7, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-sm-8 {
        grid-template-columns: repeat(8, 1fr);
    }

}

@media (min-width: 736px) and (max-width: 1023px) {
    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-md-1 {
        grid-template-columns: repeat(1, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-md-2 {
        grid-template-columns: repeat(2, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-md-3 {
        grid-template-columns: repeat(3, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-md-4 {
        grid-template-columns: repeat(4, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-md-5 {
        grid-template-columns: repeat(5, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-md-6 {
        grid-template-columns: repeat(6, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-md-7 {
        grid-template-columns: repeat(7, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-md-8 {
        grid-template-columns: repeat(8, 1fr);
    }
}

@media (min-width: 1024px) and (max-width: 1279px) {
    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-lg-1 {
        grid-template-columns: repeat(1, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-lg-2 {
        grid-template-columns: repeat(2, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-lg-3 {
        grid-template-columns: repeat(3, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-lg-4 {
        grid-template-columns: repeat(4, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-lg-5 {
        grid-template-columns: repeat(5, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-lg-6 {
        grid-template-columns: repeat(6, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-lg-7 {
        grid-template-columns: repeat(7, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-lg-8 {
        grid-template-columns: repeat(8, 1fr);
    }
}

@media (min-width: 1280px) {
    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-xl-1 {
        grid-template-columns: repeat(1, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-xl-2 {
        grid-template-columns: repeat(2, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-xl-3 {
        grid-template-columns: repeat(3, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-xl-4 {
        grid-template-columns: repeat(4, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-xl-5 {
        grid-template-columns: repeat(5, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-xl-6 {
        grid-template-columns: repeat(6, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-xl-7 {
        grid-template-columns: repeat(7, 1fr);
    }

    .sp-tab__tab-content .sp-tab__image-wrapper.sp_tab-grid-content.col-xl-8 {
        grid-template-columns: repeat(8, 1fr);
    }
}

/* Masonry Style. */
@media (max-width: 480px) {
    .sp-tab__image-wrapper.sp_tab-masonry-content.col-xs-1 {
        column-count: 1;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-xs-2 {
        column-count: 2;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-xs-3 {
        column-count: 3;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-xs-4 {
        column-count: 4;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-xs-5 {
        column-count: 5;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-xs-6 {
        column-count: 6;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-xs-7 {
        column-count: 7;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-xs-8 {
        column-count: 8;
    }
}

@media (min-width: 481px) and (max-width: 735px) {
    .sp-tab__image-wrapper.sp_tab-masonry-content.col-sm-1 {
        column-count: 1;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-sm-2 {
        column-count: 2;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-sm-3 {
        column-count: 3;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-sm-4 {
        column-count: 4;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-sm-5 {
        column-count: 5;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-sm-6 {
        column-count: 6;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-sm-7 {
        column-count: 7;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-sm-8 {
        column-count: 8;
    }
}

@media (min-width: 736px) and (max-width: 1023px) {
    .sp-tab__image-wrapper.sp_tab-masonry-content.col-md-1 {
        column-count: 1;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-md-2 {
        column-count: 2;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-md-3 {
        column-count: 3;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-md-4 {
        column-count: 4;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-md-5 {
        column-count: 5;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-md-6 {
        column-count: 6;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-md-7 {
        column-count: 7;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-md-8 {
        column-count: 8;
    }
}

@media (min-width: 1024px) and (max-width: 1279px) {
    .sp-tab__image-wrapper.sp_tab-masonry-content.col-lg-1 {
        column-count: 1;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-lg-2 {
        column-count: 2;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-lg-3 {
        column-count: 3;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-lg-4 {
        column-count: 4;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-lg-5 {
        column-count: 5;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-lg-6 {
        column-count: 6;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-lg-7 {
        column-count: 7;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-lg-8 {
        column-count: 8;
    }
}

@media (min-width: 1280px) {
    .sp-tab__image-wrapper.sp_tab-masonry-content.col-xl-1 {
        column-count: 1;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-xl-2 {
        column-count: 2;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-xl-3 {
        column-count: 3;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-xl-4 {
        column-count: 4;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-xl-5 {
        column-count: 5;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-xl-6 {
        column-count: 6;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-xl-7 {
        column-count: 7;
    }

    .sp-tab__image-wrapper.sp_tab-masonry-content.col-xl-8 {
        column-count: 8;
    }
}

.sp-tab__image-wrapper.sp_tab-masonry-content {
    column-gap: 24px;
    column-count: 3;
}

.sp-tab__image-wrapper.sp_tab-masonry-content .sp-tab__image-item {
    margin-bottom: 24px;
}

.sp-tab__image-wrapper img.sp-tab__image {
    display: inline-block;
    width: 100%;
    box-shadow: none !important;
}

/* Fancybox style for Image gallery. */
.sp-tabs-fancybox-wrapper.fancybox__container {
    z-index: 99999;
}

.fancybox__container.sp-tabs-fancybox-wrapper .fancybox__slide>.f-html {
    background: none;
}

.fancybox__container.sp-tabs-fancybox-wrapper .fancybox__slide iframe[src*='tiktok'] {
    max-width: 323px;
    margin: 0 auto;
}

.sp-tab__image-item {
    position: relative;
    overflow: hidden;
}

.sp-tab__tab-content .sp-tab__image-link {
    display: block;
    position: relative;
    line-height: 0;
}

.sp-tab__tab-content .sp-tab__image-overlay {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    transition: opacity 0.3s ease;
}

.sp-tab__tab-content .sp-tab__image-link:hover .sp-tab__image-overlay {
    opacity: 1;
}

.sp-tab__tab-content .sp-tab__zoom-icon {
    color: #fff;
    overflow: hidden;
    font-size: 24px;
}

.sp-tab__tab-content .sp-tab__zoom-icon i.fa {
    font-size: 16px;
    color: #fff;
    background: rgba(0, 0, 0, 0.5);
    padding: 10px;
    border-radius: 50%;
    height: 24px;
    width: 24px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}

/* Fancybox style for video gallery. */
.sp-tab__tab-content .tabs-video-wrapper {
    position: relative;
    line-height: 0;
    display: inline-block;
}

.sp-tab__tab-content .tabs-video-thumbnail {
    display: block;
    width: 100%;
    border-radius: 8px;
}

.sp-tab__tab-content .sp-video-play-link {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    text-decoration: none;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.sp-tab__tab-content a.sp-video-play-link:focus {
    outline: 0;
}

.sp-tab__tab-content .sp-video-play-button i {
    font-size: 40px;
    color: #fff;
}

.tabs-iframe-wrapper {
    position: relative;
    display: inline-block;
    overflow: hidden;
    border-radius: 8px;
}

/* Thumbnail stays normal */
.tabs-video-thumbnail {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 8px;
}

/* Dark overlay using pseudo-element */
.tabs-iframe-wrapper::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0, 0, 0, 0.3);
    z-index: 1;
    /* sits above the image but below the play icon */
    pointer-events: none;
}

/* Play link covers thumbnail */
.sp-video-play-link {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 22;
    text-decoration: none;
}

/* Play button/icon stays fully visible */
.sp-video-play-button {
    position: relative;
    z-index: 33;
    color: #fff;
    font-size: 40px;
}
