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

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