/* Slider */
.slick-slider { position: relative; display: block; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none;  -ms-user-select: none;  user-select: none;
    -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y;  touch-action: pan-y; -webkit-tap-highlight-color: transparent;}
.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{ -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0);}
.slick-track{ position: relative;  top: 0; left: 0;  display: block; margin-left: auto; margin-right: auto;}
.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: 1px solid transparent;}
.slick-arrow.slick-hidden { display: none;}





/* SLICK THEME */
.slick-loading .slick-list { background: #fff url('/img/preloader.gif') center center no-repeat;}
@font-face {  font-family: 'slick'; font-weight: normal; font-style: normal; }
.slick-prev, .slick-next {
    font-size: 0;
    line-height: 0;
    position: absolute;
    top: 50%;
    display: block;
    width: 20px;
    height: 20px;
    padding: 0;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
    cursor: pointer;
    color: transparent;
    border: none;
    outline: none;
    background: transparent;
}
.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: 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{ left: -25px;}
[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: '←';}

.slick-dotted.slick-slider{  margin-bottom: 30px;}
.slick-dots{    position: absolute;    bottom: -25px;   display: block;   width: 100%;  padding: 0;  margin: 0;  list-style: none; text-align: center;}
.slick-dots li{    position: relative;  display: inline-block;  width: 20px; height: 20px; margin: 0 5px; padding: 0;  cursor: pointer;}
.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; color: black; -webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;}
.slick-dots li.slick-active button:before{  opacity: .75; color: black;}




/* CUSTOMIZE */
.slick-slider-main {  height: 400px; margin: 30px auto 1px; overflow: hidden; }
.slick-slider-nav {  height: 100px; margin: auto; }
.slick-slider-nav .slick-track { height: 85px; }
.slick-arrow { position: absolute; top: 50%; z-index: 50; }
.slick-prev:before, .slick-next:before { color: #666!important; }
.slick-slider-nav .item.slick-slide {border: 5px solid #fff;}
.thumbnail-image {min-width: 50px; min-height: 50px; aspect-ratio: 1/1}








/* VERTICAL SLIDER */
.slick-gallery img {  max-width: 100%;}
.slick-gallery ul, .slick-gallery ul li { padding: 0; margin: 0; list-style-type: none;}

.banner-slider .slider.slider-for { max-width: 84%;min-width: 400px; min-height: 400px; padding-right: 0px;}
.banner-slider .slider.slider-nav { max-width: 16%;}
.slider-banner-image.slick-slide.slick-current.slick-active a:focus  {outline: 0;}
.banner-slider .slider.slider-for,.banner-slider .slider.slider-nav { width: 100%; float: left;  z-index: 0;}
.banner-slider .slider.slider-nav { height: 500px; min-width: 50px; overflow: hidden; padding: 0 20px 0 0; z-index: 0;}
.slider-banner-image { height: auto; }
.slider-nav .slick-slide.thumbnail-image .thumbImg{  max-width: 178px;  height: 110px; margin: 0 auto; /*border: 1px solid #EBEBEB;*/}
.slider-banner-image img,.slider-nav .slick-slide.thumbnail-image .thumbImg img {  width:100%; object-fit: cover; cursor: pointer; aspect-ratio: 1/1;}
.slick-vertical .slick-slide:active,.slick-vertical .slick-slide:focus,.slick-arrow:hover,.slick-arrow:focus { border: 0; outline: 0;}
.slick-slide { text-align: center;}
.slick-slide img { display: inherit;}
.slider-banner-image img {height: unset!important; width: unset!important; aspect-ratio: 1/1;}

.slider-nav .thumbnail-image.slick-slide .thumbImg {opacity: 0.5; }
.slider-nav .thumbnail-image.slick-slide .thumbImg:hover {opacity: 1; }  
.slider-nav .thumbnail-image.slick-slide.slick-current.slick-active .thumbImg { /*border: 2px solid #196DB6;*/    opacity: 1;}

.slick-vertical .slick-slide { border: 0px solid transparent; margin-bottom: 0px; padding-bottom: 0;}
.slider-nav .slick-slide.slick-current span { color: #196DB6;}
.slider-nav .slick-slide {text-align: center; position: relative;}
.slider-nav .slick-slide span { font-size: 14px; display: block; padding: 5px 0 15px;}

/*
.slick-arrow { width: 100%; background-color: transparent; border: 0; background-position: center; background-repeat: no-repeat; font-size: 0; height: 18px; position: absolute; left: 0; right: 0; z-index: 99;}
.slick-prev { top: 0;}
.slick-next { bottom: 0; background-color: #fff;}
.slick-prev.slick-arrow { background-image: url(/img/toggle_up.png);}
.slick-next.slick-arrow { background-image: url(/img/toggle_down.png);}
*/




@media screen and (max-width : 991px) {
    .banner-slider .slider.slider-for, .banner-slider .slider.slider-nav {  max-width: 100%; float: none; }
    .banner-slider .slider.slider-for { padding-right: 0;}
    .banner-slider .slider.slider-nav { height: auto;}
    .slider-banner-image { height: 500px;} 
    .slider.slider-nav.thumb-image { padding: 10px 30px 0; }
    .slider-nav .slick-slide span { padding: 5px 0;}
    .slick-arrow { padding: 0; width: 30px; height: 30px;top: 50%;bottom: 0;  -webkit-transform: translateY(-50%) rotate(-90deg); -moz-transform: translateY(-50%) rotate(-90deg); -ms-transform: translateY(-50%) rotate(-90deg);transform: translateY(-50%) rotate(-90deg); }
    .slick-prev { left: 0; right: unset; }
    .slick-next { left: unset; right: 0; background-color: transparent; }
    .bid-tag {  padding: 10px 0 15px; }
    .slider.slider-nav.thumb-image { white-space: nowrap; }
    .thumbnail-image.slick-slide { padding: 0px 5px; min-width: 75px; display: inline-block; float: none; }
    .slider-nav {display: none;}
}

@media screen and (max-width : 767px) {
    .slider-banner-image {  height: 400px; }
    .slider.slider-nav.thumb-image {  padding: 0px 20px 0; margin: 10px 0px 0; }
    .slider-nav .slick-slide.thumbnail-image .thumbImg {  max-width: 140px;  height: 80px; }
    .slick-prev.slick-arrow { background-position: center 10px; }
    .slick-next.slick-arrow { background-position: center 10px, center; }
    .slider-nav .slick-slide span { font-size: 12px;  white-space: normal;}
}

@media screen and (max-width: 580px) {
    .slider-banner-image { height:340px; }
}

@media screen and (max-width : 480px) {
    .slider-banner-image { height:280px; }
}