/* 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 PEDROCHE    */
/******************/


/***** Diseño dado por el .psd a 950px    ********/

/*********** BODY *************************************/
html{
 height:100%;
 background:#fff;
}

body {    
     /*
       -El texto de contenido es Trebuchet MS, tamaño 11px (0.8em) #000.
       -Se ve demasiado pequeña, paso a 0.8em
       -Background del body: #fff.
      */
     color:#000;
     background:#fff;
     font-family:Trebuchet MS,Arial,times New Roman,Verdana,sans-serif;
     font-size:0.8em;
     line-height: 1.3em;
    
   /*
     ya tenemos para toda la pág. por defecto 11px, a partir de aquí recalcula
       teniendo en cuenta ya 11px. Para volver a 16px (por defecto) tendríamos
      que poner 1.45em pues siempre recalcula a partir de body hacia los elementos
      interiores.
   */
   
     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;} /*";}
}/* */ 


/*** CONTENEDOR ***************************************************/
#contenedor{
   background:#fff;
   margin:0 auto; /*centrar página */
   overflow:hidden; 
   width:950px;
   text-align:left;
}

/********************** GENERALES ***************************************/

/* Párrafos */
#elcontenido p {
margin-bottom:5px;
margin-left:0px;
margin-right:1em;
}

/*********** ENLACES **************/
a {
    color:#af5d52;
    text-decoration:none;
    outline:none;
}

a:focus, a:hover {
    color:#b49b97;
    outline:none;
}
/*********** H1...H6 ***********/
h1, h2, h3, h4, h5, h6 {font-family:Georgia,Verdana,Arial,sans-serif;
font- weight:normal;color:#261512;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.6em;font-weight:bold;font-style:italic;line-height:1em;margin-bottom:0.5em;letter-spacing:1.2px;padding-left:0.3em;padding-bottom:4px;border-bottom:2px solid #ada4a3;}

h4 {font-size:1.17em;font-weight:bold;font-style:italic;line-height:1em;margin-bottom:0.5em;margin-top:1em;margin-left:0.4em;letter-spacing:1px;padding-bottom:4px; padding-left:0.3em;}

h5 {
font-size:1em;
font-weight:bold;
margin-bottom:0.5em;
margin-top:0.5em;
text-decoration:underline;
}
h6 {font-size:1em;font-weight:normal;margin-bottom:0.3em;margin-left:0px;text-decoration:underline;}

/*DEFINICIONES DE TABLA USADO EN SUSCRIPCIONES */
dl {
    clear:both;
    margin:0px 0px 0px 0px;
	background:#ffffff;
	border: 1px solid #ada4a3; /*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;
}

/*iconos pdf en ordenanzas, edictos,...*/
#columnacentroancha  a.pdf img,#columnacentro a.pdf img{
     margin:0;
     padding:0;
     border:none;
}

/*Descargar Adobe Reader (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;
}

/*lineas separadoras, p.e. en obtener Acrobat Reader */
hr{
  color:#5a0000;
}

/*------*/


/******** PÁRRAFOS *************/
p {
    margin-left: 1em;  
 }

.subrayado{
   text-decoration:underline;
}

/****************************CONTENEDOR ****************************/
/*
#contenedor{ 
}
*/

/*****************************CABECERA ****************************/
#cabecera{
    background: transparent url(/uploads/pedroche/cabecera.jpg) no-repeat;
    width:950px;
    height:145px;
    overflow:hidden;   
}

#cabeceraizquierda
{
  position:absolute;
  width:324px;
  z-index:10;
}

#cabeceraderecha
{
   float:right;
   margin-right:5em;
   width:480px;
   height:40px;
   overflow:hidden;
}

#cabecera h1 {
  float:left;
  width:324px;
  height:51px;
}

#cabecera h1 a{
  display:block;
  margin-top:37px;
  margin-left:47px;
  width:324px;
  height:51px;
  text-indent:-2000em;
}

#cabecera h2 {
   float:left;  /*desaparezca del flujo */
   text-indent:-2000em;
}

/*Hack IE6 */
*html #cabeceraderecha{
  margin-right:2.5em;
}

/**************   MENU CONTACTO **********************/
ul#menucontacto{
    list-style-type:none;
    margin-top:16px;
    margin-right:2px;
    float:right;
    text-align:center;
    overflow:hidden;
    height: 17px;
   /*Necesario para IE6 IE7, sino no sabe el width y no sale en línea el Menu contacto */
    width:280px;
}

ul#menucontacto li {
   background:transparent none repeat scroll 0 0;
   border-left:1px solid #000;
   float: left;
   padding-right:5px;
   padding-left:5px; 
   text-align: left;
  /*Letra */
/*      Misma letra que el <a> pues al picar el enlace se hace activo y se pone el texto del <li> pues
         desaparece el <a> 
*/
   text-align:center;
   font-family:Arial,Trebuchet MS,times New Roman,Verdana;
   font-weight:bold;
   font-size:0.9em; 
   line-height:1.2em;
   color: #000;

}

ul#menucontacto li.rss{

  background: transparent url('/uploads/pedroche/rss.png') no-repeat 5px 0px;
  text-align: right;
  width:42px; /*Para que quepa la imagen del rss y no se monte con las letras RSS */
  float:right;
}

ul#menucontacto  li.primero{
  border:none;
}

ul#menucontacto li.activo{
  font-weight:bold;
   color:#880000;
}

ul#menucontacto li a{
  border:none;
  /*Letra */
   /*El size no se pone pues se duplica al hacer .85*.85  del <li> * <a> */
  text-align:center;
  font-family:Arial,Trebuchet MS,times New Roman,Verdana;
  font-weight:bold;
  line-height:1.2em;
  color:#000;
}

ul#menucontacto li a:hover{
    color:#40221e;
   text-decoration:underline;
}

/****** BUSCADOR **************************/
#cabeceraderecha form{
  background:#b49b97;
  width:152px;
  height:25px;
  float:right;
  margin-right:1.7em;
  margin-top:10px;
}


/*Texto: Buscar */
#cabeceraderecha form label{
  font-family:Arial,Trebuchet MS,times New Roman,Verdana;
  font-weight:bold;
  font-size:0.9em;
  line-height:1.2em;
  color:#000; 
  width:auto;
  float:left;
  line-height:1em; /*no funciona margin-top, se hace con line-height */
  margin-left:5px;
  margin-right:5px;
  margin-top:8px;
}

/*Cuadro de búsqueda  (también sería la lupa, que después se sobreescribe más abajo*/
#cabeceraderecha  form input {
 background: transparent url('/uploads/pedroche/busca-cuadro.gif') no-repeat;
 float:left;
 width:68px;
 height:20px;
 font-family:Arial,Trebuchet MS,times New Roman,Verdana;
 font-size:0.9em;
 border:none;
 margin-top:3px;
}

