:root {
    --carousel-tile-spacing: 3px;
    --carousel-tile-width: 250px;
    --carousel-tile-height: calc(var(--carousel-tile-width) / (16 / 9));
    --carousel-growth-factor: 1.5;
    --carousel-growth-factor-left: 0.5;
    --carousel-normal-opacity: 1;
    --carousel-offset-left: calc(var(--carousel-tile-width) * (var(--carousel-growth-factor-left) - 1));
    --carousel-offset-right: calc(var(--carousel-tile-width) * (var(--carousel-growth-factor) / 3));
    --carousel-transition-1: 1s;
    --carousel-transition-2: 0.5s;
    --carousel-transition-3: 0.3s;
}

.smallSlider {
    background: #EEE;
    height: 230px !important;
    -webkit-transform-origin: left;
    transform-origin: left;
    margin: 0 10px;
    background-color: transparent !important;
}
    .smallSlider .flickity-viewport {
        height: 230px !important;
        padding-top: 35px;
    }

    .smallSlider .smallSliderBox {
        position: relative;
        display: inline-block;
        margin: var(--carousel-tile-spacing);
        background-color: rgb(34, 34, 34);
        border-radius: 5px;
        box-shadow: 0 3px 7px rgba(0, 0, 0, 0.2);
        z-index: 1;
        width: var(--carousel-tile-width);
        height: var(--carousel-tile-height);
        cursor: pointer;
        white-space: nowrap;
        -webkit-transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
        transition: all 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
        -webkit-transform-origin: left;
        transform-origin: left;
        border: solid 3px rgb(35,35,35);
    }

        .smallSlider .smallSliderBox p {
            padding-top: 0px;
            color: #fff !important;
        }

    .smallSlider .is-selected:hover {
        -webkit-transform-origin:left;
        transform-origin: left;
        -webkit-transform: scale(var(--carousel-growth-factor));
        transform: scale(var(--carousel-growth-factor));
        z-index: 999;
    }

        .smallSlider .is-selected:hover ~ .smallSliderBox {
            -webkit-transform: translate3d(var(--carousel-offset-right), 0, 0) !important;
            transform: translate3d(var(--carousel-offset-right), 0, 0) !important;
        }

    .smallSlider .smallSliderBox .image-format {
        height: 80%;
        width: 100%;
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        margin-bottom: 0px !important;
        background-size: contain;
    }

    .smallSlider .col {
        max-width: 373px;
        flex: auto;
    }

@media only screen and (max-width: 700px) {
    .smallSlider {
        margin: 0px;
    }
}


@media only screen and (max-width: 1272px) {
    .smallSlider .is-selected:hover {
        -webkit-transform: scale(1.13, 1.13);
        transform: scale(1.13, 1.13);
        z-index: 100;
    }
}

@media only screen and (max-width: 1440px) {
    .smallSlider .is-selected:hover {
        -webkit-transform: scale(calc(var(--carousel-growth-factor) * 0.779));
        transform: scale(calc(var(--carousel-growth-factor) * 0.779));
    }

        .smallSlider .is-selected:hover ~ .smallSliderBox {
            -webkit-transform: translate3d(calc(var(--carousel-offset-right) / 3), 0, 0) !important;
            transform: translate3d(calc(var(--carousel-offset-right) / 3), 0, 0) !important;
        }
}