@charset 'UTF-8';

/* Arrows */
.slick-arrow:hover {cursor: pointer; transition: var(--smooth); background-color: var(--dark-gold);}
.slick-prev, .slick-next {bottom: 0; font-size: 0; line-height: 0; position: absolute; display: block; width: 60px; height: 60px; padding: 0; -webkit-transform: translate(0, -50%); -ms-transform: translate(0, -50%); transform: translate(0, -50%); cursor: pointer; color: transparent; border: none; outline: none; z-index: 1;}
.slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus {color: transparent; outline: none;}
.slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before {opacity: 1;}
.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before {opacity: .25;}
.slick-prev:before, .slick-next:before {font-family: 'slick'; font-size: 20px; line-height: 1; opacity: .75; color: white; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
.slick-prev {right: 40px;}
[dir='rtl'] .slick-prev {right: -25px; left: auto;}
.slick-prev:before {content: '←';}
[dir='rtl'] .slick-prev:before {content: '→';}
.slick-next {right: -25px;}
[dir='rtl'] .slick-next {right: auto; left: -25px;}
.slick-next:before {content: '→';}
[dir='rtl'] .slick-next:before {content: '←';}

/* Dots */
.slick-dotted.slick-slider {margin-bottom: 30px;}
.slick-dots {position: absolute; bottom: -67px; display: flex; width: 100%; padding: 0; margin: 0; list-style: none; justify-content: flex-start;}
.slick-dots li {position: relative; display: inline-block; height: 5px; padding: 0; cursor: pointer; background-color: var(--light-gold); transition: var(--smooth);}
.slick-dots .slick-active {background-color: var(--wellington-gold);}
.slick-dots li button {font-size: 0; line-height: 0; display: block; width: 20px; height: 20px; padding: 5px; cursor: pointer; color: transparent; border: 0; outline: none; background: transparent;}
.slick-dots li button:hover, .slick-dots li button:focus {outline: none;}
.slick-dots li button:hover:before, .slick-dots li button:focus:before {opacity: 1;}
.slick-dots li button:before {font-family: 'slick'; font-size: 6px; line-height: 20px; position: absolute; top: 0; left: 0; width: 20px; height: 20px; content: '•'; text-align: center; opacity: .25; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;}
.slick-dots li.slick-active button:before{opacity: .75;}

/* Responsive */

@media (min-width: 1301px) {
    .slick-dots li {width: clamp(100px, 20vw, 250px);}
}

@media (max-width: 1300px) {
    .slick-dots li {width: clamp(100px, 18vw, 200px);}
}