/* BannerCarousel.css */

/* Carousel slick slider.
    Need .bannerCarousel for more-specific override, because can't move head css/js.
*/

.bannerCarousel .item img
{
    width: 100%;                /* This makes the image fit the carousel item size, otherwise the image crops. Don't put dimensions on the img elements. */
}

.bannerCarousel .slick-dotted.slick-slider
{
    margin-bottom: 0;               /* Remove bottom white gap. */
}

.bannerCarousel .slick-dots
{
    bottom: 0;          /* Position dots. */
}

.bannerCarousel .slick-dots li button:before          /* Dots style. */
{
    color: #918b8d;
    font-size: 10px;
    opacity: 0.9;
}

.bannerCarousel .slick-dots li.slick-active button:before
{
    color: #ffffff;
}