header.site-header {
  position: fixed;

  top: 0;
  width: 100%;
  z-index: 99;
  background: linear-gradient(to right, rgba(#0a1724, .8) -50%, rgba(#172c4f, .5) 100%);
  transition: background 2s ease;
  nav.navbar {
    margin-bottom: 0;
    background-color: #0B1724;
    border-radius: 0;
    border: none;
    .navbar-collapse.in {
      background-color: #0B1724 !important;
      animation: fadeInUp .2s ease-in-out;
      position: fixed;
      @include position(0,0,0,0);
      padding: 20%;
      font-size: 1.2em;
      li {
        padding-bottom: 1em; } }
    .navbar-brand {
      font-weight: 600;
      color: white;
      z-index: 1; }
    .navbar-header {
      position: relative;
      z-index: 2; }
    .navbar-toggle {
      background-color: $brand-primary;
      border: solid 1px $brand-primary;
      color: white;
      &.collapsed {
        background-color: transparent;
        border: solid 1px rgba(white,.4);
        color: white; } }
    .navbar-nav {
      > li > a {
        padding-bottom: 0; }
      > .active > a {
        color: #1D96C7 !important;
        background-color: transparent; } } } }

.main-content {
  margin-top: $navbar-height; }