/*----------------------------------------------------------------------------
LETRAS, CABECERAS Y SPANS
----------------------------------------------------------------------------*/
	/*----------------------------------------------------------------------------
	Letras de Foto Grande
	----------------------------------------------------------------------------*/

	span.fototitulo{
		float:left;
		display:inline;
		font-weight:bold;
		font-variant: small-caps;
		font-size:medium;
		/*margin:0.1em;*/
		text-align:center;
		color:#FFFFFF;
		background-color:#9F0048;
	}
	a.linktitulo{
		float:right;
		display:inline;
		font-weight:bold;
		font-variant: small-caps;
		font-size:medium;
		/*margin:0.1em;*/
		text-align:center;
		color:#FFFFFF;
		background-color:#9F0048;
	}
	span#subtitle2{
		padding:1em 1.1em 1em 1.1em;
		display:block;
	}
	
	
	
	/*----------------------------------------------------------------------------
	Letra del Div Informacion de OBRA <id="iobra">
	----------------------------------------------------------------------------*/
	div.iobra h3 {/*Titulo de la Obra*/
		color:#666666;
		font-weight: bolder;
		font-variant: small-caps;
		font-size:medium;
		margin: 1.3em 0.3em 1.2em 0.3em;
		text-align:center;
	}
	div.iobra h4 {/*Titulo DESCRIPCION de la Obra*/
		display:inline;
		font-weight: bolder;
		font-variant: small-caps;
		font-size:medium;
		margin:0.1em;
		text-align:center;
		color:#999999;
	}
	div.iobra h5 {
		display:inline;
		font-weight:bold;
		font-variant: small-caps;
		font-size:medium;
		margin:0.1em;
		text-align:center;
		color:#999999;
	}
	div.iobra li
	{
		margin: 0em 0.2em 0.2em 0.2em;
	}
	div.iobra ul
	{
		list-style-type: none;
		padding: 1.2em 0.1em 0.5em 0.1em;
		margin: 0;		
	}
	/*----------------------------------------------------------------------------
	Letras del de Cabecera Principal
	----------------------------------------------------------------------------*/
	div.header0 h1{
		font-variant:small-caps;
		font-family:Verdana, Arial, Helvetica, sans-serif;
		color:#FFF;
	}
	/*----------------------------------------------------------------------------
	Letras del Footer
	----------------------------------------------------------------------------*/
	div.footer h5{
		border:2px #9F0048; 
		padding:0em;
		margin:0em;
		font-variant:small-caps;
		font-family:Verdana, Arial, Helvetica, sans-serif;
		color:#FFFFFF;
		font-size:0.8em;
	}
/*----------------------------------------------------------------------------
DIV DE LA PAGINA, HEADER Y FOOTER
----------------------------------------------------------------------------*/
div.contenedor {
/*border-style:solid;
border-width:thin;*/
color:#000000;
overflow:visible;
position:absolute;
text-align:center;
width:98%;
z-index:0;
margin:1.1em 1px 1.1em 1px;
padding:auto;
}

	/*----------------------------------------------------------------------------
	HEADER
	----------------------------------------------------------------------------*/
		/*----------------------------------------------------------------------------
		Titulo de la Pagina
		----------------------------------------------------------------------------*/
		div.header0 {
		border-style:solid;
		border-width:thin;
		color:#FFFFFF;
		text-align:center;
		background-color:#9F0048;
		overflow:visible;
		width:100%;
		z-index:2;
		padding:0em;
		margin:0em;
		}
		img#Titu{
		display:inline;	
		}
				
		div.header0 p{
		padding:0em 0em 0.4em 0em;
		margin:0.1em;
		color:#FFFFFF;
		font:sans-serif;
		font-variant:small-caps;
		}
		div.header0 h1{
		margin:0.3em 0.1em 0.1em 0.1em;
		padding:0.1em;
		}
		/*----------------------------------------------------------------------------
		Titulo del Distrito
		----------------------------------------------------------------------------*/
		div.header1 {
		color:#000000;
		font-size:1em;
		overflow:hidden;
		text-align:left;
		z-index:1;
		font-variant:small-caps;
		font-weight:bold;
		margin:0.5em 0em 0.5em 0em;
		}
	
	/*----------------------------------------------------------------------------
	FOOTER
	----------------------------------------------------------------------------*/
		div.footer {
		clear:both;
		color:#000000;
		font-size:1.1em;
		text-align:center;
		font-variant:small-caps;
		margin: 0.1em 0em 1em 0.1em;
		padding:1em 0em 0em 0em;
		background-color:#9F0048;
		}

	/*----------------------------------------------------------------------------
	MAPAS
	----------------------------------------------------------------------------*/
	div.mapcnt {
	float:right;
	/*width:70%;*/
	width:60%;
	padding: 0em 0em 0em 0.5em;
	margin:0.4em 0em 0.5em 0em;
	}
	
	div.mapa {
	height:500px;
	overflow:hidden;
	text-align:left;
	margin:0.5em 25px 1em 25px;
	}

