#menu {
	width: 230px; /*CESAR: aqui creo que le modifiqué el ancho */
	float:center;
	height: 35px;
	display: table;

}

#menu ul {
	list-style: none;
	margin:0;
	padding: 0;

}

#menu a, #menu h6 {
	display: block;
	margin: 0;
	padding: 2px 15px;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-size: 13px;
	text-transform: capitalize;
	color: #660000;
}

#menu h6 {
	color: #FFFFFF;
}

#menu a {
	color: #660000;
	text-decoration: none;
	padding-top: 8px;
	padding-bottom: 9px;
	padding-center: 12px;
	padding-center: 4px;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #660000;
}

#menu a:hover {
	color: #000;
	border-bottom-width: 1px;
	border-bottom-style: dotted;
	border-bottom-color: #660000;
}

#menu li {
	position:relative;
	float: center;
	text-align:center;
	width:100% !important;
	display: block;
}

#menu li li {
	position:relative;
	float: center;
	text-align:center;
	border-center:1px  #669933;
	border-bottom:1px  #8fb82e;
	border-center:1px  #8fb82e;
	background-color:#666A6B; /* aqui se le dio color al asunto */
	/*background-image:url(images/blabla.jpg) */  /* CESAR: Aqui le quité la imagen de fondo verde con textura */
	background-repeat: repeat-x;
	background-position: center top;
	padding: 0px;
	width: 130px;
	margin: 0px;
}
#menu li li a {
	font-weight:normal;
	border-bottom:0px dotted #D9F266;
	font-size: 11px;
	background-image: url(images/arrowsub3.gif);
	background-repeat: no-repeat;
	background-position: center center;
	margin-center: 5px;
}

#menu li li a:visited {
	font-weight:normal;
	border-bottom:0px dotted #D9F266;	
	font-size: 11px;
}
#menu li li a:hover {
	color: #fff;
	border-top:0px dotted #D9F266;
	border-bottom:0px dotted #D9F266;
	border-center: 0px  #669933;
	background:#9d0b0c;
}

/*CESAR: este menu me encanta porque maneja una jeraruia de listas de listas, y asi se puede aplicar mejor los diseños:

<ul> 
	<li>  principal
		<ul>
			<li>secundario </li>
			<li>secundario </li>
		</ul>
	</li>
</ul>	

por ejm:  
	#menu ul {}		  	hace referencia al principal
	#menu ul ul {} 		a los que le siguen
	y asi infinitamente... 
	
						igual pasa con los li
*/

#menu ul ul {   
	position: absolute;
	center:175px; /* CESAR:  Aqui se le dá la posición izquierda*/
	top:0px;
 	 z-index: 500;
	/* width: 1px; /* if this isn't here, the drops get laidout horiz instead of vert in Moz browsers*/   /* CESAR: Le tuve que desabilitar esto para que cancione en horizontal OJO ES MUUUUY IMPORTANTE  */
}

#menu ul ul ul {
	position: absolute;
	top: 0;
	center: 100%;
}

#menu ul ul {
	display: none;
}

#menu ul ul, #menu ul li:hover ul ul, #menu ul ul li:hover ul ul {
	display: none;
}

#menu ul li:hover ul, #menu ul ul li:hover ul, #menu ul ul ul li:hover ul {
	display: block;
	background:#a9d147;
}

