/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/drop_examples.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the assocaited (x)html may be modified in any 
way to fit your requirements.
=================================================================== */

/* 	containter class for the menu: to be set in TS
	all the menu settings have to be ajusted to this container (div)*/
	
.main_menu_red {
text-align:left; 
font-family: verdana, sans-serif; 
position:relative; 
font-size:0.85em; 
width:auto;
height:20px; 
margin:0;
z-index:100;
}

/* first level (horizontal) ul (container)*/
.main_menu_red ul {
padding:0; margin:0; list-style-type: none;
}

/* first level (horizontal) ul li (elements)*/
.main_menu_red ul li {
float:left; position:relative;
background: #758279;
font-size:11px;
text-decoration:none; 
color:#fff; 
border:1px solid #fff;
padding:0; margin:0;
height:20px;
width: 130px;
}
/* first level link format (horizontal) ul li (elements)*/
.main_menu_red ul li a, .main_menu_red ul li a:visited {
display:block; 
text-decoration:none; 
width:120px; height:20px; 
color:#000; 
padding:0; margin:0;
padding-left:10px; 
line-height:20px;
}
/*some IE hack */
* html .main_menu_red ul li a, .main_menu_red ul li a:visited {
width:175px; w\idth:120px;
}

/* style the first level background */
.main_menu_red ul a.drop, .main_menu_red ul ul a.drop:visited {
background:#d4d8bd url('../images/arrow_down.gif') no-repeat bottom right;
}
/* style the first level hover */
.main_menu_red ul a.drop:hover{
background:#c9ba65 url('../images/arrow_down.gif') no-repeat bottom right;
}

/* style the second level background */
.main_menu_red ul ul a.drop, .main_menu_red ul ul a.drop:visited {
background:#d4d8bd url('../images/arrow_right.gif') no-repeat center right;
}
/* style the second level hover */
.main_menu_red ul ul a.drop:hover{
background:#c9ba65 url('../images/arrow_right.gif') no-repeat center right;
}
.main_menu_red ul ul :hover > a.drop {
background:#c9ba65 url('../images/arrow_right.gif') no-repeat bottom right;
}
/* style the third level background */
.main_menu_red ul ul ul a, .main_menu_red ul ul ul a:visited {
background:#e2dfa8;
}
/* style the third level hover */
.main_menu_red ul ul ul a:hover {
background:#b2ab9b;
}

/* second level (vertical) */
.main_menu_red ul li ul {
visibility:hidden; 
position:absolute; top:0; left:0; height:0; 
overflow:hidden;
}

/* for the IE hack */
.main_menu_red table {
margin:-1px; border-collapse:collapse; font-size:1em;
}

/*** second level */
/* fist line style for IE7 and non-IE browsers and the second line for IE5.5 and IE6 */
.main_menu_red ul li:hover a,
.main_menu_red ul li a:hover {
color:#c00; text-decoration:underline; border:0;
}

/* second level (vertical) menu */
.main_menu_red ul li:hover ul,
.main_menu_red ul li a:hover ul {
visibility:visible; width:130px; position:absolute; top:20px; left:-1px; background:#fff; border:1px solid #fff; overflow:visible;
}

/* second level link without sub level*/
.main_menu_red ul li:hover ul li a,
.main_menu_red ul li a:hover ul li a {
display:block; text-decoration:none; color:#c00; height:20px; line-height:1.5em; padding:2px 0px 2px 5px; width:130px; w\idth:125px;
}

/* second level link with sub level*/
.main_menu_red ul li:hover ul li a.drop,
.main_menu_red ul li a:hover ul li a.drop {
display:block; color:#000; height:20px; line-height:1.5em; padding:2px 0px 2px 5px; width:130px; w\idth:125px;
}

/* hover over link of second level */
.main_menu_red ul li:hover ul li a:hover,
.main_menu_red ul li a:hover ul li a:hover {
color:#00f; text-decoration:underline;
}

/*** thrid level */
/* hiding third level when hover over first level */
.main_menu_red ul li:hover ul li ul,
.main_menu_red ul li a:hover ul li a ul {
visibility:hidden; position:absolute; top:0; left:0; height:0; overflow:hidden;
}

/* hover over link of second level --> showing third level*/
.main_menu_red ul li:hover ul li:hover ul,
.main_menu_red ul li a:hover ul li a:hover ul {
visibility:visible; position:absolute; top:-1px; color:#000; left:130px; height:auto; border:1px solid #fff;
}
/* if the third level should be towards left (only if TS supports it) */
.main_menu_red ul li:hover ul li:hover ul.left,
.main_menu_red ul li a:hover ul li a:hover ul.left {
left:-166px;
}

.main_menu_red ul li:hover ul li:hover ul li a,
.main_menu_red ul li a:hover ul li a:hover ul li a {
display:block; color:#00f; height:20px; line-height:1.5em; padding:2px 0px 2px 5px; width:130px; w\idth:125px;
}
* html .main_menu_red ul li a:hover ul li a:hover ul li a {padding:2px 0px 2px 5px;}

.main_menu_red ul li:hover ul li:hover ul li:hover a,
.main_menu_red ul li a:hover ul li a:hover ul li a:hover {
color:#000; text-decoration:underline;
}

/* fourth level */
/* hiding third level when hover over first level */
.main_menu_red ul li:hover ul li:hover ul li ul,
.main_menu_red ul li a:hover ul li a:hover ul li a ul {
visibility:hidden; position:absolute; top:0; left:0; height:0; overflow:hidden;
}

/* hover over link of second level --> showing third level*/
.main_menu_red ul li:hover ul li:hover ul li ul li:hover ul,
.main_menu_red ul li a:hover ul li a:hover ul li ul li a:hover ul {
visibility:visible; position:absolute; top:-1px; color:#000; left:430px; height:auto; border:1px solid #fff;
}

/* if the third level should be towards left (only if TS supports it) */
.main_menu_red ul li:hover ul li:hover ul li:hover ul.left,
.main_menu_red ul li a:hover ul li a:hover ul li a:hover ul.left {
left:-166px;
}

.main_menu_red ul li:hover ul li:hover ul li:hover ul li a,
.main_menu_red ul li a:hover ul li a:hover ul li a:hover ul li a {
display:block; color:#00f; height:20px; line-height:1.5em; padding:2px 0px 2px 5px; width:130px; w\idth:125px;
}
* html .main_menu_red ul li a:hover ul li a:hover ul li a:hover ul li a {padding:2px 0px 2px 5px;}

.main_menu_red ul li:hover ul li:hover ul li:hover ul li:hover a,
.main_menu_red ul li a:hover ul li a:hover ul li a:hover ul li a:hover {
color:#000; text-decoration:underline;
}