#menu {
  /* background-color: #fff; */
  background-color:rgba(256,256,256,0.3);  /* NEW */
  width: 93%;
  height: 30px;
 /* font: 12px/25px Arial, Helvetica, sans-serif;    NEW */
  border: 1px solid grey;  /* NEW */
  border-radius: 10px;    /* NEW 
  padding-bottom: 20px;*/
  margin: auto;

}

#menu ul {
  background-color: #fff;
  text-align: left;
  

  text-indent: 1em each-line; /* NEW */
  padding-left: 0; /* NEW */
  
}

#menu ul li ul {
  display: none;
  opacity: 0;
  position: absolute;
  top: 30px;
  width: 100%;
  background-color: #fff;
  transform: all .5s;
  
  border: 1px solid grey; /* NEW */
  border-radius: 10px;   /* NEW */
  width: 170px; /* NEW */
}

#menu ul li ul:hover {
  display: block;
  opacity: 1;
  border: 1px solid #333;  /* NEW */
  border-radius: 10px;   /* NEW */
 
}

#menu ul li ul li { 
width: 100%; 

}
#menu ul li ul li a {
  position: relative;  /* NEW */
  left: 10px; /* NEW */

}


/* jedes gerade element kriegt eine farbe */
#menu ul li ul li:nth-child(even) 
{background-color:rgba(240,240,240,0.5);}  /* NEW */



#menu ul li ul li ul {
  position: absolute;
  top: 0;
  left: 100%;
  
}

#menu li {
  width: 12.5%;
  float: left;
  position: relative;
  padding: 0;             /* NEW */
  margin: 0;             /* NEW */
  list-style: none;  /* NEW */
  
}
 /*
li.arrowleft ul
{  position: relative;
	float: right}  NEW */

#menu li a {
  display: block;
  color: #333;
  line-height: 30px;
  text-decoration: none; /* NEW */
     /* padding: 0;           NEW */
  /* margin: 0;             NEW */

}a

#menu li a:hover { background-color: #f0f0f0; }

#menu li:hover > a {color:#990000;}   /* NEW */

#menu li a:hover + ul {
  display: block;
  opacity: 1;
}



      /* NEW Pfeile einfügen und hover*/


.arrowdown {background: url(//www.gluehbirne.ist.org/images/down-arrow.gif) no-repeat right center; text-align: center; }  /* NEW */
.arrowright {background: url(//www.gluehbirne.ist.org/images/arrow_right.gif) no-repeat right center; }  /* NEW */

  


#menu ul li.arrowdown > a:hover {background: url(//www.gluehbirne.ist.org/images/down-arrow.gif) no-repeat right center;  }  /* NEW */
#menu ul li.arrowright > a:hover {background: url(//www.gluehbirne.ist.org/images/arrow_right.gif) no-repeat right center; }  /* NEW */


 /* NEW LINKS Pfeile einfügen und hover*/

.arrowleft {background: url(//www.gluehbirne.ist.org/images/arrow_right.gif) no-repeat left center; }  /* NEW */

#menu ul li.arrowleft > a:hover {background: url(//www.gluehbirne.ist.org/images/arrow_right.gif) no-repeat left center; }  /* NEW */