/* =======================================================
   nav-centered.css
   Centers the main navigation menu on large viewports while
   keeping the logo pinned left and mobile behaviour unchanged.
   ======================================================= */

@media (min-width: 992px) {
  .main-nav .nav-inner {
    position: relative;
  }

  .main-nav .navbar-brand {
    left: 15px;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    z-index: 2;
  }

  .main-nav .navbar-collapse {
    flex-basis: 100%;
    justify-content: center !important;
  }

  .main-nav .main-nav-list {
    margin-left: auto;
    margin-right: auto;
  }
}

@media (max-width: 991.98px) {
  .main-nav .navbar-brand {
    position: static;
    transform: none;
  }
}