.carousel-container {
  .carousel {
    position: relative;
  }

  .carousel-item:not(.active) {
    display: none;
  }

  .carousel-buttons {
    display: flex;
    justify-content: center;
  }

  .carousel-button {
    border: 1px solid;
    @include usevar(border-color, dimmer-color);
    cursor: pointer;

    transition: all 100ms ease-in-out;

    &:hover {
      @include usevar(background-color, dimmest-color);
    }

    &.active {
      @include usevar(border-color, theme-color);
      @extend .w2;

      &:hover {
        @include usevar(background-color, theme-color-dimmest);
      }
    }
  }
}