@charset "utf-8";

@import url("webfonts/Candara/stylesheet.css");

/*CUERPO DEL DOCUMENTO*/
body{
	margin:auto;
	/*background-color:#fbf9f6;*/
	background-image:url(images/fondo-papel.jpg);
	background-repeat:repeat;
	background-attachment:fixed;
}

/*ESTILOS PARA TEXTO*/

h1{/*Subtítulos de Sección*/
	font-family: Candara, sans-serif;
	font-size:24px;
	line-height:auto;
	text-align:left;
	padding-left:20px;
	padding-top: 8px;
	margin-right:-50px;
	color:#666;
	font-weight:900;
}
h1 span{
	font-size: 14px;
	color:#666;
}

h2{/*Subtítulos en texto de sección*/
	font-family:Candara, sans-serif;
	font-size:16px;
	color:#333;
	text-align:left;
	padding-left:30px;
}

h3{/*Descripción de Programa - Acceso general*/
	font-family:Candara, sans-serif;
	font-size:14px;
	color:#FFF;
	font-weight:100;
	text-align:left;
	padding: 10px;
	line-height:16px;
}

h4{/*Pie de Página*/
	font-family:Candara, sans-serif;
	font-size:11px;
	color:#FFF;
	font-weight:100;
	text-align:left;
	padding:5px;
	line-height:14px;
}
h5{/*Legales*/
	font-family:Candara, sans-serif;
	font-size:9px;
	color:#FFF;
}
p{
	font-family:Candara, sans-serif;
	font-size:14px;
	color:#333;
	padding:10px;
	text-align:left;
	line-height:18px;
}
li{
	font-family:Candara, sans-serif;
	font-size:14px;
	color:#333;
	text-align:left;
	line-height:16px;
	list-style-type:circle;
	list-style-position:inside;
	padding: 10px 20px 10px 20px;
}
a{
	text-decoration: none;
	color:inherit;
}
a:hover{
	text-decoration:underline;
	color:#F91336;
	/*TRANSICION DE EFECTOS*/
	-webkit-transition:all 0.4s ease;
	-moz-transition:all 0.4s ease;
	-o-transition:all 0.4s ease;
	transition:all 0.4s ease;
}
table a:hover{
	background-color:transparent;
	text-decoration:underline;
	/*TRANSICION DE EFECTOS*/
	-webkit-transition:all 0.4s ease;
	-moz-transition:all 0.4s ease;
	-o-transition:all 0.4s ease;
	transition:all 0.4s ease;
}
table img{
	margin:3px;
}
/*Contenedor para títulos*/
.titulo-seccion{
	float: left;
	height: 50px;
	width: 940px;
	border-bottom:#999 1px transparent;
	margin: 10px 10px 0px 10px;
}

/*960.gs*/

#general {
	margin-left: 8%;
	padding-top:180px;
	height: 100%;
	width: 960px;
	background-image:url(images/encabezadp-fvad.jpg);
	background-repeat:no-repeat;
	background-position:center;
	
}
/*CONSTANTES*/

#barra-social{
	float:right;
	height: auto;
	width: 250px;
	position:fixed;
	top: 0px;
	right: 15%;
	z-index:2;
	background-color:#FFF;
	opacity: 0.9;
	filter: Alpha(opacity=90);
	
	border-radius: 5px; 
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px; 
	

}
#barra-social span{
	background-color:transparent;
	opacity: 0.99;
}
#barra-social img{
	margin: 10px;
}


#menu {
	float: left;
	height: 50px;
	width: 720px;
	margin-bottom:10px;
	margin-left:15%;
}


#banner {
	border:2px 2px 0px 2px solid #009acb;
	float: left;
	height: 360px;/*520*/
	width: 940px;/*940*/
	margin-top: 10px;
	margin-left: 10px;
	margin-bottom: 10px;
}

.programa{
	float:left;
	height:150px;
	width:940px;
	margin: 15px 10px 15px 10px;
}

.titulo {
	float: left;
	height: 150px;
	width: 280px;
	font-family:Candara, sans-serif;
	font-size:20px;
	color:#FFF;
	text-align:center;
	
}
.titulo img{
	margin-top:35px;
}
.descripcion {
	float:left;
	height: 146px;
	width: 656px;	
}
.descripcion-fondo{
	float:right;
	height:80px;
	width: 300px;
	background-color:#000;
	opacity: 0.5;
	margin-top:10%;
}

