:root{
    --swiper-theme-color: var(--bs-primary);
    --carousel-height: 70vh;

    --swiper-theme-color: var(--bs-primary) !important;
    --swiper-navigation-sides-offset: 3rem;
    --swiper-navigation-size: 1rem;
}

@media (max-width: 991px) {
    :root{
        --swiper-navigation-sides-offset: 1.5rem;
        --carousel-height: 60vh;
    }
}

@media (max-width: 576px) {
    :root{
        --carousel-height: 40vh;
    }
}


.CarouselStandard .swiper-wrapper,
.CarouselStandard .swiper-container,
.CarouselStandard .swiper-container > .swiper-slide__content,
.CarouselStandard .swiper-slide {
    height: var(--carousel-height);
}

.CarouselStandard .swiper-wrapper {
    height: calc(var(--carousel-height) + 30px);
}

.CarouselStandard {
    padding: 0 var(--side-margin);
}

.swiper-button-next, .swiper-rtl .swiper-button-prev,
.swiper-button-prev, .swiper-rtl .swiper-button-next {
    border: 1px solid var(--bs-primary);
    width: 3rem;height: 3rem;
    border-radius: 50%;
}
.swiper-button-next, .swiper-button-prev {
    color: var(--bs-primary),
};

.CarouselStandard .swiper-container {
    position:relative;
    width: 90%;
    height: calc(var(--carousel-height) + 30px);
}
.CarouselStandard .swiper-container > .swiper-slide__content {
  position:absolute;
  top:0;
}

.CarouselStandard .swiper-slide {
  display:flex;
  align-items: center;
  justify-content:center;
  transition:all 200ms linear;
  transform: scale(0.6);
  opacity: 0;
  overflow: hidden;
}



.CarouselStandard .swiper-slide.swiper-slide-prev,
.CarouselStandard .swiper-slide.swiper-slide-next {
    transform: scale(0.85);
  opacity: 0.5;
}




.CarouselStandard .swiper-slide-active {
    transform: scale(1);
    opacity: 1;
  }



.CarouselStandard .carousel_slide_container {
    height: 0;
    border-radius: 25vw;
    width: 100%;
    padding-top: calc(100% * 2);
    padding-top: var(--carousel-height);
    margin: 0 auto;
    display: block;
    overflow: hidden;
    position: relative;
}

.CarouselStandard .swiper-slide .CarouselStandard__image,
.acf-block-preview .CarouselStandard img {
    position: absolute;
    width: 100%;
    height: 100%;
    object-fit: cover;
    left: 0;
    top: 0;
}








  /* PREVIEW */

  .acf-block-preview .CarouselStandard {
    width: 100%;
    height: 400px;
    overflow: hidden;
  }

  .acf-block-preview .swiper-wrapper {
    overflow: auto;
    white-space: nowrap;
  }

  .acf-block-preview .CarouselStandard .swiper-slide,
  .acf-block-preview .CarouselStandard .carousel_slide_container {
    position: relative;
    width: 350px;
    height: auto;
    display: inline-block;
    border-radius: 25vw;
    opacity: 1;
  }
