xrpl-dev-portal/styles/_top-nav.scss

/* Top navigation ----------------------------------------------------------- */

.navbar.fixed-top {
  box-shadow: inset 0 -1px 0 0 $gray-200;
}

.navbar .navbar-nav .nav-link {
  color: $gray-600;
}

.navbar .navbar-nav .nav-link:hover,
.navbar .navbar-nav .nav-link:active,
.navbar .navbar-nav .active .nav-link,
.navbar .active-parent .nav-link {
  color: $black;
}

.navbar.fixed-top {
  font-weight: 400;
  padding: 0;
  margin: 0 48px;
}

@media (max-width: 1105px) {
  .navbar.fixed-top {
    margin: 0 20px;
  }
  .navbar .navbar-nav .nav-link {
    padding-right: 5px;
  }
}

.navbar-brand {
  text-decoration: none;
  white-space: pre;
  -webkit-transition: opacity 200ms ease, color 200ms ease;
  transition: opacity 200ms ease, color 200ms ease;
}
.navbar-brand:hover {
  opacity: 0.5;
}

.navbar .navbar-nav .nav-link {
  font-size: 1rem;
  line-height: 52px;
  text-decoration: none;
  font-family: 'Space Mono', monospace;
}

.navbar .navbar-nav .nav-link:hover {
  background-color: transparent;
  box-shadow: inset 0 -1px 0 0 #000;
  text-decoration: none;
}

.navbar .navbar-nav .active a {
  font-weight: 700;
  box-shadow: inset 0 -1px 0 0 #000;
}
.navbar .active-parent a {
  font-weight: 700;
  box-shadow: inset 0 -1px 0 0 #000;
}

#navbar-search {
  position: relative;
  margin-right: 0.375rem;
}

#navbar-search .form-inline {
  min-width: 224px; /* more room for placeholder text */
}

#topsearchbar {
  padding-right: 40px;
  width: 100%;
  font-size: 0.875rem;
}

#navbar-search .btn {
  position: absolute;
  right: 0;
}

/* Top navigation Mobile ----------------------------------------------------------- */
@media (max-width: 991px) {

  .navbar .navbar-nav .nav-link {
    height: 48px;
  }
  .github-edit-wrap {
    margin: 20px 10px 20px 0;
  }

  #navbar-search .btn::after {
    display: none;
  }

  .navbar-collapse {
    background-color: white;
    position: absolute;
    top: 200px;
    right: 0;
    overflow: scroll;
    width: 260px;
    max-height: 60vh;
    margin-right: 24px;
    margin-bottom: 108px;
    padding: 24px;
    -webkit-box-flex: 1;
    z-index: 10;

    transform: translateX(1000px);
    transition-duration: 1s;
  }

  .navbar-collapse.show {
    transform: translateX(0px);
    transition-duration: 0.5s;
  }

  .menu-overlay.active {
    transform: translateX(0px);
    transition-duration: 0.5s;
  }

  .menu-overlay {
    background-color: black;
    bottom: 0;
    left: 0;
    opacity: 0.88;
    filter: alpha(opacity=80);
    /* IE7 & 8 */
    position: fixed;
    right: 0;
    top: 0;
    z-index: 5;
    transform: translateX(1000px);
    transition-duration: 0.5s;
  }

}

/* Push content below fixed header ------------------------------------------ */
#main_content_wrapper {
  margin-top: 68px;
  padding: 0 48px;
}

/* Fix so anchors don't jump under the fixed header ------------------------- */
.main h1:before,
.main h2:before,
.main h3:before,
.main h4:before,
.main h5:before,
.main h6:before,
#main_content_wrapper:before,
.interactive-block:before {
  display: block;
  content: " ";
  margin-top: -67px;
  height: 67px;
  visibility: hidden;
}

.card h1:before,
.card h2:before,
.card h3:before,
.card h4:before,
.card h5:before,
.card h6:before {
  display: none;
}


@media (max-width: 1010px) {
  .navbar-brand,
  .github-edit-wrap,
  #navbar-search {
    margin-right: 3px;
  }
}

#navbarHolder .language-selector .btn {
  font-size: 0.875rem;
  padding: .375rem .75rem;
}