.tab {
  position: relative;
  padding: 0;
  margin: 0 0 -1px;
  letter-spacing: -.4em;
  list-style: none;

  > li {
    position: relative;
    display: inline-block;
    margin: 0 0 0 -1px;
    letter-spacing: normal;
    background-color: $white;
    border: 1px solid $border-color;

    &:first-child {
      margin-left: 0;
    }

    &.is-active {
      border-bottom-color: $white;

      a {
        color: $black;
        cursor: default;
        background-color: $white;
      }
    }
  }

  a {
    display: block;
    padding: 10px 15px;
    background-color: $white-gray;

    &:hover {
      text-decoration: none;
      background-color: $gray-white;
    }
  }
}

.tab-content {
  padding: 20px 25px;
  background-color: $white;
  border: 1px solid $border-color;
}

.tab-pane {
  display: none;

  &.is-active {
    display: block;
  }
}
