
/*
El texto por defecto tiene 16px y los diseños de referencia 1920px de ancho.
El font size es 16/1920=0.83% del window width
*/
html { /*font-size: 0.83vw;*/ }


body, a { font-family: 'Montserrat'; }

body {
    font-family: 'Montserrat', Helvetica, sans-serif;
	-webkit-text-size-adjust: none;
	line-height: normal !important;
	margin:auto !important;
	width: 100%;
	background: #000000 url("../img/fondo.gif") center top no-repeat; background-size: cover; background-attachment: fixed;
}


/*----------------------------------- Disclaimer ---------------------------------*/
#miModal { max-width:400px; }
.disclaimer { text-align: center; }
.disclaimer .exclamacion { margin:15px; }
.disclaimer .naranja { font-size:16px; color:#ff711a; max-width: 300px; margin:auto; }
.disclaimer .azul { font-size:21px; color:#006dbc; margin: 45px 0px 15px 0px; font-weight: bold; }
.disclaimer .preguntaNaranja { display:inline-block; vertical-align: top; width:80px; height: 80px; border-radius: 40px; font-size: 20px; color:#ffffff; background-color: #ff721b; padding-top:30px; margin:40px 25px; text-decoration: none; cursor: pointer;  }
.disclaimer .preguntaAzul { display:inline-block; vertical-align: top; width:80px; height: 80px; border-radius: 40px; font-size: 20px; color:#ffffff; background-color: #006dbc; padding-top:30px; margin:40px 25px; text-decoration: none; cursor: pointer; }

@media (max-width: 768px){
	#miModal { max-width:inherit; }
}


/*----------------------------------- comunes ---------------------------------*/

.cuerpo { width:800px; max-width: 90%; margin: auto; padding:60px 0px; text-align: center; }
.cabecera { background-color: #00175a; border-radius: 5px; padding:30px 60px; font-size: 30px; color:#ffffff; font-weight: 300; margin-bottom: 30px; text-align: left; }
.cabecera span { font-weight: 600; font-size:43px; }
.logos { margin:0px auto; padding: 60px 0px 20px 0px; }
.logos img { max-width: 90%; }

@media (max-width: 768px){
	.cuerpo { max-width: 95%; padding:40px 0px; }
	.cabecera { padding:20px 40px; font-size: 25px; margin-bottom: 20px; }
	.cabecera span { font-size:34px; }
	.logos { margin:0px auto; padding: 30px 0px; }
}

@media (max-width: 450px){
	.cabecera { padding:15px 30px; font-size: 20px; }
	.cabecera span { font-size:28px; }
}



/*----------------------------------- Intro ---------------------------------*/

.intro { background-color: #ffffff; border-radius: 5px; padding:30px 60px; font-size: 13px; color:#00175a; text-align: left; margin-bottom: 30px; }
.intro .grande { font-size: 15px; }
.intro .muygrande { font-size: 17px; font-weight: 600; }
.intro .bNaranja { display:inline-block; background-color: #ff6105; font-weight: 600; font-size:17px; color:#ffffff; text-align: center; padding: 8px 40px; margin: 25px auto 5px auto; border-radius: 5px; text-decoration: none; }

@media (max-width: 768px){
	.intro { padding:20px 40px; font-size: 12px; }
	.intro .grande { font-size: 14px; }
	.intro .muygrande { font-size: 16px; }
	.intro .bNaranja { font-size:15px; padding: 6px 32px; }
}

@media (max-width: 450px){
	.intro { padding:15px 30px; font-size: 11px; }
	.intro .grande { font-size: 12px; }
	.intro .muygrande { font-size: 15px;}
}



/*----------------------------------- Preguntas ---------------------------------*/

.pregunta { background-color: #ffffff; border-radius: 5px; padding:30px 30px 0px 30px; font-size: 17px; color:#00175a; text-align: left; font-weight: 600; margin-bottom: 30px; }
.pregunta .enunciado { min-height: 90px; margin-bottom: 25px; }
.pregunta .enunciado img { float:left; padding: 0px 15px 10px 0px; }
.pregunta .respuesta { display:block; font-size: 17px; color:#222222; padding: 8px 15px; margin-bottom: 15px; border-radius: 5px; box-shadow: 1px 1px 3px #666; text-decoration: none; background-color: #f2f2f2; }
.pregunta .respuesta.seleccionada { color:#ffffff; background-color: #ff6105; }
/*.pregunta .respuesta:hover { color:#ffffff; background-color: #ff6105; }*/
.pregunta .respuesta .respuestaPuntos { font-size: 17px; color:#5ca4e1; font-weight: bold; float: right; padding: 0px 0px 5px 5px; }
.pregunta .respuesta.seleccionada .respuestaPuntos { color:#ffffff; }
/*.pregunta .respuesta:hover .respuestaPuntos { color:#ffffff; }*/
.pregunta .izquierda { display:inline-block; vertical-align: middle; width: 44%; font-size:14px; color:#006dbc; font-weight: 600; text-align: left; margin: 25px auto; }
.pregunta .derecha { display:inline-block; vertical-align: middle; width: 54%; text-align: right; margin: 15px auto; }
.pregunta .derecha .bContinuar { display:inline-block; width:188px; background-color: #ff6105; font-weight: 600; font-size:14px; color:#ffffff; text-align: center; padding: 8px 0px; border-radius: 5px; text-decoration: none; }

@media (max-width: 768px){
	.pregunta { padding:20px 20px 0px 20px; font-size: 15px; }
	.pregunta .respuesta { font-size: 15px; }
	.pregunta .respuesta .respuestaPuntos { font-size: 15px; }
	.pregunta .izquierda { font-size:13px; }
	.pregunta .derecha .bContinuar { font-size:12px; padding: 4px 25px;}
}

@media (max-width: 450px){
	.pregunta { padding:15px 15px 0px 15px; font-size: 13px; }
	.pregunta .respuesta { font-size: 13px; }
	.pregunta .respuesta .respuestaPuntos { font-size: 13px; }
	.pregunta .izquierda { font-size:12px; }
	.pregunta .derecha .bContinuar { font-size:11px; padding: 4px 20px;}
}


/*----------------------------------- Pie resultados ---------------------------------*/

.pie { display:none; position: fixed; bottom: 0; width: 100%; background-color: #005ba4; padding: 20px; }
.pieCentrador { width:740px; max-width: 100%; margin:auto; }
.piePuntos { font-size:35px; color:#ffffff; font-weight: 600; }
.pieFrase { font-size:21px; color:#ffffff; font-weight: lighter; }
.pieBotonNaranja, .pieBotonNaranja:hover { display:inline-block; float:right; width:188px; background-color: #ff6105; font-weight: 600; font-size:14px; color:#ffffff; text-align: center; padding: 8px 0px; border-radius: 5px; text-decoration: none; margin: 5px 0px; }
.pieBotonBlanco { display:inline-block; width:188px; background-color: #ffffff; font-weight: 600; font-size:14px; color:#005ba4; text-align: center; padding: 8px 0px; border-radius: 5px; text-decoration: none; margin:10px 0px; }
.pieLogos { text-align:right; }
.pieLogos img { max-width: 100%; }

@media (max-width: 450px){
	.piePuntos { font-size:30px; }
	.pieFrase { font-size:16px; }
	.pieboton { float:none; }
}


/*----------------------------------- final ---------------------------------*/

.final { display:none; background-color: #ffffff; border-radius: 5px; padding:30px; font-size: 17px; color:#00175a; text-align: center; font-weight: 600; margin-bottom: 30px; }
.final .finalPuntuacion { font-size:25px; color:#1ea613; padding: 15px 0px 5px 0px; }
.final .finalEscala { padding: 40px 10px 0px 10px; }
.final .finalFrase { font-size: 17px; color:#222222; padding: 40px 0px 50px 0px; }
.final .finalBotonAzul { display:inline-block; width:188px; background-color: #006dbc; font-weight: 600; font-size:14px; color:#ffffff; text-align: center; padding: 8px 0px; border-radius: 5px; text-decoration: none; margin:0px 20px; }

@media (max-width: 768px){
	.pregunta { padding:20px 20px 0px 20px; font-size: 15px; }
	.pregunta .respuesta { font-size: 15px; }
	.pregunta .respuesta .respuestaPuntos { font-size: 15px; }
	.pregunta .izquierda { font-size:13px; }
	.pregunta .derecha .bContinuar { font-size:12px; padding: 4px 25px;}
}

@media (max-width: 450px){
	.pregunta { padding:15px 15px 0px 15px; font-size: 13px; }
	.pregunta .respuesta { font-size: 13px; }
	.pregunta .respuesta .respuestaPuntos { font-size: 13px; }
	.pregunta .izquierda { font-size:12px; }
	.pregunta .derecha .bContinuar { font-size:11px; padding: 4px 20px;}
}