.programa:hover .descripcion{
	/*border:#999 2px dashed;*/
	background-position: 95% 10%;
	opacity:0.7;
	filter:Alpha(opacity=70); /* IE8 and earlier */
	/*TRANSICION DE EFECTOS*/
	-webkit-transition:all 0.4s ease;
	-moz-transition:all 0.4s ease;
	-o-transition:all 0.4s ease;
	transition:all 0.4s ease;
}
.programa:hover .descripcion-fondo{
	animation:width 2s infinite;
	margin-right:20px;
	height:100%;
	margin-top:0%;
	margin-right:0%;
	opacity:0.9;
	filter:Alpha(opacity=90); /* IE8 and earlier */
	/*TRANSICION DE EFECTOS*/
	-webkit-transition:all 0.4s ease;
	-moz-transition:all 0.4s ease;
	-o-transition:all 0.4s ease;
	transition:all 0.4s ease;
}

#donar{
	height: 480px;
	width:150px;
	z-index: 3;
	position:fixed;
	bottom:0px;
	right:0px;
	background-color:#FDCE57;
	
	padding-top:20px;
	
	border-radius: 5px; 
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px;
	border:4px solid #FFF;
	
	text-align:center;
}


/*BARRAS DE ACCESOS*/
.barra-horizontal { 
	float: left;
	height: 260px;
	width: 100%;
	margin: 10px 10px 10px 10px;
	
	border-radius: 5px; 
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px;

}

.barra-h-contenido{
	float:left;
	height: 240px;
	width: 298px;
	margin: 10px;
	border: 1px solid #CCC;
	border-radius: 5px; 
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px;
}
.barra-h-contenido h2{
	color:#51B59B;
	margin-top:7px;
	margin-bottom:-20px;
}
.barra-h-contenido2{
	float:left;
	height: 240px;
	width: 620px;
	margin: 10px;
	background-color:transparent;
	border-radius: 5px; 
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px;
}

.barra-vertical { 
	float: left;
	height: auto;
	width: 280px;
	margin: 10px;
	background-color:none;
	border-radius: 5px; 
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px;
}
.barra-v-contenido{
	float:left;
	height: 200px;
	width: 260px;
	margin: 10px;
	background-color:transparent;
	border-radius: 5px; 
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px;
}
.barra-v-contenido2{
	float:left;
	height: 420px;
	width: 260px;
	margin: 10px;
	background-color:transparent;
	border-radius: 5px; 
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px;
}

/*PIE DE PÁGINA*/

#pie {
	background-color: #17395A;
	height: 100px;
	width: 100%;
	float:left;
	position:relative;
	bottom:0px;
	margin-top:20px;
}
#pie img{
	opacity:0.7;
	filter:Alpha(opacity=70); /* IE8 and earlier */
}
#contenedor-pie {
	height: 100px;
	width: 940px;
	margin:auto;
}
#logo-cemefi {
	float: left;
	height: 88px;/*100px;*/
	width: 80px;
	padding-top:12px;
}
#sumate{
	float: left;
	height: 50px;
	width: 180px;
	margin-left:55px;
	font-family:Candara, sans-serif;
	font-size:14px;
	color:#FFF;
}
.ico-mapa {
	float: left;
	height: 50px;
	width: 50px;
	margin-left: 20px;
}
.ubicacion{
	float: left;
	height: 80px;
	width: 220px;
	margin-left: 20px;
}

.ico-tel {
	float: left;
	height: 50px;
	width: 50px;
	margin-left: 20px;
}
.llamanos{
	float:left;
	height: 80px;
	width: 220px;
	margin-left: 20px;
}
#legales {
	float: right;
	height: 15px;
	width: 90%;
	font-family:Candara, sans-serif;
	font-size:12px;
	color:#FFF;
	text-align:center;
	font-weight:100;
}

