/* style the outer div to give it width */
.menu{
 width:670px;
 height: 22px;
 font-weight:bold;
 overflow:visible;
 z-index:998;
}


/* remove all the bullets, borders and padding from the default list styling */
.menu ul {
 padding:0;
 margin:0;
 list-style-type:none; 
 height:22px; 
 background:transparent;
 overflow:visible;
 z-index:998;
  float:left;
 }


/* style the sub-level lists */
.menu ul ul{
width:25em;
 overflow:visible;
 z-index:998;
}

/* float the top list items to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.menu ul li {
 border-right: 1px #fff solid;
 float:left;
 height:22px;
 line-height:22px; 
 display:block;
 overflow:visible;
 z-index:998;
}


/* style the links for the top level */
.menu a, .menu a:visited {
 display:block;
 float:left;
 height:22px; 
 padding: 0 10px;
 font-size:11px;
 text-decoration:none;
 color:#fff;
 overflow:visible;
 z-index:998;
}


/* style the level hovers */
* html .menu a:hover{
 color:#000;
 position:relative; 
 overflow:visible;
 z-index:998;
 }
 
.menu li:hover{
 position:relative;
 }
.menu :hover > a {
 color:#000;
 }


/*+++++++++ second ++++++++++++*/

/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu ul ul{
 visibility:hidden;
 position:absolute;
 height:0;
 top:22px; 
 left:0; 
 width:140px;
  overflow:visible;
  z-index:998;
 }

/* style the sub level links */
.menu ul ul a, 
.menu ul ul a:visited{
 display:block;
 background-color:#666;
 background-image: url(/images/pulldown/line_22.png);  
 color:#fff;
 width:140px;
 height:100%;
 line-height:1em; 
 padding:8px 12px 8px 12px;
 overflow:visible;
 z-index:998;
 }
 
* html .menu ul ul a, * html .menu ul ul a:visited{ /*IE-Hack*/
 width:140px; 
 w\idth:140px;
 padding:8px 12px 8px 12px;
 background-color:transparent;
 background-image: url(/images/pulldown/line_22h.png); 
 overflow:visible;
 z-index:998;
 }
 
 *+ html .menu ul ul a, *+ html .menu ul ul a:visited{ /*IE-Hack*/
 padding:7px 12px 7px 12px;
 }

/* make the second level visible when hover on first level list OR link */
.menu ul :hover ul{
 visibility:visible; 
 height:auto; 
 padding:0 3em 3em 3em; 
 background:transparent url(images/trans.gif); 
 left:-3em;
 overflow:visible;
 z-index:998;
 }
 
 .menu ul ul a:hover{
 color:#666;
 background-color:#eceded;
 background-image: url(/images/pulldown/line_22.png); 
 position:relative; 
 z-index:998;
 overflow:visible;
 }
 
 *html .menu ul ul a:hover{
 color:#fff;
 background-image: url(/images/pulldown/line_22h.png); 
 text-decoration: yes;
 }
 
 
 
/* style the sub level list items */ 
.menu ul ul li:hover{
 position:relative;
 background-color:#eceded;
 overflow:visible;
 z-index:998;
 }
 

.menu ul ul li {
 display:block;
 width:10em;
 height:auto;
 line-height:1em;
 background-color:#eceded;
 overflow:visible;
 z-index:998; 
 }
 
 *+html .menu ul ul li {
 width:185px;
 overflow:visible;
 z-index:998;
 }



/* style the table so that it takes no part in the layout - required for IE to work */
.menu table{
 border-collapse:collapse; 
 padding:0; 
 margin:-1px; 
 width:0; 
 height:0; 
 font-size:11px; 
 z-index:998;
 overflow:visible;
}

.trenner{
margin: 2px 0 -4px 0;	
}

.line{
 clear:both;
 background-image: none !important;   
 border-bottom: 1px #cfd0d2 solid;
 text-decoration: none; 
}

*html .line{
 clear:both;
 text-decoration: none;  
 background-image: none !important;  
 background-color: transparent!important;
 background-color: #555!important;  
 border-bottom: 1px #cfd0d2 solid!important;
}