:root {
  --navbar-heigh: 55px;
}



#username {
  /* font-size: 0.875rem; */
}

#mail-link {
  margin-left: -8px;
}

#crx-search-form {
  top: 58px;
  position: absolute;
  background-color: #ffffff;
  box-shadow: 0 .5rem 1rem rgba(0,0,0,.15);
  display: flex;
  flex-wrap: nowrap;
}

#search-form.collapse.show,
#search-form.collapsing {
  display: inline-flex;
}

#navbar {
  position: relative;
  z-index: 1000;
}

.navbar-collapse.show {
  background-color: #ffffff;
  box-shadow: 0 .5rem 1rem rgba(0,0,0,.15);
}

.navbar .nav-item .nav-link {
  font-weight: 500;
  padding: 19px;
}

.logo-geoportal {
  max-height: 36px;
  margin-left: 0px;
}

.navbar-geoportal .nav-item {
  max-height: 55px;
}

.navbar-geoportal .nav-item a {
  color: white;
}
.navbar-geoportal .nav-item .active {
  background-color: rgba(var(--bs-light-rgb),var(--bs-bg-opacity));
  color: var(--bs-navbar-active-color);
}


.navbar-geoportal img {
  max-height: 50px;
  padding-bottom: 5px;
  padding-top: 5px;
}

.user-toolbar a {
  text-wrap: nowrap;
}

.gutter-right {
  padding-right: var(--bs-navbar-nav-link-padding-x);
}

@media (min-width: 992px){



  .nav-item.dropdown:hover .dropdown-menu {
    display: initial;
  }

  .mobile-nav-container {
    display: none;
  }

  #globalNavbarSwitch {
    display: none;
  }
}

/* This width is Bootstraps lg breakpoint */
/* Could be good to load bootstraps breakpoint using scss */
@media (max-width: 992px){

  #sub-menu {
    height: 120px;
  }

  #search-form{
    position: initial;
    display: flex;
    box-shadow: none;
    margin-bottom: 10px;
  }

  #search-form-toggler{
    display: none;
  }

  #navbar {
    position: absolute;
    top: calc(120px - 10px);
    left: 50%;
    transform: translate(-50%, 0%);
    width: 95vw;
  }

  .navbar-geoportal {
    display: none;
  }

  nav.navbar .navbar-brand img {
    max-height: 40px;
  }

  .navbar-toggler {
    position: absolute;
    right: 5px;
    height: 45px;
  }

  .mobile-nav {
    height: 45px;
    border-color: #ffffff;
  }

  #globalNavbarSwitch {
    display: inline-block;
  }
}

#social-networks {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-content: center;
  min-width: 75px;
}

nav.navbar#main-menu{
  height: var(--navbar-heigh);
}

nav.navbar#main-menu *:not(input, a, button) {
  background-color: inherit;
}

#navbar-offset {
  margin-top: var(--navbar-heigh);
}

nav.navbar>div.container {
  flex-wrap: wrap;
}

nav.navbar>div.container>div.row {
  width: 100%;
}

nav.navbar.navbar-geoportal{
  background-color: rgb(72,77,86);
}

nav#sub-menu.navbar {
  background-color: rgb(225, 225, 225);
}