/*ENCABEZADOS)*/
.titulo-pagina {
	float: left;
	height: 150px;
	width: 280px;
	margin-top:0px;
	margin-left:10px;
	font-family:Candara, sans-serif;
	font-size:20px;
	color:#FFF;
	text-align:center;
	border-radius: 10px 0px 0px 10px; 
	-moz-border-radius: 10px 0px 0px 10px; 
	-webkit-border-radius: 10px 0px 0px 10px;
}
.titulo-pagina img {
	margin-top:35px;	
}
.imagen-pagina {
	float: left;
	height: 146px;
	width: 656px;
	margin-top: 0px;
}

/*MULTIMEDIA*/

#multimedia{
	float: left;
	height:500px;
	width: 940px;
	margin:10px;
	border:#CCC thin solid;
}
#titulo-multimedia{
	float:left;
	height:50px;
	width: 220px;
	margin:5px;
	border-bottom:#666 thin solid;
	background-color:#FFF;
}
#texto-multimedia{
	float: left;
	height:280px;
	width: 220px;
	margin:5px;
}
#contenido-multimedia{
	float: right;
	height:480px;
	width: 700px;
	margin:5px;
}

/*NOSOTROS*/
#submenu-pagina {
	float: right;
	height: 30px;
	width: 660px;
	margin-right:10px;
	
}
#submenu-pagina a{
	text-decoration: none;
}
.sub-boton-nosotros {
	float: left;
	height: 24px;
	width: 220px;
	padding-top:6px;
	font-family:Candara, sans-serif;
	font-size:14px;
	color:#FFF;
	background-color:#815d9b;
	text-align:center;
}
.sub-boton-nosotros:hover{
	background-color: #333333;
	/*TRANSICION DE EFECTOS*/
	-webkit-transition:all 0.4s ease;
	-moz-transition:all 0.4s ease;
	-o-transition:all 0.4s ease;
	transition:all 0.4s ease;
}

#transparencia{
	float: left;
	height: auto;
	width: 280px;
	margin:10px;
}

/*VIVIENDA*/
.sub-boton-vivienda {
	float: left;
	height: 24px;
	width:220px;/*165*/
	padding-top:6px;
	font-family:Candara, sans-serif;
	font-size:14px;
	color:#FFF;
	background-color:#f91336; 
	text-align:center;
}
.sub-boton-vivienda:hover{
	background-color: #333333;
	/*TRANSICION DE EFECTOS*/
	-webkit-transition:all 0.4s ease;
	-moz-transition:all 0.4s ease;
	-o-transition:all 0.4s ease;
	transition:all 0.4s ease;
}

/*EDUCACION*/
.sub-boton-edu {
	float: left;
	height: 24px;
	width:220px;/*165*/
	padding-top:6px;
	font-family:Candara, sans-serif;
	font-size:14px;
	color:#FFF;
	background-color:#ff8a44;
	text-align:center; 
}
.sub-boton-edu:hover{
	background-color: #333333;
	/*TRANSICION DE EFECTOS*/
	-webkit-transition:all 0.4s ease;
	-moz-transition:all 0.4s ease;
	-o-transition:all 0.4s ease;
	transition:all 0.4s ease;
}
/*SALUD*/
.sub-boton-salud {
	float: left;
	height: 24px;
	width:330px;/*220*/
	padding-top:6px;
	font-family:Candara, sans-serif;
	font-size:14px;
	color:#FFF;
	background-color:#00a75c; 
	text-align:center;
}
.sub-boton-salud:hover{
	background-color: #333333;
	/*TRANSICION DE EFECTOS*/
	-webkit-transition:all 0.4s ease;
	-moz-transition:all 0.4s ease;
	-o-transition:all 0.4s ease;
	transition:all 0.4s ease;
}

/*VIVIENDA*/
.sub-boton-donar {
	float: left;
	height: 24px;
	width:165px;
	padding-top:6px;
	font-family:Candara, sans-serif;
	font-size:14px;
	color:#FFF;
	background-color:#FDCD6A;
	text-align:center; 
}
.sub-boton-donar:hover{
	background-color: #333333;
	/*TRANSICION DE EFECTOS*/
	-webkit-transition:all 0.4s ease;
	-moz-transition:all 0.4s ease;
	-o-transition:all 0.4s ease;
	transition:all 0.4s ease;
}




