.carousel {
  color: #fff;
  --carousel-button-bg: transparent;
  --carousel-button-shadow: 0 2px 1px -1px rgba(0, 0, 0, 0.2),
    0 1px 1px 0 rgb(0 0 0 / 14%), 0 1px 3px 0 rgb(0 0 0 / 12%);
  --carousel-button-svg-width: 20px;
  --carousel-button-svg-height: 20px;
  --carousel-button-svg-stroke-width: 2.5;
}

.carousel .carousel__button:focus {
  outline: none;
  box-shadow: 0 0 0 4px #a78bfa;
}

.carousel .carousel__button.is-prev {
  left: -0.8rem;
}

.carousel .carousel__button.is-next {
  right: -0.8rem;
}

#myCarousel {
  max-height: calc(80vh);
}

#myCarousel .carousel__slide {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  position: relative;
  align-items: center;
  justify-content: center;
  padding: 36px 36px 18px 36px;
  overflow: hidden;
  box-sizing: border-box;
  user-select: none;
  -webkit-user-drag: none;
}

#myCarousel .carousel__slide figcaption {
  height: 20px;
}

#myCarousel .carousel__slide img {
  max-height: calc(80vh - 20px - 72px);
  max-width: calc(100% - 72px);
  object-fit: cover;
}