
:root {
  --font-xxl:clamp(2rem, 6vw, 4rem);
  --font-xl:clamp(1.8rem, 4.5vw, 2.6rem);
  --font-l:clamp(1.3rem, 3vw, 1.7rem);
  --font-m:clamp(1rem, 2.2vw, 1.3rem);
  --font-s:clamp(0.8rem, 2vw, 1rem);
  --font-xs:clamp(0.75rem, 0.9vw, 0.9rem);
  --font-color: #fff;
  --font-color-d1: #7DA6B2;
  --font-color-d1l: #DBE9ED;
  --font-color-d2: #EB9E83;
  --bgcolor: #030303;
  --bgcolorm: #061114;
  --bgcolorl: #0C252C;
}
html{font-size: 16px}
*{-webkit-box-sizing: border-box;box-sizing: border-box;scroll-behavior: smooth;}
h1,h2,h3,p{margin:1rem 0}
body{position:relative;padding:0;font-family: "Figtree", Arial, sans-serif;  font-optical-sizing: auto; font-weight: 400; font-style: normal;font-size: var(--font-m);color:var(--font-color);background-color: var(--bgcolor); letter-spacing: -0.01rem;text-wrap:pretty}
.container{position:relative;z-index:5;background: url("../img/30aniv-gregorio-ordonez-fondo.jpg") no-repeat right bottom; background-size: 1000px;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-flow:column;flex-flow:column;-webkit-box-pack: start;-ms-flex-pack: start;justify-content: flex-start;margin:0 auto}
body.mensaje .container{min-height:82vh;}
.content{width:100%;max-width: 1000px;margin: 0 auto}

