.navbar-expand-lg {
  .nav-item {
    margin-left: 2px;
    a {
      &.nav-link {
        padding: 0 0 0 6px;
        margin: 8px 0 8px 0;
        border-left: 6px transparent solid;
        &.active {
          border-left: 6px $secondary solid;
          border-bottom: none;
        }
        &:hover, &:active {
          color: $primary !important;
          border-left: 6px $secondary solid;
          border-bottom: none;
        }
      }
    }
  }
}

@include media-breakpoint-up(lg) {
  .navbar-expand-lg {
    .nav-item {
      margin-left: 0;
      a {
        &.nav-link {
          padding: 0 0 2px 0;
          margin: 0 12px 0 12px;
          border-left: none;
          border-top: 6px transparent solid;
          border-bottom: 6px transparent solid;
          &.active {
            border-left: none;
            border-bottom: 6px $secondary solid;
          }
          &:hover, &:active {
            color: $primary !important;
            border-left: none;
            border-bottom: 6px $secondary solid;
          }
        }
      }
    }
  }
}