/*Lupa para buscar */
#cabeceraderecha  form input.boton{
 background: transparent url('/uploads/pedroche/busca-lupa.gif') no-repeat;
 float:left;
 width:15px;
 height:17px;
 border:none;
 text-indent:-2000em;
 /*IE6 IE7 no funciona el text-indent se ve el texto*/
 font-size:0em;
 color:#b49b97; /* mismo color fondo buscador pues con el size se ve una raya '-'*/
 cursor:pointer;
 margin-left:7px;
 margin-top:3px;
}

#cabeceraderecha form input.boton:hover{
 background-position:bottom right;
}

/**************************** FIN CABECERA ***************************/

/****************MENU PRINCIPAL***********************************/
#contenidomenuprincipal{
    width:452px; /*  450px +2px de sombra puesto en su hijo ul#menuprincipal  */
    height:30px;
    overflow:hidden;

   /* No lleva background: #2f0000 url(/uploads/pedroche/mp-imagen.gif) no-repeat 5px 3px; */

  /*Nota: si ponemos z-order no funciona el relative. */
   
   /*sombra derecha del menu principal*/
  padding-bottom:3px;
  background: transparent url('/uploads/pedroche/mp-sombra-inferior.gif') bottom right;


  /*Lo situamos encima de la cabecera */
  position:relative;
  left:7em;
  top:-1em;

  /*Debe cubrir sus hijos float */
  overflow:hidden;

}

ul#menuprincipal{
  float:left;
  padding:0;
  width:450px;
  height:30px;
  overflow:hidden;

   /*sombra derecha del menu secundario*/
  padding-right:2px;
  background: transparent url('/uploads/pedroche/mp-sombra-derecha.gif')  top right;

}

ul#menuprincipal li{
  width:150px;
  height:30px;
  padding:0;
  margin:0;
  float:left;
}

#menuprincipal li a{
  text-indent:-2000em;
  display:block;
}

ul#menuprincipal li a{
  width:100%;
  height:100%;
}

#menuprincipal li.ayuntamiento a { 
 background: transparent url('/uploads/pedroche/mp-ayuntamiento.gif') no-repeat left top;
 }

#menuprincipal li.turismo a { 
 background: transparent url('/uploads/pedroche/mp-turismo.gif') no-repeat left top;
 }


#menuprincipal li.tramites a { 
 background: transparent url('/uploads/pedroche/mp-tramites.gif') no-repeat left top;
 }


 /* Hover: Muestro la segunda imagen, como cada imagen es de 30, la segunda será 
    -30. Recordemos que tenemos las tres en un sólo .jpg que es de  anchura * 90.
    En la primera, tenemos el <a> normal, la siguientes es -hover- y la última  -activo- */

#menuprincipal li a:hover { 
   background-position: left -30px;
}


/*Para todas si está activo muestro la 3ª imagen  (más baja) del .jpg */
#menuprincipal li.activo a { 
   background-position: bottom right;
}



/**************** MIGAS *****************************/
#migas{
   width:904px;
   height:22px;
   background:#fff;
   display:block;
   overflow:hidden;
   clear:both;
   margin-bottom:12px;
   margin-left:26px;
}

#migas #contenidomigas{
    font-family: Times New Roman,Arial,Georgia,serif;
    font-size:1.1em;
    line-height:1.5em;
    font-weight:bold;
    color:#000;
    text-align:left;
    height:25px;
    width:904px
    letter-spacing:1px;
}

/*Parrafo dentro de las migas, no debe coger los márgenes del elemento
   general <p>*/
#migas p{
   /*No se puede subir más pues el <contenidomenuprincipal> es position-relative
      y aunque lo hemos subido para arriba, no sale del flujo y ocupa el espacio
      original como si empezara por debajo de la cabecera */
   margin-top:-4px;
   /*Para la izquierda pasa igual que hacia arriba*/
   margin-left:0em;
}
#migas a
{
   color:#000;
}

#migas a:hover {
  text-decoration: underline;
  color:#412522;
}

#migas a.inicio{
  text-decoration:underline;
}

#migas span.lastitem{
  font-style:italic;
}

/*************************************************************************/
/*                                          C U E R P O                                                                      */
/* Contiene la columnaizquierda (menusecundario) y la columnacentroancha con el contenido       */
/*************************************************************************/
#cuerpo{
  width:925px;
  overflow:hidden;
}

/************* MENU SECUNDARIO ************************/
#columnaizquierda{
    width:221px;
    background: #fff;
    margin-left:0px;
    float:left;
    overflow:hidden;

   /*borde del menu secundario*/
   border-left:1px  solid #fbfbfb;
 /

}

#ms-sombra-inferior{
  float:left;
  overflow:hidden;

   /*sombra baja del menu secundario*/
  padding-bottom:6px;
  background: transparent url('/uploads/pedroche/ms-sombra-inferior.gif') repeat-x bottom right;

}


#columnaizquierda h3{
  float:left;
  text-indent:-2000em; /*será una imagen */
  width:221px;
  height:29px;
  margin:0;
  padding:0;
  border:none; /*quito el borde del h3 definido en común*/
}


ul#menusecundario{
  width:214px;  /*214+7 de padding-right para la sombra=221, que es la anchura de col-izquierda*/
  float:left;
  overflow:hidden; 

   /*sombra derecha del menu secundario*/
  padding-right:7px;
  background: transparent url('/uploads/pedroche/ms-sombra-derecha.gif') repeat-y top right;
}

/*IE6 Ojo! con #menusecundario .ayuntamiento el IE6 da problemas y no coge el .gif */

/*El <h3> toma el class .ayuntamiento, turismo o tramites y nosotros ponemos la imagen */
.ayuntamiento {
  background: transparent url('/uploads/pedroche/ms-ayuntamiento.jpg') no-repeat  top;
}

/* Así no coge el .gif el IE6 #cuerpo #columnaizquierda ul#menusecundario .turismo{ */

.turismo {
  background: transparent url('/uploads/pedroche/ms-turismo.jpg') no-repeat  top;
}

.tramites {
  background: transparent url('/uploads/pedroche/ms-tramites.jpg') no-repeat top;
}


ul#menusecundario li { 
  width:214px;
  float:left;
}

ul#menusecundario li a {
  /*Float */
  float:left;

  /*Letra */
  font-family:Times New Roman,Arial,Georgia;
  font-size:1.2em;
  font-weight:bold;
  line-height:2em; /*Espaciar altura líneas */
  letter-spacing:1px;
  color:#40221e;

  /*Quiero anchura de 214 pero como he puesto padding de 30 width sera 214-30=183 */
  width:183px; /* Total 184 + el padding */

  padding-left:30px;
  background: transparent url(/uploads/pedroche/li.gif) no-repeat 9px 11px;

}

