.ctn-carousel {
    margin: 20px auto 0px auto;
    width: 64%;
    align-content: center;
}

.carousel-cell {
    width: 32.5%; /* full width */
    height: 440px; /* height of carousel */
    margin: 0px 7px 0px 7px;
}

/* no circle */
.flickity-button {
    background: transparent;
}

/* big previous & next buttons */
.flickity-prev-next-button {
    width: 80px;
    height: 80px;
}

    .flickity-prev-next-button:hover {
        background: transparent;
        opacity: 1;
    }

    .flickity-prev-next-button.previous {
        left: -100px;
    }

    .flickity-prev-next-button.next {
        right: -100px;
        margin-top: 0px;
    }

/* icon color */
.flickity-button-icon {
    fill: white;
}

    .flickity-button-icon:hover {
        fill: #983ffd;
    }

/* position dots in carousel */
.flickity-page-dots {
    bottom: -20px;
    display: none;
}
    /* white circles */
    .flickity-page-dots .dot {
        width: 12px;
        height: 12px;
        opacity: 1;
        background: transparent;
        border: 2px solid white;
    }
        /* fill-in selected dot */
        .flickity-page-dots .dot.is-selected {
            background: white;
        }

.flickity-enabled:focus .flickity-viewport {
    outline: none;
}

.ctnCarouselCellSelected {
    background-image: linear-gradient(#983ffd, #ff00a0 );
}

@media only screen and (max-width: 1800px) {
    .ctn-carousel {
        width: 68%;
    }
}

@media only screen and (max-width: 1750px) {
    .ctn-carousel {
        width: 71%;
    }
}

@media only screen and (max-width: 1700px) {
    .ctn-carousel {
        width: 74%;
    }
}

@media only screen and (max-width: 1600px) {
    .ctn-carousel {
        width: 80%;
    }
}

@media only screen and (max-width: 1500px) {
    .ctn-carousel {
        width: 84%;
    }
}