/* 1996-2006 Inter Media S.A. Todos los Derechos Reservados. */ /* CSS para proyecto Municipalidad de santiago */ /* Version 1.0 */ /* media: SCREEN */ /* Fecha de creación 22/06/2006 */ /* HISTORIAL DE MODIFICACIONES */ /* 23/03/2009 Se optimiza html y css para compatibilidad de navegadores segun comentarios del cliente */ /* IMPORTANTE • Los nombres de los estilos deben hacer referencia a la funcionalidad del elemento que se esta definiendo, en ningun caso a caracteristicas gráficas o ubicación, por ejemplo NO NOMBRAR #menu_left o #menu_rojo SI NOMBRAR #menu_principal • NO USAR guiones al centro(-) al nombrar estilos ya que puede generar problemas si se necesita que el estilo interactue con una funcion javascript o PHP, para separar palabras utilizar guion bajo (_) • Lo ideal es generar el Css para impresión al final de la programacion HTML, CSS de modo que existan las mismas clases en ambos Css, de no ser posible es importante que cada vez que se cree un estilo nuevo en la versión SCREEN, este sea replicado en la versión PRINT con las características que corresponden. • Se debe privilegiar la utilización de etiquetas HTML por sobre las clases. • Todos los comentarios adicionales a una definición de estilos SON DE AYUDA Y SON BIENVENIDOS estos deben estar ubicados al principio de la definicion y ser lo mas breve posibles y en un leguaje claro. */ /* REDEFINICION DE ELEMENTOS HTML */ body{margin:0px; padding:0px 0px 35px 0px; font:11px Arial, Helvetica, sans-serif; background:url(../images/rediseno/fon_degrade09.jpg) repeat-x top left #03677E;} table{} td{} h1{} h2{} h3{} h4{} h5{} h6{} strong, b{} a:link{} a:visited{} a:hover{} a:active{} :focus{outline:none;} form{} label{} ul{} button{} .align_left{text-align:left;} .align_right{text-align:right;} .align_center{text-align:center;} .float_left{float:left;} .float_right{float:right;} /*Estilos cabecera*/ #header{width:830px; margin:0px auto; background:#FFF; border-left:1px solid #EBEBEB; border-right:1px solid #EBEBEB;} #header #flash_header{width:809px; height:141px; margin:0px auto; text-align:right;} #header p#fecha_header{font:10px "Trebuchet MS", Arial, Helvetica, sans-serif; position:absolute; margin:0px; padding:2px 0px 0px 15px; z-index:990;} #header #menu{width:830px; height:29px; background:url(../images/rediseno/bkg_menu_header.jpg) 0px 0px repeat-x; border-top:1px solid #CCC; border-bottom:1px solid #CCC; margin:0px; padding:0px;} #header #menu ul{width:604px; height:29px; margin:0px; padding:0px 0px 0px 7px; list-style-type:none;} #header #menu ul li{float:left; padding:9px 4px 0px 4px; font:10px Arial, Helvetica, sans-serif; color:#036;} #header #menu ul li a:link, #header #menu li a:visited{color:#036; text-decoration:none;} #header #menu ul li a:hover, #header #menu li a:active{color:#376CEA; text-decoration:none;} #header #menu #buscador{width:202px; height:29px; float:right;} #header #menu #buscador form{margin:0px; padding:2px 0px 0px 0px;} #header #menu #buscador form input{width:115px; height:18px; float:left; border:1px solid #CCC; margin:0px 5px 0px 0px; font:11px Arial, Helvetica, sans-serif;} #header #menu #buscador form button{cursor:pointer; height:22px; float:left; margin:0px;} #header #menu .menu{position:absolute; visibility:hidden; overflow:hidden; height:auto; background:#FFF; z-index:999; width:122px; padding:0px 4px 4px 4px; background:#F4F4F4; border:1px solid #CCC;} #header #menu .menu p{padding:5px 0px 0px 0px; margin:0px; font:9px Arial, Helvetica, sans-serif;} #header #menu .menu p a{display:block; border-bottom:1px solid #CCC;} #header #menu .menu p a:link{color:#000; text-decoration:none; padding:2px 0px 5px 0px;} #header #menu .menu p a:visited{color:#000; text-decoration:none; padding:2px 0px 5px 0px;} #header #menu .menu p a:hover{color:#06C; background:#FFF; padding:2px 0px 5px 10px; text-decoration:none;} #header #menu .menu p a:active{color:#06C; background:#FFF; padding:2px 0px 5px 10px; text-decoration:none;} /*Estilos contenido Home*/ #estructura{width:832px; margin:0px auto; background:#FFF; vertical-align:top; border-left:none; border-top:none; border-right:none; border-bottom:8px solid #F00;} #estructura #col_menu{width:166px; vertical-align:top; background:#ACC5CA; border:none; text-align:center;} #estructura #col_menu #zona5{padding:15px 0px 0px 0px;} #estructura #col_menu #zona6{padding:15px 0px 0px 0px;} #estructura #col_menu #zona7{padding:15px 0px 0px 0px;} #estructura #col_menu #zona8{padding:5px 0px 0px 0px;} #estructura #col_menu #zona9{padding:10px 0px 30px 0px;} #estructura #col_conteido{width:434px; padding:5px 0px 50px 15px; vertical-align:top; background:#FFF; border:none;} #estructura #col_conteido #noticias_home{width:440px; overflow:hidden;} #estructura #col_conteido #noticias_home a{color:#039;} #estructura #col_conteido #noticias_home h1{background:url(../images/rediseno/bkg_titulos.jpg) 0px 0px repeat-x; height:26px; margin:0px; padding:10px 0px 0px 0px; font:bold 14px Arial, Helvetica, sans-serif;} #estructura #col_conteido #noticias_home p{margin:0px; padding:5px 15px 10px 15px;} #estructura #col_conteido #noticias_home h1 strong{background:url(../images/rediseno/bullet_titulos.gif) 8px 1px no-repeat; padding:0px 0px 0px 30px;} #estructura #col_conteido #noticias_home .destacado{width:420px; overflow:hidden; padding:20px 10px 0px 10px; background:url(../images/rediseno/bkg_santiago_informa.jpg) 0px 10px repeat-x;} #estructura #col_conteido #noticias_home .destacado h2{font:bold 11px Arial, Helvetica, sans-serif; color:#002D9A; margin:0px; padding:0px 0px 10px 0px;} #estructura #col_conteido #noticias_home .destacado p {margin:0px; padding:0px 0px 15px 0px; font:11px/18px Arial, Helvetica, sans-serif;} #estructura #col_conteido #noticias_home .destacado img{float:left; width:240px; margin:5px 10px 0px 0px;} #estructura #col_conteido #zona4{width:440px; height:91px; margin:20px auto 0px auto; padding:0px; border:1px solid #CCC;} #estructura #col_conteido #buscador_tramites{width:440px; height:140px; margin:15px auto; background:url(../images/rediseno/busca_tramites_fon.jpg) 20px 30px no-repeat #F0F3F9; border-bottom:3px solid #DBE3F0; } #estructura #col_conteido #buscador_tramites h1{background:url(../images/rediseno/bkg_tit_tramites.jpg) right top no-repeat #FFF; height:20px; padding:0px 20px 0px 0px; float:left; clear:both; margin:0px 0px 10px 0px; font:bold 14px Arial, Helvetica, sans-serif;} #estructura #col_conteido #buscador_tramites h1 strong{background:url(../images/rediseno/bullet_titulos.gif) 5px 10px no-repeat; padding:10px 0px 0px 25px; height:24px;} #estructura #col_conteido #buscador_tramites form{width:320px; float:right; margin:0px 10px 0px 0px; padding:0px;} #estructura #col_conteido #buscador_tramites form p{margin:0px; padding:0px 0px 10px 0px;} #estructura #col_conteido #buscador_tramites form select{width:320px; height:18px; font:11px Arial, Helvetica, sans-serif;} #estructura #col_conteido #buscador_tramites form input{width:320px; height:14px; border:1px solid #CCC; font:11px/14px Arial, Helvetica, sans-serif; background:url(../images/rediseno/fon_input.jpg) 0px 0px repeat-x;} #estructura #col_conteido #buscador_tramites form button{background:url(../images/rediseno/busca_tramites_boton.jpg) center center no-repeat; float:right; padding:0px; margin:0px; cursor:pointer; width:132px; height:16px; text-align:center; color:#FFF; border:none; font:9px Arial, Helvetica, sans-serif;} #estructura #col_conteido #pago_tramites{width:440px; height:110px; background:url(../images/rediseno/pagos_linea_bkg.jpg) 0px 0px no-repeat;} #estructura #col_conteido #pago_tramites h1{background:url(../images/rediseno/pagos_linea_tit.gif) 0px 0px no-repeat; width:207px; height:45px; margin:25px 25px 0px 0px; float:right; font:1px Arial, Helvetica, sans-serif; color:#F7F7F7; letter-spacing:-1px;} #estructura #col_conteido #pago_tramites p{clear:both; margin:0px; padding:5px 0px;} #estructura #col_conteido #pago_tramites button{background:url(../images/rediseno/pagos_linea_boton.jpg) center center no-repeat; border:none; cursor:pointer; color:#666; font:bold 11px/12px Arial, Helvetica, sans-serif; float:right; margin:0px 10px 0px 0px; width:133px; height:29px;} #estructura #col_banner{width:217px; vertical-align:top; background:#FFF; border:none;} #estructura #col_banner #zona1{width:190px; height:144px; margin:15px auto 0px auto; padding:0px; border:1px solid #666;} #estructura #col_banner #zona2{width:190px; margin:0px auto; padding:15px 0px 0px 0px;} #estructura #col_banner #zona3{width:190px; margin:0px auto; padding:15px 0px 0px 0px;} #estructura #col_banner #stgo_informa{width:190px; margin:0px auto; padding:15px 0px 0px 0px;} #estructura #col_banner #stgo_informa h1{background:url(../images/rediseno/bkg_titulos.jpg) 0px 0px repeat-x; height:26px; margin:0px; padding:10px 0px 0px 0px; font:bold 14px Arial, Helvetica, sans-serif;} #estructura #col_banner #stgo_informa h1 strong{background:url(../images/rediseno/bullet_titulos.gif) 4px 1px no-repeat; padding:0px 0px 0px 20px;} #estructura #col_banner #stgo_informa #txt_informa{width:170px; background:url(../images/rediseno/bkg_santiago_informa.jpg) 0px 0px repeat-x; padding:7px 10px 0px 10px; font:11px Arial, Helvetica, sans-serif;} #estructura #col_banner #stgo_informa #txt_informa h2{color:#002D9A; font:bold 11px Arial, Helvetica, sans-serif; text-transform:uppercase; margin:0px; padding:0px 0px 15px 0px;} #estructura #col_banner #stgo_informa #txt_informa p{font:11px Arial, Helvetica, sans-serif; margin:0px; padding:0px 0px 10px 0px;} #estructura #col_banner #stgo_informa #txt_informa a{color:#039;} /*Estilos Intenas*/ #estructura #col_internas{width:641px; padding:5px 0px 35px 15px; vertical-align:top; background:#FFF; border:none;} #estructura #col_internas a { color:#002D9A; text-decoration:underline;} #estructura #col_internas p { font:11px Arial, Helvetica, sans-serif; padding:0px 0px 0px 0px; margin:0px;} #estructura #col_internas h1{font:bold 12px Arial, Helvetica, sans-serif; color:#002D9A; background:transparent url(../images/rediseno/bkg_santiago_informa.jpg) repeat-x scroll 0 0px; height:30px; padding:5px 0px 0px 5px; margin:0px;} #estructura #col_internas .td_tabla { border:0.5px solid #ccc;} .lin-seg-gris {background-image: url(../images/lin-seg-gris.gif);background-repeat: repeat-x;background-position: center center;height: 5px;} .td10 {font-family:verdana, arial; font-size:9.5px; padding-right: 4px; padding-left: 4px; color: #002D9A;} .tit{ font-size: 10px; font-weight: bold; color: #cc0000; background-image:url(../images/fd-tit-tabla.jpg); background-repeat: repeat-y; padding-right: 3px; padding-left: 3px;} /*Estilos Busqueda interna*/ #resultado_busqueda{font:11px Arial, Helvetica, sans-serif; border-bottom:3px solid #E2E9F3;} #resultado_busqueda th{background:#F0F3F9; padding:5px 15px; border-bottom:1px solid #E2E9F3; text-align:left; color:#002D9A; font:bold 11px Arial, Helvetica, sans-serif;} #resultado_busqueda .seccion{background:#FDFDFD; padding:7px 15px; border-top:1px solid #CCC; border-bottom:1px solid #CCC; text-align:left; color:#000; font:bold 11px Arial, Helvetica, sans-serif;} #resultado_busqueda td{background:#F3F5F5; padding:0px 15px; border-top:2px solid #FFF; text-align:left; color:#000; font:11px Arial, Helvetica, sans-serif;} #resultado_busqueda td p{background:url(../images/bullet_rojo.gif) 0px 4px no-repeat; margin:0px 0px 0px 5px; } #resultado_busqueda td .ver_ficha{background:url(../images/bullet_ficha.gif) 2px 0px no-repeat; padding:0px 0px 0px 15px;} #resultado_busqueda td .ver_ficha a:link, #resultado_busqueda td .ver_ficha a:visited{color:#C00; text-decoration:underline; font:10px Arial, Helvetica, sans-serif;} #resultado_busqueda td .ver_ficha a:hover, #resultado_busqueda td .ver_ficha a:active{color:#C30; text-decoration:underline; font:10px Arial, Helvetica, sans-serif;} #estructura #col_internas #resultado_busqueda td p{padding:0px 0px 0px 15px;} /*Estilo buscador interno*/ #estructura #col_internas #buscador_tramites{width:610px; height:140px; margin:15px auto; background:url(../images/rediseno/busca_tramites_fon.jpg) 20px 30px no-repeat #F0F3F9; border-bottom:3px solid #DBE3F0; } #estructura #col_internas #buscador_tramites h1{background:url(../images/rediseno/bkg_tit_tramites.jpg) right top no-repeat #FFF; height:20px; padding:0px 20px 0px 0px; float:left; clear:both; margin:0px 0px 10px 0px; font:bold 14px Arial, Helvetica, sans-serif;} #estructura #col_internas #buscador_tramites h1 strong{background:url(../images/rediseno/bullet_titulos.gif) 5px 10px no-repeat; padding:10px 0px 0px 25px; height:24px;} #estructura #col_internas #buscador_tramites form{width:320px; float:right; margin:0px 10px 0px 0px; padding:0px;} #estructura #col_internas #buscador_tramites form p{margin:0px; padding:0px 0px 10px 0px;} #estructura #col_internas #buscador_tramites form select{width:320px; height:18px; font:11px Arial, Helvetica, sans-serif;} #estructura #col_internas #buscador_tramites form input{width:320px; height:14px; border:1px solid #CCC; font:11px/14px Arial, Helvetica, sans-serif; background:url(../images/rediseno/fon_input.jpg) 0px 0px repeat-x;} #estructura #col_internas #buscador_tramites form button{background:url(../images/rediseno/busca_tramites_boton.jpg) center center no-repeat; float:right; padding:0px; margin:0px; cursor:pointer; width:132px; height:16px; text-align:center; color:#FFF; border:none; font:9px Arial, Helvetica, sans-serif;} #estructura #col_internas .paginador {text-align:center; font:10px Arial, Helvetica, sans-serif; margin:10px 0px 25px 0px; color:#000;} #estructura #col_internas .paginador a:link, #estructura #col_internas .paginador a:visited{margin:0px 5px; color:#000; width:14px; height:14px; text-decoration:none;} #estructura #col_internas .paginador a:hover, #estructura #col_internas .paginador a:active{margin:0px 5px; color:#FFF; width:14px; height:14px; text-decoration:none; background:url(../images/fon_over_paginador.gif) top center no-repeat;} #estructura #col_internas .paginador a.selected:link, #estructura #col_internas .paginador a.selected:visited{margin:0px 5px; color:#FFF; width:14px; height:14px; text-decoration:none; background:url(../images/fon_over_paginador.gif) top center no-repeat;} #estructura #col_internas .paginador a.selected:hover, #estructura #col_internas .paginador a.selected:active{margin:0px 5px; color:#FFF; width:14px; height:14px; text-decoration:none; background:url(../images/fon_over_paginador.gif) top center no-repeat;} #estructura #col_internas .paginador #actual{margin:0px 5px; color:#FFF; width:14px; height:14px; text-decoration:none; background:url(../images/fon_over_paginador.gif) top center no-repeat; border:none; cursor:pointer;} #estructura #col_internas .paginador #actual:link, #estructura #col_internas .paginador #actual:visited{margin:0px 5px; color:#FFF; width:14px; height:14px; text-decoration:none; background:url(../images/fon_over_paginador.gif) top center no-repeat;} #estructura #col_internas .paginador #actual:hover, #estructura #col_internas .paginador #actual:active{margin:0px 5px; color:#FFF; width:14px; height:14px; text-decoration:none; background:url(../images/fon_over_paginador.gif) top center no-repeat;} /*ESTILOS AGENDA*/ #agenda{margin:20px 20px; background:#F0F3F9; padding:0px 0px 15px 0px; border-bottom:3px solid #E2E9F3; } #agenda #top{height:155px; background:url(../images/rediseno/agenda_fon_top.gif) left bottom no-repeat #FFF; vertical-align:bottom;padding:0px 0px 20px 0px;} #agenda #top #fecha{color:#002C99; padding:100px 0px 0px 0px; text-align:left; font:bold 12px Arial, Helvetica, sans-serif; float:left;} #agenda #top #calendarios{width:380px; height:150px; text-align:center; float:right;} #agenda #top #calendarios .botones{margin:50px 0px 0px 0px;} #agenda #top #calendarios .calendario{width:140px; height:133px; border:1px solid #002D9A; margin:0px 4px; float:left; background:#002D9A; display:table;} #agenda #top #calendarios .calendario .mes{border-top:1px solid #FFF; height:35px; padding:2px 0px 0px 0px; text-align:center; font:bold 11px Arial, Helvetica, sans-serif; color:#FFF;} #agenda #top #calendarios .calendario .titulo_calendario{border-top:1px solid #FFF; height:35px; padding:12px 0px 0px 0px; background:#002D9A; text-align:center; font:bold 11px Arial, Helvetica, sans-serif; color:#FFF;} #agenda #top #calendarios .calendario table{border:1px solid #D2D7DD; border-collapse:collapse;} #agenda #top #calendarios .calendario table th{border:1px solid #D2D7DD; text-align:center; font:bold 10px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#FFF; background:#D2D7DD;} #agenda #top #calendarios .calendario table td{border:1px solid #D2D7DD; text-align:center; font:bold 10px "Trebuchet MS", Arial, Helvetica, sans-serif; color:#002D9A; background:#FFF;} #agenda #top #calendarios .calendario table td a:link, #agenda #top #calendarios .calendario table td a:visited{background:#D6E0EF; color:#002D9A; display:block; width:100%; text-decoration:none;} #agenda #top #calendarios .calendario table td a:hover, #agenda #top #calendarios .calendario table td a:active{background:#900; color:#FFF; display:block; width:100%; text-decoration:none;} #agenda #top #calendarios .calendario table td a:link strong, #agenda #top #calendarios .calendario table td a:visited strong{background:#F1F3F5; color:#900; display:block; width:100%; text-decoration:none; cursor:pointer;} #agenda #top #calendarios .calendario table td a:hover strong, #agenda #top #calendarios .calendario table td a:active strong{background:#900; color:#FFF; display:block; width:100%; text-decoration:none; cursor:pointer;} #agenda #top #calendarios .calendario table td .dia_actual {background:#900; color:#FFF; text-decoration:none} #agenda #top #calendarios .calendario table td .dia_actual a {background:#900; color:#FFF; text-decoration:none} #agenda #detalle_agenda{background:url(../images/rediseno/agenda_fon_detalle.jpg) top right no-repeat #FFF; font:11px Arial, Helvetica, sans-serif; padding:15px 20px; margin:15px; height:350px; overflow:auto;} #agenda #detalle_agenda h1{font:bold 11px Arial, Helvetica, sans-serif; background:url(../images/bullet_rojo.gif) 0px 4px no-repeat; padding:0px 0px 0px 10px; margin:0px;} #agenda #detalle_agenda .actividad{border-bottom:1px dashed #C9D6E9; padding:0px 0px 15px 0px; margin:0px 0px 15px 0px;} #agenda #detalle_agenda p{font:11px Arial, Helvetica, sans-serif; padding:0px 0px 0px 10px; margin:0px 0px 15px 0px;} #footer{width:832px; background:url(../images/rediseno/bkp_footer.jpg) left bottom no-repeat #FFF; overflow:hidden; margin:0px auto 10px auto; padding:13px 0px; text-align:center; text-transform:uppercase;} #footer address{width:370px; float:left; padding:15px 0px 0px 210px; margin:0px; color:#666; font:normal 9px Arial, Helvetica, sans-serif;} #footer address strong{font:bold 9px Arial, Helvetica, sans-serif; line-height:13px;} #footer address a:link{text-transform:lowercase; text-decoration:none; color:#666;} #footer address a:visited{text-transform:lowercase; text-decoration:none; color:#666;} #footer address a:hover{text-transform:lowercase; text-decoration:none; color:#000;} #footer address a:active{text-transform:lowercase; text-decoration:none; color:#000;} #footer h2#alo_santiago{background:url(../images/rediseno/img_alo_santiago.jpg) 0px 0px no-repeat; width:140px; height:53px; font:1px Arial, Helvetica, sans-serif; letter-spacing:-1px; color:#1EA0EB; padding:0px; float:right; margin:3px 20px;}