#menu { list-style-type:none; padding:0; margin:0; }

/* lista el primer menu aca hacer transparent*/
#menu li { float:left; background:#000000; margin:0px; position:relative; color: #FFFFFF; font-weight: 800; }

/* lista los submenues*/
#menu ul { list-style-type:none; padding:0; margin:0; }

/* primer boton con imagen, EL HACK DE IMPORTANT ES PARA FIREFOX Y ie7*/
#menu li.sub { background:#000000; margin-top: 0px !important; margin-top: 0px; }

/* for IE5.5 and IE6 only */
#menu table { border-collapse:collapse; position:absolute; top:0; left:0; z-index:80; font-size:1em; }

/* varios *  EL HACK DE IMPORTANT ES PARA FIREFOX e IE7 para que el IE6 ajuste cajas*/
#menu li a { display:block; color: #666666; height:auto; font-family:arial, sans-serif; font-size:12px; line-height:24px; width:83px; text-decoration:none; text-align:center; }

#menu :hover { color:#FFFFFF; background:#000000; }

#menu :hover > a { color:#FFFFFF; background:#000000; }

/* EL HACK DE IMPORTANT ES PARA FIREFOX e IE7 para que el IE6 ajuste cajas*/
#menu ul, #menu :hover ul ul, #menu :hover ul :hover ul ul, #menu :hover ul :hover ul ul.left { position:absolute; left:-9999px; width: 83px !important; width:auto; padding-top: 6px; }

/* the background image is for IE7 */
#menu :hover ul { left:0; top:25px; background:url(transparent.gif); }

/* top maneja el alineamiento de todos los menus en forma vertical, left el segundo menu cuancerca esta del presionado*/
#menu :hover ul :hover ul, #menu :hover ul :hover ul :hover ul { padding:0 0px; left:105px; top:0px; }

/* datos del menu a la izquierda */
#menu :hover ul :hover ul.left, #menu :hover ul :hover ul :hover ul.left { padding:0 3px; left:-131px; top:-3px; }