

/* (PART A) SLIDES CONTAINER */
.slides {
  position: relative;
  max-width: 600px; height: 400px;
  text-align: center;
  margin: 0 auto;
}

/* (PART B) SHARED */
.slides figure, .slides figcaption, .slides .last, .slides .next { position: absolute; }
.slides figure, .slides img { width: 100%; height: 100%; }

/* (PART C) SLIDES */
.slides figure {
  top: 0; left: 0;
  padding: 0; margin: 0;
  visibility: hidden; opacity: 0;
  transition: all 0.5s;
}
.slides figure.show {
  visibility: visible; opacity: 1;
}
.slides img {
  object-fit: cover;
}
.slides figcaption1 {
  bottom: 0; left: 0;
  width: 100%; padding: 10px;
  color: #fff; background: rgba(0, 0, 0, 0.7);
}

/* (PART D) LAST/NEXT BUTTONS */
.slides .last, .slides .next {
  display: flex; align-items: center; justify-content: center;
  font-size: 20px; color: #fff; background: rgba(0, 0, 0, 0.7);
  width: 40px; height: 40px; border-radius: 50%;
  z-index: 9; top: 50%; transform: translateY(-50%);
  cursor: pointer;
}
.slides .last { left: 10px; }
.slides .next { right: 10px; }

/* (PART X) ENTIRE PAGE */
* {
  font-family: Arial, Helvetica, sans-serif;
  box-sizing: border-box;
}
.centerslide {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
}