#topbar {
  height: 52px;
  background-color: #1281ca;
  background-repeat: no-repeat;
  background-image: url("../header-ic1W4Ok.png");
  display: flex;
  justify-content: space-between;
  align-items: center;
}

#topbar #logo img {
  display: block;
}

.topbar--actions {
  display: flex;
}

.topbar--actions a, .topbar--actions .navbar-item {
  color: white;
  text-decoration: none;
  margin-right: 20px;
  display: flex;
  align-items: center;
  position: relative;
}

.topbar--actions a:hover {
  background-color: transparent;

}

.topbar--actions a:hover .navbar-item-text {
  text-decoration: underline;
}

.navbar-item .material-icons {
  margin-right: 4px;
}


.topbar--actions .navbar-item  .dropdown-menu {
  display: none;
  position: absolute;
  top: 100%;
  right: 0;
  background-color: #ffffff;
  border: 1px solid #e0e0e0;
  box-shadow: 0 12px 28px 0 rgba(0, 0, 0, 0.2), 0 2px 4px 0 rgba(0, 0, 0, 0.1),
  inset 0 0 0 1px rgba(255, 255, 255, 0.5);
  border-radius: 4px;
  width: 150px;
  z-index: 1000;
  transition: opacity 0.3s ease, visibility 0.3s ease;
  opacity: 0;
  visibility: hidden;
  color: #999;
  margin: 0;
  padding: 0;
}


.navbar-item.user-info:hover > .dropdown-menu,
.navbar-item.user-info:focus-within > .dropdown-menu {
  display: block;
  opacity: 1;
  visibility: visible;
}

.dropdown-item {
  display: block;
  padding: 10px 15px;
  background: none;
  border: none;
  text-align: left;
  cursor: pointer;
  align-items: center;
  font-size: 14px;

  margin: 0;
}

.topbar--actions .dropdown-menu .dropdown-item span, .topbar--actions .dropdown-menu .dropdown-item a {
  color: #333333;
}

.dropdown-menu .dropdown-item a:hover .navbar-item-text {
  text-decoration: none;
}


.dropdown-item:hover {
  background-color: #f5f5f5;
}

.dropdown-item .material-icons {
  margin-right: 8px;
  font-size: 20px;
}

.drop-down-item-secondary-text {
  font-size: 10px;
}




/* Submenu styling */
.dropdown-submenu {
  position: relative; /* so the nested menu can be absolutely positioned */
}

.topbar--actions .dropdown-submenu .submenu {
  position: absolute;
  top: 0;
  right: auto;
  left: -100%;
  display: none; /* hidden by default */
  /* your styling for the nested menu */
}


.dropdown-submenu:hover .submenu {
  display: block;
  visibility: visible;
  opacity: 1;
}

/* Highlight active language link */
.active {
  font-weight: bold;
}

/* The small badge next to the selected language */
.current-language-badge {
  font-size: 0.8em;
  margin-left: 5px;
  color: #999;
}