/**

 *********************************************

 * Prototype of styles for horizontal CSS-menu

 * @data 30.06.2009 Ò»Á÷ËزÄÍøwww.16sucai.com

 *********************************************

 * (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 {

	width:985px;

    height:48px;

	margin:0px auto;

}



div#menu ul {

    margin: 0;

    padding: 0;

    list-style: none;

}

div#menu ul.menu {

    

}



div#menu li {

    position: relative;

    z-index: 9;

    margin: 0;

    display: block;

    float: left;

}

div#menu li:hover>ul {

    left: -2px;

}



div#menu a {

    position: relative;

    z-index: 10;

    height: 45px;

    display: block;

    line-height: 45px;

    text-decoration: none;

}

div#menu a:hover, div#menu a:hover span { color: #FF0000; }

div#menu li.current a {}



div#menu span {

    display: block;

    cursor: pointer;

    background-repeat: no-repeat;

    background-position: 95% 0;

}

div#menu ul ul a.parent span {

    

   

}

div#menu ul ul a.parent:hover span {

   

}



/* menu::level1 */

div#menu a {

    line-height: 45px;

    color: #e5e5e5;

	font-size:16px;

}

div#menu span {

   

}/**@replace#1*/

div#menu li.pro-title{background:url(../../images/sunjia/li_bj.jpg);}

div#menu li {width:140px;text-align:center;position:relative;}

div#menu li  .top-shape{position:absolute;display:none;top:40px;left:60px; width: 0;height: 0;border-left: 8px solid transparent;border-right: 8px solid transparent;border-bottom: 7px solid #E21001;}

div#menu li:hover .top-shape{display:block;}

div#menu li.last { background: none; }



/* menu::level2 */

div#menu ul ul li {width:200px; height:40px;line-height:40px;padding-left:40px; text-align:left; background: none; border-bottom:1px solid #ccc;background:#fff;}

div#menu ul ul {

    position: absolute;

    top: 43px;

    left: -999em;

    width: 200px;

    padding: 5px 0 0 0;

    margin-top:1px;

	display:block;

}

div#menu ul ul a {

    height: auto;

    float: none;

    display: block;

    line-height: 45px;

    color: rgb(169,169,169);

}

div#menu ul ul span {

    margin-top: 0;

    _padding-right: 20px;

    color: #222;

	text-align:left;

	background:#fff;

	

}

div#menu ul ul a:hover span {

    color: #FF0000;

}

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

div#menu ul ul li {

    width: 100%;

}

div#menu ul ul .level-two{position:relative;}

div#menu ul ul .level-two:hover{background:#E21001;color:#fff;}

div#menu ul ul .level-two span{background:none;}

div#menu ul ul .level-two span a{color:#fff;}

div#menu ul ul .level-two  .shape{position:absolute;display:none; right:-5px;top:13px;width: 0;height: 0; border-top: 8px solid transparent;border-left: 7px solid #E21001;border-bottom: 8px solid transparent;z-index:999;}

div#menu ul ul .level-two:hover .shape{display:block;}

div#menu ul ul .level-two ul li:hover{background:#F1F1F1;}

/* menu::level3 */

div#menu ul ul ul {

    padding: 0;

    margin: -43px 0 0 240px !important;

    margin-left:172px;

}



/* colors */

div#menu ul ul ul { background: #fff; }

div#menu ul ul ul ul { background: rgb(38,38,38); }

div#menu ul ul ul ul { background: rgb(35,35,35); }



/* lava lamp */

div#menu li.back {

    background: url(images/lava.png) no-repeat right -44px !important;

    background-image: url(images/lava.gif);

    width: 13px;

    height: 44px;

    z-index: 8;

    position: absolute;

    margin: -1px 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: 44px;

    margin-right: 8px;

}