@charset "UTF-8";
/* CSS Document */

body{
	margin: 0px;
	font: lighter 18px/24px Helvetica, Arial, sans-serif;
	color: #343b36;
	background: url(img/dark_stripes.png);
	background: linear-gradient(#0e1114, #2f3640, #0e1114);
}

a{ text-decoration:none; color:#EA9944;}

#header{ background: url(img/fondo_v2.png) fixed bottom; border-bottom:thick solid #ca2d82; color:#fff;  }
#logo{height:50px; width:auto; margin:20px; float:right;}
.titulo{font:300 30px/50px 'Oswald Light', Helvetica, Arial, sans-serif; float:left; margin:10px 30px;}
.titulo img {
    height: 25px;
}

.container{max-width:960px; margin:10px auto;}

#instrucciones{ width:46%; margin:65px 2% 15px; float:left; color:#fff;}
#instrucciones input, .otra_seccion input{ width:68%; padding:10px 0 10px 2%; border-radius:5px; outline: none; border:none; background:#e8e8e8; font-size:15px; margin-right:2%; font-family: 'Oswald Light';}

.buscar {
	width:28%;
	float: right;
	font-size:15px;
	padding:10px 1%;
	background:#999999;
	border-radius:5px;
	color:#fff;
	border: none;
	outline: none;
	cursor:pointer;
	font-family: 'Oswald Light';
}

.buscar:hover{background:#ca2d82; color:#000;}


#credencial{ width:46%; margin:15px 2%; float:right; text-align: center;}
#credencial img{ width:80%; height:auto;}

.clear{ clear:both;}

.menu{ background:rgba(255,255,255,.4); text-align:center; font:300 14px/20px 'Oswald Light', Helvetica, Arial, sans-serif;}
.principal{font:300 18px/20px 'Oswald Light', Helvetica, Arial, sans-serif; background:rgba(255,255,255,.2);}
.menu .boton{ display:inline-block; padding:5px 10px; color:#fff; cursor:pointer; margin:1px;}
.menu .boton:hover{ background:#999; color:#fff;}
.menu .activo{ background:#ca2d82;color: #000;}
.otros{ padding-top:10px; font-weight: bold;}


.correspondencia{font:300 18px/24px 'Oswald Light', Helvetica, Arial, sans-serif; text-align:center; color:#0D3345; padding:10px; background: #fff;}

.candidatos{text-align:center; padding:30px;}
.partido{ padding:10px 0; background-color: rgba(0,0,0,0.7);margin-top: 10px;}
.candidato{display:inline-block; width:200px; margin:5px; -webkit-box-shadow: 5px 5px 20px 0 rgba(0,0,0,.2);
box-shadow: 5px 5px 20px 0 rgba(0,0,0,.2); border-radius:5px;}

.ganador{ border: solid thick #ca2d82;}
.ganador .texto{ color:#000; font:300 18px/24px 'Oswald Light', Helvetica, Arial, sans-serif; background:#ca2d82; text-transform:uppercase; padding:5px;}

/*.nombre{font:300 16px/20px 'Oswald Light', Helvetica, Arial, sans-serif; padding:0px 10px 10px 10px; overflow:hidden; background-color: rgba(0,0,0,0.7); color: #fff;}*/
.nombre{font:300 15px/18px 'Oswald Light', Helvetica, Arial, sans-serif; padding:0px 10px 10px 10px; overflow:hidden; background-color: rgba(0,0,0,0.7); color: #fff;height: 65px;}
.foto{}
.propuesta{ width:103px; height:29px; background:url(img/videopropuesta.png); margin:auto;}
.sin_propuesta{ width:103px; height:29px; margin:auto; background:#333;}


#footer{border-top: solid thick #ca2d82; height:150px; text-align:center; padding:30px; color: #fff}

.col_1{ width:46%; float:left; padding:15px 2%;}
.col_2{ width:46%; float:right; padding:15px 2%;}
.perfil_dato{ color:#000; font-weight:bold; margin-top:15px;}

.movil{display:none;}


/*#perfil{ padding-bottom:50px; width:640px; display:none;}
#perfil .personaje{ background: url(img/fondo_2.jpg) center; color: #fff; background-size: cover;}
#perfil .foto{ float:left;}
#perfil .datos{ float:left; margin:10px;}*/
/*luigomez 24ABR18 Tuve que modificar de id a clase */
.perfil{ padding-bottom:50px; width:640px; display:none;}
.perfil .personaje{ background: url(img/fondo_v2.png) center; color: #fff; background-size: cover;}
.perfil .foto{ float:left;}
.perfil .datos{ float:left; margin:10px;}

.sin_perfil{ color:#fff;}

#videopropuesta, #todas{
	width:640px;
	display:none;
	position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    height: 0px;
	overflow:hidden;}

#mapa{
	width:640px;
	display:none;
	position: relative;
    padding-bottom: 53.25%; /* 16:9 */
    height: 0px;
	overflow:hidden;
}
	
#videopropuesta .iframe, #mapa .iframe, #todas .iframe{
	position:absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: none;
	}



.otra_seccion{width:60%; margin:auto;}
.buscar_otra{ float:left; width:30%}

.titulo_casilla{font:400 24px/24px 'Oswald Regular', Helvetica, Arial, sans-serif; color: #ed8307; float:left; line-height:50px; cursor:pointer;}

.tu_casilla{ background:#fff; border-radius:10px; padding:0px; margin:2% 5px;-webkit-box-shadow: 5px 5px 20px 0 rgba(0,0,0,.2);
box-shadow: 5px 5px 20px 0 rgba(0,0,0,.2); }

/* luigomez 24ABR18 - Agregar  */
/*#info_casilla{}*/
#info_casilla{display:none;}
#resultado{display:none;}
.btn_mapa{ float:right; background:url(img/mapa.png); width:50px; height:47px;}
.mas{ float:left; background:#000; color:#fff; text-align:center; margin:9px 10px 0px 8px;  width:30px; height:30px; border-radius:25px; font:300 50px/25px 'Oswald Light', Helvetica, Arial, sans-serif;line-height: 17px;}
.titulo_casilla:hover .mas{ background: #ed8307}

/* luigomez 24ABR18 Tuve que cambiar de id a clase */
/*#perfil .nombre*/
.perfil .nombre{font:300 22px/22px 'Oswald Light', Helvetica, Arial, sans-serif; padding:0px !important; height: auto;}
li{list-style-type: disc;
    list-style-position: inside;
    text-indent: -1em;
    padding-left: 2em;}


@media (max-width:667px) {
	#instrucciones input, .otra_seccion input{ font-size:15px; }
	.otra_seccion{width:90%; margin:auto;}
	#logo{width:50%; height:auto; margin:10px 10% -20px; }
	.titulo{font:300 18px/24px 'Oswald Light', Helvetica, Arial, sans-serif; margin:10px 30px; width:50%}
	#instrucciones{ width:90%; margin:15px 5%; float:none;}
	#credencial{ width:90%; margin:15px 5%; float:none;}
	.candidatos{ padding:10px;}
	.candidato{ margin:5px; width:140px;}
	.menu{font:300 16px/18px 'Oswald Light', Helvetica, Arial, sans-serif;}
	.menu .boton{margin:5px 2px 0px; padding:2px 5px;}
	.col_1{ width:80%; float:none; padding:15px 5%;font-size: 13px;}
	.col_2{ width:80%; float:none; padding:15px 5%;}
	/* luigomez 24ABR18 Tuve que cambiar de id a clase */
	/*#perfil{ padding-bottom:50px; width:100%; font-size:12px; position:relative;}*/
	.perfil{ padding-bottom:50px; width:100%; font-size:12px; position:relative;}
	.movil{display: block;}
	.desktop{ display:none;}
	/* luigomez 24ABR18 Tuve que cambiar de id a clase */
	/*#perfil .foto{ float:left; margin:45px 0 0 0;}
	#perfil .datos{ float:right; margin:10px; width:50%;}*/
	.perfil .foto{ float:left; margin:45px 0 0 0;}
	.perfil .datos{ float:right; margin:10px; width:50%;}
	#videopropuesta, #mapa, #todas{width:290px; height:180px; position:relative;}
	#videopropuesta .iframe, #mapa .iframe, #todas .iframe{width:100%; height:100%;}
}

@media (max-width: 480px) {
	#header{text-align: center;background-position: left;}
	#logo{width:60%; height:auto; float:none; margin:15px 0 0 0; }
	.titulo{font:300 24px/30px 'Oswald Light', Helvetica, Arial, sans-serif; float:none; margin:10px 0px; text-align:center; width:100%;}
	#instrucciones{ width:90%; margin:15px 5%; float:none;}
	#credencial{ width:90%; margin:15px 5%; float:none;}
	.candidatos{ padding:10px;}
	.candidato{ margin:5px; width:140px;}
	.fancybox-wrap .foto{display: none;}
	/* luigomez 24ABR18 Tuve que cambiar de id a clase */
	/*#perfil .datos{ float:none; margin:0px; width:100%; padding: 10px;}*/
	.perfil .datos{ float:none; margin:0px; width:100%; padding: 10px;}

	.menu, .menu.principal{
		width: 100%; /* arbitary for demo only */
		white-space: nowrap;
		overflow-y: hidden;
		overflow-x: scroll;
		-webkit-overflow-scrolling: touch;
	}
	.boton{
		display: inline;
		margin: 10px 2px !important;
	}

}



@media screen and (max-width: 600px) {
  table#promesas caption { background-image: none; }
  table#promesas thead { display: none; }
  table#promesas tbody td { 
    display: block; padding: .6rem; 
  }
  table#promesas tbody tr td:first-child { 
    background: #666; color: #fff; 
  }
	table#promesas tbody td:before { 
    content: attr(data-th); 
    font-weight: bold;
    display: inline-block;
    width: 6rem;  
  }
  .imagen-conoce {
    grid-template-columns: 1fr !important;
    padding: 0 20px;
    text-align: center;
	}
}




.foto{
	overflow: hidden;
	border-radius: 100%;
	border: solid 5px #ca2d82;
}
.foto img{
	width: 100%;
	height: 100%;
}
.fancybox-wrap .foto{
	margin: 10px;
}
.fancybox-wrap .partido, .fancybox-wrap .nombre{
	background: none;
}
.fancybox-wrap .puesto{
	color: #999;
}
.fancybox-wrap .nombre {
    line-height: 32px !important;
}

.ver-video,.ver-perfil{
	padding: 5px 0;
    background-color: rgba(0,0,0,0.7);
    color: #ca2d82;
    height: 28px;
}

.ver-perfil a, .ver-video a{
	cursor: pointer;
	transition: 0.4s;
}
.ver-perfil a:hover, .ver-video a:hover{
	cursor: pointer;
	transition: 0.4s;
	color: #fff;
}

/*ESTILOS GANADOR*/
.ganador{
	background-color: #ca2d82;
}
.ganador .partido, .ganador .nombre{
	background-color: rgba(0,0,0,1);
}


.leyenda{
	color: #a9a9a9;
	font-size: 15px;
	font-weight: bold;
	margin-bottom: 30px;
	text-align: center;
	margin-top: 20px;
}

.ver-video{
	height: 18px;
	line-height: 18px;
}

.conoce-container{
	border-top: solid thick #ca2d82;
}

.conoce{
	max-width: 900px;
	margin: 100px auto;
}

.imagen-conoce img{
	max-width: 300px;
}
.imagen-conoce p{
	color: #fff;
}

.imagen-conoce{
	display: grid;
	grid-template-columns: 1fr 2fr;
	grid-gap: 10px;
	align-items: center;
}
.wrapper-botones{
	border-top: thick solid #ca2d82;
	color:#fff;
}
.contenedor-botones{
	max-width: 945px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin: 30px auto;
    justify-items: center;
}

.contenedor-conoce, .contenedor-simula{
	border: solid 2px #ca2d82;
	max-width: 300px;
	padding: 0 10px;
    border-radius: 10px;
}

.contenedor-conoce a, .contenedor-simula a{
	display: grid;
    grid-template-columns: 1fr auto;
    grid-gap: 10px;
    align-items: center;
	color: #fff;
}
@media screen and (max-width:668px) {
	.contenedor-botones{
		grid-template-columns: 1fr !important;
    	grid-row-gap: 20px;
	}
}