.navih{
    position: relative;
    padding: 10px 5px 8px 5px;
    
}

.navih:hover > .navi,
.navih.hover > .navi{
    visibility: visible;
    height: auto;
    background: #333;
    font-size: medium;

}

.navi{
  margin:0;
  padding:0;
  position: absolute;
  display: inline;
  float: left;
  top: 28px;
  visibility: hidden;
  height: 0;
  font-size: 0em;
}



.navi  *{
 margin:0;
 padding:0;
 list-style:none;
 text-decoration:none;
}



ul.navi , ul.navi ul {
    width:9.375em;
    float:left;
    -webkit-transition: background 0.3s ease-out 0s;
    -moz-transition: background 0.3s ease-out 0s;
    -o-transition: background 0.3s ease-out 0s;
    transition: background 0.3s ease-out 0s;
    
    -webkit-transition: font-size 0.15s ease-out 0s;
    -moz-transition: font-size 0.15s ease-out 0s;
    -o-transition: font-size 0.15s ease-out 0s;
    transition: font-size 0.15s ease-out 0s;
}

ul.navi a {
 display:block;
 margin:0px 1px 0px 1px;
 padding-top: 8px;
 padding-bottom: 3px;
 /*color:#fff;*/
 /*font-weight:bold;*/
}


ul.navi  li  {
 position:relative;

}

/* Alle Ebenen ausblenden */

ul.navi ul  ,
ul.navi  li:hover ul ul ,
ul.navi  li:hover  ul ul ul  {
    position:absolute;
    visibility: hidden;
    left:9.375em;
    font-size: 0em;
    top:0;
 /*background:#000;*/
}

/* Einzelne Ebenen einblenden */
ul.navi li:hover ul ,
ul.navi li.hover ul ,
ul.navi ul  li:hover  ul ,
ul.navi ul  li.hover  ul ,
ul.navi ul  ul li:hover  ul,
ul.navi ul  ul li.hover  ul  {
    visibility: visible;
    background:#333;
    font-size: medium;
 }



/* Hover Hinter- und Vordergrundfarbe für alle Ebenen */
ul.navi li:hover > a , ul.navi  ul li:hover  > a, ul.navi ul  ul  li:hover  > a, ul.navi ul  ul ul  li:hover  > a  {
    background:#a33;
    -webkit-transition: background 0.3s ease-out 0s;
    -moz-transition: background 0.3s ease-out 0s;
    -o-transition: background 0.3s ease-out 0s;
    transition: background 0.3s ease-out 0s;
  /*color:#fff;*/
}

ul.navi a span {
 float:right;
  font-weight:normal;
}