.ts-gallery .ts-gallery-grid {
    display: grid;
    width: 100%;
    grid-gap: 15px
}

.ts-gallery li {
    position: relative
}

.ts-gallery li .ts-image-overlay {
    background: transparent;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    transition: .15s ease;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    color: #fff;
    font-size: var(--e-global-typography-text-font-size);
    grid-gap: 5px
}

.ts-gallery li .ts-image-overlay i {
    color: #fff
}

.ts-gallery li .ts-image-overlay svg {
    fill: #fff
}

.ts-gallery li.ts-gallery-last-item .ts-image-overlay {
    background: rgba(40, 41, 43, .4)
}

.ts-gallery li.ts-gallery-last-item a:hover .ts-image-overlay {
    background: rgba(40, 41, 43, .55)
}

.ts-gallery li.ts-empty-item {
    pointer-events: none;
    overflow: hidden
}

.ts-gallery li.ts-empty-item div {
    border: 1.5px dashed var(--ts-shade-5);
    width: 100%;
    height: 100%;
    border-radius: 15px
}

.ts-gallery li a {
    height: 100%;
    width: 100%;
    position: relative;
    white-space: nowrap;
    display: flex;
    overflow: hidden;
    flex-direction: column
}

.ts-gallery li a:hover .ts-image-overlay {
    background: rgba(0, 0, 0, .1)
}

.ts-gallery li a img {
    width: 100%;
    height: 100%
}

.ts-gallery li a i {
    font-size: 32px;
    color: #525a6e
}

.ts-gallery li a .ts-image-overlay img, .ts-gallery li a .ts-image-overlay svg {
    width: 32px;
    height: 32px;
    -o-object-fit: contain;
    object-fit: contain;
    fill: #fff
}

@media (max-width: 1024px) {
    .ts-gallery-nowrap {
        display: flex !important;
        flex-wrap: nowrap !important;
        width: 100% !important;
        grid-template-columns:1fr 1fr 1fr !important;
        scroll-snap-type: x mandatory
    }

    .ts-gallery-nowrap > li {
        scroll-snap-align: start;
        grid-row: 1 !important;
        grid-column: auto !important;
        width: 50%;
        min-width: 50%
    }
}