nav.idioma{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-pack: end;-ms-flex-pack: end;justify-content: flex-end}
nav.idioma ul{display:-webkit-box;display:-ms-flexbox;display:flex;list-style-type: none;background-color: #515050; color:#fff;padding:8px 15px;margin:0 50px 0 0;gap:20px;font-size: var(--text-l);font-weight: 800}
nav.idioma ul a{color:#fff;text-decoration: none}
nav.idioma ul a.active{color:var(--font-color-d1l);text-decoration: none}


.header {text-align: left}
.header h1{font-size: var(--font-xxl);letter-spacing: 0rem;font-weight: 700;margin-bottom:15px;padding: 0 0 5px;line-height:90%}
.header h1 span{color:var(--font-color-d1)}
.header p{font-size: var(--font-l);font-weight: 800;padding:5px 20px;margin-top:0;color: var(--font-color-d1);border-top: 1px solid var(--font-color-d1);border-bottom: 1px solid var(--font-color-d1);text-align: center}


.info .content{position: relative;padding-bottom:60px}
.info a,body.mensaje a{color:var(--font-color-d2);font-weight: 800;-webkit-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out}
.info a:hover,body.mensaje a:hover{color:#fff;background-color:var(--font-color-d2) }
.info .descripcion{width:100%;max-width:650px}
.info .descripcion p{font-size: var(--font-m)}
.info .recuerda{width:100%;}
.info .recuerda .textos{width:100%;max-width:650px}
.info .recuerda h2{color:var(--font-color-d2);border-bottom: 1px solid var(--font-color-d2);font-size: var(--font-xl);font-weight: 700;padding-bottom:5px }
.info .recuerda h2::before{content:url("../img/ic-exclamacion.png");position:relative;top:35px;margin-right:15px;padding:0 10px 0 0;background-color: var(--bgcolor)}
.info .recuerda strong{color:var(--font-color-d2);font-weight: 800}
.info .recuerda p{text-indent:85px;margin-top:10px;font-size: var(--font-m)}

.aforo-completo{width:100%;background-color: #ff0000; color: #fff;font-weight: 800;font-size: var(--font-m);padding: 10px 30px;text-align: center;margin:-15px 0 20px}
.aforo-completo p{margin:0}



body.mensaje .gracias{text-align: center;padding:0 25px 50px}

/*--FORMULARIO--*/

.form-footer{margin-top:auto;background-color:var(--bgcolorl)}
.form-footer a{font-weight: 800;-webkit-transition: all 0.3s ease-in-out;-o-transition: all 0.3s ease-in-out;transition: all 0.3s ease-in-out;color:var(--font-color-d2)}
.form-footer a:hover{font-weight: 800;color:#fff;background-color:var(--font-color-d2) }
.form{ accent-color: var(--font-color-d1l);padding-top:20px}
.form h2{color:var(--font-color-d1l);font-size: var(--font-xl);margin:0;position: relative;text-align: center;font-weight: 700;padding-right:20px}
.form .aviso{padding:30px 20px 40px;text-align:center;min-height:300px}
.form .aviso p{margin-bottom:20px}
.form .aviso.sin-altura, .form #errores.aviso{min-height:auto;padding-bottom:0}
.form #errores.aviso{text-align: left}
.form .aviso.sin-altura p{margin-bottom:0}
.form #errores.aviso>div{padding: 20px;background-color: #f72828;color: #fff}
.form .campos{padding:30px 0px 40px;display: -webkit-box;display: -ms-flexbox;display: flex;-ms-flex-flow: wrap;flex-flow: wrap;gap:3%;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between}
.form .campos div{-webkit-box-flex: 1;-ms-flex: 1 1 30%;flex: 1 1 30%;margin:10px 0}
.form .campos div label{color:var(--font-color-d1);font-weight: 700}
.form .campos div input{font-size: clamp(0.95rem, 2.3vw, 1.1rem);border-radius:10px;border:1px solid #2d2d2d;margin-top:5px;padding:3px 10px;-webkit-transition: all 0.5s ease-in-out;-o-transition: all 0.5s ease-in-out;transition: all 0.5s ease-in-out;width:100%}
.form .campos div input:focus{background-color:var(--font-color-d1l)}
.form .campos p{font-size: var(--font-xs);-webkit-box-flex:1;-ms-flex:1 1 100%;flex:1 1 100%}
.form .campos p.leyenda{font-size: var(--font-s);-webkit-box-flex:1;-ms-flex:1 1 100%;flex:1 1 100%}
.form .campos .captcha{-webkit-box-flex: 0;-ms-flex: 0 1 305px;flex: 0 1 305px;margin:0}
.form .campos .captcha label{font-weight: 400;font-size: var(--font-s)}
.form .campos input[type=submit]{font-size: var(--font-l);font-weight: 800;border:none;border-radius:15px;padding:15px 50px;cursor:pointer;-webkit-transition: all 0.2s ease-in-out;-o-transition: all 0.2s ease-in-out;transition: all 0.2s ease-in-out;background-color: var(--font-color-d1);color:#fff;-ms-flex-item-align:center;-ms-grid-row-align:center;align-self:center}
.form .campos input[type=submit]:hover{background-color: #ff3c00;-webkit-transform: scale(1.1);-ms-transform: scale(1.1);transform: scale(1.1)}


/*--PIE ENLACES--*/
.navfooter{display: -webkit-box;display: -ms-flexbox;display: flex;gap:10px;margin:0 auto;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between;padding:10px 15px 20px;background-color: var(--bgcolorm)}
.navfooter p{font-size: var(--font-xs)}
.navfooter .patrocinios{display: -webkit-box;display: -ms-flexbox;display: flex;gap:50px;-webkit-box-pack: justify;-ms-flex-pack: justify;justify-content: space-between}
.navfooter .patrocinios>div{display: -webkit-box;display: -ms-flexbox;display: flex;flex-flow:column}
.navfooter .patrocinios .logos{display: -webkit-box;display: -ms-flexbox;display: flex;gap:20px;align-items:center}
.navfooter ul{display: -webkit-box;display: -ms-flexbox;display: flex;list-style-type: none;gap:10px;-webkit-box-pack: end;-ms-flex-pack: end;justify-content: flex-end;padding:0px 15px}
.navfooter ul a{font-size: var(--font-xs);color:#fff;font-weight: 400;text-decoration: none}



@media (max-width:1200px){
	.header h1{padding: 0 20px 5px}
	.navfooter{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-flow:column;flex-flow:column;-webkit-box-align:center;-ms-flex-align:center;align-items:center}
	.form .campos{padding:30px 30px 40px}
}

@media (max-width:1000px){
	.container{background-size: 800px}
	.content{padding:0 30px}
	.form .campos,.form .aviso{border:none;min-height:200px}
	.form-footer .content{padding:0}
	.info .descripcion{position: relative;top:auto;left:auto;max-width:100%;padding:3px 0 5px}
	.info .recuerda{max-width:100%;position: relative;top:auto;left:auto;margin-top:20px}
	.info .recuerda h2{margin:-40px 0 0}

}
@media (max-width:650px){
	.container{background-size: 500px;}
	body.mensaje .container{min-height:52vh}
	.content{padding:0}
	.info .descripcion,.info .recuerda .textos{padding:0 30px}
	.info .recuerda .textos{max-width:100%}
	.form {background-size: 700px}
	.form h2{border-bottom: none;text-align: left;padding:0 20px;margin-bottom:10px}
	.form h2::before, .eu .form h2::before{content: ""}
	.form .campos {padding:0 20px 20px }
	.form .campos div{-webkit-box-flex:1;-ms-flex:1 1 40%;flex:1 1 40%}
	.form .campos div input{padding:5px}
	.form .campos p{-webkit-box-flex:1;-ms-flex:1 1 100%;flex:1 1 100%}
	.form .campos .captcha{-webkit-box-flex: 1;-ms-flex: 1 1 100%;flex: 1 1 100%}
	.form .campos input[type=submit]{-webkit-box-flex:1;-ms-flex:1 1 100%;flex:1 1 100%;margin-top:20px}
	.footer{-webkit-box-orient: vertical;-webkit-box-direction: normal;-ms-flex-flow: column;flex-flow: column;background-color: #537b27;gap:0;padding:0 20px}
	.footer div,.footer div:not(:last-child){border-bottom:1px solid #fff;width:100%;border-right: none;margin-top:0}
	.navfooter .patrocinios{-webkit-box-orient:vertical;-webkit-box-direction:normal;-ms-flex-flow:column;flex-flow:column;gap:10px}
	.navfooter ul{-ms-flex-wrap:wrap;flex-wrap:wrap;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}
	
}
@media (max-width:450px){
	.header h1 br{display:none}
	.form .campos {-webkit-box-align: center;-ms-flex-align: center;align-items: center;-webkit-box-pack: center;-ms-flex-pack: center;justify-content: center; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-flow: column; flex-flow: column}
	.form .campos div{-webkit-box-flex:1;-ms-flex:1 1 100%;flex:1 1 100%;width:100%}
	.form .campos input[type=submit]{margin-bottom:20px}
	.navfooter .patrocinios div:nth-child(2) .logos{gap:0;margin-left:-20px}
	.navfooter .patrocinios div:nth-child(2) .logos img{-webkit-transform: scale(0.8);-ms-transform: scale(0.8);transform: scale(0.8)}
}