/* defaults from slick css */
/* should merge and clean up file one day */
.slick-slider { position:relative; display:block; box-sizing:border-box; user-select:none; touch-action:pan-y; }
.slick-list { position:relative; display:block; overflow:hidden; margin:0; padding:0; }
.slick-list:focus { outline:none; }
.slick-list.dragging { cursor:pointer; cursor:hand; }
.slick-slider .slick-track, .slick-slider .slick-list { transform:translate3d(0, 0, 0); }
.slick-track { position:relative; top:0; left:0; display:block; }
.slick-track:before, .slick-track:after { display:table; content:''; }
.slick-track:after { clear:both; }
.slick-loading .slick-track { visibility:hidden; }
.slick-slide { display:none; float:left; height:100%; min-height:1px; }
[dir='rtl'] .slick-slide { float:right; }
.slick-slide img { display:block; }
.slick-slide.slick-loading img { display:none; }
.slick-slide.dragging img { pointer-events:none; }
.slick-initialized .slick-slide { display:block; }
.slick-loading .slick-slide { visibility:hidden; }
.slick-vertical .slick-slide { display:block; height:auto; border:0px solid transparent; font-size:0; }
.slick-arrow.slick-hidden { display:none; }


.zuko-slick-wrapper { position:relative; width:100%; display:block; }
.zuko-slick { visibility:hidden; }
.zuko-slick.slick-initialized { visibility:visible; }

@media (max-width:767px) {
    .break_slider_on_mobile .zuko-slick { visibility:visible; }
}


/* fw_ratio */
.zuko-slick-wrapper.slider-ratio:after { padding-top:37.25%; display:block; content:''; }
.slider-ratio .zuko-slick { position:absolute; top:0; bottom:0; right:0; left:0; width:100%; height:auto; }

/* fw_fh */
.slider-fullscreen .zuko-slick { height:100vh; }
.admin-bar .slider-fullscreen .zuko-slick { height:calc(100vh - 32px); }

/* fixed */
.slider-fixed .zuko-slick { margin:0px auto; }
/* force height so dots dont move */
.slider-fixed .slick-track { padding-top:10px; padding-bottom:10px; display:flex; }
.slider-fixed .slick-slide { display:flex; height:auto; align-items:center; justify-content:center; }
.slider-fixed .slick-dots { bottom:auto; }

.zuko-slick { width:100%; }

x.zuko-slick { width:100%; height:calc(100vh - 240px); }
x.zuko-slick { width:100%; height:500px; }

.slide-wrapper { overflow:hidden; display:inline-block; }

.slider-adaptive-height .slick-track { display:block; padding:0; height:auto; }

.slider-adaptive-height .slick-slide { height:100%; display:block; }



/* fix flex bugs */



.zuko-slick { min-width:100%; width:0; }



.zuko-slick * { min-height:0; min-width:0; }



.zuko-slick img { height:100%; width:auto; box-sizing:border-box; max-height:none; margin:0px; text-indent:-999px; }



.zuko-slick .ratio-box { position:relative; display:block; width:100%; }



.zuko-slick .ratio-box img { position:absolute; top:0; left:0; width:100%; height:100%; }



.zuko-slick.slick-vertical .ratio-box img { position:static; height:calc(100vh); width:100%; }



.zuko-slick .background-image { xbackground-color:rgba(0,0,0,.05); }



.zuko-slick .background-image img { object-fit:cover; font-family:'object-fit: cover'; }



.zuko-slick .background-image.contain img { object-fit:contain; font-family:'object-fit: contain'; }



.zuko-slick .caption { position:absolute; left:0px; bottom:0px; color:white; font-size:12px; padding:4px 8px; }



/* wrapper for advanced slides */



.zuko-slick .slide-wrapper { position:relative; }



.zuko-slick .slide-wrapper .overlay { position:absolute; top:50%; transform:translate(-50%, -50%); left:50%; }

.center-mode .zuko-slick .slick-slide { opacity:.4; -webkit-transition:opacity .1s linear; transition:opacity .1s linear; }
.center-mode .zuko-slick .slick-slide.slick-current { opacity:1; }

.slide-img { overflow:hidden; position:relative; height:100%; background-repeat:no-repeat; background-position:center center; background-size:cover;
    -moz-transform:rotate(0);
    -webkit-backface-visibility:hidden;
    -webkit-transform:translate3D(0,0,0);
}

.ratiobox { height:100%; }






/*
.slide-img:before { position:absolute; width:100%; height:100%; top:0; left:0; background-color:rgba(0,0,0,.2); content:""; -webkit-transition:1s ease background-color; transition:1s ease background-color; }
*/

