.carousel {
  position: relative;
  max-width: 500px;
  overflow: hidden;
}
.carousel img {
  width: 100%;
  display: none;
}
.carousel img.active {
  border: 1px solid #E44C65;
  border-radius: 8px;
  display: block;
}
.carousel-controls {
  text-align: center;
  /* position: absolute; */
  /* top: 40%; */
  /* width: 100%; */
  /* display: flex; */
  /* justify-content: space-between; */
  /* transform: translateY(-50%); */
  /* background-color: black; */
}
.carousel-controls button {
  background-color: rgba(173, 164, 164, 0.7);
  margin: 0.5rem;
  /* border: none; */
  cursor: pointer;

}

.carousel-controls button img {
  display: block;
  width: 24px;
  height: 24px;
}
@media screen and (max-width: 768px) {
  .carousel-controls{
    top: 60%;
    width: 100%;
  }
  .carousel-controls button img {
    width: 18px;
    height: 20px;
    /* border: none; */
  }
}