@use "sass:map";
/*$blue_60;*/
/*$blue_50;*/
.menu {
  background-color: #F1F2F4;
  padding: 0 .5em;
  border-right: 1px solid #F1F3F4; }
  .menu li {
    margin: .35em 0; }
  .menu ul ul {
    padding-left: .5em;
    margin-bottom: .7em; }
  .menu > ul {
    position: -webkit-sticky;
    position: sticky;
    top: .35em; }
  .menu .eintrag {
    display: flex;
    width: 100%;
    padding: .6em .75em;
    white-space: nowrap;
    border: 1px solid #D1D7DA;
    background-color: #fff;
    color: #808385; }
  .menu a.eintrag:hover {
    background-color: #5d84a0;
    border-color: #5d84a0;
    color: #fff; }
  .menu .text {
    flex-grow: 1;
    font-size: 0.9em; }
  .menu .abstand {
    margin-bottom: .88em; }
  .menu .nav-aktiv > .eintrag,
  .menu .nav-aktiv > a.eintrag:hover {
    background-color: #185078;
    border-color: #134060;
    color: #fff; }
    .menu .nav-aktiv > .eintrag .zustand,
    .menu .nav-aktiv > a.eintrag:hover .zustand {
      color: inherit; }

@media (max-width: 768px) {
  .menu {
    display: none;
    flex-direction: column;
    padding: 0;
    font-size: 0.9em; }
    .menu > ul {
      position: static;
      top: 0;
      margin: 0; }
    .menu li, .menu .abstand {
      margin: 0; }
    .menu .eintrag {
      padding: .8em 1.2em;
      border-bottom: 1px solid #D1D7DA;
      background-color: #fff;
      color: #808385; }
    .menu a.eintrag:hover {
      background-color: #5d84a0;
      border-color: #5d84a0;
      color: #fff; } }