/* Start of CMSMS style sheet 'reset' */ /* http://meyerweb.com/eric/tools/css/reset/ v1.0 | 20080212 */ /* Reset de propiedades por defecto de los navegadores. Esta hoja de estilos se aplicará a todas las plantillas. */ html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent; } body { line-height: 1em; } ol, ul { list-style: none; } blockquote, q { quotes: none; } blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; } /* remember to define focus styles! */ :focus { outline: 0; } /* remember to highlight inserts somehow! */ ins { text-decoration: none; } del { text-decoration: line-through; } /* tables still need 'cellspacing="0"' in the markup */ table { border-collapse: collapse; border-spacing: 0; } /* End of 'reset' */ /* Start of CMSMS style sheet 'comun' */ /*************************/ /* COMÚN SANTA EUFEMIA */ /************************/ /***** Diseño dado por el .psd a 952px ********/ /*********** BODY *************************************/ html{ height:100%; background:#c6cedb; /*El color de fondo fuera de la página siempre poner en etiqueta */ /*aquí sería bajo el pie */ } body { /* width:952px; */ /*Libre ocupa toda la pantalla Diseño a 952px */ /* -El texto de contenido es Arial, tamaño 11-12px (0.8em) #000. -Background del body: #fff. */ /*Texto*/ font-family:Arial,sans-serif,Verdana,Trebuchet MS,Times New Roman; font-size:0.8em; /*aunque firebug muestre el font-size: 100% del reset, ese 100% es respecto al valor dado aquí */ color:#000; font-weight:normal; line-height: 1.3em; /*Bk, márgenes, ... */ /*Puesto en background:#fff; */ margin:0; text-align:left; } /* hacks para que funcione correctamente el centrado de la web en IE5.5 */ @media tty { i{content:"\";/*" "*/}} body{text-align:center;} /*";} }/* */ /*********** ENLACES **************/ a { color:#01139e; text-decoration:none; outline:none; } a:focus, a:hover { color:#9a0000; outline:none; } /*********** H1...H6 ***********/ h1, h2, h3, h4, h5, h6 {font-family:Arial,sans-serif,Verdana,Trebuchet MS,Times New Roman; font-weight:normal;color:#1e008e;margin:0;clear:both;} h1 {font-size:3em;line-height:1;} h2 {font-size:2.5em;line-height:1em;text-decoration:underline;} h3 { font-size:1.4em;font-weight:normal;font-style:normal;line-height:1.1em;margin-bottom:0.5em; padding-bottom:1px;border-bottom:2px solid #000d6d; /* letter-spacing:2px; */ } h4 {font-size:1.25em;font-weight:normal;font-style:normal;line-height:1.1em;margin-bottom:0.5em;margin-top:1em;margin-left:0.4em;padding-bottom:4px; } h5 { font-size:1em; font-weight:bold; margin-bottom:0.5em; margin-top:0.6em; text-decoration:underline; } h6 {font-size:1em;font-weight:normal;margin-bottom:0.3em;margin-left:0px;text-decoration:underline;} /*********** ICONOS PDF DE ORDENANZAS, EDICTOS, ...************/ #columnacentroancha a.pdf img,#columnacentro a.pdf img{ margin:0; padding:0; border:none; } /********** ICONO DESCARGAR ADOBE PDF (en el pie) ************/ a#piePdf{ display:block; margin:0 auto; background: transparent url('/uploads/images/enlaces/get_adobe_reader.png') no-repeat; text-indent:-1000em; width:158px; height:39px; } /*Color lineas separadoras, p.e. en obtener Acrobat Reader */ hr { width:95%; color:#000d6d; } /****************************CONTENEDOR ****************************/ #contenedor{ /* width:952px; */ /*Libre ocupa toda la pantalla Diseño a 950px */ margin:0 auto; /*centrar página */ overflow:hidden; text-align:left; } /*****************************CABECERA ****************************/ #cabecera-padre{ background: transparent url('/uploads/santaeufemia/cabecera-bk.gif') repeat-x; /*Width: Libre ocupa toda la pantalla*/ height:280px; overflow:hidden; } #cabecera{ /*El diseño real es a 952px sólo que se ocupa toda la pantalla con colores.*/ width:952px; height:280px; /*Centramos en pantalla*/ margin:0 auto; overflow:hidden; } #cabecera-top { width:952px; height:32px; overflow:hidden; } /****** BUSCADOR **************************/ #cabecera-top form{ float:left; background:#f3f2f2; margin-left:11px; margin-top:4px; width:205px; height:23px; } /* Hack IE6 */ *html #cabecera-top form{ margin-left:5px; } /*Texto: Buscar : NO HAY, puse espacio-blanco en extensiones-buscador */ #cabecera-top form label{ width:0px; } /*Cuadro de búsqueda */ #cabecera-top form input { float:left; padding-left:4px; background:#f3f2f2; border:none; /*no es un campo y sin background. Quitamos borde que pone por defecto*/ width:161px; height:21px; /*Letra=body*/ line-height:1.6em; } /*Lupa para buscar*/ #cabecera-top form input.boton{ background: transparent url('/uploads/santaeufemia/busca-lupa.jpg') no-repeat; float:right; width:28px; height:23px; border:none; text-indent:-2000em; /*IE6 IE7 no funciona el text-indent se ve el texto*/ font-size:0; color:#f3f2f2; /* mismo color fondo buscador pues con el size se ve una raya '-'*/ cursor:pointer; } #cabecera-top form input.boton:hover{ background-position:bottom right; } /************** MENU CONTACTO **********************/ ul#menucontacto{ float:left; list-style-type:none; margin-left:25px; margin-top:6px; text-align:center; overflow:hidden; height:26px; /*Necesario para IE6 IE7, sino no sabe el width y no sale en línea el Menu contacto */ width:265px; } ul#menucontacto li { background:transparent none repeat scroll 0 0; /*border-left:1px solid #fff; SIN BORDE-SEPARADOR entre elementos */ float:left; padding-right:5px; padding-left:5px; text-align: left; /*Letra = body */ line-height:1.6em; color: #fff; } ul#menucontacto li.rss{ width:30px; height:18px; margin-top:1px; text-indent:-5000em; } ul#menucontacto li a.rss{ float:left; background: transparent url('/uploads/santaeufemia/rss.gif') no-repeat left top; text-indent:-5000em; width:30px; height:18px; } /*Al elegir rss, se pierde el y sólo queda
  • , luego hemos de tener también el fondo en el
  • */ ul#menucontacto li.rss{ float:left; /*la imagen debe quedar justo encima que la imagen del . Los 5px son pues los
  • tienen un padding de 5px */ background: transparent url('/uploads/santaeufemia/rss.gif') no-repeat 5px top; text-indent:-5000em; width:30px; height:18px; } ul#menucontacto li.primero{ border:none; } ul#menucontacto li.activo{ /* font-weight:bold;*/ color:#ffee7a; } ul#menucontacto li a{ border:none; /*Letra=body */ line-height:1.6em; color:#fff; } ul#menucontacto li a:hover{ color:#ffee7a; /* text-decoration:underline;*/ } ul#menucontacto li a.rss:hover{ background-position:bottom right; } /***************Dia y fecha ****************************/ #cabecera-top span { float:right; margin-top:6px; /*idem menu-contacto*/ color:#fff; line-height:1.6em; } /********CABECERA IZQUIERDA H1 -H2 *****************************/ #cabeceraizquierda { float:left; overflow:hidden; width:227px; height:248px; background: transparent url('/uploads/santaeufemia/cabecera-izquierda.jpg') no-repeat left 3px; } #cabecera h1 { float:left; width:227px; height:53px; /*Desplazamos para que ocupe las letras -grafico- Ayuntamiento de Conquista*/ margin-top:10px; } #cabecera h1 a { display:block; width:378x; height:53px; /*Texto no debe verse*/ text-indent:-2000em; } #cabecera h2 { float:left; /*desaparezca del flujo */ text-indent:-2000em; } /********** CABECERA DERECHA *******************************/ #cabeceraderecha { float:right; overflow:hidden; margin-top:14px; width:705px; /* +2 borde=707 */ height:233px; /*+1 borde=234*/ background-color:#f2f2f2; border-top:1px solid #000d6d; border-left:1px solid #000d6d; border-right:1px solid #000d6d; } /****** FLASH ****************************/ #cabeceraderecha div#banner{ width:685px; height:219px; margin:10px 0 0 10px; background: transparent url('/uploads/images/flash.jpg') no-repeat; } /* #cabeceraderecha div#banner img { width:685px; height:219px; margin:0; border:none; } */ /*************************************************************************/ /* C U E R P O */ /* Contiene la columnaizquierda (menusecundario) y la columnacentroancha con el contenido */ /************************************************************************/ /*Nuevo div que tendrá la trama centrada */ #cuerpo{ /*Ancho a toda pantalla por la trama. Dentro metemos un #contenido que hará la función de #cuerpo e irá centrado a 952px */ background-color:#dfe9f2; margin:0 auto; overflow:hidden; } /*Centramos el contenido pues el diseño está a toda pantalla */ #contenido { width:952px; margin:0 auto; overflow:hidden; /*Para que el pie se meta aquí y este quede por encima. El z-index sólo funciona en relative */ position:relative; z-index:1; } /***** COLUMNA IZQUIERDA ******************************/ #columnaizquierda{ width:227px; background: #dfe9f2 url('/uploads/santaeufemia/columna-izquierda.jpg') no-repeat center top; float:left; overflow:hidden; padding-top:70px; } /******** COLUMNA CENTRO ANCHA ************************/ #columnacentroancha{ float:right; width:695px; /*tot anchura=707*/ padding-left:10px; border-left:1px solid #000D6D; border-right:1px solid #000D6D; border-bottom:1px solid #000D6D; background-color:#f2f2f2; padding-bottom:5px; overflow:hidden; } /***********EL CONTENIDO ******************************/ #elcontenido{ width:690px; padding-right:5px; padding-bottom:10px; overflow:hidden; /*Para asemejar a la barra de menú izqa. */ min-height:680px; } *html #elcontenido { height:690px; /*Funciona como min-height. Si es posible evitarlo. Si se pone evitar los height:100% en elementos dentro de o la pifiará IE6*/ overflow:visible; /*En IE6 con Overflow:hidden y poniendo height, no crece. Por tanto reseteamos el valor puesto. Ojo: en elementos contenidos evitar height: 100% y poner auto simplemente quitar height.*/ /*Nota: Si no ponemos hidden, cuidado con los float dentro del div*/ /*Otra solución es quitar overflow:hidden de #elcontenido pues ahí no tendremos float*/ } /***** MENU SECUNDARIO *********************************/ ul#menusecundario { width:215px; /*width total = 227+padding+2borde */ padding-left:10px; background-color:#f2f2f2; border:1px solid #000D6D; margin:0 auto; overflow:hidden; padding-top:19px; padding-bottom:14px; } /************ PRIMER NIVEL: AYUNTAMIENTO-MUNICIPIO-OFICINA VIRTUAL Este es el MenuPrincipal de la mayoría de Webs **************/ ul#menusecundario li { width:208px; } /*sombra el en li principal activo*/ ul#menusecundario li.principalactivo { padding-bottom:10px; background: transparent url('/uploads/santaeufemia/sombra-menu-activo.gif') no-repeat left bottom; } #menusecundario li a { /*para que funcionen los enlaces al quitar el texto de pantalla con el text-indent:-1000em hemos de abarcar todo el width-height de su bakcground, o sea los 208*51 */ display:block; text-indent:-4000em; width: 208px; height: 51px; /*recordemos que para que funcione en IE6 los hover han de ir sobre enlaces a*/ } #menusecundario li.ayuntamiento a { background: transparent url('/uploads/santaeufemia/ayuntamiento.gif') no-repeat; } #menusecundario li.municipio a { background: transparent url('/uploads/santaeufemia/municipio.gif') no-repeat; } #menusecundario li.oficina-virtual a{ background: transparent url('/uploads/santaeufemia/oficina-virtual.gif') no-repeat; } #menusecundario li.tramites a{ background: transparent url('/uploads/santaeufemia/tramites.gif') no-repeat; } #cuerpo #menusecundario li a:hover { background-position: left -51px; } #cuerpo #menusecundario li a.activo { height:41px; background-position: left -102px; } /************** SEGUNDO NIVEL, este es el verdadero menusecundario de la mayoría de webs ******************/ #menusecundario li ul { width:184px; /*total 208px*/ background: transparent url('/uploads/santaeufemia/menusecundario-ul.gif') repeat-y left top; padding-left:10px; padding-right:14px; padding-bottom:5px; /*Separamos último elemento */ /* margin-bottom:10px;*/ } #menusecundario li li { width:183px; border-top:1px solid #000; border-bottom:1px solid #c2c4d7; } #menusecundario li li.activo { background-color:#f2f2f2; font-weight:normal; color:#000d6d; } #menusecundario li li.ultimo { border-bottom:none; } #menusecundario li li.ultimo { /*Abrimos espacio para sombra */ /* padding-bottom:10px; background: transparent url('/uploads/santaeufemia/sombra-menu-activo.gif') no-repeat left bottom; */ } #columnaizquierda #menusecundario li li a { text-indent: 0; display: block; width:180px; /*total + padding = 183px */ padding-left:3px; height:auto; overflow:hidden; background: none; color:#fff; /* texto heredado del body */ font-size:1.1em; font-weight:normal; line-height:1.6em; } #menusecundario li li span { text-indent: 0; display: block; width:180px; /*total + padding = 183px */ padding-left:3px; height:auto; overflow:hidden; background: none; color:#000d6d; /* texto heredado del body */ font-size:1.1em; font-weight:normal; line-height:1.6em; } #columnaizquierda #menusecundario li li a:hover { /*background-color:#f2f2f2; color:#000d6d;*/ /* color:#ffee7a;*/ text-decoration:underline; } #columnaizquierda #menusecundario li li a.activo { color:#000d6d; height:auto; /*eliminamos css elementos menu principal */ } /************** TERCER NIVEL, este es el verdadero menusecundario de la mayoría de webs ******************/ #menusecundario li ul ul { /*eliminamos css padre*/ background:none; padding-left:0; padding-right:0; } ul#menusecundario li li li { width:183px; border:none; /*elimino bordes puesto en los padres*/ } #columnaizquierda ul#menusecundario li li li a, ul#menusecundario li li li span { font-size:1em; font-weight:normal; margin-top:0; line-height:1.5em; /*Quiero anchura de 183 pero como he puesto padding de 14 width sera 183-14 = 1690 */ width:169px; color:#000d6d; padding-left:14px; } ul#menusecundario li li li span { text-decoration:underline; } #menusecundario li li li { background:transparent url('/uploads/santaeufemia/borde.gif') no-repeat 0px 0; width:auto; /* margin:0 0 0 10px;*/ } #menusecundario li li li.ultimo { background: transparent url('/uploads/santaeufemia/borde-ultimo.gif') no-repeat 0px 0; } #columnaizquierda ul#menusecundario li li li a:hover { background-color:transparent; font-style:none; text-decoration:underline; color:#000d6d; } #columnaizquierda ul#menusecundario li li li a.activo { background :none; text-decoration:underline; } /**************** MIGAS *****************************/ #migas { /*tamaño*/ width:685px; heigth:25px; /*Texto: Lo cogerá el de las migas*/ /* Heredado del body font-family:Arial,sans-serif,Verdana,Trebuchet MS,Times New Roman; */ font-size:1em; line-height:1.5em; font-weight:normal; color:#000d6d; text-align:left; margin-top:1px; margin-bottom:10px; } #migas a { /* Heredado del body font-family:Arial,sans-serif,Verdana,Trebuchet MS,Times New Roman; */ font-size:1em; line-height:1.5em; font-weight:normal; color:#000d6d; text-align:left; /*text-decoration:underline; */ } #migas a:hover { text-decoration: underline; } /* #migas a.inicio{ text-decoration:underline; } */ #migas span.lastitem{ font-weight:bold; } #migas p { margin-left:0px; /*anulamos atributo general*/ } /************** PIE *****************************/ #pie { /*Sin width, a toda pantalla*/ /*width:950px;*/ height:52px; /*+30=92*/ padding-top:40px; background: #c6cedb url('/uploads/santaeufemia/pie-bk.gif') repeat-x; /*Metemos el pie en #contenido. Para que el pie quede por debajo tanto como en relative y aquí el z-index ha de ser menor. z-index no va si no se pone también en relative*/ position:relative; top:-30px; z-index:0; } #pie #contenidopie{ width:952px; height:54px; margin:0 auto; /*centramos el contenido del pie*/ padding-top:0; overflow:hidden; } #pie #datospie{ float:left; padding-top:8px; margin:0; width:600px; /*aumentando este width, desplazamos a la dha. los iconos accesibilidad sin poner margin*/ } *html #pie #datospie{ width:620px; } #pie p{ margin:0; float:left; text-align:left; color:#fff; margin-left:8px; } /*hack IE6 dobla el margen */ *html #pie p{ margin-left:4px; } #pie #datospie p{ /************************ Heredada del body font-family:Arial,Helvetica,Verdana,sans-serif; font-size:.95em; line-height:1.2em; color: #000; ****************************/ width:auto; font-size:1em; line-height:1.2em; color:#000d6d; } /*Cogemos el general #pie a{ color:#40221e; } */ /******* Para que funcione en IE 6-7 pues resulta que sus hijos los si tienen el width pero como sus padres -accesibilidad y validxthm10 no lo tenían puesto, IE6-7 los hacía más grandes (como la ventana padre de estos). **********************/ #pie p#accesibilidad,#pie p#validxhtml10{ width:71px; } #pie p#disenaeprinsa a,#pie p#creadoconportal a,#pie p#accesibilidad a, #pie p#validxhtml10 a,#pie p#juntaandalucia a{ height:28px; text-indent: -1000em; margin-top:10px; float: left; } #pie p#disenaeprinsa a{ background:transparent url('/uploads/santaeufemia/disenaeprinsa-peque.gif') no-repeat top; width:67px; margin-right:0px; } #pie p#disenaeprinsa a:hover{ background-position:bottom; } #pie p#creadoconportal a{ background:transparent url('/uploads/santaeufemia/creadoconportal-peque.gif') no-repeat top; width:56px; margin-right:0px; } #pie p#creadoconportal a:hover{ background-position:bottom; } #pie p#juntaandalucia a{ background:transparent url(uploads/santaeufemia/jandalucia-peque.gif) no-repeat top; float:left; width:47px; margin-right:0px; } #pie p#juntaandalucia a:hover{ background-position:bottom; } #pie p#accesibilidad a{ background:transparent url('/uploads/santaeufemia/accesibilidadAA-peque.gif') no-repeat top; width:71px; float:right; margin-right:0px; } #pie p#accesibilidad a:hover{ background-position:bottom; } #pie p#validxhtml10 a{ background:transparent url('/uploads/santaeufemia/xhtml-peque.gif') no-repeat top; width:71px; float:right; margin-right:0px; } #pie p#validxhtml10 a:hover{ background-position:bottom; } /**************** FORMULARIOS **************************/ form{ width:95%; overflow:hidden; margin:0 auto; } form fieldset{ padding:2%; /*borde del formulario */ border:1px solid #000d6d; /*CAMBIAR*/ /*color background*/ background:#f2f2f2; /*CAMBIAR*/ } form label{ clear:both; display:block; width:20%; float:left; font-weight:normal; } form textarea{ width:60%; overflow:hidden; font-size:1.6em } /*Check-box, cuadros de texto */ form input, form select, form textarea{ /*borde campos a rellenar: textbox, text areas */ /*border:1px solid #000d6d;*/ /*CAMBIAR*/ /*al quitar el borde ya no aparece en IE6-7 en los checkbox */ } form input, form select{ font-size:1.1em; } form span{ clear:both; display:block; } form p{ clear:both; padding:0px; margin:3px 0px 8px 0px; height:100%; overflow:hidden; } p.botones{ padding:2px 0px 2px 0px; /*fondo color donde se coloca p.e. en Contacto el botón Enviar */ background:#c6cedb;/*#1b5353 ;*//*#cfdecf;*/ /*CAMBIAR*/ text-align:center; /*Color texto botones */ color:#000; /*fff; EVALUAR */ } p.botones input, p.botones a{ width:auto; background:#fff !important; color:#000; text-align:center; cursor:pointer; font-size:1em; } p.botones a{ padding:2px 0px 2px 0px; } .aviso{ /*color aviso de campos que deben rellenarse en formulario */ color:#5a0000; } .mensajeaviso{ border:1px solid #5a0000; padding:2%; background:#dfe9f2; /*CAMBIAR*/ margin-bottom:10px; /*separamos los cuadros de texto al mostrar el mensaje*/ } .mensajeaviso p{ color:#5a0000; } /***************** FORMULARIO SUSCRIPCION *********************/ div.capasuscripcion dl.suscripcion dd { width: 85% !important; background:none; } div.capasuscripcion dl.suscripcion dd label{ width:80%; } div.capasuscripcion dl.suscripcion dt { margin-top: 0px; clear: left; width: 6% !important; } div.capasuscripcion dl.suscripcion dd { margin-left: 0px !important; margin-top: 4px; margin-bottom: 4px; } /*DEFINICIONES DE TABLA USADO EN SUSCRIPCIONES */ dl { clear:both; margin:0px 0px 0px 0px; /* Cuadro que envuelve los checkbox. Los
    engloban los
    */ background:transparent; border: 1px solid #000d6d; /*CAMBIAR*/ overflow: hidden; padding: 5px 0; height:auto; width:95%; margin:0 auto; margin-bottom:5px; } dt { clear: both; width: 34%; float: left; margin-top: 4px; text-align: right; padding: 2px 5px; min-height:1.5em; } dd { width: 50%; float: left; margin-top: 5px; background: #fff; padding: 2px 5px; min-height:1.5em; } /************************** MAPA WEB *************************/ div.div_mapa { width:33%; float:left; } #elcontenido div.div_mapa ul.tablaContenido{ margin-left:0px; margin-right:0px; } #elcontenido div.div_mapa ul.tablaContenido li { background : none; /*Eliminamos estilos posibles puesto en #elcontenido ul li */ width:auto; margin-left:0px; } /*Elementos 1er nivel. Cabeceras del mapa */ #elcontenido div.div_mapa ul.tablaContenido li a { /*tamaño*/ width:92%; display: block; /*Lleva la fuente del body */ line-height:1.4em; /*CAMBIAR para centrar el texto en el recuadro*/ font-weight:bold; /*color fondo encabezados menú en el mapa-web */ background:#c6cedb repeat-x scroll left bottom; /*CAMBIAR COLOR*/ /*borde de los encabezados */ border:1px solid #000d6d; /*CAMBIAR*/ /*Controla la altura de los encabezados.*/ padding:6px 10px 3px 5px; margin-bottom: 5px; /*color enlaces del mapa, es decir todo el texto. Normalmente el del h3 */ color:#000d6d; /*CAMBIAR/* } #elcontenido div.div_mapa ul.tablaContenido li ul { /*acercamos la barra de elemento hijo a su padre.*/ margin-top:0px; } #elcontenido div.div_mapa ul.tablaContenido li ul li a { background:none; padding-left:0px; font-weight:normal; margin-bottom:0px; padding:0px; width:90%; border:none; color: #000; } #elcontenido div.div_mapa ul.tablaContenido li ul li a:hover { color:#9a0000; /*idem general*/ } /*Elementos 2º nivel. Inmediatamente bajo los principales que están en cabecera*/ #elcontenido div.div_mapa ul.tablaContenido li ul li { padding-top: 0px; padding-left:1.2em; /*Separamos li.gif del texto del enlace */ background:transparent url(uploads/santaeufemia/li.gif) no-repeat scroll 0 3px; } /*Elementos 3er nivel*/ #elcontenido div.div_mapa ul.tablaContenido li ul li a ul li, #elcontenido div.div_mapa ul.tablaContenido li ul li ul li { border:0 solid white; padding-left:15px; /*o 20px y los borde-li-mapa.gif mostrar en 0 0 */ padding-top:0; background-image:none; } #elcontenido div.div_mapa ul.tablaContenido li ul li a ul li, #elcontenido div.div_mapa ul.tablaContenido li ul li ul li { background:transparent url(uploads/santaeufemia/borde-li-mapa.gif) no-repeat scroll -5px 0; margin:0; } #elcontenido div.div_mapa ul.tablaContenido li ul li a ul li.last, #elcontenido div.div_mapa ul.tablaContenido li ul li ul li.last { background:transparent url(uploads/santaeufemia/borde-li-mapa-last.gif) no-repeat scroll -5px 0; } #elcontenido div.div_mapa ul.tablaContenido li ul li ul li a ul li, #elcontenido div.div_mapa ul.tablaContenido li ul li ul li ul li{ padding-top: 0px; } /****COMUNES GALERIAS, ENLACES,NOTICIAS, CALENDARIO **********/ /*********** PARA GALERIAS DE IMÁGENES *************/ #elcontenido ul li.thumb{ margin-left:0; padding-left:0; } /*********** COLUMNAIZQUIERDAINTERIOR: Contiene las distintas imgs, noticias, categorías,..... ************/ /*****************************************/ #elcontenido #columnaizquierdainterior { float:left; margin-right:8px; width:65.8% ; padding-left:5px; overflow:hidden; /* height:100%; */ /*height:100%;->da problemas en Ie6 si ponemos height para simular min-height y se corta el contenido. Pasó al ver varias noticias. Quitarlo o poner auto Además si no se usa el min-height tampoco hace falta ponerlo*/ } #elcontenido #columnaizquierdainterior ul{ overflow:hidden; } /*Elemento
  • al listar noticias por categorías o todas */ #columnaizquierdainterior ul li{ background:none; padding-left:0; } /********* Anulamos css de img dentro plantilla [contenido.css] ***********/ #elcontenido #columnaizquierdainterior img { border:none; padding:0; margin-left:none; /*Imágenes en en
  • de los listados de noticias por categorias o todas las noticias */ } /* IMAGENES EN EL DETALLE DE UNA NOTICIA ESTÁN DENTRO DE UN

    Al estar dentro de #columnaizquierdainterior hay un menú a la derecha, por tanto la imagen no debe llegar a él. Sin embargo su height da igual pues hacia abajo no hay límite. */ #elcontenido #columnaizquierdainterior p img { max-width:440px; } /*Hack IE6 */ * html #elcontenido #columnaizquierdainterior p img { width: expression(this.width > 440? "440px":this.width); } /********** [Más información] -> recuadro abajo donde te pone la {fecha de las noticia} en Noticias o {volver a galerías de imágenes} en Galerias *********/ #columnaizquierdainterior .masinformacion { width:95%; /*Colores borde y fondo: CAMBIAR*/ /* Modelo caja ----------- border:1px solid #000d6d; background: #d7d7d7; */ /*Modelo entre líneas sup-inf */ border-right:1px solid #000d6d; border-bottom:2px solid #000d6d; clear:both; /*texto CAMBIAR (si se desea)*/ font-size:0.85em; color:#000; margin: 1px 0 1em 0; padding-right:0.4em; text-align:right; /*Así controlamos la altura del

    más información para que el texto quede dentro del recuadro dibujado con el propio

    */ line-height:1.7em; } /*Texto general color:#fff; */ } #columnaizquierdainterior .masinformacion a:focus, #columnaizquierdainterior .masinformacion a:hover{ /*CAMBIAR*/ /*cogemos del general color:#feea83; */ } /* << volver : dentro de noticias, agenda,... */ #volver a { /*Cogemos del general color:#261512; */ /*CAMBIAR */ } #volver a:hover { /*Cogemos del general color:#af5d52; */ /*CAMBIAR*/ } /**************** COLUMNADERECHAINTERIOR: contiene el menuterciario con : categoria >ver todas> ----------------------- Categ1 ->elemento Categ2 .. ******************/ #elcontenido #columnaderechainterior ,#columnaderechainterior{ /*Color de fondo: CAMBIAR */ /*Cuadro relleno con borde */ /* background:#c6cedb;*/ /*#d7d7d7; */ /* border:1px dotted #000d6d;*/ /*Adornamos con un borde sup y otr inf*/ /* border-top:1px solid #000d6d;*/ border-bottom:2px solid #000d6d; margin: 0 0 1em 0.5em; float:left; width:28%; /*padding: 0 0 5px 2px; */ /*sin borde dejamos la sombra baja*/ /* border:1px solid #989e73;* /*CAMBIAR color */ } /* Cabecera en menú derecha. Contiene p.e. en galerias: Galeria >ver todas< . Idem para resto */ #elcontenido #columnaderechainterior h3, #columnaderechainterior h3 { padding-left:5px; padding-top:5px; text-decoration:none; /*SIN COLOR FONDO, DEJAMOS SOMBRA ALTA */ /*Color fondo cabecerita,..CAMBIAR , quitar ,.... */ /* background:#f1ebef;*/ /*CAMBIAR*/ padding-bottom:2px; /*bajamos la línea */ border-bottom: 1px solid #000d6d; /*borde inferior en la cabecera del menu-dha. CAMBIAR */ /* border-bottom:1px solid #00996a;*/ /*Color Texto CAMBIAR */ color:#000d6d; width:97%; height:1.3em; /*se puso h3 por error TAW y este h3 lo ponemos como h5 pues la letra debe ser pequeña Son los [Categorias >ver todas<] */ font-size:1em; line-height:1.5em;/*TOCAR PARA ALTO H3 */ font-weight:bold; margin-bottom:0.5em; margin-top:0em; overflow:hidden; } /*El >ver todas< */ #columnaderechainterior h3 a.vertodo { float:right; margin-right:5px; font-weight: normal; letter-spacing: 0px; font-size:0.85em; line-height:1.8em; text-align: right; /*separamos el vertodo del título principal*/ padding-left:25px; border-left:1px solid #000d6d; /*acomodamos .gif */ padding-right:16px; background: transparent url('/uploads/santaeufemia/mas.gif') no-repeat right 2px; /*CAMBIAR*/ /*cogemos color del general color:#1e008e; */ /* text-decoration:underline; */ } /*hack IE6-7 */ *:first-child+html #columnaderechainterior h3 a.vertodo{ margin-top:-19px; /*TOCAR SI NO CUADRA EL VER-TODAS EN IE7*/ } *html #columnaderechainterior h3 a.vertodo{ margin-top:-17px; /*TOCAR SI NO CUADRA EL VER-TODAS EN IE6*/ line-height:1.5em; background: transparent url('/uploads/santaeufemia/mas.gif') no-repeat right 0px; } /*Hover sobre ver-todo */ #columnaderechainterior h3 a.vertodo:focus, #columnaderechainterior h3 a.vertodo:hover{ /*CAMBIAR*/ /*cogemos del general color:#990000; */ } /*Padding para los li*/ #columnaderechainterior #menuterciario { padding-left:0px; padding-bottom:3px; border-right:1px solid #000d6d; } #columnaderechainterior #menuterciario li{ padding-left:5px; /*Sobreescribimos el del #elcontenido ul li */ background:none; /*Eliminamos li.gif puesto en #elcontenido ul li */ /*Tamaño fuente de las distintas categorías listadas como li */ font-size:1em; } /*Categorías listadas en el menu derecha (categorias de noticias, eventos,..) */ #columnaderechainterior #menuterciario a{ /*CAMBIAR*/ /*cogemos color del general color:#1e008e; */ font-size:1em; font-style: italic; } /*Hover sobre las categorías,.. */ #columnaderechainterior #menuterciario a:hover { /*CAMBIAR*/ /*cogemos color del general color:#990000; */ } #columnaderechainterior #menuterciario a.activo { color:#990000; } /*********** PAGINACIÓN. Se pagina (poner en pestaña opciones: Enlaces,Agenda y Noticias. ***********/ #elcontenido ul.paginacion{ clear:both; /*CAMBIAR */ /*background: #f1ebef;*/ /* CAMBIAR */ width:100%; /*height:100%; problemas IE6 al poner height en contenido para simular min-height. Ponía la paginación a un height= height del contenido.Ad+ no hace falta en ningún caso.*/ overflow:hidden; margin:10px auto; text-align:center; padding:1px 0px 1px 0px; border-top:1px solid #000d6d; border-bottom:1px solid #000d6d; } #elcontenido ul.paginacion li{ background:none; display:inline; padding-left:18px !important; /* Para todos los navegadores */ padding-left:16px; /* Para IE 5.5 */ padding-left/**/:/**/18px; /* Para IE 6 */ } ul.paginacion li a{ /*cogemos del general color:#1e008e; */ } ul.paginacion li a:hover{ /*cogemos del general color:#990000; */ } div#volver { margin:0 auto; color:#000; font-size:1em; /*CAMBIAR */ text-align:right; overflow:hidden; width:92%; } /************* GALERIA DE IMAGENES ************************/ /*Preparado para normal de unos 700px */ #galeriainterior{ width:100%; padding-top:5px; } /*Galeria interior ul */ #galeriainterior ul{ padding-left:10px; overflow:hidden; } /* Lista que contiene las imágenes */ #galeriainterior ul li.thumb{ background-image:none; /* Las imágenes no pasarán de esta anchura en en li para que quepan por li las que queramos*/ width:137px; /*Ojo: Si establecemos height da problemas en IE6, pone más altura. Habría que indicar otro height para IE7 */ /*height:145px;*/ /*145Altura para como máximo 2 líneas de descripción de la img */ /*Márgenes*/ margin:0 0.4em 0.4em 0; } /*HACK IE6*/ *html #galeriainterior ul li.thumb { margin:0 0.2em 0.2em 0; } /* Texto bajo imágenes */ #galeriainterior ul p{ width:122px; /* igual al li: 132-18(margen)-2(borde)=122 para que se centre en él */ /*texto centrado para imagen galería */ text-align:center; font-size:0.9em; /*CAMBIAR */ } /* dentro de li*/ #galeriainterior .thumb a { display:block; /*colores por defecto que pone port@l (gris) border-color:#EEEEEE #CCCCCC #CCCCCC #EEEEEE;*/ border-color:#01139e #000d6d #000d6d #01139e; background-color:#dfe9f2; /*Centramos el dentro del li margin:0 auto; heigth:75px; */ /* para que centre el texto del enlace bajo la img de la galería */ text-align:center; } /* {.thumb a} por defecto cogen borde y un ancho de 100px. */ .thumb img{ /*para que no se salga por abajo si es muy alta ni horizontalmente */ max-width:100px; max-height:70px; /*Tendrán su hack en IE6 */ /* para que centre la imagen dentro del enlace */ display:block; margin:none; /*eliminamos cualquier posible margen */ margin:0 auto; /*Anulamos estilos de la plantilla -> img{} para que no se apliquen a Galerias */ border:none; padding: 0; } /*hack IE6: no debe pasar la altura/anchura máxima permitida */ * html .thumb img{ width: expression(this.width > 100 ? "100px":this.width); height: expression(this.height> 70? "70px":this.height); } /* #.thumb img { margin-left:0; } */ /*************** ENLACES *******************/ #enlacesinterior ul { clear:none; float:left; background:none; } #elcontenido #columnaizquierdainterior ul li.thumbenlace{ margin-bottom:1em; padding-top:0.8em; padding-left: 0px; width:138px; margin-right:9px; overflow:hidden; float:left; height: 90px; /*Para que no coja estilos de #elcontenido ul li en contenido.css */ margin-left:0; background-image:none; /*quitamos el li.gif */ } /*Sirve tanto para a.enlaceenlace como para a.imagenenlace */ #elcontenido #columnaizquierdainterior li.thumbenlace a{ display:block; padding:0px !important; margin:0px !important; text-align:center; width:95%; font-weight:bold; } .thumbenlace a.imagenenlace{ /* height: 126px; */ width:138px; overflow:hidden; margin-bottom:10px } .thumbenlace a.enlaceenlace{ text-align:center; line-height:1.1em; /*Dejamos el color del general. color:#1e008e; CAMBIAR*/ font-size:0.9em; } .thumbenlace a.enlaceenlace:hover{ /*Dejamos el color del general. color:#990000; CAMBIAR*/ } .thumbenlace a.imagenenlace img{ max-height:90px; max-width:120px !important; /* Para todos los navegadores */ width:auto; /* Para todos los navegadores */ text-align:center; border:1px solid #000d6d !important; margin-left:0; } /*Hack IE6 pues no reconoce el max-width */ *html .thumbenlace a.imagenenlace img{ width: expression(this.width > 120? "120":this.width); } *html .thumbenlace a.imagenenlace img{ height: expression(this.height > 90? "90":this.height); } /**************** NOTICIAS **************************************/ /***************** Todo el cuerpo de noticias que puede crecer *****************/ #listadonoticiasinterior { margin: 0px; border: none; width:100%; height:auto; } /*Cada noticia es un

  • */ #elcontenido ul.listadointerior li { clear:both; width:100%; border:none; background-image:none; /*Para que no queden estilos de contenido.css #elcontenido ul li */ padding-left:0; } /* Título de la noticia, es un que lleva a él */ #columnaizquierdainterior ul.listadointerior a{ padding-left:14px; text-decoration:none; /*Color enlace noticia,evento,... Poner el del h3*/ /*cogemos del a general color:#1e008e; */ /*CAMBIAR*/ } #columnaizquierdainterior ul.listadointerior a:hover{ /*Color enlace noticia,evento,...Poner el del h3:over (o menusecund:hover)*/ /*cogemos del a general color:#990000;*/ /*CAMBIAR */ } /* imagen de la noticia */ #columnaizquierdainterior ul.listadointerior li img{ float:left; border:1px solid #1e008e; max-width:28% !important; /* Para todos los navegadores */ width:auto; /* Para todos los navegadores */ margin-left:1em; margin-right:5px; /*para separar el resumen que está a su derecha */ margin-bottom:10px; /*separa el más-información */ padding:15px 7px; } /*Hack IE6 pues no reconoce el max-width */ *html #columnaizquierdainterior ul.listadointerior li img{ width: expression(this.width > 105? "28%":this.width); } /*Div que contene el resumen de la noticia*/ ul.listadointerior li div{ margin-bottom:1em; } /*resumen de la noticia */ ul.listadointerior li div p{ margin:0; padding-right:0.2em; } .centrado { text-align:center; } /************* CALENDARIO **************/ #elcontenido ul.listacalendario li{ background-image:none; /*Para que no quede el estilo de contenido.css #elcontenido ul li*/ padding-left:0; } /*Las img. llevan la clase flotaizquierda */ .listacalendario .flotaizquierda{ float:left; max-width:28% !important; /* Para todos los navegadores */ width:auto; /* Para todos los navegadores */ margin-right:5px; /*para separar el resumen que está a su derecha */ margin-bottom:10px; /*separa el más-información */ } /*Título del enlace. Es un que lleva a él. */ #columnaizquierdainterior ul.listacalendario a{ padding-left:14px; text-decoration:none; /*CAMBIAR. Poner el del h3,menu-sec.*/ /*Dejamos el color del general color:#1e008e; */ } #columnaizquierdainterior ul.listacalendario a:hover{ /*CAMBIAR. hover del h3*/ /*Dejamos del general color:#990000; */ } #tablaagenda table{ width:98%; margin-bottom:1.5em; margin-top:0px; /*Color borde separador calendario - Categorías ver todas. CAMBIAR*/ border-bottom: 1px solid #000d6d; /*Fuente*/ font-size:85%; } #tablaagenda table tr{ background:none; } /* cuadro que tiene: << Mes >> */ #tablaagenda .calendar-month { font-size:1.1em; overflow:hidden; } /*Texto << (ir a mes anterior) */ #tablaagenda span.calendar-prev { float:left; color:#00996a; width:16px; height:16px; } /*Contiene: Febrero 2010 ..... es decir el mes y año */ #tablaagenda span.texto { float:left; color:#00996a; width:80%; height:16px; text-align:center; } /*Texto >> (ir a mes siguiente)*/ #tablaagenda span.calendar-next { float:right; color:#00996a; width:16px; height:16px; } #tablaagenda table caption { /*CAMBIAR color tabla calendario <> */ background:#000d6d; text-align:center; /*border-top: 1px solid #646100;*//*border*/ } #tablaagenda table caption *{ color:white; margin:0 auto; } /*Texto: Lun Mar Mie Jue Sab Dom que es subcabecera */ #tablaagenda table th{ padding:0; /*color de texto y fondo: CAMBIAR */ color:#000; background:#c6cedb; /*CAMBIAR Color fondo del título: lun mar mie jue...*/ text-align:center; font-weight:normal; } /*dias sin eventos: en negro*/ #tablaagenda table td{ padding: 0 0 5px; text-align:center; border: none; color:#000; } /*hoy*/ #tablaagenda table td.calendar-today{ background:#e0e0e0; } /*días con eventos*/ #tablaagenda table td a{ /*Dejamos del general color:#1e008e; */ text-decoration:underline; } #tablaagenda table .calendar .texto { padding-top:3px; width:128px; } /*********** FIN GALERIAS, ENLACES, NOTICIAS, CALENDARIO **************************/ /**********************TABLAS ************************/ table{ margin-bottom:1.4em; width:95%; margin:6px auto 7px; /*centramos la tabla*/ /*Color de cada fila */ background:#fafafa; /*#f6f6f6;*/ /*CAMBIAR*/ /*color borde limites superior e inferior tabla border-top:2px solid #000d6d; /*CAMBIAR línea-separador*/ border-bottom:2px solid #000d6d; /*CAMBIAR línea-separador*/ border:1px solid #000d6d; border-collapse:separate; border-spacing:0; } table.mitadancho{ width:60%; } table thead tr *{ color:#fff; } table thead td, table thead th{ font-size:1.2em; /*color cabecera tabla background */ background:#000d6d; /*CAMBIAR*/ /*color borde inferior cabecera tabla que junto a los bordes sup-inf de la tabla la delimitan*/ border-bottom:2px solid #000d6d; /*CAMBIAR línea-separador*/ /*border-left:1px solid #cfdecf;*/ /*separador columnas */ /* text-align:center; que el usu alinee como quiera, pues al poner esto siempre centra (lo cual puede confundirlo) y además puede que no quiera el centrado. */ } /*SUBCABECERAS Dentro de tbody->tr->th, subcabecera dentro del body */ table tbody tr th { background:#c6cedb none repeat scroll 0 0; /*CAMBIAR color Sub-cabecera */ border-bottom:2px solid #000d6d; /*CAMBIAR, he puesto mº color cabecera-tabla */ font-size:0.9em; color:#000d6d; /*CAMBIAR color texto dentro del background */ font-weight:bold; text-align:center; } table tbody tr td{ border-bottom:2px solid #fff; border-left:2px solid #fff; padding-left:0.5em; padding-right:0.5em; } table, td, th { vertical-align:middle; } /* SubCabeceras definidas dentro del body con */ table th a.asc{ padding-right:15px; } table th a.desc{ padding-right:15px; } table td.importe{ text-align:right; white-space:nowrap; font-size:0.9em; } table td.descripcion{ font-size:0.9em; } table td.fecha{ font-size:0.9em; } table td.sinsalto{ white-space:nowrap; } /*texto dentro de la tabla*/ #elcontenido table tbody p { /*Anulamos estilo #elcontenido p en Generales */ margin-right:2px; margin-left:0px; } /*Imágenes dentro tabla*/ table img{ margin:0.2em; border:none; float:none; } /*** GUIA DE TRAMITES **/ /*************************************/ /*Solución problema telemático label-input */ .radio_tramites span{ width:90%; display:block; font-weight:bold; } .radio_tramites label{ width:45%; margin-left:15px; font-style:italic; } .radio_tramites input{ float:left; } /*************************************/ /*Sello de tiempo */ .sello a { background:transparent url(http://www.dipucordoba.es/inc/eadmin/contratacion/img/sello.gif) no-repeat scroll right top; float:none; line-height:25px; padding-right:25px; padding-top:6px; text-decoration:none; } /* Ya no lo uso lo he puiesto como en las tablas normales con en vez de */ background:#ebe5df none repeat scroll 0 0; border-bottom:1px solid #770606; font-size:1.1em; font-weight:bold; } /****************** GOOGLE MAP ***************************/ #map{ margin:0 auto; width:481px; height:323px; clear:both; border:1px solid #000d6d; position:relative; margin-left: 2em auto; margin-bottom:1.2em; } #map img{ border:none; margin-left:0; padding:0; } /* End of 'comun' */ /* Start of CMSMS style sheet 'contenido' */ /********************** CONTENIDO-SANTA EUFEMIA ------------------------ Esta plantilla no se aplica en PORTADA. Estos estilos no se deben aplicar a columnaizquierdainterior ni columnaderechainterior Sólo a las pags. de contenido (ni por supuesto a portada). Siempre estos estilos serán anulados donde no se desee. */ /****** PARRAFOS **************/ #elcontenido p { /*Márgenes */ margin:0 0.5em 0.35em 0; overflow:hidden; } /****** LI **********************/ #elcontenido ul li{ /*Hacemos espacio para li.gif */ padding-left:17px; /*CAMBIAR posición para cuadrar según el tamaño del li.gif */ background:transparent url(/uploads/santaeufemia/li.gif) no-repeat scroll left 2px; } /*
  • que tiene un icono de pdf al final. Hemos de bajar el li.gif respecto al
  • sin imagen.*/ #elcontenido ul li.lipdf { background:transparent url(/uploads/santaeufemia/li.gif) no-repeat scroll left 7px; } /*******si quisieramos márgenes *********** ul, ol { *********margin:0 1.5em 1.5em; }*****************/ /****** REDEFINICIONES HN *******************/ #elcontenido h4 { font-size:1.3em; margin-left:.2em;font-weight:bold;} #elcontenido h5 { font-size:1.2em;margin-left:0.5em;font-weight:bold;} #elcontenido h6 {font-size:1.1em;margin-left:0.8em;font-weight:bold;} /********** IMÁGENES ***********************/ img, p img { margin: 5px 5px 5px 5px; /* padding: 15px 7px; margin-left:1em; margin-right:1em; margin-bottom:.5em; */ } /* imagen que tiene el para descargar un documento .pdf. Lo centramos en la línea de párrafo en que se encuentre. */ img.enlacepdfsmall { margin:1px; /*quitamos el margen 5px en imgs puesto anteriormente*/ } #sinborde { padding:0; margin:0 3px 0 0; } /* End of 'contenido' */