*,
*:before,
*:after{box-sizing:border-box}
body,html{margin:0;padding:0}

body{
background-color:#fff;
color:#333399;
font-family:'Open Sans', sans-serif;
font-weight:400;
font-size:calc(16px + (22 - 18) * ((100vw - 300px) / (1600 - 300)));
display:flex;
flex-direction:column;
min-height:100vh;
height:100%}

img{max-width:100%;height:auto}

a{text-decoration:none}
a:hover{text-decoration:none}

a.en1{text-decoration:underline}

a.en3{color:#29abe2; text-decoration:underline}
a.en3:hover{color:#003399; text-decoration:none; font-weight:600}

ul{margin:auto; padding:0; list-style-position:outside}
li{padding:.5rem 0; margin:0}

p{margin:0;padding:.8rem 0}

h1,h2,h3,h4,h5,h6{font-family:'Oswald', sans-serif}

h2{position:relative; z-index:1; padding-left:1.5rem}
h2:before{border-top:7px solid #ffcc00; content:""; position:absolute; top:50%; right:0; width:95vw; z-index:-1}
h2 span{background:#fff; padding:0 3rem}


/* MAQUETACION */
header,main,section,footer{display:block}
header,footer{text-align:center; padding:1rem 0}

header{margin-top:15px; text-transform:uppercase; font-weight:700}
footer{font-weight:500}
main{flex:1; line-height:1.5}

section{width:100%}
article{max-width:1300px; padding:1rem; margin:auto}

.flexBox{display:flex;justify-content:space-around;flex-wrap:wrap}
.row25,.row30,.row50,.row50h{padding:0; margin:.5rem 0}
.row25{width:24%}
.row30{width:32%}
.row50{width:47%}
.row50h{width:53%}
.contenido{padding-bottom:2rem}
.big{font-size:1.5rem}

header,footer{
font-family:'Oswald', sans-serif;
background:rgb(11,36,100);
background:-moz-linear-gradient(left,  rgba(11,36,100,1) 0%, rgba(0,153,204,1) 40%, rgba(0,153,204,1) 60%, rgba(11,36,100,1) 100%);
background:-webkit-linear-gradient(left,  rgba(11,36,100,1) 0%,rgba(0,153,204,1) 40%,rgba(0,153,204,1) 60%,rgba(11,36,100,1) 100%);
background:linear-gradient(to right,  rgba(11,36,100,1) 0%,rgba(0,153,204,1) 40%,rgba(0,153,204,1) 60%,rgba(11,36,100,1) 100%);
filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#0b2464', endColorstr='#0b2464',GradientType=1 )}


/* CABECERA */
.logotipo{text-align:center; padding:.5rem}
.logotipo img{display:block; margin:auto}

	/* MENU SUPERIOR */
	.topnav{overflow:hidden; max-width:1200px; margin:auto; justify-content:center; display:flex;justify-content:space-around}
	.topnav a{float:left;display:block;color:#fff;text-align:center;padding:14px 16px;text-decoration:none}
	.active{background-color:#0099cc; color:#fff; border-radius:5px}
	.topnav .icon{display:none}
	.dropdown{float:left;overflow:hidden}
	.dropbtn{text-transform:uppercase; font-weight:700}
	.dropdown .dropbtn{border:none;outline:none;color:#fff;padding:14px 16px;background-color:inherit;margin:0}
	.dropdown-content{background-color:#6fbce5;display:none;position:absolute;min-width:160px;box-shadow:0px 8px 16px 0px rgba(0,0,0,0.2);z-index:10;font-weight:300}
	.dropdown-content a{float:none;color:#000;padding:12px 16px;text-decoration:none;display:block;text-align:left; text-transform:none}
	.topnav a:hover,.dropdown:hover .dropbtn{background-color:rgba(255,255,255,.3)}
	.dropdown-content a:hover{background-color:rgba(255,255,255,.3);color:#333399}
	.dropdown:hover .dropdown-content{display:block}
	@media screen and (max-width:700px){
	.topnav{flex-direction:column;}
	.active{width:25%; margin-left:10px}
	.topnav a:not(:first-child), .dropdown .dropbtn{display:none}
	.topnav a.icon{float:right;display:block}
	.topnav.responsive{position:relative}
	.topnav.responsive .icon{position:absolute;right:0;top:0}
	.topnav.responsive a{float:none;display:block;text-align:left}
	.topnav.responsive .dropdown{float:none}
	.topnav.responsive .dropdown-content{position:relative}
	.topnav.responsive .dropdown .dropbtn{display:block;width:100%;text-align:left}
	}
	/* FIN DE MENU SUPERIOR */


/* FOOTER */
.redes_sociales{text-align:center}
.redes_sociales img{margin:0 .5rem}
footer ul{margin:.7rem auto; padding:0}
footer li{display:inline; padding:0}
footer li a{color:#fff}
footer li a:hover{color:#fff; text-decoration:underline}
footer li:after{content:"/"; color:#fff; padding:0 .3rem}
footer li:last-child:after{display:none; padding:0}

footer p{margin:0; padding:0; color:#fff; font-family:'Open Sans', sans-serif; font-size:1rem}


/* PRESIDENTES */
.banderaEuropa{background-image:url(../img/fondoBandera.jpg); background-repeat:no-repeat; background-position:bottom right}
.pre{text-align:center}
.presidente{text-align:left; background-color:rgba(255,255,255,.8)}
.presidente h3{border-bottom:5px solid #ffcc00; padding-bottom:.7rem}
.fPre{background-color:rgba(255,255,255,.8)}
.marco{-webkit-box-shadow:1px 1px 20px 2px #666;box-shadow:1px 1px 20px 2px #666}
.Nompresi{font-family:'Oswald', sans-serif;font-weight:700; font-size:2rem}


/* JUNTA DIRECTIVA */
.direct{text-align:center; font-size:1rem}
.imgRedonda{width:120px; height:120px; border-radius:160px; border:3px solid #333399}


/* PANEUROPA INTERNACIONAL */
.internacional{background:url(../img/mapa-europa.jpg) no-repeat top; background-size:cover; height:700px; position:relative}
a.en2{color:#0c3575}
a.en2:hover{color:#2c6dba;}

.circulo{border:20px solid #2c6dba;position:absolute; top:20%; right:10%;width:15rem;height:15rem;border-radius:50%;display:flex;justify-content:center;align-items:center;text-align:center;margin:0 auto;padding:3%;
background:rgb(255,255,255);background:-moz-linear-gradient(left,  rgba(255,255,255,1) 30%, rgba(102,102,102,1) 100%);background:-webkit-linear-gradient(left,  rgba(255,255,255,1) 30%,rgba(102,102,102,1) 100%);
background:linear-gradient(to right,  rgba(255,255,255,1) 30%,rgba(102,102,102,1) 100%);filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#666666',GradientType=1 )}
.circulo > h3{font-family:'Oswald', sans-serif; font-weight:700; font-size:4rem}

/* CABECERAS */
.cabecera{background-color:#183698}
.cabecera img{height:100%; width:100%; object-fit:cover; object-position:bottom center; display:block;}
.unete{position:relative; z-index:0}
.unete h1{font-size:4rem; position:absolute; top:2%; left:5%; z-index:1}


/* INICIO */
.bienvenida h1{color:#29abe2; text-align:right; font-family:'Open Sans', sans-serif; font-weight:300; font-size:2.6rem}
.azulOsc{color:#0c3575; font-weight:600}
.der{text-align:right}
.bajo{display:flex; align-items:flex-end; flex-direction:column}


/* FOROS Y NOTICIAS */
.conForos{max-width:1200px; margin:auto; display:flex; justify-content:space-between}
.entradas{width:55%; margin-right:10%}
aside{width:35%;padding:1rem}
aside ul{list-style-position:inside}
.NotImg{background-color:rgba(204,204,204,.5); margin:.8rem 0}
.NotImg img{display:block; margin:auto}
.sepa{background-color:rgba(51,51,51,.1)}
.card{padding:1rem; margin-bottom:1rem}
.inter{line-height:1.5}
.card h2{padding:0; margin:0 0 .5rem 0;font-size:2rem}
.card h2:before{border:0}
.sepa h3{margin:0; padding:0 0 .5rem 0}
.card h6{font-family:'Open Sans', sans-serif; font-weight:400; padding:0; margin:0}
.card li{padding:.4rem 0}
.card p{margin:0; padding:.4rem 0}
.twitterDes{background-color:rgba(51,51,51,.1); padding:.5rem}

.acordeon{background-color:#666; color:#fff; cursor:pointer; padding:.4rem; width:100%; border:none; outline:none; transition:0.4s; border-bottom:1px solid #fff}
.acordeon:hover{background-color:#ccc; color:#666}
.panel{padding:0 18px;display:none;background-color:#fff;overflow:hidden}

.desNews{margin:0 auto 1.5rem auto}
.desNews h3, .desNews h6, .desNews p{margin:0; padding:0}
.desNews h3{padding:.8rem 0}
.desNews h6{padding:.8rem 0}
.desNews a{color:#666}


/* CONTACTO */
.fContacto{padding:8rem 0; background:url(../img/contacto.jpg) no-repeat center; background-size:cover}
.contacto{background-color:rgba(255,255,255,.4); max-width:700px}
input,textarea{padding:12px; margin:8px auto; display:inline-block; border:0; color:#000; background-color:rgba(255,255,255,.8)}
input[type="text"],textarea{width:100%}

/* UNETE */
.formUnete input[type="text"]{background-color:rgba(51,51,51,.1)}
.centro{text-align:center}


/* BOTONES */
.btn{border:5px solid #73c3ea;text-align:center;-webkit-border-radius:50px;border-radius:50px;text-transform:uppercase;padding:1rem 3rem}
.btn1{border:none;color:#fff;padding:1rem 2rem;cursor:pointer;-webkit-border-radius:5px;border-radius:5px}
.azul{background-color:#66ccff}
.azul:hover{background-color:#3399ff}

.btnAzul{font-family:'Oswald', sans-serif; font-weight:700; color:#fff; font-size:2rem;
background:rgb(54,169,225);
background:-moz-linear-gradient(top, rgba(54,169,225,1) 60%, rgba(38,51,111,1) 100%);
background:-webkit-linear-gradient(top, rgba(54,169,225,1) 60%,rgba(38,51,111,1) 100%);
background:linear-gradient(to bottom, rgba(54,169,225,1) 60%,rgba(38,51,111,1) 100%);
filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#36a9e1', endColorstr='#26336f',GradientType=0 )}


/* ASPECTOS LEGALES */
.legales{max-width:800px; line-height:1.5}
.legales ul{padding-left:1.5rem}
.legales p{padding-left:.5rem}

.cookies{border-collapse:collapse;width:80%; margin:0 auto 3rem auto}
.cookies td, .cookies th{border:1px solid #ddd;padding:8px; font-size:1rem}
.cookies tr:nth-child(even){background-color:#f2f2f2}
.cookies th{padding:.7rem 0;text-align:center;background-color:#eee;color:#000}



/* MEDIA QUERYS */
@media only screen and (min-width:821px) and (max-width:980px){
.internacional{background:url(../img/mapa-europa-T5.jpg); height:430px}
.fContacto{padding:1rem 0; background:url(../img/contacto-T5.jpg) no-repeat top}

h2{padding-left:5px}
h2:before{border-top:6px solid #ffcc00; top:50%; width:90vw}
h2 span{padding:0 1rem}

.circulo{border:12px solid #2c6dba; top:5%; right:5%; width:12rem; height:12rem; border-radius:50%}
.circulo > h3{font-size:3.5rem}

.entradas{width:63%; margin-right:2%}
aside{width:35%; padding:1rem}

.topnav a{padding:14px 1px}
}


@media only screen and (min-width:621px) and (max-width:820px){
.internacional{background:url(../img/mapa-europa-T4.jpg); height:302px}
.fContacto{padding:1rem 0; background:url(../img/contacto-T4.jpg) no-repeat top}

h2{padding-left:5px}
h2:before{border-top:6px solid #ffcc00; top:50%; width:90vw}
h2 span{padding:0 1rem}

.circulo{border:10px solid #2c6dba; top:5%; right:5%; width:10rem; height:10rem; border-radius:50%}
.circulo > h3{font-size:3rem}

.entradas{width:63%; margin-right:2%}
aside{width:35%; padding:1rem}

.topnav a{padding:14px 1px}
}


@media only screen and (min-width:421px) and (max-width:620px){
.internacional{background:url(../img/mapa-europa-T3.jpg); height:302px}
.fContacto{padding:1rem 0; background:url(../img/contacto-T3.jpg) no-repeat top}

h2{padding-left:5px}
h2:before{border-top:6px solid #ffcc00; top:50%; width:90vw}
h2 span{padding:0 1rem}

.circulo{border:10px solid #2c6dba; top:7%; right:7%; width:7rem; height:7rem; border-radius:50%}
.circulo > h3{font-size:2rem}

.entradas{width:55%;margin-right:0}
aside{width:35%;padding:1rem}

.conForos{flex-direction:column}
.entradas, aside{width:100%}
}


@media only screen and (min-width:321px) and (max-width:420px){
.row25,.row30,.row50,.row50h{width:100%; padding:.5rem; margin:.5rem 0}

footer ul{margin:0 auto; padding:0}
footer li{display:block; padding-bottom:1rem}
footer li:after{content:""; color:inherit; padding-bottom:1rem}

.bienvenida h1{text-align:center; font-size:2rem}

h2{padding-left:5px}
h2:before{border-top:6px solid #ffcc00; top:50%; width:90vw}
h2 span{padding:0 1rem}

.big{font-size:1.3rem}
ul{padding:0; list-style-position:inside}
li{padding:.5rem}

.internacional{background:url(../img/mapa-europa-T2.jpg); height:302px}
.fContacto{padding:1rem 0; background:url(../img/contacto-T2.jpg) no-repeat top}

.circulo{border:10px solid #2c6dba; top:5%; right:5%; width:6.5rem; height:6.5rem; border-radius:50%}
.circulo > h3{font-size:2rem}
.imgRedonda{width:250px; height:250px; border-radius:160px; border:6px solid #333399}

.entradas{width:55%;margin-right:0}
aside{width:35%;padding:1rem}

.conForos{flex-direction:column}
.entradas, aside{width:100%}
}


@media only screen and (min-width:200px) and (max-width:320px){
.row25,.row30,.row50,.row50h{width:100%; padding:.5rem; margin:.5rem 0}

footer ul{margin:0 auto; padding:0}
footer li{display:block; padding-bottom:1rem}
footer li:after{content:""; color:inherit; padding-bottom:1rem}

.btn{padding:.8rem 1.5rem}
.btnAzul{font-size:1.5rem; width:150px}

.bienvenida h1{text-align:center; font-size:1.5rem}
.unete h1{font-size:2.5rem; top:2%; left:5%}
h2{padding-left:5px}
h2:before{border-top:5px solid #ffcc00; top:50%; width:90vw}
h2 span{padding:0 1rem}

.big{font-size:1rem}
ul{padding:0; list-style-position:inside}
li{padding:.5rem}

.internacional{background:url(../img/mapa-europa-T1.jpg); height:255px}
.fContacto{padding:1rem 0; background:url(../img/contacto-T1.jpg) no-repeat top}

.circulo{border:10px solid #2c6dba; top:5%; right:5%; width:6rem; height:6rem; border-radius:50%}
.circulo > h3{font-size:2rem}
.imgRedonda{width:250px; height:250px; border-radius:160px; border:6px solid #333399}
.entradas{width:55%; margin-right:0}
aside{width:35%;padding:1rem}

.conForos{flex-direction:column}
.entradas, aside{width:100%}
}