/*!*
* Slick Custom Theme
*/

.slider {
  opacity: 0.1;
  /*repace height in specific page for a fitable placeholder height*/
  height: auto;
}

.slider.slick-initialized {
  height: auto;
  display: block !important;
  opacity: 1 !important;
  transition: all 1.5s ease-out !important;
}

.slick-item {
  color: #333;
  /*background-color: #3498db;*/
  min-height: 80px;
  position: relative;
  text-align: center;
  text-transform: uppercase;
  margin: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}
.slick-item:hover {
  opacity: 1
}

.slick-slide img {
  width: 100%;
  /*height: auto;*/
  /*width: auto;*/
  /*padding: 2px;*/
  /*margin: 6px;*/
}

.slider-thumbnail {
  margin-bottom: 5px;
}
.slider-thumbnail .slick-item{
  padding: 10px;
  margin: 10px 6px;
}

.slider-thumbnail-collection {
  margin-bottom: 5px;
}
.slider-thumbnail-collection .slick-item{
  padding: 5px;
  margin: 6px;
}

.slider-thumbnail-collection.center img {
  opacity: 1;
}

.slider-thumbnail-collection.center .slick-center img{
  -moz-transform:scale(1);
  -ms-transform:scale(1);
  -o-transform:scale(1);
  -webkit-transform:scale(1);
  /*color:#e67e22;*/
  opacity:1;
  transform:scale(1);
  border: 0;
}



.slick-prev:before,
.slick-next:before {
  /*color: #333;*/
  color: black;
  font-family: "Line Awesome Free";
  font-size: 36px;
  font-weight: 900;
}


.slick-prev:before {
  content: "\f104";
}

.slick-next:before {
  content: "\f105";
}

.slick-arrow {
  width: 32px;
  height: 40px;
  z-index: 5;
  top: 50%;
  min-width: 0;

}

.slick-prev {
  left: 0;
  border-top-left-radius: inherit;
  border-bottom-left-radius: inherit;
}

.slick-next {
  right: 0;
  border-top-right-radius: inherit;
  border-bottom-right-radius: inherit;
}

.slider-collection .slick-arrow {
  top: 38%;
  /*width: 32px;*/
  /*height: 40px;*/
}

.slider-collection .slick-prev:before {
  /*content: "\f053";*/
}

.slider-collection .slick-next:before {
  /*content: "\f054";*/
}

.slider-collection .slick-prev {
  left: 7px;
}
.slider-collection .slick-next {
  right: 7px;
}
.slider-collection .fabricbox {
  margin-left: 10px;
  margin-right: 10px;
}
@media screen and (max-width: 767px){
	.slider-collection .fabricbox {
	  margin-left: 4px;
	  margin-right: 4px;
	}

  .slider-collection .arrow-left {
    width: 50px !important;
    height: 50px !important;
    margin-left: 0px;
  }

  .slider-collection .arrow-right {
    width: 50px !important;
    height: 50px !important;
    margin-right: 0px;
    -webkit-transform: translate(0, -50%) scaleX(-1) !important;
    -ms-transform: translate(0, -50%) scaleX(-1) !important;
  }
}


/**!
* Caption Styles
*/

.caption-item {  
  right: 0;
  margin: 0px;
  padding: 0px;
}

.caption-link {
  display: block;
  position: relative;
  margin: 0 auto;
  /*max-width: 400px;*/
}

.caption-link .caption-layer {
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0;
  -webkit-transition: all ease .5s;
  -moz-transition: all ease .5s;
  transition: all ease .5s;
}

.caption-layer.green {
  background: rgba(173, 219, 50, .25);
}

.caption-layer.blue {
  background: rgba(152, 231, 254, .25);
}

.caption-layer.grey {
  /*background: rgba(0, 0, 0, 0.25);*/
  /*background-color: rgba(0, 0, 0, 0.1);*/
}

.caption-link .caption-layer:hover,
.caption-layer.video-icon {
  opacity: 1;
}

.caption-link .caption-layer .caption-content {
  position: absolute;
  top: 0;
  /*bottom: 30px;*/
  width: 100%;
  text-align: center;
  font-size: 24px;
  color: #fff;
}

