@import url("22_eventoDetalle.css");
@import url("calendario.css");

#main h2.titEventos { margin-bottom:10px;  font-size:2em; color:#E5E5E5; text-indent:-9999px; margin-left:10px; margin-right:10px; float:left; width:80px; height:340px;padding-left:0;}
* html #main  h2.titEventos {height:340px!important;}


/* eventos destecados*/
#main #eventosDestacados{ width:410px; float:left; margin-bottom:10px;}
#main #eventosDestacados>h3{ float:none; clear:both; color:#DF0003; border-bottom: 1px solid #DF0003; margin-bottom:5px;  font-size:1.1em; margin-top:5px; }
#main #eventosDestacados>h4 a{ text-decoration:none;}
#main #eventosDestacados>h4 a:hover{color:#DF0003;}
#main #eventosDestacados>p.imgLeft{ margin-right:10px; margin-bottom:15px;}
#main #eventosDestacados>h4{ margin-left:0}
#main #eventosDestacados ul li  { margin-left:10px;}
* html #main #eventosDestacados ul li {
	height: 1px;
	margin-left: 20px;
}
*:first-child+html #main #eventosDestacados ul li {

	margin-left: 20px;
}
#main ul.datosEvento{ float:left; margin:0;}

/* estil igual que linksRecorridos pero en vermell */
/* Això ho canvio bastant
#main>h3.linksEventos {   width:270px; float:left; background:none; font-size:1.1em; clear:none;clear:left; margin-bottom:5px; background:pink }
#main>h3.linksEventos a{ color:#DF0003; background: url(../imgs/arrowLink-10x10-hover.gif) no-repeat left;  text-decoration:none; padding-left:15px; }
#main h3.linksEventos a:hover{ color:#aaa; background: url(../imgs/arrowLink-10x10.gif) no-repeat left;}

#main>h3.linksEventos + h3.linksEventos { padding-top:0px; clear:none;}
#main>h3.linksEventos + h3.linksEventos { width:250px;}
#main>h3.linksEventos + h3.linksEventos+ h3.linksEventos{ width:270px;}
#main>h3.linksEventos + h3.linksEventos+ h3.linksEventos+ h3.linksEventos { width:250px; margin-bottom:20px;}
*/
#main>h3.linksEventos {
	width: 249px;
	float: left;
	font-size: 1.1em;
	margin-bottom: 5px;
	margin-right: 10px;
}
#main>h3.linksEventos a{ color:#DF0003; background: url(../imgs/arrowLink-10x10-hover.gif) no-repeat left;  text-decoration:none; padding-left:15px; }
#main h3.agenda {
	border-top: 20px solid #fff !important; /* margin */
}
* html #main h3.agenda,
*:first-child+html #main h3.agenda {
	border-top: 0 !important;
	margin-top: 20px;
}


/* AGENDA*/
#main #agenda { clear:both; }
#main #agenda{ border: 1px solid #E4E4E4; min-height:162px; border-top:0}
#main #agenda a{ text-decoration:none; }
#main #agenda a:hover{ color:#DF0003;}
#main h3.agenda{ clear:both; background:#DF0003 url(../imgs/tit-DF0003.gif) no-repeat top; color:#FFF; border:0; padding-left:10px; }
#main #agenda>h4{padding-left:10px; border: 1px solid #E4E4E4; border-left:0; border-right:0; padding-top:3px; padding-bottom:3px; clear:both;}
#main #agenda>h4 span{ font-weight:normal; font-size:.7em; position:absolute; right:10px}

#main #agenda>ul{ margin:10px; position:relative; min-height:89px;}
#main #agenda:after { 	content: "";	display: block;	height: 0px;	clear: both;}

#main #agenda>ul li{ width:250px; margin-bottom:5px; position:relative; }
#main #agenda>ul li{ list-style:none; float:left; clear:left; }
#main #agenda>ul li+li{ float:right; clear:none; }
#main #agenda>ul li h5 { margin-bottom:0px; margin-top:10px; font-size:1em;color:#333333; }
/*#main #agenda ul li h5 a{ color:#333333; }*/
#main #agenda ul li p{ color:#666; padding-right:20px;}
#main #agenda ul li p a{ color:#807F84; font-weight:bold}
#main #agenda ul li p.imgLeft{ padding-right:0px;}

#main #calendario { padding-left:10px; padding-top:10px; padding-bottom:10px; border-top: 1px solid #E4E4E4; clear:both; }
#main #calendario h4, #main #calendario p{ margin-left:175px;  }
#main #calendario ul{ margin-left:185px; margin-top:0  }
#main #calendario ul li{ color:#333}
#main #calendario ul li a{ font-weight:bold; color:#807F84}

#main #calendario h4{ font-size:.8em; margin-bottom:30px;  }
* html #main #calendario h4 { margin-top:-1.5em; }

/* flecha siguientes eventos*/

 #main #agenda>ul li.readMore{ position:absolute; right:0; bottom:-7px; width:auto;min-height:1px}
 #main #agenda>ul li.readMore a{ background: url(../imgs/arrow-10x10.gif) no-repeat left; text-indent:-9999px; display:block; width:10px; height:10px;}
 #main #agenda>ul li.readMore a:hover{ background-image: url(../imgs/arrowLink-10x10-hover.gif); }

#main hr.events{ background:0; margin:0; height:0; padding:0}