Template:MainPageSlider/style.css

.slick:not(.slick-initialized) .slick-slide:not(:first-of-type) {display: none}

.banner-text { visibility: hidden; }

.slick-active .banner-text { visibility: visible; color: white; height:50px; width:100%; background:rgba(0,0,0,0.7); position:absolute; bottom:0; left:8px; padding:5px; }  .slick-active .banner-text .text2 { animation: fadeIn ease-in 0.85s; }

@keyframes fadeIn { 0% {   opacity:0; } 100% {    opacity:1; } }

.slick .slick-next { right: 30px; }

.slick .slick-prev { left: 40px; }

.slick .slick-prev, .slick .slick-next { font-size: 0; line-height: 0; position: absolute; top: 50%; display: block; width: 30px; height: 30px; cursor: pointer; color: transparent; border-radius: 30px; background: #fff; padding: 0; }

.slick-slide img { display: block; width: 100%; max-width: 664px; padding: 0 8px; }

.slick-dots li button { width:10px; height:10px; background:#4E443C; border-radius:10px; }

.slick-dots li button:hover { background:red; }

.slick-dots li.slick-active button:before, .slick-dots li button:before { color: #FFF; opacity: 1; font-size: 0px; } .slick-dots li.slick-active button { border: 0px solid #00AC9F; border-radius: 100%; background :#00AC9F; } .slick-dots li.slick-active button:before { color: transparent; }