.slick-down-arrow:after { content:'\f078'; font-family:Font Awesome\ 5 Pro, FontAwesome; font-weight:300; position:absolute; bottom:15px; text-align:center; margin:0px auto; color:white; font-size:30px; width:30px; left:50%; cursor:pointer; margin-left:-15px; }


.slick-dots { position:absolute; bottom:10px; width:100%; text-align:center; }
.slick-dots li { display:inline-block; margin:0px 3px; }
.slick-dots button { border:0px; border-radius:50%; height:10px; width:10px; padding:0px; text-indent:-50000px; background:rgba(255,255,255,.5); cursor:pointer; }
.slick-dots li.slick-active button { background:#FFF; }
.slick-dots.right { width:auto; right:15px; }
.slick-dots.left { width:auto; left:15px; }
.slick-dots.right-vertical { bottom:auto; width:auto; right:30px; top:50%; transform:translateY(-50%); }
.slick-dots.right-vertical li { display:block; margin:3px; }

@media (max-width:768px) {
    .slick-dots.right-vertical { position:fixed; }
}

.arrows-bottom-right .slick-dots.right { right:70px; bottom:20px; }

.slick-next, .slick-prev { position:absolute; top:0; z-index:9; height:30px; width:75px; }
.slick-next { right:0; }


.slick-arrow {  }

.arrows-bottom-right .slick-arrow { top:auto; bottom:0px; }
.arrows-bottom-right .slick-prev { left:auto; right:35px; }

.arrows-overlay-bg .slick-arrow, .arrows-overlay .slick-arrow { height:100%; width:35px; }

.arrows-overlay-bg .slick-arrow { background:rgba(0,0,0,.4); }

.arrows-overlay .slick-arrow:not(.slick-disabled):hover:before { color:#CCC; }

.arrows-overlay-bg .slick-arrow:hover { background:rgba(0,0,0,.7); }


.slick-list, .slick-track {
    height:100%;
}

@media only screen and (max-width:768px) {

    .slider-ratio .zuko-slick { height:auto; width:100%; }

    /* what should we do for fullscreen sliders on mobile? */
    x.slider-fullscreen .zuko-slick img { width:100%; height:auto; }
    x.slider-fullscreen .zuko-slick { max-height:60vh; }


}

@media only screen and (min-width:2000px) {
    /*.zuko-slick-wrapper.ratiox:after { padding-top:56.25%; }*/

    /* i am not sure why this line is important - changed to fullscreen only */
    .slider-fullscreen .zuko-slick { width:100%; height:calc(100vh - 265px); }
}





/* slick buttons */

.slick-loading .slick-list { /* background:#fff url('./ajax-loader.gif') center center no-repeat; */ }
.slick-prev, .slick-next { font-size:0; line-height:40px; position:absolute; top:50%; display:block; width:25px; padding:0; -webkit-transform:translate(0, -50%); transform:translate(0, -50%); cursor:pointer; color:transparent; border:none; outline:none; background:transparent; font-family:Font Awesome\ 5 Pro, FontAwesome; font-weight:300; }

.slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus { color:transparent; outline:none; background:transparent; }
.slick-prev:hover:before, .slick-prev:focus:before, .slick-next:hover:before, .slick-next:focus:before { opacity:.75; }

.slick-prev.slick-disabled:before, .slick-next.slick-disabled:before { opacity:.2; }

.slick-prev:before, .slick-next:before { font-size:50px; line-height:30px; opacity:1; color:#333; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }

.slick-disabled { cursor:default; }

/* commented out 1/16 idk what it was for? default set below?
.slick-prev { left:15px; }
[dir='rtl'] .slick-prev { right:15px; left:auto; }
*/
.slick-prev:before { content:'\f053'; float:left; }

/*
.slick-next { right:15px; }
[dir='rtl'] .slick-next { right:auto; left:15px; }
*/

.slick-next:before { content:'\f054'; float:right; }
.arrows-overlay .slick-next:before { float:none; }

.slick-prev { left:-3.5%; }
.slick-next { right:-3.5%; }

@media only screen and (max-width:991px) {

    .slick-prev { left:-5%; }
    .slick-next { right:-5%; }

}

@media (max-width:575px) {

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

}

.arrows-overlay .slick-prev { left:0px; }
.arrows-overlay .slick-next { right:0px; }

.arrows-overlay .slick-prev:before, .arrows-overlay .slick-next:before {
    font-size:30px;
    color:white;
}