/* Shared header states for every page. */
body #mainNav {
  background: #282866 !important;
  transition: background-color .3s ease, padding .3s ease, box-shadow .3s ease;
}

body #mainNav:not(.scrolled) .navbar-brand { color: #fff !important; }
body #mainNav:not(.scrolled) .navbar-brand span { color: #ff5b55 !important; }
body #mainNav:not(.scrolled) .navbar-nav .nav-link { color: #fff !important; opacity: 1 !important; }
body #mainNav:not(.scrolled) .btn-login { color: #fff !important; border-color: rgba(255,255,255,.8) !important; }

body #mainNav.scrolled {
  background: #fff !important;
  padding-top: 12px !important;
  padding-bottom: 12px !important;
  box-shadow: 0 8px 35px rgba(7, 17, 45, .12) !important;
}

body #mainNav.scrolled .navbar-brand {
  color: #282866 !important;
}

body #mainNav.scrolled .navbar-brand span {
  color: #ff5b55 !important;
}

body #mainNav.scrolled .navbar-nav .nav-link {
  color: #1b1642 !important;
  opacity: 1 !important;
}

body #mainNav.scrolled .navbar-nav .nav-link:hover,
body #mainNav.scrolled .navbar-nav .nav-link.active {
  color: #cc302b !important;
}

body #mainNav.scrolled .navbar-nav .nav-link::after {
  background: #cc302b !important;
}

body #mainNav.scrolled .btn-login {
  color: #fff !important;
  background: #cc302b !important;
  border-color: #cc302b !important;
}

/* Styles previously injected with the shared components script. */
.price-card .btn-outline-light {
  color: #1b1642;
  background: #fff;
  border-color: #d9dbe5;
}

.price-card .btn-outline-light:hover,
.price-card.featured .btn-light {
  color: #fff;
  background: #cc302b;
  border-color: #cc302b;
}

@media (max-width: 991.98px) {
  body #mainNav,
  body #mainNav.scrolled {
    background: #fff !important;
  }

  body #mainNav .navbar-brand { color: #282866 !important; }
  body #mainNav .navbar-nav .nav-link { color: #1b1642 !important; }
}