//
// CAROUSEL
//

.carousel {
  @include touch-action(pan-y);

  overflow:hidden;
  position:relative;
  text-align: center;
}

.carousel-scroller {
  @include transition(all ease-out);
  @include transform(translate3d(0,0,0));
  vertical-align: top;
  text-align: left;
  overflow:hidden;
}

.carousel-page {
  overflow: hidden;
  vertical-align: top;
}

.carousel-pagination {
  -webkit-backface-visibility:hidden;
  -webkit-transition: -webkit-transform 2s;
  -moz-transition: -moz-transform 2s;
  transition: transform 2s;

  position:absolute;
  bottom: $carousel-pagination-size/2;
  height: $carousel-pagination-size;
  line-height: 0;
  width: auto;
  white-space: nowrap;
}

.carousel-pagination-label + .carousel-pagination-label {
  margin-left: $carousel-pagination-size/2;
}

.carousel-pagination-label {
  @include border-radius($carousel-pagination-border-radius);
  @include background($carousel-pagination-background);
  @include box-sizing(border-box);

  border: rem(1) solid $carousel-pagination-border-color;
  text-align: center;

  display:inline-block;

  width: $carousel-pagination-size;
  height: $carousel-pagination-size;
  line-height: $carousel-pagination-size;
  overflow: hidden;

  color: $carousel-pagination-font-color;
  font-size: $carousel-pagination-font-size;
}

.carousel-pagination-label.active {
  @include background($carousel-pagination-active-background);
  border: rem(1) solid $carousel-pagination-active-border-color;
}