.gatekeeper-navbar {
    position: relative;
    display: block;
    background-color: var(--nav-background);
    top: 0;
}

.gatekeeper-navbar ul {
    display: flex;
    align-items: center;
    align-content: center;
    list-style: none;
    padding: 0 2em;
    margin: 0;
    min-height: 4em;
}

.gatekeeper-brand {
  display: flex;
  align-items: center;
  height: 4rem;
}

.gatekeeper-brand a {
  display: block;
  width: max-content;
}

.gatekeeper-brand img {
    max-height: 2rem;
}

.gatekeeper-brand {
    margin: 0rem 2rem;
}

.gatekeeper-nav-item {
    margin: 0rem 0.5rem;
    border-radius: 0.5em;
}

.gatekeeper-nav-item a,
.gatekeeper-nav-item span,
.gatekeeper-nav-item a:hover {
    display: block;
    padding: 0.5rem 1rem;
    color: var(--nav-primary-text-color);
    text-align: center;
    text-decoration: none;
}

.gatekeeper-nav-item:hover {
    background-color: var(--nav-hover-background-color);
    color: black;
}

.gatekeeper-nav-item.active {
    background-color: var(--nav-active-background-color);
    color: white;
}

.gatekeeper-nav-item-right {
    margin-left: auto; 
}

.dropdown-toggle span {
    display: inline;
}

.dropdown-item {
    padding: 0.25em 1.5em;
}

.gatekeeper-toggler {
    display: none;
    position: absolute;
    top: 0;
    right: 0;
    margin: 0.75rem 1rem;
    color: rgba(255,255,255,.5);
    background-color: var(--nav-background);
    border-style: solid;
    border-radius: .25rem;
    border-width: 1px;
    border-color: var(--nav-icon-border-color);
    padding: .45rem .75rem;
}

.gatekeeper-icon {
    /*background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='30' height='30' viewBox='0 0 30 30'%3e%3cpath stroke='rgba(255, 255, 255, 0.5)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");*/
    background-image: var(--nav-icon);
    background-repeat: round;
    width: 1.5em;
    height: 1.5em;
    display: flex;
    transition: background-image .5s;
}

@media screen and (max-width: 991px) {

  .gatekeeper-navbar {
    height: auto;
  }

  .gatekeeper-navbar ul {
    flex-flow: column;
    align-items: stretch;
    align-content: center;
    display: block;
  }

  .gatekeeper-toggler {
    display: flex;
    align-items: center;
  }

  .gatekeeper-nav-item  {
    display: none;
  }

  .gatekeeper-navbar.responsive .gatekeeper-nav-item {
    display: block;
    text-align: left;
  }

  .gatekeeper-navbar.responsive .gatekeeper-icon {
    /*background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' height='30' width='30' viewbox='0 0 30 30'%3e%3cpath stroke='rgba(255, 255, 255, 0.5)' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' fill='none' d='m4 10l11 -6l11 6m4 18l11 -6l11 6m4 26l11 -6l11 6'/%3e%3c/svg%3e");*/
    background-image: var(--nav-icon-expanded);
  }

}