@import url('./brand-alhambra.min.css');
@import url('./normalize.css');
@import url('./fonts.css');

/*
TIPOGRAFÍA */
* {
	font-family: "Gotham Medium";
	font-weight: 300;
	font-style: normal;
}
body {
	font-size: 15px;
	color: #FFFFFF;
	letter-spacing: 0.1rem;
	font-size: 16px;
}
b, strong {
    font-family: "Gotham Bold";
    font-weight: normal;
}



/* textos */
#gracias {
	font-size: 100%;
}
.stage.full-design main .bloque1 .descripcion .caja-titulo h1,
#gracias .titulo-promo {
	font-family: "Gotham Medium";
    text-transform: uppercase;
    /*text-align: center;*/
    letter-spacing: 0.3rem;
    line-height: 130%;
    font-size: 310%;
	margin-bottom: 4%;
	text-shadow: none;
	/*text-shadow: 0px 0px 15px rgb(0 0 0 / 30%);*/
}
.stage.full-design main .bloque1 .descripcion .caja-titulo h2,
#gracias .subtitulo-promo  {
	text-shadow: none;
	font-family: "Gotham Regular";
	text-shadow: 0px 0px 15px rgb(0 0 0 / 30%);
}
.stage.full-design main .bloque1 .descripcion .caja-titulo h2 strong,
.stage.full-design main .bloque1 .descripcion .caja-titulo h2 b,
#gracias .subtitulo-promo strong,
#gracias .subtitulo-promo b {
    font-family: "Gotham Medium";
    font-weight: normal;
}
.asterisco {
    font-family: "Gotham Medium Italic";
    line-height: 112%;
    display: block;
    font-size: 98%;
    padding-left: 11px;
    position: relative;
	/*margin: 5% 0 0 0;*/
	text-align: left;
}
.asterisco:before {
	position: absolute;
	left: 0;
	top: 0;
	content: "*";
}
.asterisco.gris {
    color: #333;
    font-size: 85%;
}

/* form */
label {
    font-weight: normal;
}
.desc_promo {
	text-align: center;
}
#compartir, .mb-30 {
    margin-bottom: 0;
}
#fichero strong {
    text-transform: uppercase;
    padding: 2% 0 1% 0;
    display: block;
	text-align: center;
}
#fichero .help-block {
    font-size: 89%;
    margin-top: 0%;
    margin-bottom: 3%;
}
form .mt-20 {
    margin-top: 0;
	font-size: 89%;
}
.checkbox {
    margin-top: 2%;
    font-size: 112%;
	margin-bottom: 2%;
}
#btnparticipar.btn-ap {
    text-transform: none;
    font-size: 100%;
    letter-spacing: 0.3rem;
    margin: 5% auto 0 auto;
    padding: 3% 8%;
    display: block;
}
#desc_promo {
    padding-top: 2rem;
	font-family: "Gotham Regular";
}

/* error */
.tooltip .tooltip-arrow {
    border-color: #fff;
}
.tooltip .tooltip-inner {
    border-radius: 0;
    padding: 10px 30px;
    max-width: none;
    background-color: rgb(0 0 0 / 70%);
    border: solid 1px #FFFFFF;
	font-family: "Gotham Medium";
    font-size: 110%;
}
/*
input.is-invalid, select.is-invalid, .multirespuesta.is-invalid, .checkbox.is-invalid, .input-group.is-invalid, .form-group.is-invalid select, .form-group.is-invalid input, .is-invalid input.date-picker {
    border: 1px solid #cacaca;
}
	*/
#fichero .mb-20.mt-20 .checkbox.is-invalid {
    border: none;
    background-color: transparent;
}

/*
LAYOUT */

/* logo */
.link-logo {
	display: block;
}
header .logo {
    margin: 0 auto;
	background-position: center;
}

/* cont - columnas */
#layout-landing {
    display: flex;
}

.stage.full-design main .bloque1 {
    max-width: 90%;
    margin: auto;
}
main .blur {
    background-color: #D19000;
    border: none;
    text-align: left;
	padding: 2em 4em;
}
@media (min-width: 768px) {
    .col-sm-6.formulario {
        padding-right: 10%;
    }
	.col-sm-6.descripcion {
		padding-left: 5%;
	}
	.stage.full-design .bloque1 {
        align-items: center;
    }
}
@media (min-width: 1300px) {
    .stage.full-design main .bloque1 #mecanicas {
        max-width: 100%;
    }
}

/* footer */
footer {
    padding-bottom: 0.5em;
}

/* form */
.pregunta_personalizada {
    width: 50%;
    float: left;
}
#preguntas .pregunta_personalizada:nth-child(odd) {
	padding-right:1.5%;
	clear:both;
}
#preguntas .pregunta_personalizada:nth-child(even) {
	padding-left: 1.5%;
}
#fichero,
#mecanicas p {
	clear: both;
}
.form-control {
    height: 44px;
}
.form-control:focus {
    border-color: #fff;
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(255, 255, 255, .075), 0 0 8px rgba(255, 255, 255, .6)!important;
    box-shadow: inset 0 1px 1px rgba(255, 255, 255, .075), 0 0 8px rgba(255, 255, 255, .6);
}

