#multi-level {height:30px; position:relative; z-index:100;} #multi-level .pad {float:left;} /* The menu-cel styling */ /* Remove the padding, margins and bullets from the lists */ .menu-cel, .menu-cel ul {list-style-type:none; padding:0; margin:0; font-family:arial, sans-serif;} /* Set up the top level list items and float left to place inline */ .menu-cel li.top {display:block; float:left; position:relative;} /* Style and position the table so it takes no part in the menu-cel function. The font size is necessary for IE5.5 */ .menu-cel table {border-collapse:collapse; width:0; height:0; position:absolute; top:0; left:0;} /* Default top link link styling */ .menu-cel li.top a.top_link {display:block; float:left; height:75px;} /* YO : ORIGINAL height:35, PERO SE SEPARABA MUCHO DEL CUERPO.OJO, TIENE QUE SER IGUAL A .menu-cel :hover ul.sub { left:0; top:60px; , MAS ABAJO, SINO, NO FUNCIONA BUSCAR: OJO-AQUI CON EL TOP PARA ENCONTRAR LA LINEA DONDE ESTÁ */ .menu-cel li.top a span {position:absolute; left:-9999px; top:0; z-index:0; font-size:12px;} /* move the link text off screen */ /* PRE-CARGA LAS IMAGENES PARA EL HOVER. width Y height TIENEN QUE COINCIDIR CON TAMAÑO DE LA IMAGEN DEL BOTON, enlaces-musica-militar-cel-png */ .menu-cel li.musica-militar-cel {width:640px; height:71px; background:url(objetos/menu/enlaces-musica-militar-cel.png) no-repeat;;} .menu-cel li.origenes-cel {width:800px; height:88px; background:url(objetos/menu/enlaces-origenes-cel.png) no-repeat;;} .menu-cel li.recuerdos-cel {width:640px; height:71px; background:url(objetos/menu/enlaces-recuerdos-cel2.png) no-repeat;;} /* CONFIGURA LA VISTA INCIAL DE LOS ENLACES. width Y height TIENEN QUE COINCIDIR CON TAMAÑO DE LA IMAGEN DEL BOTON */ .menu-cel li a#enlaces-musica-militar-cel {width:640px; height:71px; background:url(objetos/menu/enlaces-musica-militar-cel.png) no-repeat;;} .menu-cel li a#enlaces-origenes-cel {width:800px; height:88px; background:url(objetos/menu/enlaces-origenes-cel.png) no-repeat;;} .menu-cel li a#enlaces-recuerdos-cel {width:640px; height:71px; background:url(objetos/menu/enlaces-recuerdos-cel2.png) no-repeat;;} /* Style the list OR link hover. Depends on which browser is used */ .menu-cel a:hover {visibility:visible;} /* for IE6 */ .menu-cel li:hover { position:relative; z-index:200;} /* for IE7 */ /* HACE QUE AL POSAR EL MOUSE, EL BOTON SE HAGA TRANSPARENTE Y SE PUEDA VER EL QUE ESTÁ ABAJO INNECESARIO EN CELULARES, PORQUE ES UN SOLO BOTÓN*/ /* HACE INVISIBLE LOS MENUES, SI LO SACO, AUN EN CELULARES, SE VEN TODAS LAS OPCIONES DE ENTRADA */ .menu-cel ul, .menu-cel :hover ul ul, .menu-cel :hover ul :hover ul ul, .menu-cel :hover ul :hover ul :hover ul ul, .menu-cel :hover ul :hover ul :hover ul :hover ul ul {position:absolute; left:-9999px; top:-9999px; width:0; height:0;} /* set up the first drop down sub level 93 90 87*/ /* CONFIGURA 1er. NIVEL DE SUB-menu-celES. */ /* YO : ORIGINAL top:35, PERO SE SEPARABA MUCHO DEL CUERPO. OJO, TIENE QUE SER IGUAL A .menu-cel li.top a.top_link {... height:30px;} , MAS ARRIBA, SINO, NO FUNCIONA */ /* top: POSICION SUBMENU QUE SE ABRE RESPECTO AL BOTON, width: ANCHO SUB MENU - PARA NO CEL - 143px, left:0, REGULA POSICION A LA IZQ QUE ABRE EL MENU, CON EL top:70px; SE REGULA EL MARGEN SUPERIOR CON EL BOTON OJO-AQUI CON EL TOP */ .menu-cel :hover ul.sub {left:0; top:75px; background:#fff; padding:3px 0; border:1px solid #888; white-space:nowrap; width:500px; height:auto; text-align:left;} /* CONFIGURA CADA OPCION DEL 1ER. NIVEL DEL SUBMENU - NO CELULARES: height:20px; width:140px; EL height: CONFIGURA EL ANCHO DEL RENGLON DE CADA SUBMENU. COORDINARLO CON EL TAMAÑO DE LETRA, width: ES EL ANCHO DEL SUBMENU. HAY VARIOS, TODOS TIENEN QUE TENER EL MISMO TAMAÑO */ .menu-cel :hover ul.sub li {display:block; height:45px; position:relative; float:left; width:500px; } /* CONFIGURA TODAS LAS OPCIONES, EN EL HOVER. EL WIDTH y los 2 ANTERIORES, LE DAN ANCHO A OPCIONES DEL 1ER. NIVEL, SOLO LAS QUE TIENE FLECHAS NO CELULARES: font-size:12px; height:20px; width:137px; line-height:20px; text-indent:5px; CON EL font-size:, SE REGULA EL TAMAÑO DE LA LETRA DEL SUBMENU, EL line-height:30px PARECE QUE BAJA SOLO LAS LETRAS AL ABRIR EL SUBMENU CON EL height:45px SE PINTA UNA OPCION CUANDO SE ELIGE, POR ESO TIENE QUE TENER EL MISMO NUMERO QUE EN LA LINEA ANTERIOR (.menu-cel :hover ul...) NO BORRAR, NECESARIO PARA CELULARES */ .menu-cel :hover ul.sub li a {display:block; font-size:38px; padding-top:8px; height:45px; width:500px; line-height:30px; text-indent:15px; color:#000; text-decoration:none; border:3px solid #fff; border-width:0 0 0 3px; border-top:1px solid green; } /* YO : PARA CONFIGURAR EL 2º NIVEL, QUE LO HICE MÁS ANCHO, POR LOS NOMBRES LARGOS. SINO, EL HOVER QUEDA "CORTO" Y NO SE PINTA BIEN INNECESARIO EN CELULARES */ /* CONFIGURA LAS OPCIONES QUE TIENEN FLECHA. EL BACKGROUND, AFECTA A TODA LA OPCION INNECESARIO EN CELULARES */ /* CONFIGURA EL HOVER DE LAS OPCIONES QUE NO TIENEN FLECHA IGUAL A NO CELULARES, NO CAMBIAR */ .menu-cel :hover ul.sub li a:hover { background:#37a237; color:#fff; } /* CONFIGURA EL HOVER DE LAS OPCIONES QUE TIENEN FLECHA INNECESARIO EN CELULARES */ /*CONFIGURA LA OPCION QUE QUEDA ACTIVA, CUANDO PASAMOS DE UN NIVEL AL SEGUNDO NIVEL */ .menu-cel :hover ul li:hover > a.fly {background:#37a237 url(objetos/menu/arrow_over.gif) 120px 7px no-repeat; color:#fff; } /* set up the flyout levels when hovering #fff*/ /* CONFIGURA EL 2º NIVEL. EL left: COLOCA EL SUB-menu-cel (ERA 90, PUSE 130). EL PROXIMO WIDTH ERA 93 ME PARECE QUE ES INNECESARIO EN CELULARES */ .menu-cel :hover ul :hover ul, .menu-cel :hover ul :hover ul :hover ul, .menu-cel :hover ul :hover ul :hover ul :hover ul, .menu-cel :hover ul :hover ul :hover ul :hover ul :hover ul {left:130px; top:-4px; background:white; padding:3px 10px 3px 0; border:1px solid #888; white-space:nowrap; width:278px; z-index:200; height:auto; z-index:300;} /* YO : EN LA LINEA ANTERIOR, EL ORIGINAL ERA top:-4px, PERO EL SUB-menu-cel SE VEIA MUY ARRIBA, PORQUE ANTES HABIA CAMBIADO LA POSICION DEL SUB-menu-cel ACTUAL */ /* EL WIDTH ERA 143PX , LO AGRANDE PORQUE LAS RESEÑAS TIENEN NOMBRES LARGOS, PERO SI LO PONGO MUY LARGO, SE DESCOMPAGINA */