#menu-sticky-wrapper { position:relative; z-index:3; }
.is-sticky .menu-toggle #nav-title { position:fixed; top:0; left:0; }

/* Nav-Main */
#menu {
  width:100%;
  opacity:0.96;
  background:#f5f4f4;
}
#nav-title {
  position:relative;
  width:40px;
  height:30px;
  margin:.8em 1em;
  font-size:100%;
  text-indent:-999em;
}

/* nav-title */
#nav-title span {
  position:absolute;
  display:block;
  width:100%;
  height:20%;
  border-radius:.1em;
  background-color:#7f7f7f;
}
#nav-title .str-top { top:0; }
#nav-title .str-middle { top:40%; }
#nav-title .str-bottom { bottom:0; }

#nav-title a {
  position:absolute;
  display:block;
  left:0;
  top:0;
  width:100%;
  height:100%;
}

/* Menu-Button */
#nav-title span {
  transition:all .3s ease-in-out;
}
#menu:target #nav-title .str-top,
.menu-toggle #nav-title .str-top {
  transform:translateY(200%) rotate(45deg);
}
#menu:target #nav-title .str-middle,
.menu-toggle #nav-title .str-middle {
  background-color:transparent
}
#menu:target #nav-title .str-bottom,
.menu-toggle #nav-title .str-bottom {
  transform:translateY(-200%) rotate(-45deg);
}

#nav-title a { z-index:1; }
#nav-title a,
#menu:target #nav-title a.menu-open,
.menu-toggle #nav-title a.menu-open,
#nav-title:target a.menu-close { display:none; }
#nav-title a.menu-open,
#menu:target #nav-title a.menu-close,
.menu-toggle #nav-title a.menu-close,  
#nav-title:target a.menu-open { display:block; }

/* :hover, :focus */
#nav-title:hover span,
#nav-title .focused { background-color:#444; }

/* p-list */
#p-list {
  display:none;
  margin:0;
  padding:0;
  list-style-type:none;
}
#menu:target #p-list,
.menu-toggle #p-list { display:block; }

#p-list,
#p-list ul { list-style:none; }

/* em, strong */
#menu li em,
#menu li strong { font-weight:normal; font-style:normal; }

/* a, strong */
#menu li a,
#menu li strong { display:block; white-space:nowrap; color:#17524e; }

/* hover (a), active (em) und current (strong) */
#menu li a:hover,
#menu li em,
#menu li strong { color:#8d0148; }

/* erste Ebene */
#menu li a,
#menu li strong { padding:17px 20px 14px 20px; font-size:1.3em; }

/* zweite Ebene */
#menu li li a,
#menu li li strong { padding:6px 20px; font-size:1.1em; }

/* dritte Ebene */
#menu li li li a,
#menu li li li strong { padding:5px 15px; font-size:1.0em; }

#p-list li { padding:0 2em; }

#p-list li h1 { display:none; }
#p-list li div div ul { display:block; background-color:#f5f4f4; }
#p-list li.mega h1 { display:block; padding:15px 15px 0 21px; text-align:left; white-space:nowrap; }
#p-list li.mega div div,
#p-list li.mega div div ul { display:inline-block; vertical-align:top; margin:0; }

/* Mobile Devices */
@media screen and (min-width:820px) {
  #menu { display:inline-block; }

  #nav-title { display:none; }
  #p-list { position:relative; display:inline-block; width:100%; text-align:center; }
  #p-list ul { position:absolute; display:none; margin:0; padding:0; }
  /* #p-list > li:first-child { margin-left:8px; } */
  #p-list li:hover > ul { display:block; }
  #p-list li ul { position:absolute; opacity:0.99; text-align:left; background:#ffffff; }
  #p-list li ul { left:0; top:100%; padding:2px 0; }
  #p-list li li ul { left:100%; top:0; padding:0; margin-top:3px; }
  #p-list li { position:relative; padding:0; }
  #p-list > li { display:inline-block; }
  
  #p-list li > div {
    position:absolute;
    left:100%;
    /*top:.2em;*/
    top:49px;
    left:0px;
    display:none;
  }
  #p-list .mega > div {
    position:absolute;
    left:100%;
    /*margin-top:3px;*/
    top:49px;
    left:0px;
    display:none;
    flex-direction:row;
    background:#f5f4f4;
  }
  #p-list li:hover > div { display:block; }
  #p-list li.mega:hover > div { display:flex; }
  .mega div div:first-child { margin-right:-1px; }
  .mega div div:last-child { margin-left:-1px; }
  #p-list li.mega div div ul { position:static; background:transparent; }
}

@media screen and (max-width:819px) {
  #menu { overflow:hidden; }

  #p-list li.mega h1 { display:block; padding:8px 15px 0 43px; white-space:nowrap; }
}