@charset "iso-8859-1";
.mmenu { position: relative; }
.mmenu ul {
  display: none;
  list-style-type: none;
  margin: 0; padding: 0;
  background-color: rgba(255,255,255,.95); /*.5*/
}
.mmenu ul { position: absolute; left: 100%; top: 0; }
.mmenu-btn ~ ul {
  position: absolute; left: 0; top: auto; z-index: 1002;
  text-transform: uppercase;
}
.mmenu li {
  background-color: #ccc; color: black;
  padding: 0; margin: 0; /*_margin: .2em;*/
  border: .2em solid transparent;
  background-clip: padding-box;
  /* added 01-12-2016 */
  position:relative;
}
.mmenu li a, .mmenu .with-submenu .subspan {
  width: 100%; box-sizing: border-box; min-width: 15em;
  background-color: #ccc; color: black;
  /*color: inherit;*/ text-decoration: none;
  display: inline-block; padding: .5em; padding-right: 1.5em;
  min-height: 1.6em;
}
.mmenu li a > * { /*border-bottom: 1px solid #ccc;*/ }
.mmenu li a:visited > * { border-bottom-color: #aaa; }

.mmenu a:hover, .mmenu a:focus, .mmenu a:active, .mmenu a.selected, .mmenu .with-submenu .subspan:hover, .mmenu .with-submenu .subspan:focus, .mmenu .with-submenu .subspan:active, .mmenu .with-submenu .subspan.selected {
  color: white; background-color: #93BF20; outline: 0 none;
}

/* added 01-12-2016 */
.mmenu ul li ul {
	top: -0.2em;
}

.mmenu-btn:hover ~ ul, .mmenu-btn:focus ~ ul, .mmenu-btn:active ~ ul, .mmenu-btn.selected ~ ul,
.mmenu-btn ~ ul:hover, .mmenu-btn ~ ul:focus, .mmenu-btn ~ ul:active { display: block; }


.mmenu a[href^="http"]::before { /* externe Links */
  display: inline-block;
  /*content: '>';*/
  content: url('../Images/symbols/raus-grau-rd.svg'); _height: 1em; width: 1em;
  /* was: content: url('../Images/symbols/running-away-black.svg'); _height: 1em; width: 1em; */
  /*margin-left: -1.5em; float: right;*/
  position: absolute; right: 0.5em; /* was: .3em */
}
.mmenu a[href^="http"]:hover::before, .mmenu a[href^="http"]:focus::before, .mmenu .subspan:hover::before, .mmenu .subspan:focus::before, .mmenu .subspan:active::before,  
.mmenu a[href^="http"]:active::before {
  content: url('../Images/symbols/raus-weiss-rd.svg');
}
.mmenu .with-submenu > a::before, .mmenu .with-submenu > .subspan::before {
  display: inline-block;
  /*content: '>';*/
  content: url('../Images/symbols/pfeil-rechtsblack.svg'); width: .5em;
  /*margin-left: -1.5em; float: right;*/
  position: absolute; right: 0.5em; /* was: .3em */
}
.mmenu .with-submenu:hover > a::before, .mmenu .with-submenu:focus > a::before,
.mmenu .with-submenu:hover > .subspan::before, .mmenu .with-submenu:focus > .subspan::before, .mmenu .with-submenu:active > .subspan::before, .mmenu .with-submenu.selected > .subspan::before,
.mmenu .with-submenu:active > a::before, .mmenu .with-submenu.selected > a::before {
  content: url('../Images/symbols/pfeil-rechtsweiss.svg');
}
.mmenu .with-submenu > a:hover ~ ul, .mmenu .with-submenu > a:focus ~ ul, .mmenu .with-submenu > a:active ~ ul,
.mmenu .with-submenu:hover > a ~ ul, .mmenu .with-submenu > a.selected ~ ul,
.mmenu .with-submenu > a ~ ul:hover { display: block; }
.mmenu .with-submenu > a:hover::after,
.mmenu .with-submenu:hover > a::after,
.mmenu .with-submenu > .subspan:hover ~ ul, .mmenu .with-submenu > .subspan:focus ~ ul, .mmenu .with-submenu > .subspan:active ~ ul,
.mmenu .with-submenu:hover > .subspan ~ ul, .mmenu .with-submenu > .subspan.selected ~ ul,
.mmenu .with-submenu > .subspan ~ ul:hover { display: block; }
.mmenu .with-submenu > .subspan:hover::after,
.mmenu .with-submenu:hover > .subspan::after
 { /* extend :hover area */
  content: ''; display: block;
  position: absolute; top: 0; bottom: 0; right: -110%; left: 98%;
  background-color: transparent; /*yellow;*/
  border-radius: 0 0 33% 0;
}
.mmenu .dummy { display: none; }
.mmenu .dummy a { /* js2016-09-19 */
  display: inline-block;
  width: 2em; min-width: 0; height: 100%;
  background-color: transparent;
}

@media (max-width: 45em) /* 15*3=45 XXX */
{ .mmenu ul ul{ position: static; _background: white; }
  .mmenu ul ul { background: none; background-color: rgba(255,255,255,0); }
  .mmenu ul ul li { padding: 0; background-color: rgba(255,255,255,0); border-left: none; border-right: none; }
  .mmenu li { background-color: rgba(255,255,255,0); }
  .mmenu ul ul li a, .mmenu ul ul li .subspan { background: white; padding-left: 1em; }
  .mmenu ul ul li li a , .mmenu ul ul li li .subspan { background: white; padding-left: 2em; }
  .mmenu ul ul li li li a, .mmenu ul ul li li li .subspan { background: white; padding-left: 3em; }
  .mmenu .with-submenu > a::before { transform: translateX(-0.5em) rotate(90deg); }
  .mmenu .with-submenu:hover > a::before, .mmenu .with-submenu:focus > a::before,
  .mmenu .with-submenu:active > a::before, .mmenu .with-submenu.selected > a::before {
    transform: translateX(-0.5em) rotate(-90deg);
  }
  .mmenu .with-submenu:hover > a::after , .mmenu .with-submenu:hover > .subspan::after { content: none; } /* added js2016-09-19 */
  /*.mmenu-btn ~ ul:hover::after, .mmenu-btn ~ ul:focus::after, .mmenu-btn ~ ul:active::after {
    display: list-item; position: absolute; top: 0; bottom: 0; right: 0; width: 2em;
    content: ''; z-index: 100; background-color: yellow;
  }*/
  .mmenu .dummy { display: list-item; 
    position: absolute; top: 0; bottom: 0; right: 0; width: 2em;
    z-index: 1; _background-color: yellow;  }
  .mmenu-btn ~ ul .dummy a, .mmenu-btn ~ ul:focus .dummy a, .mmenu-btn ~ ul:active .dummy a {
    /*display: block; position: absolute; top: 0; bottom: 0; right: 0; width: 2em;
    z-index: 100; background-color: yellow;*/
  }
}


/*************************
 *
 *	PARENT NO LINK
 *
 *************************/
 .mmenu .with-submenu .subspan {
	 cursor: pointer;
 }
 .mmenu .active, .mmenu .active.subspan {
	 color: white; background-color: #93BF20; outline: 0 none;
 }
 .mmenu .active.subspan::before {
	 content: url('../Images/symbols/pfeil-rechtsweiss.svg');
 }