ul#menusecundario li a:hover{
  /*
  Sin background 
  ---------------
  background: transparent url(/uploads/pedroche/menuizquierda-li-hover.gif) no-repeat left 2px;
  */
  
color:#af5d52;

}

ul#menusecundario li a.activo {
  /*
  No se quita pues no hay fondo que quitar al estar hecho el hover con background
  background :none;
   */
  color:#8b8b8b;
}


#cuerpo #columnaizquierda ul#menusecundario li  li a{
   font-size:1em;
   font-weight:normal;
   margin-top:0;
   line-height:1.5em;

  /*Quiero anchura de 214 pero como he puesto padding de 44 width sera 214-44 = 170 */
   width:170px;
   padding-left:44px;
   background :none; /*quito el li.gif */
}

/*
 No vale pues ya no hay hover hecho con un background
 ------------------------------------------------------

#cuerpo #columnaizquierda ul#menusecundario li li a:hover {
  background :none;
  font-style:none;
  color:#af5d52;
}

#cuerpo #columnaizquierda ul#menusecundario li li a.activo {
  background :none;
  color:#8b8b8b;
}

*/

/******** COLUMNA CENTRO ANCHA ************************/
#columnacentroancha{
  width:672px;
  float:right;
  overflow:hidden;
}

/***********EL CONTENIDO ******************************/
#elcontenido{
  width:672px;
  overflow:hidden;
}


/**************      PIE     *****************************/
#pie{
    width:949px;
    height:50px;
    background: transparent url(/uploads/pedroche/pie-fondo.gif) no-repeat;
    margin:30px 0 0 0;
    clear:both; 
    float:left;
    margin-top:40px;
    margin-left:0px;
}

*html #pie{
  margin-left:2px;
}

#pie #contenidopie{
   width:949px;
   height:50px; 
   color:#000;
   text-align:left;
   padding-top:0;
   overflow:hidden;   
}

#pie p{
  margin:0;
  float:left;
  text-align:left;
  color:#fff; 
  margin-left:9px; 
 }

/*hack IE6 dobla el margen */
*html #pie p{
  margin-left:5px;
}

#pie #datospie{
  margin-left:0px;
  margin-right:0px; 
  margin-top:12px;
  width:522px;
  float:left;
}

#pie #datospie p{
 font-family:Arial,Helvetica,Verdana,sans-serif;
 font-size:.95em;
 line-height:1.2em;
 color: #000;
 width:100%;
}

#pie a{
 color:#40221e;
}

/*******
 Para que funcione en IE 6-7 pues resulta que sus hijos los <a> 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:88px;
}

#pie  p#disenaeprinsa a,#pie  p#creadoconportal a,#pie p#accesibilidad a,
#pie p#validxhtml10 a,#pie p#juntaandalucia a{	
	height:31px;
        text-indent: -1000em;
	margin-top:10px;
	float: left;

}

#pie  p#disenaeprinsa a{
	background:transparent url('/uploads/pedroche/disenaeprinsa.gif') no-repeat top;       
	width:78px;	
        margin-right:0px;
}

#pie  p#disenaeprinsa a:hover{
	background-position:bottom;       
}

#pie  p#creadoconportal a{
	background:transparent url('/uploads/pedroche/creadoconportal.gif') no-repeat top;        
	width:62px;	   	
        margin-right:0px;
}

#pie  p#creadoconportal a:hover{
	background-position:bottom;
}

#pie p#juntaandalucia a{
	background:transparent url(uploads/pedroche/jandalucia.gif) no-repeat top;       
        float:left;
	width:48px;	       
        margin-right:0px;
}

#pie p#juntaandalucia a:hover{
	background-position:bottom;
}

#pie p#accesibilidad a{
	background:transparent url('/uploads/pedroche/accesibilidadAA.gif') no-repeat top;        
	width:88px;	
        float:right;
        margin-right:0px;
}
#pie p#accesibilidad a:hover{
	background-position:bottom;
}

#pie p#validxhtml10 a{
	background:transparent url('/uploads/pedroche/xhtml.gif') no-repeat top;    
	width:88px;		   
        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 #ada4a3; /*CAMBIAR*/
      
       /*color background*/
       background:#fff; /*CAMBIAR*/

}

form label{
	clear:both;
	display:block;
	width:20%;
	float:left;
	font-weight:normal;
}
form textarea{
	width:60%;
	overflow:hidden;
        font-size:1.6em
}
form input, form select, form textarea{

       /*borde campos a rellenar: textbox, text areas */
       /*border:1px solid #ada4a3; CAMBIAR*/

}


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:#b49b97; /*CAMBIAR*/
	
        text-align:center;
	color:#fff;

}
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 #833D14;
 padding:2%;
 background:#eeeacd;

}

.mensajeaviso p{
  color:#425227;
}

/*****************   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;
}

/************************** 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;
  width:auto;
  margin-left:0px;
}


#elcontenido div.div_mapa ul.tablaContenido li a {

  /*Lleva la fuente del body */
  line-height:1.5em; /*CAMBIAR*/


  font-weight:bold;
  margin-bottom:5px;

/*color fondo encabezados menú en el mapa-web */
  background:#ada4a3 repeat-x scroll left bottom; /*CAMBIAR COLOR*/

/*borde de los encabezados */
  border:1px solid #ada4a3; /*CAMBIAR*/

  padding:6px 10px 3px 5px;
  width:92%;
  display: block;
  margin-bottom: 5px;
  /*color enlaces del mapa, es decir todo el texto. Normalmente el del h3 */
  color:#261512; /*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;
   margin-left:5px;
   font-weight:normal;
   margin-bottom:0px;  
   padding:0px;
   width:90%;
    border:none;
}

#elcontenido div.div_mapa ul.tablaContenido li ul li a:hover {
 color:#af5d52;
}


#elcontenido div.div_mapa ul.tablaContenido li ul li {
  padding-top: 0px;
  background:transparent url(uploads/pedroche/li.gif) no-repeat scroll 0 5px; /*CAMBIAR 5px*/
}

#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:20px;
  padding-top:0;
  
}

#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/pedroche/borde-li-mapa.gif) no-repeat scroll 0 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/pedroche/borde-li-mapa-last.gif) no-repeat scroll 0 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%;
}
#elcontenido #columnaizquierdainterior ul{
  overflow:hidden;
}

/*Elemento <li> al listar noticias por categorías o todas */
#columnaizquierdainterior ul li{
background:none;
padding-left:0;
}

/********* Anulamos css de img dentro plantilla [contenido] ***********/
/*Imágenes en en <li> de los listados de noticias por categorias o todas las noticias */
#elcontenido #columnaizquierdainterior  img {
  border:none;
  padding:0;
  margin-left:none;
}

