@import "assets/ngx-tiny-slider";
// Variables
$border-color-hover: #bfbfbf;
$border-color-active: #808080;

// Slider wrapper
.slider-wrapper {
  &-nav-center {
    position: relative;
    padding: 0 28px;

    .tns-controls {
      position: absolute;
      width: 100%;
      left: 0;
      top: 50%;

      [data-controls*='next'] {
        right: 0;
        position: absolute;
      }

      [data-controls*='prev'] {
        left: 0;
        position: absolute;
      }
    }
  }

  &-custom-nav-style {
    .tns-controls {
      button {
        width: 25px;
        height: 25px;
        color: $border-color-active;
        border-radius: 12px;
        border: 1px solid $border-color-active;
        padding: 0;
        font-size: 17px;
        outline: none;

        &:hover {
          background: $border-color-hover;
          color: #fff;
          border: 1px solid $border-color-hover;
        }
      }
    }
  }
}