/* CSS Document */

/*MENU PRINCIPAL SUPERIOR: MENUTOP*/
ul{
margin:0;
padding:0;
list-style:none;
}
ul.menu{
margin:0;
padding:0;
padding-left:65px;
list-style:none;
}

ul.menu > li{
position:relative;
float: left;
background:url(../images/btnright.jpg);
background-repeat:no-repeat;
background-position:right top;
margin: 0;
}
ul.menu li  a{
display: block;
background: #000;
color: #87AD9C;
padding: 17px 10px;
letter-spacing:0.1em;
border-right:1px dashed #87AD9C;
text-decoration:none;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
margin:0;
}
ul.menu li a:hover{
background:url(../images/btnleft.jpg) no-repeat;
background-position:left top;
color: #333333;
border-right:1px dashed #333333;
}
ul.menu li.selected a{ 
background:#000 url(../images/pico.jpg) no-repeat;
background-position:center bottom;
}

ul.menu li.selected a:hover{
background:url(../images/btnleft.jpg) no-repeat;
background-position:left bottom;
}
/*--------------*/
ul.menu > li > ul /* Solo para los ul debajo de los li de primer nivel. */
{
   position:absolute;
   left:0px;
   top:46px;
   display:none;
   list-style:none;
}
/* Esto afecta a todos los ul inmediatamente debajo (el > ) de un li que a su vez esté dentro de un ul.menu */
ul.menu li:hover > ul 
{
   display:block;
   background:#000000;
   width:153px;
}

ul.menu li ul > li
{
	/*height:25px;*/
   	border:0.5px solid #87AD9C;
}
ul.menu li ul  li.topi
{
	/*height:30px;*/
   	border:0.5px solid #87AD9C;
	border-top:none;
	background:#000000 url(../images/line.jpg);
   	background-repeat:repeat-x;
	background-position:left 2px;
	padding-top:7px;
}



/*---------------------------------------------------*/
/*clase sub*/

ul.menu li ul.sub li a{
display:block;
letter-spacing:0;
border:none;
color:#87AD9C;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:11px;
padding:5px;
margin:0;
}

ul.menu li ul.sub li a:hover{
background:#87AD9C;
color:#333333;
}

ul.menu li.selected ul.sub li a{ 
background:#000000;
color:#87AD9C;
}
ul.menu li.selected ul.sub li a:hover{
background:#87AD9C;
color:#000000;
}
ul.menu li.selected ul.sub li a.select{ 
background:#000 url(../images/pico2.jpg) no-repeat;
background-position:right center;
color:#87AD9C;
}
/*----------------------------------------------------*/


<!--[if IE]>
<style type="text/css">
.mtop{
height: 1%;  /*Apply Holly 3px jog hack to get IE to position bottom border correctly beneath the menu*/
}
</style>
<![endif]-->