/***************** OWL - SLIDER ***************/
.custom-next {
  background: url('./../assets/images/sliders/arrow_left_black.png') no-repeat;
  height: 55px;
  width: 31px;
}

.owl-next {
  position: absolute;
  top: 30%;
  left: calc(-5vw + 10px);
}

.custom-previous {
  background: url('./../assets/images/sliders/arrow_right_black.png') no-repeat;
  height: 55px;
  width: 31px;
}

.owl-prev {
  position: absolute;
  top: 30%;
  right: calc(-5vw + 10px);
}

.owl-prev:hover, .owl-next:hover {
  background: transparent !important;
}

.owl-item {
  display: flex !important;
  justify-content: center !important;
}

@media screen and (max-width: 1024px) {
  .custom-previous, .custom-next {
    background-size: 55% 55%;
    background-position-y: center;
    background-position-x: center;  
  }

  .owl-prev { right: calc(-5vw - 5px); }
  .owl-next { left: calc(-5vw - 5px); }
}

@media screen and (min-width: 1920px) { 
  .owl-prev { right: -5vw; }
  .owl-next { left: -5vw; }
}



/***************** ROYAL-SLIDER ***************/
.royalSlider .rsNav {
  position: absolute;
  right: 0;
  top: 0;
}

.royalSlider .rsThumbs {
  width: 390px;
  max-height: 100%;
}

.royalSlider .rsContent .rsABlock {
  background-color: rgba(0, 0, 0, 0.5);
  position: absolute;
  top: auto;
  bottom: 0px;
  width: 100%;
  color: #ffffff;
  text-align: right;
  direction: rtl;
}

.rsThumbsArrow.rsThumbsArrowRight {
  display: none;
}

.rsThumbsArrow.rsThumbsArrowLeft {
  display: none;
}

.rsThumbsArrow.rsThumbsArrowLeft .rsThumbsArrowIcn,
.rsThumbsArrow.rsThumbsArrowRight .rsThumbsArrowIcn {
  justify-content: center;
  display: flex;
  align-items: center;
  height: 100%;
}

.rsThumbsArrow.rsThumbsArrowLeft.rsThumbsArrowDisabled,
.rsThumbsArrow.rsThumbsArrowRight.rsThumbsArrowDisabled {
  display: none;
}

@media screen and (max-width: 1024px) {
  
  .royalSlider .rsNav {
    position: relative;
    right: auto;
    top: auto;
  }

  .royalSlider .rsThumbs {
    max-height: 530px;
    width: 100%;
  }

  .royalSlider .rsContent img.rsImg {
    width: 100%;
    height: 100%;
    margin: 0;
  }

  .rsThumbs {
    left: 0;
    position: relative;
    width: 100%;
    height: auto;
  }
  
  .rsThumbsContainer {
    height: auto !important;
  } 
  
  .rsThumb {
    width: 100%;
  }
}

@media screen and (min-width: 1440px) { 
  .royalSlider .rsThumbs {
    width: 500px;
    max-height: 100%;
  }
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .rsThumb {
    float: none;
  }
}