/* Smoother scroll to the achorpoints */
html {
  scroll-behavior: smooth;
}

/* Scrollcontainer */
#loyl-landingpage-menu-bar-scroll-container {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100vw;
  height: auto;
  z-index: 1;
}

/* Deactive scrollbar for hopefully better UX */
#loyl-landingpage-menu-bar-scroll-container::-webkit-scrollbar {
  display: none;
}

#loyl-landingpage-menu-bar-scroll-container {
  -ms-overflow-style: none; /* IE, Edge */
  scrollbar-width: none; /* Firefox */
}

/* Menubar */
#loyl-landingpage-menu-bar {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-width: 885px;
  padding: 12px 18px 12px 18px;
  background: rgba(0, 0, 0, 0.4);
}

#loyl-landingpage-menu-bar a.nui-copy {
  color: var(--nui-snow, rgba(255,255,255,1));
  margin-right: var(--nui-space-7, 7rem);
}

#loyl-landingpage-menu-bar a.nui-button-secondary-white {
  text-transform: uppercase;
  margin: 0;
  max-height: 30px;
}

/* Button for mobile */
#loyl-landingpage-menu-bar a:first-of-type {
  display: none;
}

/* lift the suchen footer by about 55px to avoid overlapping with beyond menu bar */
.suchen-subfooter {
  margin-bottom: 55px;
}

@media (max-width: 959px) {
  #loyl-landingpage-menu-bar a.nui-copy, #loyl-landingpage-menu-bar a.nui-button-secondary-white {
    margin-right: var(--nui-space-5, 5rem);
  }

  #loyl-landingpage-menu-bar-scroll-container {
    cursor: grab;
    overflow: auto;
    user-select: none;
    -webkit-user-drag: none;
  }

  /* Switch button for mobile */
  #loyl-landingpage-menu-bar a:first-of-type {
    display: flex;
  }

  #loyl-landingpage-menu-bar a:last-of-type {
    display: none;
  }
}