/*CONTENEDOR DE TEXTO PRINCIPAL (SECCIÓN)*/
.texto-seccion { /*NOSOTROS, VIVIENDA*/
	float: right;
	height: auto;
	width: 640px;
	margin-top: 10px;
	margin-bottom:10px;
	border:1px solid #CCC;
	border-radius: 10px 0px 10px 0px; 
	-moz-border-radius: 10px 0px 10px 0px; 
	-webkit-border-radius: 10px 0px 10px 0px;
}
.texto-seccion span{
	float: left;
	width:500px;
	height:auto;
	margin:20px 10px 10px 30px;
}
.texto-seccion img{
	margin-left: 150px;
}

.texto-seccion-programas {
	float: left;
	height: auto;
	width: 940px;
	margin-top: 50px;
	margin-left:10px;
	border-radius: 5px; 
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px;
	
}
.texto-seccion-programas img{
	float: right;
	margin-top:10px;
}
.texto-seccion-programas span{
	float: right;
	width:500px;
	height:auto;
	margin:-60px 10px 10px 10px;
}

/*GALERÍAS*/
.lateral-galeria {
	background-color: #096;
	float: left;
	height: 500px;
	width: 100px;
	margin-top: 25px;
	margin-left:10px;
	font-family:Candara, sans-serif;
	font-size:14px;
	color:#FFF;
	text-align:center;
}

.lateral-galeria img {
	margin-top:20px;
}
.galeria {
	float: left;
	height: 520px;
	width: 840px;
	margin-top: 25px;
	border:none;
}

/*TESTIMONIALES*/
.lateral-testimonios {
	float: left;
	background-color: #06F;
	height: 450px;
	width: 100px;
	margin-top:20px;
	margin-bottom:25px;
	margin-left:10px;
	font-family:Candara,sans-serif;
	font-size:14px;
	color:#FFF;
	text-align:center;
}

.lateral-testimonios img{
	margin-top:20px;
}
#testimoniales {
	float: left;
	height: auto;
	width: 840px;
	margin-top: 20px;
	border: 1px solid #CCC;
}
.test-programas {
	background-color:#FFF;
	float: left;
	height: 196px;
	width: 256px;
	margin: 30px 10px 10px 10px;
	border:1px solid #CCC;
}
.test-programas h1{
	font-family:Candara, sans-serif;
	font-size:14px;
	line-height:10px;
	text-align:center;
	font-weight:200;
}
.test-programas p{
	font-family:Candara, sans-serif;
	font-size:12px;
	line-height:14px;
	text-align:left;
	padding:10px;
	font-weight:100;
	
}
#eco-menu {
	float: left;
	height: 50px;/*220*/
	width: 940px;
	margin-top: 10px;
	margin-bottom: 10px;
	padding-left:15px;
}
.btn-eco {
	float:left;
	font-family:Candara, sans-serif;
	font-size:14px;
	text-align:center;
	font-variant:small-caps;
	color:#FFF;
	background-color: #f91336;
	height: 40px;
	width: 160px;
	margin-left: 5px;
	margin-right: 5px;
	padding-top:5px;	
}
.btn-eco img {
	margin-top:20px;
	
}
.btn-eco:hover{
	background-color:#333;
	text-decoration:none;
	/*TRANSICION DE EFECTOS*/
	-webkit-transition:all 0.4s ease;
	-moz-transition:all 0.4s ease;
	-o-transition:all 0.4s ease;
	transition:all 0.4s ease;
}
#eco-contenidos{
	float:left;
	height: 400px;
	width: 940px;
	margin: 10px;
	border:1px solid #999;
	
}
#img-eco {
	float: left;
	height: 396px;
	width: 296px;
	text-align:center;
	margin-top:5px;
	
}
#texto-eco {
	float:left;
	height: 396px;
	width: 636px;
}

/*EDUCACIÓN*/
#lateral-becas {
	background-color: #0C9;
	float: left;
	height: 400px;
	width: 100px;
	margin:25px 0px 0px 10px;
	font-family:Candara, sans-serif;
	font-size:14px;
	color:#FFF;
	text-align:center;
}
#lateral-becas img{
	margin-top:20px;
}
#texto-lateral-becas {
	float: left;
	height: 400px;
	width: 840px;
	margin-top: 25px;
	text-align:center;
}

