/* * Fichero: public.css ,v1.0px 04/12/2006 Vanessa Martín Oliete * * Hoja de estilos para presentación de los elementos principales comunes a * toda la Web. Se establecen tamaños, fuentes, solores y otros atributos * en general. * * Media screen * Navegadores IE5+, Mozilla 1.3+, Konqueror X, Opera X * CSS 2 * Fichero public.css * Version v1.0 * Autores Vanessa Martín Oliete * Comentarios */ /* ESTILOS GENERALES */ body {margin:0px auto;padding:0px auto;width:730px;color:#969696;text-align:center;font-family:Arial, Verdana, Sans Serif; font-size:11px;background:#FFFFFF; } html, body { } td { } hr { display: none; } /* ESTILOS CAJAS GLOBALES. GRID GLOBAL */ /* Estructura de datos de grid globales para los esquemas: web-pre -> Caja web que engloba la pre home web -> Caja web que engloba todo pcab -> Caja precabecera cab -> Caja cabecera scab -> Caja subcabecera ctd -> Caja contenido que engloba laterales y datos dts -> Caja datos pie -> Caja pie */ #web {padding:0px auto;margin:0px auto;width:730px;background:#FFFFFF;text-align:left;} #cab {width:730px; } #ctd {width:730px;float:left;background:#FFFFFF;padding:0px 0px 30px 4px;} #lat {float:left;width:150px;} #dts-home {width:687px;background:#FFFFFF url(/MODULOS/global/publico/interfaces/img/fondo-dts-home.gif) 0px 1px repeat-x;margin:0px;padding:0px;} #dts {float:left;width:535px;margin:0px;padding:0px;} #pie {width:687px; } /* ESTILOS PARA LA CABECERA DE LA WEB */ #cab .nav {float:right;width:503px;background:url(/MODULOS/global/publico/interfaces/img/fnd-nav-home.gif) 0px 0px no-repeat; color:#1F2F6B;height:109px;text-align:right; } #cab .nav ul{ float:right;color:#1F2F6B;list-style-type:none;padding:0px 35px 0px 8px;margin:5px 0px 0px 0px;height:30px;text-align:right; } #cab .nav li{margin:0px;padding:0px 5px 0px 0px;font-family:Arial; font-size:8pt;list-style-type:none;float:left; } #cab .nav li a{margin:0px;padding:0px; color:#1F2F6B;text-decoration:none;font-weight:bold;text-transform:uppercase;} #cab .logo h1{float:left;height:92px;background:url(/MODULOS/global/publico/interfaces/img/logo.gif) 0px 0px no-repeat; width:215px; padding:0px;margin:0px;} #cab .logo h1 a span{display:none;} #cab .logo h1 a{display:block;height:92px; width:215px;} /*ESTILOS SUBCABECERA*/ #scab{background:url(/MODULOS/global/publico/interfaces/img/precab.gif) 0px 0px no-repeat;height:35px;margin-bottom:10px;width:692px;} /* ESTILOS PARA EL PIE DE LA PAGINA */ #pie {float:left;margin:0px; padding:8px 0px 0px 4px; background:url(/MODULOS/global/publico/interfaces/img/fnd-pie.gif) 0px 0px no-repeat;height:32px;color:#000000;} #pie .logo{width:200px;vertical-align:middle;float:left;} #pie .nav { padding:0px 4px 0px 0px; float:right; } #pie .nav ul{ margin:0px; padding:1px 4px 1px 8px; } #pie .nav li{ margin:0px; padding:0px;list-style-type:none;display:inline; color:#000000;} #pie .nav li a{ color:#256099;text-decoration:underline; padding: 0px;font-family:Arial; } /*ESTILOS PARA BREADCRUMBS*/ .bdc{float:left;width:526px;text-align:left;padding-top:8px;font-size:12px;font-family:Arial;background:url(/MODULOS/global/publico/interfaces/img/fnd-path.gif) 0px 0px repeat-x;color:#1F2F6B;height:30px;padding:8px 0px 0px 10px;} .bdc-padd{padding:0px 0px 0px 0px;} .bdc a{color:#006699;text-decoration:underline;} .bdc a:hover{text-decoration:none;} .bdc .act{color:#333333;font-weight:bold;} /* ESTILOS PARA EL CONTENIDO Y DATOS */ #dts .cont{float:left;margin:8px 0px 0px 0px;width:535px;} #dts .cont-img{width:210px;float:right;text-align:right;padding-left:15px;} #dts .cont-img-dts{float:right;background:url(/MODULOS/global/publico/interfaces/img/fnd-pie-ft.gif) 0px 2px repeat-x;width:210px;height:22px;font-size:10px;color:#1F2F6B;text-align:center;padding:4px 0px 0px 0px;} #dts .cont2{float:right;margin:8px 0px 0px 0px;width:535px;} #dts .cont2-img{width:240px;float:left;text-align:left;} #dts .cont2-img-dts{float:left;background:url(/MODULOS/global/publico/interfaces/img/fnd-pie-ft.gif) 0px 2px repeat-x;width:225px;height:22px;font-size:10px;color:#1F2F6B;text-align:center;padding:4px 0px 0px 0px;} #dts .cont3-img-dts{float:left;background:url(/MODULOS/global/publico/interfaces/img/fnd-pie-ft.gif) 0px 2px repeat-x;width:225px;height:22px;font-size:10px;color:#1F2F6B;text-align:center;padding:4px 0px 0px 0px;} #dts h2 {color:#1F2F6B;font-size:15pt;font-weight:bold;} /* ESTILOS PARA MENUS DE NAVEGACION */ /* Menu de 1º Nivel, 2º Nivel y 3º Nivel anidados. Con el estilo ".act" estamos definiendo la opcion de menu actual */ ul.men{float:left;margin:10px 0px 0px 0px;padding:0px;width:129px;border-bottom:2px solid #C6CAD9;} ul.men {margin-bottom:10px; padding:0px;list-style-type:none; } ul.men li{margin:0px; padding:4px 0px 2px 12px;background:url(/MODULOS/global/publico/interfaces/img/bullet-lat.gif) 0px 8px no-repeat;list-style-type:none;border-bottom:1px solid #C6CAD9;} ul.men li a{font-weight:bold;margin:0px; padding:0px;list-style-type:none;text-transform:uppercase;color:#4E5B8A;text-decoration:none;} ul.men li a:hover{margin:0px; padding:0px;list-style-type:none;color:#8891B1;} ul.men-2n {margin:0px; padding:0px;list-style-type:none;} ul.men-2n li{margin:0px; padding:4px 0px 2px 20px;list-style-type:none; background:none; border:none;} ul.men-2n li a{margin:0px; padding:0px;list-style-type:none;color:#8891B1;text-decoration:none;border:none;} ul.men-2n li a:hover{margin:0px; padding:0px;list-style-type:none;color:#4E5B8A;} /*ESTILOS MAPA WEB*/ ul.mweb{float:left;margin:10px 0px 0px 0px;padding:0px;width:129px;} ul.mweb {margin-bottom:10px; padding:0px;list-style-type:none; } ul.mweb li{margin:0px; padding:4px 0px 2px 12px;list-style-type:none;font-weight:bold;} ul.mweb li a{font-weight:bold;margin:0px; padding:0px;list-style-type:none;color:#4E5B8A;text-decoration:none;} ul.mweb li a:hover{margin:0px; padding:0px;list-style-type:none;color:#8891B1;} ul.mwep-2n {margin:0px; padding:0px;list-style-type:none;} ul.mwep-2n li{margin:0px; padding:4px 0px 2px 20px;list-style-type:none; background:none; border:none;width:200px;} ul.mwep-2n li a{margin:0px; padding:0px;list-style-type:none;color:#8891B1;text-decoration:none;border:none;} ul.mwep-2n li a:hover{margin:0px; padding:0px;list-style-type:none;color:#4E5B8A;} /* ESTILOS PARA LOS LISTADOS */ /* Listados para documentos */ .lst-doc ul { margin:0px; padding:0px; list-style-type:none;} .lst-doc li { margin:0px; padding:0px;list-style-type:none;color:#342E25; font-family:"Times New Roman";} .lst-doc li a{text-decoration:none; margin:0px; padding:0px;background:url(/MODULOS/global/publico/interfaces/img/bullet-menu-act.gif) 1px 3px no-repeat; } .lst-doc dl { } .lst-doc dt { } .lst-doc dd { } /* Listados para enlaces */ .lst-enl { float:left;margin-left:2px; } .lst-enl ul { margin:0px; padding:4px 0px 0px 0px; color:#1F2F6B; } .lst-enl li { background:url(/MODULOS/global/publico/interfaces/img/bullet-flecha.gif) 0px 5px no-repeat;margin:0px; padding:0px 0px 0px 8px;list-style-type:none;color:#1F2F6B;} .lst-enl li a{color:#006699;text-decoration:underline; padding: 0px 1px 0px 3px;} .lst-enl li a:hover{text-decoration:none;} /* ESTILOS PARA CAJA CON FORMATOS */ /* Caja de Ayuda */ .caj-ayu {background:url(/MODULOS/global/publico/interfaces/img/fnd-caj.gif) 0px 0px repeat-x;border:1px solid #C7CBDA;height:103px;width:195px; padding:6px 13px 0px 8px;} .caj-lin {float:right;width:260px;border-left:1px solid #D5D5D5;padding:0px 0px 0px 20px;height:110px;} /*Caja para listado noticias*/ .caj-notc{width:535px;} .caj-notc-img{float:left;width:135px;padding-top:8px;} /* Caja de error */ .caj-err { } .caj-err-padd { } .caj-err strong { } /* Caja de 'No hay datos en listado */ .caj-ndts { } .caj-ndts-padd { } .caj-ndts strong { } /* Caja para contenidos anexos */ .caj-anx { } .caj-anx-padd { } /* Caja para contenidos notas */ .caj-not { } .caj-not-padd { } /* Caja resultados */ .caj-res { } .caj-res-padd { } /* Caja para la autentificacion */ .caj-aut { } .caj-aut-padd { } /* Caja para contenido destacado */ .caj-des { } .caj-des-padd { } .caj-des-scc { } /* Caja Tooltip */ #caj-ttip { } #caj-ttip-img { } /* Caja para personalizable: formato 1 */ /* Recordar que debeis comentar donde la empleais, eso os servira con el tiempo a encontrar las cosas */ .caj-f1 {background:url(/MODULOS/global/publico/interfaces/img/fnd-tit.gif) bottom left no-repeat;padding-top:5px;padding-bottom:5px;} .caj-f1a{float:right;width:400px;background:url(/MODULOS/global/publico/interfaces/img/fnd-tit2.gif) bottom right no-repeat;padding-top:5px;padding-bottom:5px;} .caj-f1b{float:right;width:535px;background:url(/MODULOS/global/publico/interfaces/img/fnd-tit3.gif) bottom right no-repeat;padding-top:5px;padding-bottom:5px;} .caj-f2 {background:url(/MODULOS/global/publico/interfaces/img/fnd-f1.gif) 0px 0px no-repeat;padding:10px 0px 0px 0px;} .caj-f3 {width:530px;margin-top:10px;} .caj-f4 {float:right;width:90px;border-left:1px solid #D5D5D5;height:20px;} /* ESTILOS PARA COLUMNAS PERSONALIZADAS */ /* Estilos empleados para modelos de columnas que se han de personalizar porque el diseño lo requiere. Un ejemplo de como nombrarlas es: - Si tenemos que hacer dos columnas seria asi .col2p1 { } 'Con el respectivo comentario de donde se emplea' .col2p1-c1 { } .col2p1-c2 { } - Si tenemos que hacer tres columnas: .col3p1 { } 'Con el respectivo comentario de donde se emplea' .col3p1-c1 { } .col3p1-c2 { } .col3p1-c3 { } Si tenemos mas de dos modelos de personalizacion de columnas, es decir dos modelos diferentes de dos columnas, las nombraremos: col2p1 y a la siguiente col2p2, recordando siempre el comentar donde se emplea. */ .col3p1 { padding-top:20px; } .col3p1-c1 { float: left; width: 130px;background:url(/MODULOS/global/publico/interfaces/img/fondo-dts.gif) 0px 0px repeat-x;} .col3p1-c2 { float: left; width: 540px;padding-left:17px;} .col3p1-c2-1 {float: left; width: 290px;padding-right:10px;} .col3p1-c2-2 {float: right; width: 220px;background:url(/MODULOS/global/publico/interfaces/img/fondo-dts.gif) 0px 0px repeat-x;} /* FONDOS ESPECIALES */ .fdo-XXX { } /* ESTILO PARA LA PAGINACION */ .pag { } .pag a.ini { } /* Estilo para ir al inicio del listado paginado */ .pag a.ini:hover { } .pag a.ant { } /* Estilo para retroceder un paso en el listado paginado */ .pag a.ant:hover { } .pag a.fin { } /* Estilo para ir al final del listado paginado */ .pag a.fin:hover { } .pag a.sig { } /* Estilo para avanzar un paso en el listado paginado */ .pag a.sig:hover { } .pag .ley { } /* Estilo de la leyenda de paginacion */ .pag .ley strong { } .pag .res { } /* Estilo el texto de resultados */ .pag .act { } /* Estilo que indica la pagina en la que estamos */ .pag .act strong { } /* ESTILOS PARA LA NAVEGACION COMPLEMENTARIA */ /* Barra de opciones navegacion superior */ .nav-top { } .nav-top-padd { } /* Barra de opciones navegacion inferior */ .nav-btt { } .nav-btt-padd { } /* ESTILOS PARA CUALQUIER FORMULARIO */ /* Formulario Buscador */ .form-bus {margin:0px;padding:0px; width:100px;height:20px;vertical-align:middle;} .form-bus fieldset { border:none;margin:0px;padding:0px; } .form-bus legend { } .form-bus .lbl {color:#FFFFFF;margin:0px;padding:4px 0px 0px 0px; } .form-bus .cps { height:11px;border:1px solid #999999;font-size:9px;margin:0px;padding:0px;} .form-bus .btn {background:url(/MODULOS/global/publico/interfaces/MODULOS/global/publico/interfaces/img/bullet-buscar.gif) 0px 0px no-repeat; border:1px solid #000;height:15px;margin:0px;padding:0px;} /* Formulario general */ .formulario { margin-left:10px;padding:0px;width:400px;} .formulario fieldset {margin:0px;padding:0px; border:none; } .formulario fieldset legend { display:none; } .formulario fieldset label { font-size:12px; color:#1F2F6B;font-weight:bold; width:40%;float:left;padding:0px 0px 0px 0px;margin-top:3px;} .formulario fieldset .campos {border:1px solid #D5D5D5; color:#505050; font-size:11px;padding:0px 0px 0px 0px;margin-top:3px;} .formulario fieldset .boton{font-weight:bold;color:#FFFFFF;border:1px solid #6B6C6A;background:url(/MODULOS/global/publico/interfaces/img/fondoboton.gif) 0px 2px repeat-x;} .form { font-size:10px;margin-left:10px; padding:0px;width:400px; } .form fieldset { border:none; } .form fieldset legend { display:none; } .form fieldset input { padding: 1px 0px 1px 0px;} .form fieldset label{width:30%;color:#003366;font-weight:bold;padding: 1px 0px 1px 0px;} .form fieldset .lbl { color:#969696;font-family:"Times New Roman";} .form fieldset .lbl-gr { } .form fieldset .lbl-md { } .form fieldset .lbl-pq { } .form fieldset .cps { height:15px;border:1px solid #999999;font-size:9px;margin:0px;padding:0px; } .form fieldset .cps-gr { } .form fieldset .cps-md { } .form fieldset .cps-pq { } .form fieldset .cps-err { } .form fieldset .rad { } .form fieldset .chx { } .form fieldset .tex { color:#505050; } .form fieldset .tex-gr { } .form fieldset .tex-md { } .form fieldset .tex-pq { } .form .btn { } .form .btn:disabled { } .form .btn-gr { } .form .btn-md { } .form .btn-pq { } .form .dist-btn { } .form .obl { } .form .avi { } /* Formulario de filtros de busqueda, opcion de filtrado. Se anida con el estilo "form" */ .form-fil { } /* Formulario de autentificacion de entrada a la web se anida con el estilo "form" */ .form-aut { } /* Formulario de filtros de busqueda, opcion de filtrado. Se anida con el estilo "form" */ .form-fil { } /* Formulario de XXX para cajas ventanas se anida con el estilo "form" */ /* Ejemplo de como anidar:
*/ .form-XXX { } /* ESTILOS PARA TEXTO */ .tit{color:#1F2F6B;font-size:17px;font-weight:bold;}/* Estilo para el titular de la home*/ .tit2{color:#333333;font-size:12px;font-weight:bold;}/* Estilo para el titulo de la home e interiores*/ .tit-caj{color:#1F2F6B;font-weight:bold;} .sub{text-decoration:underline;} .fec { color:#E10807; } /* Estilo para campo de fecha */ .antt{color:#1F2F6B;font-size:10px;} .subtt{color:#666;font-size:10px;font-weight:bold;} .tit-doc{color:#1F2F6B;} /* ESTILOS PARA EL CUERPO */ .fondo{background:#F2F2F2;} /* ESTILOS PARA IMAGENES */ img { } a.img { } a.img:hover { } .img-sm { } /* Estilo para imagenes sin marcos */ .img-cm { border:1px solid #CDC9C4; } /* Estilo para imagenes con marcos */ .img-dch { float: right; } /* Estilos para imagenes que flotan a la derecha */ .img-dch-padd { padding:0px 8px 0px 8px; } .img-izq { float: left; } /* Estilos para imagenes que flotan a la izquierda */ .img-izq-padd { } /* ESTILOS PARA ENLACES */ a {color:#006699;text-decoration:underline;} /* Enlaces en general */ a:hover { } a.enl-1 {background:url(/MODULOS/global/publico/interfaces/img/bullet-flecha.gif) 65px 5px no-repeat;color:#006699;text-decoration:none;padding:0px 0px 0px 60px; }/* Estilo para enlace */ a.enl-1a {background:url(/MODULOS/global/publico/interfaces/img/bullet-flecha.gif) 0px 5px no-repeat;color:#006699;text-decoration:none;padding:0px 0px 0px 15px; } a.enl:hover { } a.enl-2 {background:url(/MODULOS/global/publico/interfaces/img/bocadillo.gif) 0px 3px no-repeat;color:#006699;text-decoration:none;}/* Estilo para enlace */ a.enl:hover { } a.enl-3 {background:url(/MODULOS/global/publico/interfaces/img/bullet-ok.gif) 0px 0px no-repeat;color:#006699;text-decoration:none; }/* Estilo para enlace */ a.enl:hover { } a.enl-ico{color:#1F2F6B;text-decoration:none;} a.banner{color:#000000;} /*ESTILOS PARA ANCHOS*/ .ancho2{width:210px;} /* ESTILOS PARA LA LINEAS */ .lin-f1 {border-bottom:1px solid #D5D5D5;} .lin-f2 {border-bottom:1px solid #D5D5D5;} /* ESTILOS PARA FLOTAR Y ALINEAR */ .flo-izq { float: left; } .flo-dch { float: right; } .ali-izq { text-align: left; } .ali-dch { text-align: right; } .ali-cen { text-align: center; } .ali-top { vertical-align: top; } .ali-btt { vertical-align: bottom; } .ali-med { vertical-align: middle; } /* ESTILOS PARA ESPACIOS Y DIMENSIONES */ .padd {padding:0px 0px 1px 5px; } .padd-top { padding: 60px 0px 0px 0px; } .padd-btt { padding: 0px 0px 10px 0px; } .padd-izq { padding: 0px 10px 10px 0px; } .padd-dch { padding: 0px 0px 0px 0px; } .marg-top{margin-top:5px;} .marg-dch{margin-right:45px;} .padd-clm{padding:10px 10px 0px 15px;} /* ESTILOS PARA BORRAR ESTILOS Y OCULTAR*/ .borde{border:1px solid #FFFFFF;} .brr { clear: both; } .ocu { display: none; } .con:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .con {display:table-cell;} @media all { .con { display:block; }} /* Para Opera */ /* Hides from IE-mac \*/ * html .con { height: 1%; display:block;} /* End hide from IE-mac */