/*
MENSAJES DE ERROR */
/*
input.is-invalid,
select.is-invalid,
div.is-invalid .btn-file,
div.is-invalid input {
    border: 1px solid red!important;
    background-color: #f003!important;
}
div.is-invalid input#selarch {
	opacity: 1!important;
}
div.is-invalid,
div.is-invalid {
    border: none!important;
    background-color: transparent!important;
}
.checkbox.is-invalid label a {
    color: #000000;
}
.label-error {
    color: red;
    background-color: rgb(0 0 0 / 70%);
    padding: 10px 15px;
    border: solid 1px #000000;
    position: relative;
    margin-top: 12px;
    text-align: center;
}
.label-error:before {
    width: 0;
    height: 0;
    border: 5px solid transparent;
    border-top: 0;
    border-bottom: 5px solid rgb(0 0 0 / 100%);
    position: absolute;
    content: "";
	left: calc(50% - 6px);
    top: -6px;
}
div.checkbox.is-invalid .label-error:before {
    left: 1px;
}
div.checkbox.is-invalid .label-error {
	text-align: left;
}  
*/
/*
GRACIAS */
#gracias {
    font-size: 68%;
    padding: 7% 5%;
}
#gracias .subtitulo-promo {
    text-shadow: none;
    font-size: 180%;
    line-height: normal;
}

/*
RESPONSIVE */
@media (min-width: 1550px)  {
	.only-desktop { display: block; }
	.only-laptop { display: none; }
	.only-mobile { display: none; }	
}
@media (max-width: 1710px) and (min-width: 768px)  {
	.only-desktop { display: none; }
	.only-laptop { display: block; }
	.only-mobile { display: none; }	
}
@media (max-width: 768px)  {
	.only-desktop { display: none; }
	.only-laptop { display: none; }
	.only-mobile { display: block; }	
}
	

/* entre portátil y tablet */
@media (max-width: 1600px) and (min-width: 768px)  {
	.stage.full-design main .bloque1 .descripcion .caja-titulo {
		margin: 0;
		font-size: 88%;
	}
	.stage.full-design main .bloque1 .descripcion .caja-titulo h1,
	#gracias .titulo-promo {
        line-height: 120%;
        font-size: 270%;
        margin-top: 0;
        margin-bottom: 3%;
    }
    .stage.full-design .bloque1 {
        /*align-items: flex-start;*/
    }
	.label-error {
		color: red;
		background-color: rgb(0 0 0 / 70%);
		padding: 10px 15px;
		border: solid 1px #000000;
		position: relative;
		margin-top: 12px;
		text-align: center;
		font-size: 90%;
	}
	/* para que quepa el formulario */
	.mt-20 {
		margin-top: 0em;
	}
	.form-group {
		margin-bottom: 10px;
	}
	.form-control {
		height: 40px;
	}
	.checkbox {
        margin-bottom: 1%;
        float: left;
        clear: both;
        width: 100%;
    }
		.checkbox input[type=checkbox] {
		margin-left: 0;
		left: 0;
		top: 0;
	}
	
}
/* resolución cliente */
@media (max-width: 1200px) and (min-width: 768px)  {
	.stage.full-design main .bloque1 {
		max-width: 100%;
	}
	.col-sm-6.formulario {
        padding-right: 8%;
    }
	.form-control,
	.btn-file {
        height: 30px;
    }
	label {
		font-weight: normal;
		font-size: 90%;
	}
	.btn-file {
        font-size: 12px;
        line-height: 30px;
        padding: 0 15px;
    }
	.glyphicon {
		font-size: 85%;
	}
	.stage.full-design main .bloque1 .descripcion .caja-titulo {
		width: 98%;
	}
	main .blur {
        padding: 0.5em 2em!important;
    }
	#fichero .help-block {
        margin-top: -0.5%!important;
        margin-bottom: 1.5%!important;
    }
	#btnparticipar.btn-ap {
        margin: 4% auto 0 auto!important;
    }
	.mb-20 {
		margin-bottom: 1.5em;
	}
}
/* / resolución cliente */

/*a patir de portatil */
@media (max-width: 1600px)  {
	main .blur {
		padding: 0.5em 2.5em;
		font-size: 90%;
	}
	#fichero .help-block {
		margin-top: 2%;
		margin-bottom: 1%;
	}
	#btnparticipar.btn-ap {
		margin: 2% auto 0 auto;
	}
	.stage.full-design header {
		padding-bottom: 1rem;
	}
	#fichero .help-block {
        margin-top: 0%;
        margin-bottom: 3%;
    }
}