.slick-dots {
  background-color: rgba(0, 0, 0, 0.25);
  bottom: 6px;
  left: 0px;
  color: #fff;
  opacity: 0.7;
  /*line-height: 20px;*/
  text-align: right;
  padding-right: 4px;
  padding-top: 2px;
}
.slick-dots li {
  height: 18px;
}

.slick-dots li button{
  height: 18px;
}

.slick-dots li button:before {
  background-color: black;
  height: 12px;
  content: '';
  opacity: 1;
}
.slick-dots li.slick-active button:before {
  opacity: 1;
  background-color: white;
}

.slick-dotted.slick-slider {
  margin-bottom: 0px;
}

.slider {
  opacity: 0;
/*display the slider till loaded*/
  visibility: hidden;
  transition: opacity 0.2s ease;
  -webkit-transition: opacity 0.2s ease;
}

.slider.slick-initialized {
  /*display the slider till loaded*/
  visibility: visible;
  opacity: 1;
}

.center .slick-center img{
  -moz-transform:scale(1.10);
  -ms-transform:scale(1.10);
  -o-transform:scale(1.10);
  -webkit-transform:scale(1.10);
  /*color:#e67e22;*/
  opacity:1;
  transform:scale(1.10);
  border: solid 2px #FC746D;
}

.center img{
  opacity:0.5;
  transition:all 300ms ease;
  padding: 1px;
}


@media (max-width: 767px) {
  .slider-main .slick {
    height: 30vh; /* Set the tracks height to 50% of the view port height */
  }
  .slider-main .slick-track
  {
    display: flex !important;
    align-items: center;
    justify-content: center;
    height: 30vh; /* Set the tracks height to 50% of the view port height */
  }

  .slider-main .slick-slide
  {
    display: flex!important;
    height: inherit !important;
  }

  .slider-main .slick-slide img {
    object-fit: cover; /* be aware that this doesn't work on IE */
    object-position: 25% 0;
    height: 30vh;
    /*width: 50%;*/
  }
}

.slider-main {
  opacity: 0;
  visibility: hidden;
  transition: opacity 1s ease;
  -webkit-transition: opacity 1s ease;
}

.slider-main.slick-initialized {
  visibility: visible;
  opacity: 1;
}



@media (max-width: 767px) {
    .slider-category .slick {
        height: 15vh; /* Set the tracks height to 50% of the view port height */
    }
    .slider-category .slick-track
    {
        display: flex !important;
        align-items: center;
        justify-content: center;
        height: 15vh; /* Set the tracks height to 50% of the view port height */
    }

    .slider-category .slick-slide
    {
        display: flex!important;
        height: inherit !important;
    }

    .slider-category .slick-slide img {
        object-fit: cover; /* be aware that this doesn't work on IE */
        object-position: 25% 0;
        height: 15vh;
        /*width: 50%;*/
    }
}

@media (max-width: 767px){
    .banner-dots {
        background-color: transparent !important;
    }
    .banner-dots button:before {
        border-radius: 50% !important;
        height: 12px !important;
        width: 12px !important;
    }
}
@media (min-width: 767px){
    .banner-dots {
        background-color: transparent !important;
        padding-right: 80px !important;
        bottom: 30px !important;
    }
    .banner-dots button:before {
        border-radius: 50% !important;
        height: 18px !important;
        width: 18px !important;
        bottom: 30px !important;
    }
}



.banner-dots button:before {
    background-color: #666666 !important;
}

.banner-dots .slick-active button:before {
    background-color: #de9285 !important;
}

.arrow-left {
    width: 68px !important;
    height: 68px !important;
    margin-left: 20px;
}

.arrow-right {
    width: 68px !important;
    height: 68px !important;
    margin-right: 20px;
    -webkit-transform: translate(0, -50%) scaleX(-1) !important;
    -ms-transform: translate(0, -50%) scaleX(-1) !important;
}

.small-arraw > .arrow-left {
    width: 40px !important;
    height: 40px !important;
}

.small-arraw > .arrow-right {
    width: 40px !important;
    height: 40px !important;
}
