/**
 *********************************************
 * Prototype of styles for horizontal CSS-menu
 * @data 30.06.2009
 *********************************************
 * (X)HTML-scheme:
 *  <div id="menu">
 *      <ul class="menu">
 *          <li><a href="#" class="parent"><span>level 1</span></a>
 *              <ul>
 *                  <li><a href="#" class="parent"><span>level 2</span></a>
 *                      <ul><li><a href="#"><span>level 3</span></a></li></ul>
 *                  </li>
 *              </ul>
 *          </li>
 *          <li class="last"><a href="#"><span>level 1</span></a></li>
 *      </ul>
 *  </div>
 *********************************************
 */

/* menu::base */
div#menu {
    height:31px;
	padding-left:10px;
	position: relative;
    z-index:50;
	width:978px
}

div#menu ul {
    margin: 0;
	padding: 0;
    list-style: none;
    float: left;
}


div#menu li {
    position: relative;
    z-index: 9;
    margin:0 2px;
/*    padding:0 3px 0 0;*/
    display: block;
    float: left;
}
div#menu li:hover>ul {
    left: -1px;
}

div#menu a {
    position: relative;
    z-index: 10;
    height:31px;
    display: block;
    float: left;
    line-height:31px;
    text-decoration: none;
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	text-transform:uppercase;
	}
	
div#menu a:hover, div#menu a:hover span { color:#fff;}
div#menu a:hover { color:#fff; }
div#menu li.current a {}


div#menu span {
    display: block;
    cursor: pointer;
/*    background-repeat: no-repeat;
    background-position: 0 0;*/
	}

div#menu ul ul a.parent span {
    background: url(../images/item-pointer.gif) 96% 53% no-repeat;
	}

div#menu ul ul a.parent:hover span {
    background:#ff981d url(../images/item-pointer-mover.gif) 96% 53% no-repeat;
}

/* menu::TOP LEVEL */
div#menu a {
/*	padding:4px 6px 0 42px;*/
	padding:4px 6px 0 40px;
    line-height: 28px;
    color:#fff;
	}
	
div#menu a.first {
	padding-left:32px;
	}

div#menu span {
    margin-top:0;
	color:#fff;
	}
	
div#menu ul a:hover span {
    color:#fff;
	}
	
div#menu ul ul ul span {
	color:#fff;
	}
	
div#menu ul ul ul a:hover span {
	color:#fff;
	}


div#menu li { background:none/* url(../images/main-delimiter.png) 98% 4px no-repeat;*/ }
div#menu li.last { background: none; }


/* menu::LEVEL 1 */
div#menu ul ul li { background: none; }

div#menu ul ul {
    position: absolute;
    top: 27px;
    left: -999em;
    width:205px;
    padding:0;
    background:#0c1928;
	border:1px solid #383944;
    margin:1px 0 0 -4px;
	}

div#menu ul ul a {
	padding:0;
    height: auto;
    float: none;
    display: block;
    line-height:1.4em;

}
div#menu ul ul span {
    margin: 0;
    padding:6px 0 5px 8px;
	color:#FFF;
	text-transform:none;
	font-weight:normal;
 }

div#menu ul ul a:hover span {
	color:#FFF;
	background-color:#ff981d;
	margin:0 0 0 -2px;
	width:197px;
	}

div#menu ul ul li.last { background: none; }
div#menu ul ul li {
    width: 100%;
}

/* menu::LEVEL 2 */
div#menu ul ul ul {
    padding: 0;
/*	top: 27px;*/ 
	margin: -28px 0 0 204px !important;
	width:200px;
}

/* menu::LEVEL 3 */
div#menu ul ul ul ul {
    padding: 5px 0;
    margin: -29px 0 0 185px !important;
	width:170px;
}

/* colors
div#menu ul ul ul {     color:#1f546c; }
div#menu ul ul ul ul {     color:#1f546c; }
div#menu ul ul ul ul {     color:#1f546c; }*/


/* lava lamp */
div#menu li.back {
   background: url(../images/lava.png) no-repeat right -28px !important;
    height: 28px;
    z-index: 8;
    position: absolute;
   	margin: 0 0 0 -5px;
}
div#menu li.back .left {
    background: url(../images/lava.png) no-repeat top left !important;
  	background-image: url(../images/lava.gif);
    height: 28px;
/*  margin-right:4px;*/
}
