/*---- Slider -----*/
.sliderBG{
    height: 70vh;
    overflow: hidden;
}
      .slider-container {
        position: relative;
        height: 100%;
        -webkit-user-select: none;
           -moz-user-select: none;
            -ms-user-select: none;
                user-select: none;
        cursor: all-scroll;
      }
      .slider-pagi {
        position: absolute;
        z-index: 3;
        right: -37px;
        top: 45%;
        font-size: 0;
        list-style-type: none;
        transform: rotate(90deg);
      }
      .slider-pagi__elem {
        position: relative;
        display: inline-block;
        vertical-align: top;
        width: .7rem;
        height: .7rem;
        margin: 0 0.5rem;
        border-radius: 50%;
        border: 2px solid #fff;
        cursor: pointer;
      }
      .slider-pagi__elem:before {
        content: "";
        position: absolute;
        left: 50%;
        top: 50%;
        width: .7rem;
        height: .7rem;
        background: #fff;
        border-radius: 50%;
        transition: transform 0.3s;
        transform: translate(-50%, -50%) scale(0);
      }
      .slider-pagi__elem.active:before, .slider-pagi__elem:hover:before {
        transform: translate(-50%, -50%) scale(1);
      }
      
      .slider {
        z-index: 1;
        position: relative;
        height: 100%;
      }
      .slider.animating {
        transition: transform 0.5s;
        will-change: transform;
      }
      .slider.animating .slide__bg {
        transition: transform 0.5s;
        will-change: transform;
      }
      
      .slide {
        position: absolute;
        top: 0;
        width: 100%;
        height: 100%;
        overflow: hidden;
      }
      
      .slide__bg {
        position: absolute;
        top: 0;
        left: -50%;
        width: 100%;
        height: 100%;
        background-size: cover;
        will-change: transform;
      }
      .slide:nth-child(1) {
        left: 0;
      }
      .slide:nth-child(1) .slide__bg {
        left: 0;
        background-image: url("../images/slideBanner.jpg");
        background-size: cover;
      }
      .slide:nth-child(1) .slide__overlay-path {
        fill: #e99c7e;
      }
      
      .slide:nth-child(2) {
        left: 100%;
      }
      .slide:nth-child(2) .slide__bg {
        left: -50%;
        background-image: url("../images/slideBanner2.jpg");
        background-size: cover;
      }
      .slide:nth-child(2) .slide__overlay-path {
        fill: #e1ccae;
      }
      
      .slide:nth-child(3) {
        left: 200%;
      }
      .slide:nth-child(3) .slide__bg {
        left: -100%;
        background-image: url("../images/slideBanner3.jpg");
        background-size: cover;
      }
      .slide:nth-child(3) .slide__overlay-path {
        fill: #adc5cd;
      }

      .slide:nth-child(4) {
        left: 300%;
      }
      .slide:nth-child(4) .slide__bg {
        left: -150%;
        background-image: url("../images/slideBanner4.jpg");
        background-size: cover;
      }
      .slide:nth-child(4) .slide__overlay-path {
        fill: #cbc6c3;
      }


@media (max-width:820px){
.sliderBG{
    height: 37vh;
}
    .slider-pagi {
        left: 50%;
        bottom: 0;
        right: auto;
        top: auto;
        transform: translateX(-50%);
    }
}
@media (max-width:567px){
    .sliderBG {
        height: 26vh;
    }
}