/* tablet - mobile */
@media (max-width: 767px)  {
	label, input {
		font-size: 110%;
	}
	#btnparticipar.btn-ap {
		font-size: 120%;
	}
	.stage.full-design main .bloque1 .descripcion {
		margin-left: -20px;
        padding-right: 40px;
	}
	main .blur {
		padding: 0 2em;
	}
	.pregunta_personalizada {
		width: 100%;
		float: none;
		padding: 0 !important;
	}
	.btn-file {
		height: 44px;
		line-height: 22px;
		font-size: 12px;
		letter-spacing: 0;
	}
	.stage.full-design main .bloque1 .descripcion .caja-titulo {
        padding-top: 0;
        margin-bottom: 0;
    }
	.stage.full-design main .bloque1 .descripcion .caja-titulo h1,
	#gracias .titulo-promo {
		line-height: 125%;
		text-shadow: 0px 0px 15px rgb(0 0 0 / 30%);
		font-size: 190%;
		padding-right: 4%;
	}
	.stage.full-design main .bloque1 .descripcion .caja-titulo h2,
	#gracias .subtitulo-promo {
        padding-right: 12%;
		text-shadow: 0px 0px 15px rgb(0 0 0 / 30%);
	}
	.stage.full-design main .bloque1 .descripcion .continuar {
        /*left: calc(95% - 17px);*/
        position: absolute;
        left: 7%;
    }
	header .logo {
		margin: 0 0 0 20px;
		background-position: left;
	}
	.stage.full-design main .bloque1 .descripcion .descripcion-container {
        min-height: calc(100vh - 32vh);
    }
	form.mt-20 {
		margin-top: 1em;
	}
	.checkbox {
        text-align: left;
        margin-top: 2% !important;
    }
	#btnparticipar.btn-ap {
        margin: 8% auto 9% auto;
    }
	
}


/*
TIPOGRAFÍA */
* {
	font-family: "Gotham Medium";
	font-weight: 300;
	font-style: normal;
}
body {
	font-size: 15px;
	color: #FFFFFF;
	letter-spacing: 0.1rem;
	font-size: 16px;
}
b, strong {
    font-family: "Gotham Bold";
    font-weight: normal;
}





#fechaNacimiento.is-invalid input#bday {
	border: 1px solid red;
	background-color: rgba(255,0,0,.2);
}

.rrssoauth {
	font-size: 34px;
	border: #fff solid 1px;
	border-radius: 50%;
	display: inline-block;
	width: 60px;
	height: 60px;
	padding: 7px;
	color: #fff;
	background-color: rgba(255, 255, 255, 0.3);
	-webkit-transition: all 0.4s ease-in-out;
	transition: all 0.4s ease-in-out;
	margin: 0 10px;
}

.rrssoauth.fa-facebook {
	color: #3b5998;
	border-color: #3b5998;
	background-color: white;
}

.tooltip {
display: block !important;
z-index: 10000;
}

.tooltip .tooltip-inner {
background: black;
color: white;
border-radius: 16px;
padding: 5px 10px 4px;
}

.tooltip .tooltip-arrow {
width: 0;
height: 0;
border-style: solid;
position: absolute;
margin: 5px;
border-color: black;
z-index: 1;
}

.tooltip[x-placement^="bottom"] {
margin-top: 5px;
}

.tooltip[x-placement^="bottom"] .tooltip-arrow {
border-width: 0 5px 5px 5px;
border-left-color: transparent !important;
border-right-color: transparent !important;
border-top-color: transparent !important;
top: -5px;
left: calc(50% - 5px);
margin-top: 0;
margin-bottom: 0;
}

.tooltip.popover .popover-inner {
background: #f9f9f9;
color: black;
padding: 24px;
border-radius: 5px;
box-shadow: 0 5px 30px rgba(black, .1);
}

.tooltip.popover .popover-arrow {
border-color: #f9f9f9;
}

.tooltip[aria-hidden='true'] {
visibility: hidden;
opacity: 0;
transition: opacity .15s, visibility .15s;
}

.tooltip[aria-hidden='false'] {
visibility: visible;
opacity: 1;
transition: opacity .15s;
}


input.is-invalid, select.is-invalid {
border: 1px solid red;
background-color: rgba(255,0,0,.2);
}
.multirespuesta.is-invalid {
border: 1px solid red;
background-color: rgba(255,0,0,.2);
}/*
.checkbox.is-invalid {
border: 1px solid red;
background-color: rgba(255,0,0,.2);
}
*/
.input-group.is-invalid {
border: 1px solid red;
background-color: rgba(255,0,0,.2);
}

.form-group.is-invalid select {
border: 1px solid red;
background-color: rgba(255,0,0,.2);
}

.form-group.is-invalid input {
border: 1px solid red;
background-color: rgba(255,0,0,.2);
}

.checkbox.is-invalid i.helper {
border: 1px solid red;
background-color: rgba(255,0,0,.2);
}
.checkbox .is-invalid label {
color: red;
}
.checkbox .is-invalid i{
color: red;
}

#bbll .is-invalid i.helper {
border: 1px solid red;
  background-color: rgba(255,0,0,.2);
}

.is-invalid input.date-picker {
border: 1px solid red;
background-color: rgba(255,0,0,.2);
}
.checkbox.is-invalid label a {
color: #fff;
}
#fichero.is-invalid input, #fichero.is-invalid span.btn-file {
	border: 1px solid red;
background-color: rgba(255,0,0,.2);
}
.label-error {
	color: red;
}
.checkbox {
	display: block;
}