/**
 * --------------------------------------------------------------------------------------------
 * FONT
 *
 * Apply font-size, line-height, and letter-spacing in one go.
 *
 * @usage
 *    @include font($font-size $line-height $letter-spacing);
 *    // All arguments are optional
 * --------------------------------------------------------------------------------------------
 */

.carousel {
  overflow: hidden;
}

.carousel__track {
  margin-left: auto;
  margin-right: auto;
  -webkit-transform: translateX(0);
  transform: translateX(0);
  will-change: transform;
}

.animatable .carousel__track {
  -webkit-transition: -webkit-transform 500ms cubic-bezier(.25, .46, .45, .94);
  transition: -webkit-transform 500ms cubic-bezier(.25, .46, .45, .94);
  transition: transform 500ms cubic-bezier(.25, .46, .45, .94);
  transition: transform 500ms cubic-bezier(.25, .46, .45, .94), -webkit-transform 500ms cubic-bezier(.25, .46, .45, .94);
}

@media (min-width: 750px) {
  .carousel__track {
    margin-right: 0;
  }
}

.carousel__item {
  -webkit-flex-shrink: 0;
  -ms-flex-negative: 0;
  flex-shrink: 0;
  margin-right: .75rem;
  -webkit-transition: opacity 500ms cubic-bezier(.455, .03, .515, .955);
  transition: opacity 500ms cubic-bezier(.455, .03, .515, .955);
}

@media (max-width: 749px) {
  .carousel__item {
    width: 100%;
  }
}

@media (min-width: 750px) {
  .carousel__item {
    margin-right: 1.625rem;
  }
}

@media (min-width: 1200px) {
  .carousel__item {
    margin-right: 1.6875rem;
  }
}

.carousel__item.is-inactive {
  pointer-events: none;
  opacity: .37;
}

@media (min-width: 750px) {
  .carousel__ctrls {
    margin-left: 75%;
  }
}

@media (min-width: 1200px) {
  .carousel__ctrls {
    margin-left: 80%;
  }
}

html[dir="rtl"] .carousel__ctrls {
  left: auto;
  right: 0;
  direction: ltr;
}

@media (min-width: 750px) {
  html[dir="rtl"] .carousel__ctrls {
    float: right;
    margin-left: 0;
    margin-right: 81.25%;
  }
}

@media (min-width: 1200px) {
  html[dir="rtl"] .carousel__ctrls {
    float: right;
    margin-left: 0;
    margin-right: 80%;
  }
}

.carousel__btn .icon {
  width: 1.4375rem;
  height: 1.4375rem;
}

.carousel__btn[disabled] {
  pointer-events: none;
}

.carousel__btn[disabled] .icon {
  fill: #d1d1d1;
}

.no-touch .carousel__btn:hover .icon {
  fill: #cd2026;
}

@media (min-width: 750px) {
  html[dir="rtl"] .carousel {
    margin-left: 0;
    margin-right: 25%;
  }
}

.carousel__dots {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  position: absolute;
  left: 0;
  bottom: 1.5625rem;
  width: 100%;
}

.carousel__dot {
  -webkit-transition: background-color .3s, -webkit-transform .3s;
  transition: background-color .3s, -webkit-transform .3s;
  transition: background-color .3s, transform .3s;
  transition: background-color .3s, transform .3s, -webkit-transform .3s;
  width: 10px;
  height: 10px;
  background-color: #d1d1d1;
  border-radius: 50%;
  overflow: hidden;
  -webkit-appearance: none;
}

.carousel__dot.active {
  -webkit-transform: scale(1.6);
  transform: scale(1.6);
  background-color: #e31c3d;
}

.carousel__dot + .carousel__dot {
  margin-left: 1.1875rem;
}

html[dir="rtl"] .carousel__dot + .carousel__dot {
  margin-left: 0;
  margin-right: 1.1875rem;
}

/*# sourceMappingURL=carousel.css.map */