/*
 IMAGENES EN EL DETALLE DE UNA NOTICIA ESTÁN DENTRO DE UN <P> 
 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 {
     margin-left:0em;
     width:98%;
     
    /*Colores borde y fondo: CAMBIAR*/
     border:1px solid #ada4a3;
     background: #b49b97;


     clear:both;
    
     /*texto CAMBIAR (si se desea)*/
     font-size:0.85em;
     color:#fff;
    
     margin-top:1px;
     margin-bottom:1em;
     padding-right:0.5em;
     text-align:right;
     height:auto !important;  /* Para todos los navegadores */
     height/**/:/**/13px;  /*  Para IE 6 */ 
}

/*Texto <Volver a galería de imágenes -Álbumes */
#columnaizquierdainterior  .masinformacion a {
  
  /*CAMBIAR */
  color:#fff;

}

#columnaizquierdainterior .masinformacion a:focus,
#columnaizquierdainterior .masinformacion a:hover{
  /*CAMBIAR*/
  color:#af5d52
}

/* << volver : dentro de noticias, agenda,... */
#volver a
{
  color:#261512; /*CAMBIAR */
}
#volver a:hover{
   color:#af5d52; /*CAMBIAR*/
}


  /****************
           COLUMNADERECHAINTERIOR: contiene el menuterciario con  :
                                  categoria   >ver todas>
                                  -----------------------
                                  Categ1 ->elemento <span>
                                  Categ2 ..

    ******************/
#elcontenido  #columnaderechainterior {

  /*Color de fondo: CAMBIAR */
   background:#fff;

   border:none;
   margin: 1.8em 0 1em 1.5em;
   float:left;
   width:28%;
   padding-top:0em;
   padding-left:5px;
   border:1px solid #ada4a3; /*CAMBIAR color */
}

/*Contiene p.e. en galerias: Galeria   >ver todas<  .  Idem para resto*/
#elcontenido #columnaderechainterior h3{
  padding-left:5px;
  padding-top:2px;
  text-decoration:none;

  /*Color fondo cabecerita,CAMBIAR , quitar ,.... */
  background:#FFF /*#b49b97; */

 /*borde inferior CAMBIAR */
  border-bottom:1px solid #ada4a3;

 /*Color Texto CAMBIAR */
  color:#261512;

  width:95%;
  height:1.2em;

/*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;
  font-weight:bold;
  margin-bottom:0.5em;
  margin-top:0.5em;
  overflow:hidden;
}

/*El   >ver todas< */
#columnaderechainterior h3 a.vertodo { 
     float:right; 
     margin-right:5px;
     font-weight: normal;
     letter-spacing: 0px;
     font-size:0.9em; 
     text-align: right;   

     /*CAMBIAR*/
     color:#261512;

     text-decoration:underline;
}

/*hack IE6-7 */
*:first-child+html #columnaderechainterior h3 a.vertodo{
  margin-top:-14px;
}
*html #columnaderechainterior h3 a.vertodo{
  margin-top:-14px;
}

/*Hover sobre ver-todo */
#columnaderechainterior h3 a.vertodo:focus, #columnaderechainterior h3 a.vertodo:hover{
   /*CAMBIAR*/
   color:#af5d52; 
 }

#columnaderechainterior #menuterciario li{
  padding-left:0.5em; /*Sobreescribimos el del #elcontenido ul li */
  background:none; /*Eliminamos li.gif puesto en #elcontenido ul li */
}

/*Categorías de .... */
#columnaderechainterior #menuterciario a{

  /*CAMBIAR*/
  color:#261512;
  font-size:1em;
  font-style: italic;
}

/*Hover sobre las categorías,.. */
#columnaderechainterior #menuterciario a:hover {
   /*CAMBIAR*/
   color:#af5d52; 
}
#columnaderechainterior #menuterciario a.activo {
  color:#b49b97;
}

  /*********** 
    PAGINACIÓN. Se pagina (poner en pestaña opciones: Enlaces,Agenda y Noticias.
  ***********/
#elcontenido ul.paginacion{
        clear:both;
        /*CAMBIAR */
        background: #af5d52;
	width:100%;
	height:100%;
	overflow:hidden;
	margin:10px auto;
	text-align:center;
	padding:1px 0px 1px 0px;
        border-top:1px solid #c6d4fe;
        border-bottom:1px solid #c6d4fe;

}

#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{
  color:#fff;
}

ul.paginacion li a:hover{
   color:#fee27c;
}

div#volver {	
	margin:0 auto;
	color:#000;
	font-size:0.95em;
	text-align:right;
	overflow:hidden;
}

/*************    GALERIA DE IMAGENES  ************************/


#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; 

  /*Márgenes*/
  margin:0 0.4em 0.4em 0;
}
/*HACK IE6*/
*html #galeriainterior ul li.thumb {
 margin:0 0.2em 0.4em 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 */
  margin-left:6px;

  /*texto centrado para imagen galería */
  text-align:center;
  font-size:1em; /*CAMBIAR */

}

#galeriainterior .thumb a {
  display:block;
  /*Centramos el <a> 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 <contenido>-> 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;
}
*/

/*Imágnes ampliadas con el visor de javascript */
#TB_window img#TB_Image { 
/*anulamos padding de <img> general en contenido.css */
  padding:0; 
  border: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: 126px;
   background:#fff;
   
   /*Para que no coja estilos de #elcontenido ul li en contenido.css */
  margin-left:0;
}


/*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;
  color:#402501;
  font-size:0.9em;
}
.thumbenlace a.enlaceenlace:hover{
  color:#b58c85;
}

.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 #2f0000 !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 <li> */
#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 <a> que lleva a él */
#columnaizquierdainterior ul.listadointerior a{
  padding-left:14px;
  text-decoration:none;
  
  /*Color enlace noticia,evento,... Poner el del h3*/
  color:#261512;   /*CAMBIAR*/
}

#columnaizquierdainterior ul.listadointerior a:hover{
  /*Color enlace noticia,evento,...Poner el del h3:over (o menusecund:hover)*/
  color:#af5d52; /*CAMBIAR */
}

/* imagen de la noticia */
#columnaizquierdainterior ul.listadointerior li img{
     border:none;
     padding:0;
     margin-left:0;

     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 */
}

/*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 <a> que lleva a él. */
#columnaizquierdainterior ul.listacalendario a{
  padding-left:14px;
  text-decoration:none;

  /*CAMBIAR. Poner el del h3,menu-sec.*/
  color:#261512;
}

#columnaizquierdainterior ul.listacalendario a:hover{

  /*CAMBIAR. hover del h3*/
  color:#af5d52;
}


#tablaagenda table{
  width:98%; 
  margin-bottom:1.5em;
  margin-top:0px;
  /*Color borde separador calendario - Categorías ver todas. CAMBIAR*/
  border-bottom: 1px solid #ada4a3;
}

