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

/* lista el primer menu aca hacer transparent*/
#menu li { float:left; background:#ADADAD; 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:#ADADAD; 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: #000000; height:auto; font-family:arial, sans-serif; font-size:10px; line-height:26px; width:99px; text-decoration:none; text-align:center; }

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

/* aca va la imagen de fondo de los botones al pasar por arriba*/
#menu :hover > a { color:#FFFFFF; background-color: #999999; }

/* 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: 99px !important; width:auto; padding-top: 0px; }

/* 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 cuan cerca esta del presionado*/
#menu :hover ul :hover ul,
#menu :hover ul :hover ul :hover ul { padding:0 0px; left:99px; 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; }

img { margin: 0px; padding: 0px; }