@keyframes tonext {
  75% {
    left: 0;
  }
  95% {
    left: 100%;
  }
  98% {
    left: 100%;
  }
  99% {
    left: 0;
  }
}
@keyframes tostart {
  75% {
    left: 0;
  }
  95% {
    left: -300%;
  }
  98% {
    left: -300%;
  }
  99% {
    left: 0;
  }
}
@keyframes snap {
  96% {
    scroll-snap-align: center;
  }
  97% {
    scroll-snap-align: none;
  }
  99% {
    scroll-snap-align: none;
  }
  100% {
    scroll-snap-align: center;
  }
}
* {
  box-sizing: border-box;
  scrollbar-color: transparent transparent; /* thumb and track color */
  scrollbar-width: 0px;
}

.carousel__viewport {
  display: flex;
}

.carousel__slide {
  position: relative;
  flex: 0 0 100%;
  width: 100%;
  counter-increment: item;
}

.carousel__slide.hidden {
  display: none !important;
}

.carousel__slide.display {
  display: grid !important;
}

.carousel__slide.hide {
  animation: fadding ease 3s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}

.carousel__slide.view {
  animation: appearing ease 3s;
  animation-iteration-count: 1;
  animation-fill-mode: forwards;
}

@keyframes fadding {
  from {
    opacity: 1;
  }
  to {
    opacity: 0;
  }
}
@keyframes appearing {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}/*# sourceMappingURL=carousel.css.map */