.slide-navigation {
  width: 100%;
  height: 100%;
  display: flex;
}


.slide-navigation>div {
  width: 100%;
  height: 100%;
  display: none;
  position: absolute;
  transition: 0.8s;
  left: 0%;
}

#current-slide,
#beforeend-slide,
#afterbegin-slide {
  display: block;
}

#current-slide.animate-to-beforeend,
#afterbegin-slide {
  left: -100%;
}

#current-slide.animate-to-afterbegin,
#beforeend-slide {
  left: 100%;
}

#beforeend-slide.animate,
#afterbegin-slide.animate {
  left: 0;
}