/*----------------------------------------------------------------------------
LATERAL, INFOBRA FOTOPBRA
----------------------------------------------------------------------------*/

div.lateral {
float:left;
text-align:left;
z-index:1;
/*width:28%;*/
width:38%;
/*min-width:280px;*/
height:80%;
margin:0.1em;
}
div.iobra {
/*height:48%;
width:95%;*/
margin:0.2em;
padding:1em 1.1em 1em 1.1em;
text-align:left;
z-index:2;
overflow:auto;
text-align:justify;
}
div.fobra {
height:48%;
width:95%;
z-index:2;
margin:0.1em;
padding:0.5%;
overflow:hidden;
text-align:justify;
}
/*----------------------------------------------------------------------------
LEYENDA del Mapa
----------------------------------------------------------------------------*/
div#Leyenda{
float:right;
/*width:74%;*/
width:60%;
/*margin:0.3em 1em 0.2em 1em;*/
margin:0.3em 0em 0.2em 0.3em;
text-align:right;
/*font-size:1.1em;*/
/*font-family:Arial, Helvetica, sans-serif;*/
font-variant:small-caps;
}
div#Eje{
display:inline;
margin:0px 0px 1px 0px;
font-size:1.1em;
font-variant:small-caps;
font-family:Arial, Helvetica, sans-serif;
}
div#Fin{
display:inline;
margin:auto;
font-size:1.1em;
font-variant:small-caps;
font-family:Arial, Helvetica, sans-serif;
}

div#Leyenda img{
	padding:0px 10px 0px 10px;
}
.leyenda{
/*	margin:1em 1em 1em 2em;*/
	width:48%;
	display:inline;
}


/*----------------------------------------------------------------------------
FOTO OBRA
----------------------------------------------------------------------------*/
#thumbnail{
float:left;
border:3px solid #9F0048;
display:inline;
margin:1%;
width:45%;
/*width:100px;*/
/*height:75px;*/
height:45%;
}
#thumbnail img{
width:100%;
*height:100%;/*display:inline;*/
}
div#SinImagen{
background-color:#9F0048;
padding:0px;
margin:0px;
text-align:center;
font-variant:small-caps;
font-family:Arial, Helvetica, sans-serif;
font-size:1.2em;
font-weight:bold;
}

/*----------------------------------------------------------------------------
FORMULARIO
----------------------------------------------------------------------------*/
legend
{
	font-variant:small-caps;
	color: #fff;
	background: #9F0048;
	/*border: 1px solid #C7C4C5;*/
	padding: 2px 6px;
	font-weight:bold;
	
}
fieldset
{
	margin-bottom:10px;
	padding:0.1em;
}


/*----------------------------------------------------------------------------
HIDDENS - MAPAS OCULTOS DE AREQUIPA Y FOTO GRANDE OCULTO
----------------------------------------------------------------------------*/
div.aqpmapa1
{
	background-color:#9F0048;
	border: 2px solid #781351;
	visibility:hidden;
	height:520px;
	width:803px;
	position:absolute;
	left:17%;
	top:20%;
	z-index:10;
}
div.aqpmapa2
{
	background-color:#9F0048;
	border: 2px solid #781351;
	visibility:hidden;
	height:530px;
	left:33%;
	top:18%;
	z-index:10;
	width:455px;
	position:absolute;
}
div.fotogrande {
border-style:solid;
border-width:thin;
background-color:#9F0048;
font-size:20px;
height:504px;
left:15%;
overflow:hidden;
position:absolute;
text-align:left;
top:23%;
width:640px;
z-index:20;
padding:2px;
visibility:hidden;
}
/*----------------------------------------------------------------------------
Como Usar Mapa de Obras
----------------------------------------------------------------------------*/
div.modouso
{
	background-color:#9F0048;
	border: 2px solid #781351;
	visibility:hidden;
	height:630px;
	left:10%;
	top:17%;
	z-index:10;
/*	width:766px;*/
	width:840px;
	text-align:center;
	position:absolute;
}
div.modouso img{
padding:0.5em 0.5em 0.5em 0.5em;
	
}

span#titUso{
	float:left;
	padding:0em 0em 0em 1em;
}
span#titDist{
	float:right;
	padding:0em 1em 0em 0em;
}


/*----------------------------------------------------------------------------
Utilitarios y HacK
----------------------------------------------------------------------------*/
.debug{
outline: 2px dotted #FF0000;
}
.clear{
clear:both;
}
.clearboth { clear: both; }	

html{
margin:0px;
padding:0px;
}/*Arreglar el Body para todos*/

body{
/*margin:0px;
padding:1em;*/
}