#tablaagenda table tr{
 background:none;
}
#tablaagenda table caption {

  /*CAMBIAR color tabla calendario <<mes Noviembre >> */
  background:#af5d52;
  text-align:center;
  border: 1px solid #c6d4fe;
}

#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:#084328;
  background:#b49b97;

  text-align:center;
  font-weight:normal;
}

#tablaagenda table td{
  padding: 0 0 5px;
  text-align:center;
  border: none;
}

#tablaagenda table td.calendar-today{
  background:#e0e0e0;
}

#tablaagenda table td a{
  color:#bb7421;
  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:0px auto; /*centramos la tabla*/
   margin-top:15px;

  /*Color de cada fila */
   background:#f5f4f4; /*CAMBIAR*/

  /*color borde limites superior e inferior tabla */
   border-top:2px solid #40221e; /*CAMBIAR línea-separador*/
   border-bottom:2px solid #40221e;  /*CAMBIAR línea-separador*/

   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:#af5d52; /*CAMBIAR*/

  /*color borde inferior cabecera tabla que junto a los bordes sup-inf de la tabla la delimitan*/
   border-bottom:2px solid #40221e;  /*CAMBIAR línea-separador*/

   text-align:center;	 	
}

/*SUBCABECERAS  <th> Dentro de tbody->tr->th, subcabecera dentro del body */
table tbody tr th {
  background:#b49b97 none repeat scroll 0 0; /*CAMBIAR color Sub-cabecera */
  border-bottom:1px solid #af5d52; /*CAMBIAR,  he puesto mº color cabecera-tabla */
  font-size:1.1em;
  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 <th> */
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;
}

/*Imágenes dentro tabla*/
table img{
   margin:0.2em;
   border:none;
   float:none;
}


/******************    GOOGLE MAP ***************************/
#map{
   margin:0 auto;
   width:481PX;
   height:323px;
   clear:both;
   border:1px solid #d5d3ba;
   position:relative;
   margin-left: 2em auto;
   margin-bottom:1.2em;
}
#map img{
  border:none;
  margin-left:0;
  padding:0;
}


/*** 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 <th> en vez de
    <td class="titulocategoria"
*/
/*Todo definido en tablas menos las categorías que se meten en trámites */
#columnacentroancha td.titulocategoria,#columnacentro td.titulocategoria {

  /*
     -color sub-encabezados de la tabla definidos como td.titulocategoria en Trámites
     -En otras tablas están definidas como <th>
  */
  background:#c3d2fd none repeat scroll 0 0;

  border-bottom:1px solid #770606;
  font-size:1.1em;
  font-weight:bold;
}

/* End of 'comun' */

/* Start of CMSMS style sheet 'portada' */
/****************************/
/* PORTADA PEDROCHE                  */
/***************************/

/***** Diseño dado por el .psd a 950px    ********/

/*
   Hemos incluido para la plantilla portada reset.css y comun.css, de ellos coge lo correspondiente
    y aquí modificaremos para portada
*/

body {    

    /*Ponemos la fuente más común en portada, o sea la del resumen de agenda, noiticias,.. */

     /*Texto */
     font-family:Trebuchet MS,Arial,Times New Roman,Verdana,sans-serif;
     font-size:0.8em;
     font-weight:normal;
     line-height: 1.3em;
     color:#2b2928;
    }

h3{
 border:none; /*Eliminamos bordes de h3 (puestos en comun) pues el text-indent no lo elimina */
}
/***********************************************************************
        DISEÑO PANTALLA - ANCHURAS-ALTURAS DIV - BORDES-COLOR RELLENO
 ***********************************************************************/
/* CONTENEDOR ya definido en comun #contenedor{} */

#contenidoportada {
    clear:both;
    width:950px;    
    overflow:hidden;
}

/****** ESCAPARATE IZQUIERDO **************************************************/
#escaparate-izquierdo {
 float:left;
 overflow:hidden;
 width:355px;
 margin-right:9px;

 /*Lo separamos del menú principal. Idem para escaparate-central y derecho */
 margin-top:1.3em;
}

/*** NOTICIAS PORTADA **********/

/*div que cubre a todos */
#noticias-sombra-derecha{
  float:left;
  overflow:hidden;

 /*Sombra derecha */
  background: transparent url('/uploads/pedroche/noticias-sombra-derecha.gif') repeat-y right top;

 /*Margen inferior para separar el siguiente DIV -> Agenda */
 margin-bottom:1em;

}

#noticias-sombra-izquierda {
  float:left;
  overflow:hidden;

 /*Sombra izquierda */
  background: transparent url('/uploads/pedroche/noticias-sombra-izquierda.gif') repeat-y left top;
}


#noticias-portada{
   width:355px;
   float:left;
   overflow:hidden;
   background:#fff;

 /*Sombra inferior*/
  padding-bottom:9px; /*Le hacemos hueco*/
  background: transparent url('/uploads/pedroche/noticias-sombra-inferior.gif') no-repeat left bottom;


}

#noticias-portada h3{
  text-indent:-2000em; /*será una imagen */
  width:355px;
  height:31px;
  margin:0;
  padding:0;
  border:none; /*quito el borde del h3 definido en común*/
 /*el h3 es un gif */
  background: transparent url('/uploads/pedroche/noticias-h3.jpg') no-repeat left top;
}

#noticias-portada ul{
 /*sin width limitado según nº caracteres en la plantilla */

 overflow:hidden;
 /*Sin height, por si pone titulos de noticias largos, no se solapen */

  margin:0px
  margin-bottom:5px;
  

  /*Separamos la imagen que hace de h3 del ul y establecemos margen-izquierdo*/
  padding-top:1em;
  padding-left:1.2em;
}

#noticias-portada ul li{
   width:317px;
 overflow:hidden;
 /*Sin height, por si pone titulos de noticias largos, no se solapen */

   margin-bottom:12px;
   margin-left:0.3em;
 }

#noticias-portada img{
  float:left;
  text-align:center; /*Centrar la img */
  max-width:71px;
  max-height:53px;

  /*Separamos la imagen del <div> de texto resumen de la noticia. */
  margin-right:.8em; 
}

/*Hacks IE6 IE7 para max-width, max-height */
* html #noticias-portada img {
      width: expression(this.width > 71? "71px":this.width);
}
* html #noticias-portada img {
      height: expression(this.height> 53? "53px":this.height);
}


#noticias-portada h4{
   text-decoration:none;
   width:310px;
   margin:0em;
   margin-bottom:0.1em;
   padding-left:0.1em;
   text-align:left;
}

/*texto encabezado noticia dentro del h4*/
#noticias-portada li a{
     /*Texto: En los <a> siempre hay que ponerlos */
     font-family:Trebuchet MS,Arial,times New Roman,Verdana,sans-serif;
     font-size:1.1em;
     font-weight:normal;
     font-style:normal;
     line-height: 1.2em;
     color:#2b2928;
  
