/* style-custom.css */

/* Related items Scroller */

.scroll-container {
    overflow: hidden;
}

.scroll-container-inner {
    margin: 0 0 0 -16px;
    display: flex;
    flex-wrap: nowrap;
    flex-direction: row;
    overflow-x: auto;
}

@media (min-width: 1200px) {
    .scroll-container-inner {
        margin: 0 -24px;
    }
}

.scroll-box {
    flex-shrink: 0;
    width: 180px;
    margin: 0 16px;
    padding-bottom: .75rem;
}

@media (min-width: 768px) {
    .scroll-box {
        width: 220px;
    }
}

@media (min-width: 992px) {
    .scroll-box {
        width: 240px;
    }
}

@media (min-width: 1200px) {
    .scroll-box {
        /*width: 260px;*/
        width: 328px;
        margin: 0 24px;
    }
}

.scroll-box-img.rounded-circle {
    overflow: hidden;
}

/* .scroll-box-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
} */

.scroll-box-img {
    height: 180px;
    width: 180px;
    margin-bottom: 2rem;
    aspect-ratio: 1 / 1;
    flex: 0 0 auto;
}

@media (min-width: 768px) {
    .scroll-box-img {
        height: 220px;
        width: 220px;
    }
}

@media (min-width: 992px) {
    .scroll-box-img {
        height: 240px;
        width: 240px;
    }
}

@media (min-width: 1200px) {
    .scroll-box-img {
        height: 260px;
        /*width: 260px;*/
        width: 328px;
    }
}