.slideshow-container {
  position: relative;
  width: 744px;
  height: 600px;
  margin: 20px auto;
  overflow: hidden;
  background: #fff;
}

.slideshow-container .slide {
  position: absolute;
  inset: 0;
  display: none;
  width: 100%;
  height: 100%;
  object-fit: contain;
  object-position: center;
}

.slideshow-container .slide:first-of-type { display: block; }

.slideshow-container .prev,
.slideshow-container .next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  padding: 16px;
  color: #0472ec;
  background: transparent;
  font-size: 18px;
  font-weight: bold;
  text-decoration: none;
  opacity: 0;
  transition: opacity 150ms ease;
}

.slideshow-container .prev { left: 0; }
.slideshow-container .next { right: 0; }
.slideshow-container:hover .prev,
.slideshow-container:hover .next,
.slideshow-container:focus-within .prev,
.slideshow-container:focus-within .next { opacity: 1; }

.vues > img,
.vues > iframe,
.vues > .slideshow-container {
  display: block;
  margin-top: 20px;
  margin-right: auto;
  margin-left: auto;
}

.video-portrait {
  display: block;
  margin: 20px auto 0;
}