/*Establecemos color para que no ponga el de a:hover */
  color:#2b2928;

  text-decoration:none;
  
  /Separamos de la izqa.
  padding-left:0.2em;
}
#noticias-portada li a:hover{
   color:#af5d52; /*El mismo que en los items del menu-secundario de css-comun */
}


/*texto resumen de la noticia */
#noticias-portada ul li div{
   /*Texto heredado del body, tamaño, color, etc...*/

   /*No ponemos width-height para que flote alrededor de la imagen */
}

#noticias-portada .vertodo a{
    display:block;
    position:relative; 
   /*Lo subimos para arriba para dejar un margen respecto del borde inferior
     de las noticias */
    top:-5px;

   /*Texto heredado del body, tamaño,*/
    color:#412420;
    width:95%; /*aquí si va el 95% */
    padding-top:0.3em;
    text-align:right;
}

#noticias-portada .vertodo a:hover {
   color:#af5d52; /*El mismo que en los items del menu-secundario de css-comun */
}


/*** AGENDA/EVENTOS PORTADA **********/

/*DIV superior que contiene a todos*/
#agenda-sombra-derecha{
  float:left;
  overflow:hidden;

 /*Sombra derecha */
  background: transparent url('/uploads/pedroche/noticias-sombra-derecha.gif') repeat-y right top;

}

#agenda-sombra-izquierda {
  float:left;
  overflow:hidden;

 /*Sombra izquierda */
  background: transparent url('/uploads/pedroche/noticias-sombra-izquierda.gif') repeat-y left top;
}

#agenda-portada{
   width:355px;
   float:left;
   overflow:hidden;
   background:#fff;

 /*Sombra inferior*/
  padding-bottom:9px; /*Le hacemos hueco*/
  background: transparent url('/uploads/pedroche/noticias-sombra-inferior.gif') no-repeat left bottom;

}

#agenda-portada h3{
  text-indent:-2000em; /*será una imagen */
  width:355px;
  height:31px;
  margin:0;
  padding:0;
  border:none; /*quito el borde del h3 definido en común*/
 /*el h3 es un gif */
  background: transparent url('/uploads/pedroche/agenda-h3.jpg') no-repeat left top;
}

#agenda-portada ul{
 /*sin width limitado según nº caracteres en la plantilla */

 overflow:hidden;
 /*Sin height, por si pone titulos de noticias largos, no se solapen */

  margin:0px
  margin-bottom:5px;
  

  /*Separamos la imagen que hace de h3 del ul y establecemos margen-izquierdo*/
  padding-top:1em;
  padding-left:1.2em;
}

#agenda-portada ul li{
   width:317px;
 overflow:hidden;
 /*Sin height, por si pone titulos de noticias largos, no se solapen */

   margin-bottom:12px;
   margin-left:0.3em;
 }

#agenda-portada img{
  float:left;
  text-align:center; /*Centrar la img */
  max-width:71px;
  max-height:53px;

  /*Separamos la imagen del <div> de texto resumen de la noticia. */
  margin-right:.8em; 
}

/*Hacks IE6 IE7 para max-width, max-height */
* html #agenda-portada img {
      width: expression(this.width > 71? "71px":this.width);
}
* html #agenda-portada img {
      height: expression(this.height> 53? "53px":this.height);
}


#agenda-portada h4{
   text-decoration:none;
   width:310px;
   margin:0em;
   margin-bottom:0.1em;
   padding-left:0.1em;
   text-align:left;
}

/*texto encabezado noticia dentro del h4*/
#agenda-portada li a{
     /*Texto: En los <a> siempre hay que ponerlos */
     font-family:Trebuchet MS,Arial,times New Roman,Verdana,sans-serif;
     font-size:1.1em;
     font-weight:normal;
     font-style:normal;
     line-height: 1.2em;
     color:#2b2928;
  
/*Establecemos color para que no ponga el de a:hover */
  color:#2b2928;

  text-decoration:none;
  
  /Separamos de la izqa.
  padding-left:0.2em;
}
#agenda-portada li a:hover{
   color:#af5d52; /*El mismo que en los items del menu-secundario de css-comun */
}


/*texto resumen de la noticia */
#agenda-portada ul li div{
   /*Texto heredado del body, tamaño, color, etc...*/

   /*No ponemos width-height para que flote alrededor de la imagen */
}


/*Fecha del evento bajo el resumen */
#agenda-portada .masinformacion{
   float:right;
   width:95%;
   text-align:right;
   color:#64342d;
   padding-top:2px;
}

#agenda-portada .vertodo a{
    display:block;
    position:relative; 
   /*Lo subimos para arriba para dejar un margen respecto del borde inferior
     de las agenda */
    top:-5px;

   /*Texto heredado del body, tamaño,*/
    color:#412420;
    width:95%; /*aquí si va el 95% */
    padding-top:0.3em;
    text-align:right;
}

#agenda-portada .vertodo a:hover {
   color:#af5d52; /*El mismo que en los items del menu-secundario de css-comun */
}


/****** ESCAPARATE CENTRAL **************************************************/
#escaparate-central{
 float:left; 
 overflow:hidden;
 width:355px;
 margin-right:9px;

 /*Lo separamos del menú principal. Idem para todos los escaparates al estar en columna */
 margin-top:1.3em;
}


/*** AGENDA TURISTICA/EVENTOS PORTADA **********/

/*DIV superior que contiene a todos*/
#agenda-turistica-sombra-derecha {
  float:left;
  overflow:hidden;

 /*Sombra derecha */
  background: transparent url('/uploads/pedroche/noticias-sombra-derecha.gif') repeat-y right top;

 /*Para separar el siguiente elemento de la columna. Se pone aquí, en el <div> contenedor*/
 margin-bottom:1em;
}

#agenda-turistica-sombra-izquierda {
  float:left;
  overflow:hidden;

 /*Sombra izquierda */
  background: transparent url('/uploads/pedroche/noticias-sombra-izquierda.gif') repeat-y left top;
}

#agenda-turistica{
   width:355px;
   float:left;
   overflow:hidden;
   background:#fff;

 /*Sombra inferior*/
  padding-bottom:9px; /*Le hacemos hueco*/
  background: transparent url('/uploads/pedroche/noticias-sombra-inferior.gif') no-repeat left bottom;

}

#agenda-turistica h3{
  text-indent:-2000em; /*será una imagen */
  width:355px;
  height:31px;
  margin:0;
  padding:0;
  border:none; /*quito el borde del h3 definido en común*/
 /*el h3 es un gif */
  background: transparent url('/uploads/pedroche/agenda-turistica-h3.jpg') no-repeat left top;
}