.sub-boton-becas {
	float: left;
	height: 24px;
	width: 220px;
	padding-top:6px;
	font-family:Candara, sans-serif;
	font-size:14px;
	color:#FFF;
	background-color:#ff8a44;
	text-align:center;
}
.sub-boton-becas:hover{
	background-color: #333333;
	/*TRANSICION DE EFECTOS*/
	-webkit-transition:all 0.4s ease;
	-moz-transition:all 0.4s ease;
	-o-transition:all 0.4s ease;
	transition:all 0.4s ease;
}
/*DONATIVOS*/

#donadores-carrusel{
	float:left; 
	height:140px; 
	width:940px; 
	margin:20px 20px 20px 20px;
	border:1px solid #CCC;
}

#donativos {
	float: left;
	height: auto;
	width: 940px;
	margin-top:10px;
	margin-left:10px;
}
.formato-donativo {
	float: left;
	height: 296px;
	width: 296px;
	border:2px solid #ffcd6a;
	margin:5px;
	text-align:center;
}

.img-donativo {
	float: left;
	height: 120px;
	width: 296px;
	font-family:Candara, sans-serif;
	font-size:18px;
	color:#FFF;
}

.img-donativo img {
	margin:10px;
}
.cont-donativo {
	float: left;
	height: 176px;
	width: 296px;
	font-family:Candara, sans-serif;
	font-size:20px;
	color:#FFF;
}

#texto-donativo {
	border:1px solid #ffcd6a;
	border-right:0px;
	float: left;
	height: 300px;
	width: 416px;
	margin-top: 25px;
}
#imagen-texto-donativo {
	border:1px solid #ffcd6a;
	border-left:0px;
	float: left;
	height: 300px;
	width: 416px;
	margin-top:25px;
}

.lateral-donativos {
	background-color: #096;
	float: left;
	height: 300px;
	width: 100px;
	margin-top: 25px;
	margin-left:10px;
	font-family:Candara, sans-serif;
	font-size:14px;
	color:#FFF;
	text-align:center;
}

.lateral-donativos img{
	margin-top:20px;
}

.test-donativos {
	background-color:#FFF;
	float: left;
	height: 150px;/*256px;*/
	width: 256px;
	margin: 10px 10px 10px 10px;
	border:0px solid #CCC;
	text-align:center;
}
.test-donativos img{
	margin-top: 20px;
}
.test-donativos h1{
	font-family:Candara, sans-serif;
	font-size:14px;
	line-height:10px;
	text-align:center;
	font-weight:200;
}
.test-donativos p{
	font-family:Candara, sans-serif;
	font-size:12px;
	line-height:14px;
	text-align:left;
	padding:10px;
	font-weight:100;
	
}

#necesidades{
	float: left;
	height:auto;
	width:500px;
	margin:10px;
	border:2px solid #ffcd6a;
}

#donativos-personaje{
	z-index:3; 
	position:fixed; 
	bottom:0px; 
	right:0px;
	height: auto;
	width: auto;
}
#donativos-personaje img{
	float:right;
	max-height:70% !important;
	max-width:70% !important;
	display:inline;
}

/*CONTACTO*/
#contacto {
	border:2px solid #ff8a44;
	float: left;
	height: 196px;
	width: 441px;
	margin-top: 50px;
	margin-left:10px;
}
#mapa {
	border:2px solid #ff8a44;
	float: left;
	height: 196px;
	width: 441px;
	margin-top: 50px;
	margin-left: 50px;
}
#form-contac {
	border:2px solid #ff8a44;
	float: left;
	height: auto;
	width: 441px;
	margin-top: 50px;
	margin-bottom:50px;
	margin-left:10px;
}
#sociales {
	float: left;
	height: 200px;
	width: 456px;
	margin-top: 50px;
	margin-bottom: 50px;
	margin-left: 39px;
}
.btn-sociales {
	
	float: left;
	height: 200px;
	width: 103px;
	margin-left: 11px;
}
table{
	font-family:Candara, sans-serif;
	font-size:12px;
	color:#333;
}

