.tabs_stack {
  @include rem(margin-bottom, 30px);
}

.tab_item {
  display: inline-block;
  vertical-align: top;
  font-weight: $fw-semi;
  border-radius: 100px;
  color: rgba($secondary, .6);
  text-transform: uppercase;
  letter-spacing: .07em;
  font-family: $ff;
  border: 1px solid transparent;

  @include rem(font-size, 15px);
  @include rem(margin-bottom, 10px);
  @include transition(all .3s ease);

  &:focus {
    text-decoration: none;
    color: rgba($secondary, .6);
  }

  &__link {
    display: block;
    color: rgba($secondary, .6);

    @include rem(padding, 7px 22px);

    &:hover {
      color: rgba($secondary, 1);
    }

    &:focus {
      text-decoration: none;
      color: rgba($secondary, .6);
    }
  }

  &--active {
    color: #fff;
    background: $primary;
    border-color: $primary;

    .tab_item__link {
      color: #fff;
    }
  }

  &:hover {
    text-decoration: none;
  }
}