#agenda-turistica ul{
 /*sin width limitado según nº caracteres en la plantilla */

 overflow:hidden;
 /*Sin height, por si pone titulos de noticias largos, no se solapen */

  margin:0px
  margin-bottom:5px;
  

  /*Separamos la imagen que hace de h3 del ul y establecemos margen-izquierdo*/
  padding-top:1em;
  padding-left:1.2em;
}

#agenda-turistica ul li{
   width:317px;
 overflow:hidden;
 /*Sin height, por si pone titulos de noticias largos, no se solapen */

   margin-bottom:12px;
   margin-left:0.3em;
 }

#agenda-turistica img{
  float:left;
  text-align:center; /*Centrar la img */
  max-width:71px;
  max-height:53px;

  /*Separamos la imagen del <div> de texto resumen de la noticia. */
  margin-right:.8em; 
}

/*Hacks IE6 IE7 para max-width, max-height */
* html #agenda-turistica img {
      width: expression(this.width > 71? "71px":this.width);
}
* html #agenda-turistica img {
      height: expression(this.height> 53? "53px":this.height);
}


#agenda-turistica h4{
   text-decoration:none;
   width:310px;
   margin:0em;
   margin-bottom:0.1em;
   padding-left:0.1em;
   text-align:left;
}

/*texto encabezado noticia dentro del h4*/
#agenda-turistica li a{
     /*Texto: En los <a> siempre hay que ponerlos */
     font-family:Trebuchet MS,Arial,times New Roman,Verdana,sans-serif;
     font-size:1.1em;
     font-weight:normal;
     font-style:normal;
     line-height: 1.2em;
     color:#2b2928;
  
/*Establecemos color para que no ponga el de a:hover */
  color:#2b2928;

  text-decoration:none;
  
  /Separamos de la izqa.
  padding-left:0.2em;
}
#agenda-turistica li a:hover{
   color:#af5d52; /*El mismo que en los items del menu-secundario de css-comun */
}


/*texto resumen de la noticia */
#agenda-turistica ul li div{
   /*Texto heredado del body, tamaño, color, etc...*/

   /*No ponemos width-height para que flote alrededor de la imagen */
}


/*Fecha del evento bajo el resumen */
#agenda-turistica .masinformacion {
   float:right;
   width:95%;
   text-align:right;
   height:16px;
   color:#64342d;
   padding-top:2px;
}

#agenda-turistica .vertodo a{
    display:block;
    position:relative; 
   /*Lo subimos para arriba para dejar un margen respecto del borde inferior
     de las agenda-turistica */
    top:-5px;

   /*Texto heredado del body, tamaño,*/
    color:#412420;
    width:95%; /*aquí si va el 95% */
    padding-top:0.3em;
    text-align:right;
}

#agenda-turistica .vertodo a:hover {
   color:#af5d52; /*El mismo que en los items del menu-secundario de css-comun */
}


/**********  GALERIA-PORTADA **********/

/*DIV superior que contiene a todos*/
#galeria-portada-sombra-derecha {
  float:left;
  overflow:hidden;

 /*Sombra derecha */
  background: transparent url('/uploads/pedroche/noticias-sombra-derecha.gif') repeat-y right top;


 /*Para separar el siguiente elemento de la columna. Se pone aquí, en el <div> contenedor*/
 margin-bottom:1em;
}

#galeria-portada-sombra-izquierda {
  float:left;
  overflow:hidden;

 /*Sombra izquierda */
  background: transparent url('/uploads/pedroche/noticias-sombra-izquierda.gif') repeat-y left top;
}

#galeria-portada{
   width:355px;
   float:left;
   overflow:hidden;
   background:#fff;

 /*Sombra inferior*/
  padding-bottom:9px; /*Le hacemos hueco*/
  background: transparent url('/uploads/pedroche/noticias-sombra-inferior.gif') no-repeat left bottom;

}

#galeria-portada h3{
  text-indent:-2000em; /*será una imagen */
  width:355px;
  height:31px;
  margin:0;
  padding:0;
  border:none;
  background:url('/uploads/pedroche/galeria-h3.jpg') no-repeat left top;
}

#galeria-portada ul{
  height:80px; /*Más height que los <li> para acomodar el <más imágenes> abajo */
  padding-top:1.5em;
  padding-left:0.8em;
  overflow:hidden;
}

#galeria-portada ul li.thumb {
    clear:none;
    overflow:hidden;
    min-height:53px;
}

* html #galeria-portada li.thumb {
  float:left;
  height:53px

  /* Eliminamos marcos del thumb y padding que dejan la imagen dentro del marco */
  background:none;
  border:none;
  padding:0px;
}

/*******************************************
 Estilos generados automaticamente por PORTAL en [.thumb]
.thumb {
float:left;
line-height:normal;
list-style-type:none;
margin:0 0.5em 0.5em 0;          ANULAR LOS QUE NO SIRVAN
padding:0;
text-align:center;
text-decoration:none;
width:150px;
}
***********************************************/

/*Anulamos algunos */
#galeria-portada li.thumb {
  width:79px;
  margin:0;
  margin-right:5px;
}


#galeria-portada li.thumb a{
  display:block;
  height:auto;
  font-size:0.8em;
  text-align:center;

  /*Anulamos estilos del [.thumb a]  generado automaticamente por portal (no nosotros) 
   que pone width=100, height=72, border 1px 2px 2px 1px, padding,margin*/
  border:none;
  width:79px;
  height:53px;
  padding:0;
}

#galeria-portada li  img{
    max-width:none;
    height: 53px;
    /*Centrar imagen en el li */
    margin:0 auto; 
    float:none; 
    border:none;
}

#galeria-portada span{
  display:block;
  width:355px; /*Como la <div> principal */
  height:16px;
}

#galeria-portada  span.ver-mas a
{
    display:block;
    position:relative; 

   /*
     Lo subimos para arriba para dejar un margen respecto del borde inferior
     de las agenda-turistica 
   */
    top:-5px;

   /*Texto heredado del body, tamaño,*/
    color:#412420;
    width:95%; /*aquí si va el 95% */
    padding-top:0.3em;
    text-align:right;
}

#galeria-portada span.ver-mas a:hover {
  color:#AF5D52;
}

/****Enlace Que Visitar **********/

#enlace-que-visitar {
    float:left;
    width:355px;
    height:62px;
    background: transparent url('/uploads/pedroche/enlace-que-visitar.jpg') no-repeat left top;

   /*Para separar el siguiente elemento de la columna. Se pone aquí, en el <div> contenedor*/
   margin-bottom:1em;

}

#enlace-que-visitar a {
    float:left;
    width:355px;
    height:62px;
    text-indent:-5000em;
}


