<div class="slider-container d-none d-sm-block bg-dark" data-width="1900" data-height="1224">
  
  <div class="loading-slide" style="background-color: #000;
  background-image: url(assets/img/logo-light-center.svg);
  background-size: auto 100%;
  background-repeat: no-repeat;
  background-position: top right;transition: all 2s ease;position: absolute;width: 100%;z-index: 10;">
  </div>  

  <div class="slide active"><a href="" target=""> <img alt="" src="assets/img/slider-01.webp" title="" class="d-none d-sm-block w-100"/></a></div>
  <div class="slide"><a href="" target=""> <img alt="" src="assets/img/slider-02.webp" title="" class="d-none d-sm-block w-100"/></a></div>
  <div class="slide"><a href="" target=""> <img alt="" src="assets/img/slider-03.webp" title="" class="d-none d-sm-block w-100"/></a></div>
  <div class="slide"><a href="" target=""> <img alt="" src="assets/img/slider-04.webp" title="" class="d-none d-sm-block w-100"/></a></div>

  <button class="carousel-control-prev" type="button" id="prevBtn">
    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
    <span class="visually-hidden">Previous</span>
  </button>
  <button class="carousel-control-next" type="button" id="nextBtn">
    <span class="carousel-control-next-icon" aria-hidden="true"></span>
    <span class="visually-hidden">Next</span>
  </button>
 
</div>

<div class="slider-container-mobile d-block d-sm-none" data-width="600" data-height="800" >


  <div class="loading-slide-mobile" style="background-color: #000;
  background-image: url(assets/img/loading.gif);
  background-size: auto 100%;
  background-repeat: no-repeat;
  background-position: top right;transition: all 2s ease;position: absolute;width: 100%;z-index: 10;">
  </div>  

  <div class="slide-mobile active"><a href="" target=""><img alt="assets/img/slider-01.jpg" src="assets/img/slider-01-mobile.jpg" title="" class="w-100"/></a></div>
  <div class="slide-mobile "><a href="" target=""><img alt="assets/img/slider-02.jpg" src="assets/img/slider-02-mobile.jpg" title="" class="w-100"/></a></div>
  <div class="slide-mobile "><a href="" target=""><img alt="assets/img/slider-03.jpg" src="assets/img/slider-03-mobile.jpg" title="" class="w-100"/></a></div>


  <button class="carousel-control-prev" type="button" id="prevBtnM">
    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
    <span class="visually-hidden">Previous</span>
  </button>
  <button class="carousel-control-next" type="button" id="nextBtnM">
    <span class="carousel-control-next-icon" aria-hidden="true"></span>
    <span class="visually-hidden">Next</span>
  </button>

</div>