/* ------ SLIDESHOW ------ */

.slideshow{
  position: relative;
  overflow: hidden;
  margin: 20px 0;
}
.slideshow .images{
  position: relative;
  height: 55vh;
}
.slideshow .controls #right,
.slideshow .controls #left{
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
.slideshow .controls #right{
  right: 0;
}
.slideshow .controls #left{
  left: 0;
}
.slideshow img.hidden{
  z-index: -2;
  display: none;
  opacity: 0;
  transition: all .8s cubic-bezier(0.42, 0, 0.15, 1.4);
}
.slideshow img{
  position: absolute;
  /* height: 100%; */
  max-width: 100%;
  max-height: 50vh;
  width: fit-content;
  aspect-ratio: original;
  top: 50%;
  left: 50%;
  z-index: 1;
  opacity: 1;
  transition: all .8s cubic-bezier(0.42, 0, 0.15, 1.4);
  transform: translateX(-50%) translateY(-50%);
}
/* .slideshow img#thin{
  width: unset;
  height: unset;
  height: min-content;
  width: auto;
} */
/* .slideshow img.next,
.slideshow img.prev{
  z-index: 0;
} */
.slideshow img.next{
  z-index: 0;
  transform: scale(50%) translateX(300%);
}
.slideshow img.next#thin{
  transform: scale(50%) translateX(1000%);
}
.slideshow img.prev{
  z-index: -1;
  transform: scale(50%) translateX(-520%);
}
.slideshow img.prev#thin{
  transform: scale(50%) translateX(-2000%);
}

.slideshow .controls button{
  z-index: 2;
  width: 50px;
  height: 50px;
  padding: 5px;
  margin: 5px;
  background-color: var(--shadow);
  opacity: 0.5;
  border: 2px solid;
  border-color: var(--acchot);
  color: var(--txt);
  /* transition: transform .8s cubic-bezier(0.42, 0, 0.15, 1.4); */
  transition-delay: 0s;
  transition-duration: 0.3s;
}
.slideshow .controls button:hover{
  transition-delay: 0s;
  transition-duration: 0.3s;
  opacity: 1;
}

.slideshowtext{
  position: relative;
  width: 100%;
  overflow: hidden;
  margin: 50px 0;
}
.slideshowtext > div{
  position: relative;
  width: 100%;
  transform: translateX(0%) scale(100%);
  transition: transform .8s cubic-bezier(0.42, 0, 0.15, 1.4), opacity .8s ease-in-out;
}
.slideshowtext .hidden{
  display: none;
}
.slideshowtext .next,
.slideshowtext .prev{
  position: absolute;
  top: 0;
  opacity: 0;
}
.slideshowtext .next{
  transform: translateX(100%) scale(80%);
}
.slideshowtext .prev{
  transform: translateX(-100%) scale(80%);
}

.slideshowtext .title,
.slide-elem .title{
  display: block;
  width: 100%;
  text-align: center;
  font-size: 2em;
  color: var(--txt);
}

.slideshowtext .description,
.slide-elem .description{
  max-width: 100%;
  text-wrap:balance;
}

.slide-elem img{
  max-height: 50vh;
  max-height: 50dvh;
}
.slide-elem :not(img){
  margin: 0 0 3rem;
}