/****Enlace Que Comer**********/
#enlace-que-comer {
    float:left;
    width:355px;
    height:62px;
    background: transparent url('/uploads/pedroche/enlace-que-comer.jpg') no-repeat left top;

   /*Para separar el siguiente elemento de la columna. Se pone aquí, en el <div> contenedor*/
   margin-bottom:1em;

}

#enlace-que-comer a {
    float:left;
    width:355px;
    height:62px;
    text-indent:-5000em;
}

/****** ESCAPARATE DERECHO**************************************************/

#escaparate-derecho{
 float:right;  /*Pegado a la derecha */
 overflow:hidden;
 width:220px;

 /*Lo separamos del menú principal. Idem para todos los escaparates al estar en columna */
 margin-top:1.3em;
}

/***** TRAMITES *******************/

/*DIV superior que contiene a todos*/
#tramites-portada-sombra-derecha {
  float:left;
  overflow:hidden;

 /*Sombra derecha */
  background: transparent url('/uploads/pedroche/noticias-sombra-derecha.gif') repeat-y right top;

 /*Para separar el siguiente elemento de la columna. Se pone aquí, en el <div> contenedor*/
 margin-bottom:1em;
}

#tramites-portada-sombra-izquierda {
  float:left;
  overflow:hidden;

 /*Sombra izquierda */
  background: transparent url('/uploads/pedroche/noticias-sombra-izquierda.gif') repeat-y left top;
}

#tramites-portada {
   width:220px;
   height:198px; /*Puesto por IE7. sino en IE7 no tiene la misma altura que IE6 o Firefox */
   float:left;
   overflow:hidden;
   background:#fff;

 /*Sombra inferior*/
  padding-bottom:9px; /*Le hacemos hueco*/
  background: transparent url('/uploads/pedroche/tramites-sombra-inferior.gif') no-repeat left bottom;

}

#tramites-portada h3{
  text-indent:-2000em; /*será una imagen */
  width:220px;
  height:31px;
  margin:0;
  padding:0;
  border:none; /*quito el borde del h3 definido en común*/
 /*el h3 es un gif */
  background: transparent url('/uploads/pedroche/tramites-h3.jpg') no-repeat left top;
}

#tramites-portada ul{
   /* width:290px; ->   no necesario  */
   
    /*Altura del ul */
   height:153px;

  /*Separamos la imagen que hace de h3 del ul y establecemos margen-izquierdo*/
   padding-left:0.8em;
   padding-top:0.8em;

}

#tramites-portada ul li{
   display:block;
   overflow:hidden;
   width:194px;
   height:32px;
   margin-bottom:6px;
   margin-left:0.3em;
 }

/**********************************/
/*Hack IE6 */

* html #tramites-portada ul li{
   margin-bottom:3px; /*La mitad del puesto para FireFox */
}
/**********************************/

#tramites-portada li img {

   /*Para que el texto puesto por la plantilla vaya a su derecha y no debajo de la imagen*/
  float:left;
  
  /*Separamos el texto a su derecha. */
  margin-right:6px; 
}

#tramites-portada li a{
     float:left;
     
     /*Para que quepa en una línea */
     width:155px; 
      height:26px;
     /*Texto */
     font-family:Times New Roman,Trebuchet MS,Arial,Verdana,sans-serif;
     font-size:1.1em;
     font-weight:bold;
     line-height: 1.3em;
     color:#676966;


     padding-top:5px;
     text-align:left;
}

#tramites-portada li  a:hover {
  color:#AF5D52;
}

#tramites-portada li a span {

}


/***** INFORMACIÓN *******************/

/*DIV superior que contiene a todos*/
#informacion-portada-sombra-derecha {
  float:left;
  overflow:hidden;

 /*Sombra derecha */
  background: transparent url('/uploads/pedroche/noticias-sombra-derecha.gif') repeat-y right top;

 /*Para separar el siguiente elemento de la columna. Se pone aquí, en el <div> contenedor*/
 margin-bottom:1em;
}

#informacion-portada-sombra-izquierda {
  float:left;
  overflow:hidden;

 /*Sombra izquierda */
  background: transparent url('/uploads/pedroche/noticias-sombra-izquierda.gif') repeat-y left top;
}

#informacion-portada{
   width:220px;
   height:178px; /*Puesto por IE6 IE7 */
   float:left;
   overflow:hidden;
   background:#fff;

 /*Sombra inferior*/
  padding-bottom:9px; /*Le hacemos hueco*/
  background: transparent url('/uploads/pedroche/tramites-sombra-inferior.gif') no-repeat left bottom;

}

#informacion-portada h3{
  text-indent:-2000em; /*será una imagen */
  width:220px;
  height:31px;
  margin:0;
  padding:0;
  border:none; /*quito el borde del h3 definido en común*/
 /*el h3 es un gif */
  background: transparent url('/uploads/pedroche/informacion-h3.jpg') no-repeat left top;
}

#informacion-portada ul{
   /* width:290px; ->   no necesario  */
  
   /*Altura del ul */
   height:135px;

  /*Separamos la imagen que hace de h3 del ul y establecemos margen-izquierdo*/
   padding-left:0.8em;
   padding-top:0.3em;

}

#informacion-portada ul li{
   display:block;
   overflow:hidden;
   width:202px;
   height:44px;
   margin-left:0.3em;
 }


#informacion-portada li img {

   /*Para que el texto puesto por la plantilla vaya a su derecha y no debajo de la imagen*/
  float:left;
 
}

#informacion-portada li  a {
  float:left;
  width:155px; /*Impo, si no puede que no se vea el texto */

   /*Texto */
   font-family:Times New Roman,Trebuchet MS,Arial,Verdana,sans-serif;
   font-size:1.1em;
   font-weight:bold;
   line-height: 1.2em;
   color:#676966;
   text-align:left;

   /*Centramos el texto */
     margin-top:8px;

}

#informacion-portada li  a:hover {
  color:#AF5D52;
}


/****Enlace Red Patrimonia **********/

#enlace-redpatrimonia {
    float:left;
    width:220px;
    height:36px;
    background: transparent url('/uploads/pedroche/patrimonia.jpg') no-repeat left top;

   /*Para separar el siguiente elemento de la columna. Se pone aquí, en el <div> contenedor*/
   margin-bottom:1em;

}

#enlace-redpatrimonia a {
    float:left;
    width:220px;
    height:36px;
    text-indent:-5000em;
}

/****** Enlace GuadalInfo ***********/
#enlace-guadalinfo {
    float:left;
    width:220px;
    height:44px;
    background: transparent url('/uploads/pedroche/guadalinfo.jpg') no-repeat left top;

   /*Para separar el siguiente elemento de la columna. Se pone aquí, en el <div> contenedor*/
   margin-bottom:1em;

}

#enlace-guadalinfo a {
    float:left;
    width:220px;
    height:44px;
    text-indent:-5000em;
}



/* End of 'portada' */