.js-logo-track {
    align-items: center;
}

.js-logo-viewport {
    cursor: grab;
}

.js-logo-viewport.is-dragging {
    cursor: grabbing;
}

.logo-slide-item {
    flex: 0 0 100%;
}

.logo-slider-image {
    max-width: 200px;
}

.logo-slider-fade::before,
.logo-slider-fade::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    z-index: 3;
    pointer-events: none;
}

.logo-slider-fade::before {
    left: 0;
    width: 170px;
    background: linear-gradient(to right, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 38%, rgba(255, 255, 255, 0.94) 55%, rgba(255, 255, 255, 0.78) 72%, rgba(255, 255, 255, 0.42) 88%, rgba(255, 255, 255, 0) 100%);
}

.logo-slider-fade::after {
    right: 0;
    width: 170px;
    background: linear-gradient(to left, rgba(255, 255, 255, 1) 0%, rgba(255, 255, 255, 1) 38%, rgba(255, 255, 255, 0.94) 55%, rgba(255, 255, 255, 0.78) 72%, rgba(255, 255, 255, 0.42) 88%, rgba(255, 255, 255, 0) 100%);
}

@media (min-width: 480px) {
    .logo-slide-item {
        flex: 0 0 50%;
    }
}

@media (min-width: 768px) {
    .logo-slide-item {
        flex: 0 0 33.333333%;
    }

    .logo-slider-image {
        max-width: 130px;
    }

    .logo-slider-fade::before,
    .logo-slider-fade::after {
        width: 88px;
    }
}

@media (min-width: 1024px) {
    .logo-slide-item {
        flex: 0 0 25%;
    }

    .logo-slider-image {
        max-width: 155px;
    }

    .logo-slider-fade::before,
    .logo-slider-fade::after {
        width: 120px;
    }
}

@media (min-width: 1280px) {
    .logo-slide-item {
        flex: 0 0 20%;
    }
}

@media (min-width: 1536px) {
    .logo-slide-item {
        flex: 0 0 16.666667%;
    }

    .logo-slider-image {
        max-width: 180px;
    }

    .logo-slider-fade::before,
    .logo-slider-fade::after {
        width: 140px;
    }
}

@media (max-width: 767px) {
    .logo-slider-image {
        max-width: 112px;
    }

    .logo-slider-fade::before,
    .logo-slider-fade::after {
        width: 58px;
    }
}

@media (max-width: 480px) {
    .logo-slider-image {
        max-width: 98px;
    }

    .logo-slider-fade::before,
    .logo-slider-fade::after {
        width: 44px;
    }
}