// Topbar
.topbar {
  font-size: 0.9rem;
  margin-top: 0;
  z-index: 30;
  padding: 0.3rem 2rem 0.3rem 1rem;
  background-color: var(--topbar-bg);
  float: left;
  width: 100%;
  a {
    color: var(--topbar-link-color)!important;
    &:hover {
      color: var(--topbar-link-color-hover)!important;
      text-decoration: none;
    }
  }
  .info_link {
    margin: 0 0 0 1em;
  }
  .topbar_right {
    display: inline-block;
    float: right;
  }
}

// Top bar menu Widget
.mybooking-widget_topbar_right .menu {
  padding: 0;
  margin: 0;
  list-style: none;
}

.mybooking-widget_topbar_right .menu-item {
  display: inline-block;
  margin-left: 16px;
}

// Topbar message
.topbar-message {
  padding: 0.5rem 2rem;
  text-align: center;
  background-color: var(--topbar-message-bg);
  color: var(--topbar-message-text);
}

.topbar-message a {
  color: var(--topbar-message-link);
}

.topbar-message a:hover {
  color: var(--topbar-message-link-hover);
}

// Small devices
@media (max-width: 578px) {
  .topbar .container {
    padding: 0;
  }
}

// Medium devices (tablets, less than 992px)
@media (max-width: 991.98px) {
  .topbar .info_text {
    display: none;
  }
  .topbar .info_link {
    margin: 0 2em 0 0;
  }
  .topbar {
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
  }
}

// Large devices (desktops, 992px and up)
@media (min-width: 992px) {
  .home .topbar {
    background-color: var(--home-topbar-bg);
  }
}
