.carousel-wrapper {
  overflow: hidden !important;
  width: 100% !important;
}

.carousel-wrapper * {
  box-sizing: border-box !important;
}

.carousel {
  transform-style: preserve-3d !important;
}

.carousel__item {
  opacity: 0 !important;
  position: absolute !important;
  top:0 !important;
  width: 100% !important;
  margin: auto !important;
  padding: 0px !important;
  z-index: 100 !important;
  //transition: transform .5s, opacity .5s, z-index .5s;
  transition: opacity 1s;
}


.carousel__item.initial, .carousel__item.active {
  opacity: 1 !important;
  position: relative !important;
  z-index: 900 !important;
}

.carousel__photo.prev,
.carousel__photo.next {
  z-index: 800 !important;
}

//.carousel__item.prev {
//  transform: translateX(-100%) !important; /* Move 'prev' item to the left */
//}
//.carousel__item.next {
//  transform: translateX(100%) !important; /* Move 'next' item to the right */
//}

.carousel__button--prev,
.carousel__button--next {
  display: none !important;
  margin: 10px !important;
  position: absolute !important;
  top:10% !important;
  width: 2rem !important;
  height: 2rem !important;
  background-color: #fff0 !important;
  transform: translateY(-50%) !important;
  border-radius: 50% !important;
  cursor: pointer !important; 
  z-index: 1000 !important; /* Sit on top of everything */
  border: 1px solid white !important;
}
.carousel__button--prev {
  left:0 !important;
}
.carousel__button--next {
  right:0 !important;
}
.carousel__button--prev::after,
.carousel__button--next::after {
  color: white;
  content: " " !important;
  position: absolute !important;
  width: 10px !important;
  height: 10px !important;
  top: 50% !important;
  left: 54% !important;
  border-right: 2px solid white !important;
  border-bottom: 2px solid white !important;
  transform: translate(-50%, -50%) rotate(135deg) !important;
}
.carousel__button--next::after {
  left: 47% !important;
  transform: translate(-50%, -50%) rotate(-45deg) !important;
}