/* ------------------ Header ------------------ */

nav {
  &.bg-primary {
    background-color: $headerbg !important;
    padding: 0;
  }
  .navbar-brand {
    background: $white;
  }
}

#navbar-top {
  padding: 0 1rem;
}

.navbar {
  .navbar-nav, .nav {
    .nav-item {
      padding: 0px 5px;
      .nav-link {
        color: $white !important;
        text-transform: uppercase;
        font-size: 12px;
        padding: 8px 20px;
        &:hover, &.is-active {
          color: $primary !important;
          background: $white;
          border-radius: 20px;
        }
      }
    }
  }
  .primary-menu {
    margin: 0 15px 0 auto;
  }
}

#navbar-top.navbar-dark .nav-link:hover,
#navbar-top.navbar-dark .nav-link:focus {
  color: rgba(255, 255, 255, 0.75);
}

#navbar-top.navbar-dark .nav-link {
  color: rgba(255, 255, 255, 0.5);
}

#navbar-top.navbar-light .nav-link:hover,
#navbar-top.navbar-light .nav-link:focus {
  color: rgba(0, 0, 0, 0.7);
}

#navbar-top.navbar-light .nav-link {
  color: rgba(0, 0, 0, 0.5);
}

.navbar-brand .site-logo {
  margin-right: 1rem;
}

@media (max-width: 33.9em) {
  .navbar-toggleable-xs .navbar-nav .nav-item+.nav-item,
  .navbar-toggleable-xs.collapse.in .navbar-nav .nav-item {
    margin-left: 0;
    float: none;
  }
}

@media (max-width: 47.9em) {
  .navbar-toggleable-sm .navbar-nav .nav-item+.nav-item,
  .navbar-toggleable-xs.collapse.in .navbar-nav .nav-item {
    margin-left: 0;
    float: none;
  }
}

@media (max-width: 767px) {
  .navbar-collapse.collapse.show {
    position: absolute;
    z-index: 1111;
    width: 100%;
    right: 0px;
    background: #ee4723;
    padding: 10px;
    top: 100%;
  }
}
