.style2 {color: #0996DE}
.style3 {color: #FAD23F}
.style4 {color: #EC8FA4}
a {
	font-size: 10px;
}
a:link {
	color: #003366;
	text-decoration: none;
	letter-spacing:4px;
}
a:visited {
	text-decoration: none;
	color: #000099;
}
a:hover {
	text-decoration: none;
	color: #006699;
}
a:active {
	text-decoration: none;
	color: #0099CC;
}

body {
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10px;
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 0px;

}
.textoblanco {
color:#FFFFFF;
line-height:20px;
width:280px;
text-align:justify;
}

.ttextoblanco {
	color:#CCFF99;
	font-family:"Trebuchet MS";
	line-height:20px;
	font-size: 18px;
	padding-bottom:12px;
}
.pie {
	background-image: url(img/index_r5_c1.jpg);
	background-repeat: repeat-x;
	width:100%;
	background-color:#4F4B4A;
}
.contenedor {
	margin: 15px;
	padding: 15px;
	width: 280px;
	overflow:auto;
	
}
#pie1 {
	position:relative;
	float:left;
	width:350px;
	height:600px;
	z-index:1;
	border-right-color:#999999;
	border-right-width:thin;
	border-right-style:dashed;
	overflow: hidden;
}

#pie2 {
	position:relative;
	float:left;
	width:280px;
	height:600px;
	z-index:1;
	text-align: justify;
	
}
#pie3 {
	position:relative;
    float:left;
	width:280px;
	height:600px;
	z-index:1;
	border-left-color:#999999;
	border-left-width:thin;
	border-left-style:dashed;
}

#pie5 {
	position:relative;
    float:left;
	width:580px;
	height:600px;
	z-index:1;
	border-left-color:#999999;
	border-left-width:thin;
	border-left-style:dashed;
}

#pie4 {
	position:relative;
	font-size:6px;
    float:left;
	width:30px;
	height:500px;
	z-index:1;
	border-left-color:#999999;
	border-left-width:thin;
	border-left-style:dashed;
	text-transform:uppercase;
	text-shadow:#999999;
	padding-left:30px;
}


.pie #pie5 input {
	background-color: #4F4B4A;
	width: 320px;
	border: 1px dashed #999999;
	color:#FFFBF0;
}
.pie #pie5 #form1 textarea {
	background-color: #4F4B4A;
	width:320px;
	border: thin dashed #CCCCCC;
	color:#FFFBF0;
}
.contenedor li {
	display: list-item;
	border-top-width: 1px;
	border-right-width: 0px;
	border-bottom-width: 0px;
	border-left-width: 0px;
	border-top-style: dashed;
	border-top-color: #99CC33;
	list-style-position: inside;
	list-style-image: none;
	list-style-type: circle;
	padding-top: 4px;
	text-transform: uppercase;
	font-family: "Trebuchet MS";
	height: 30px;
	color: #000033;
	text-decoration: none;
}

#frase1 {
	position:relative;
	float:none;
	width:700px;
	height:180px;
	z-index:1;
	overflow:hidden;

}

#imagen1 {
	position:relative;
	float:none;
	width:700px;
	height:350px;
	z-index:1;
	overflow:hidden;

}


.fecha{
	margin:5px 5px 5px 5px;
	background-color:#99CCCC;
	font-size:20px;
	font-weight:bold;
	text-align:center;
	color:#FFF;
	width:30px;
	height:30px;
}

.boletin{
	margin:5px 5px 5px 5px;
	background-color:#9C6;
	font-size:20px;
	font-weight:bold;
	text-align:center;
	color:#FFF;
	width:30px;
	height:30px;
}

.anuncio{
	margin:5px 5px 5px 5px;
	background-color:#FFBF55;
	font-size:20px;
	font-weight:bold;
	color:#FFF;
	width:30px;
	height:30px;
}


#textointro {
	font-family: Tahoma, Geneva, sans-serif;
	font-size: 11px;
	color: #7FDFAA;
	width:700px;
	overflow:hidden;
}
a.info {
    position:relative;
    z-index:24; background-color:#ccc;
    color:#000;
    text-decoration:none;
}
a.info:hover {
    z-index:25; background-color:#ff0;
}
a.info span {  // Esta es la que hace que el texto en el span no se despliegue en el estado normal de la URL
    display: none;
}
a.info:hover span {  // Esta zona es la que hace que se despliegue cuando nos ubicamos sobre el texto de la URL o la imagen dentro de la URL
    display:block;
    position:absolute;
    top:2em;
    left:2em;
    width:200px;
    border:1px solid #0cf;
    background-color:#EEEEEE;
    color:#000000;
    text-align: left;
    font-family: Arial, Helvetica, sans-serif;
    font-size: 10px;
    padding: 5px;
}