@font-face {
font-family: 'RalewayLight';
src: url('/fonts/especiales/raleway/Raleway-Light-webfont.eot');
src: url('/fonts/especiales/raleway/Raleway-Light-webfont?#iefix') format('embedded-opentype'),
	 url('/fonts/especiales/raleway/Raleway-Light-webfont.woff') format('woff'),
	 url('/fonts/especiales/raleway/Raleway-Light-webfont.ttf') format('truetype'),
	 url('/fonts/especiales/raleway/Raleway-Light-webfont.svg#RalewayLight') format('svg');
font-weight: normal;
font-style: normal;}

@font-face {
font-family: 'RalewayHeavy';
src: url('/fonts/especiales/raleway/raleway-heavy-webfont.eot');
src: url('/fonts/especiales/raleway/raleway-heavy-webfont?#iefix') format('embedded-opentype'),
	 url('/fonts/especiales/raleway/raleway-heavy-webfont.woff') format('woff'),
	 url('/fonts/especiales/raleway/raleway-heavy-webfont.ttf') format('truetype'),
	 url('/fonts/especiales/raleway/raleway-heavy-webfont.svg#RalewayHeavy') format('svg');
font-weight: normal;
font-style: normal;}

.animacion, a, a:before {-webkit-transition: all 0.3s ease-in-out; -moz-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
html { margin:0; padding:0;}
body { overflow-x:hidden; font-family:'RalewayLight', sans-serif; color:#5e5e71; background:#dcdce3; text-align:center;}
h1, h2, h3 { font-weight:normal !important; color:#5e5e71;}
::selection {color:#fff;background: #57576b;}
::-moz-selection {color:#fff;background: #57576b;}
a { color:#d60623;}
a:hover { text-decoration:none; opacity:.5;}

.top { width:100%; padding:20px 40px; box-sizing:border-box;}
.logo { float:left; display:block; width:156px; height:34px; overflow:hidden; text-indent:-9000px; background:url('../img/elpais.png') no-repeat 0 0; background-size:100%;}
.barra_compartir { float:right; display:block;}
.barra_compartir li { float:left; display:inline-block; margin-right:20px;}
.barra_compartir li:last-of-type { margin-right:0;}
.barra_compartir li a { display:block; width:30px; height:30px; text-indent:-9000px; overflow:hidden;}
.barra_compartir li a.facebook { background:url('../img/facebook.png') no-repeat center center;}
.barra_compartir li a.twitter { background:url('../img/twitter.png') no-repeat center center;}


.pantalla_final .barra_compartir li{width:100px; display: inline;float: left; height: 100px; /*background: #e3e3e7;*/}
.pantalla_final .barra_compartir li a { display: block; color: #fff; font-family: 'RalewayHeavy', sans-serif; font-size: 18px; text-transform: uppercase; margin: 0 0 40px; width: 100%; height: 100%;}
.pantalla_final .barra_compartir li a.facebook { background:url('../img/facebook-final.png') no-repeat center center;}
.pantalla_final .barra_compartir li a.twitter { background:url('../img/twitter-final.png') no-repeat center center;}

.container { max-width:1100px; width:90%; margin:0 auto;}
h1 { max-width:888px; width:90%; height:188px; display:block; margin:80px auto 60px; overflow:hidden; text-indent:-9000px;background:url('../img/h1.png') no-repeat center center; background-size:100%;}
p { font-size:18px; line-height:24px;}
.intro p { max-width:900px; width:90%; margin: 0 auto 70px;}
.intro a { margin-bottom:5px; padding:18px 40px; text-transform:uppercase; font-family:'RalewayHeavy', sans-serif; color:#fff; background:#d60623; font-size:18px; display:inline-block;border:solid 3px #d60623;}
.intro a:after { /* content: url('../img/down.png'); padding-left:20px;*/}
.intro a:hover { opacity:1; background: transparent; color:#d60623; }

.caja-concurso p, .caja-concurso h2 {font-family:'RalewayLight', sans-serif; font-size:20px;}
.sonrisa { font-size: 50px; font-family: Arial, Helvetica, sans-serif; margin-bottom: 30px; display: inline-block; font-weight: bold}

.caja_concurso .txt p{color: #57576b;display: inline-block;font-family: "RalewayLight",sans-serif;font-size: 18px;padding: 0; text-transform: uppercase; margin-bottom: 25px;}
.txt p strong{font-family: "RalewayHeavy",sans-serif; font-weight: normal;}

.content { /*padding-top:30px;*/}
.contenedor_soltar {/*background:url('../img/campo.png') no-repeat center bottom; min-height:560px;*/ max-width:1049px; width:100%; margin:50px auto 0; display:block; position:relative;}
.contenedor_soltar img { max-width:100%; margin-top:80px;}
.contenedor_soltar ul li.pivote { width:110px; height:144px; display:block; background:url('../img/pivote_blanco.png') no-repeat 0 0; position:absolute;}
.contenedor_soltar ul li.pivote.active, .contenedor_soltar ul li.pivote.lleno { background:url('../img/pivote_rojo.png') no-repeat 0 0;}
.contenedor_soltar ul li.pivote span { width: 86px; height: 86px; display: block; background-repeat: no-repeat !important; background-position: center center; background-size: 100% !important; position: absolute; top: 7%; left: 12%;}
.contenedor_soltar ul li.pivote#pvt1 { top:4%; left:23%;}
.contenedor_soltar ul li.pivote#pvt2 { top:28%; left:23%;}
.contenedor_soltar ul li.pivote#pvt3 { top:14%; left:33%;}
.contenedor_soltar ul li.pivote#pvt4 { top:0%; left:43%;}
.contenedor_soltar ul li.pivote#pvt5 { top:38%; left:38%;}
.contenedor_soltar ul li.pivote#pvt6 { top:26%; left:47%;}
.contenedor_soltar ul li.pivote#pvt7 { top:14%; left:56%;}
.contenedor_soltar ul li.pivote#pvt8 { top:2%; left:65%;}
.contenedor_soltar ul li.pivote#pvt9 { top:41%; left:64%;}
.contenedor_soltar ul li.pivote#pvt10 { top:24%; left:72%;}
.contenedor_soltar ul li.pivote#pvt11 { top:3%; left:78%;}


li.lleno span:hover em{ display: table-cell; vertical-align: middle; color:#fff; text-transform: uppercase; background-color:rgba(0,0,0,.6); border-radius:86px; width:86px; height:86px; font-family:"RalewayHeavy"; font-style:normal; font-size:12px;}
li.pivote span em{ display:none;}

#tabs { position:relative;}
#tabs ul.migas { display:inline-block; margin:0 auto;border-bottom:solid 1px #c3c4ce; width:100%;}
#tabs ul.migas li { display:block; float:left; width:25%;}
#tabs ul.migas li.inactivo a {cursor:default; pointer-events: none; opacity:.5;}
#tabs ul.migas li a { border-bottom:solid 3px transparent; display: inline-block; padding-bottom:15px; font-size:12px; text-transform:uppercase; color:#5e5e71;font-family:'RalewayHeavy', sans-serif; }
#tabs ul.migas li a:before { color:#a9a9ae; border:solid 2px #a9a9ae;-webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; width: 20px; height: 18px; display: inline-block; padding-top: 2px; margin-right: 10px; line-height:13px;}
#tabs ul.migas li a:hover, #tabs ul.migas li a:hover:before { border-color:#2b2b41; color:#2b2b41; opacity:1;}
#tabs ul.migas li:nth-of-type(1) a:before { content:'1';}
#tabs ul.migas li:nth-of-type(2) a:before { content:'2';}
#tabs ul.migas li:nth-of-type(3) a:before { content:'3';}
#tabs ul.migas li:nth-of-type(4) a:before { content:'4';}
#tabs ul.migas li.ui-tabs-active a { color:#d60623; border-bottom:solid 3px #d60623; padding-bottom:15px;}
#tabs ul.migas li.ui-tabs-active a:before { color:#d60623; border-color:#d60623;}

.tab_content h2 {font-family:'RalewayHeavy', sans-serif; font-size:40px; text-transform:uppercase; margin-top: 25px;}
.tab_content header { border-bottom:solid 1px #fff;}
.tab_content p { font-size:15px; font-style:italic; margin-bottom:20px;line-height: 18px; margin-top: 15px;}
.tab_content p.movil { display:none;}

#tabs ul.carrusel.principio { width:100%; position:absolute; left: 0; top: 70px; display:none;}
#tabs ul.carrusel.principio li { display:inline-block;}
#tabs ul.carrusel.principio li.previous { float:left;}
#tabs ul.carrusel.principio li.next { float:right;}
#tabs ul.carrusel.principio li a { display:block; width:26px; height:48px; text-indent:-9000px; overflow:hidden;}
#tabs ul.carrusel.principio li.previous a {background:url('../img/previous.png') no-repeat 0 0;}
#tabs ul.carrusel.principio li.next a {background:url('../img/next.png') no-repeat 0 0;}
#tabs ul.carrusel.principio li.previous.inactivo a {background:url('../img/previous_inactive.png') no-repeat 0 0; cursor:default; pointer-events: none;}
#tabs ul.carrusel.principio li.next.inactivo a {background:url('../img/next_inactive.png') no-repeat 0 0; cursor:default; pointer-events: none;}

#tabs ul.carrusel.final { width:100%; margin-top: 30px; display:none;}
#tabs ul.carrusel.final li { float:left; width: calc(50% - 1px); display:inline-block; margin-left:1px;}
#tabs ul.carrusel.final li a { padding: 15px 0;border:solid 3px #d60623; font-size:18px; font-family:'RalewayHeavy', sans-serif; display:inline-block; width:100%; box-sizing:border-box;  background:#d60623; color:#fff; text-transform:uppercase;}
#tabs ul.carrusel.final li.previous a:before { content:'<'; font-size:15px; padding-right:10px;vertical-align: top;}
#tabs ul.carrusel.final li.next a:after { content:'>'; font-size:15px; padding-left:10px;vertical-align: top;}
#tabs ul.carrusel.final li.inactivo { display:none;}
#tabs ul.carrusel.final li.inactivo a { background:#ababbb;cursor:default; pointer-events: none;border:solid 3px #ababbb;}
#tabs ul.carrusel.final li a:hover { opacity:1; color:#d60623; background:transparent;}
#tabs ul.carrusel.final li.inactivo a:after, #tabs ul.carrusel.final li.inactivo a:before {  color:#ababbb;}

.jugadores { margin-top:20px;}
.jugadores .item_jugador { position:relative; z-index:100; width:10%; margin-bottom:1px; float:left; font-size:11px; text-transform:uppercase; box-sizing:border-box; padding:10px 0; border:solid 3px #dcdce3; background: #dcdce3; cursor:pointer;}
#portero.jugadores .item_jugador {width: 16.6666%;}
.jugadores .item_jugador h3 {padding: 8px 10px 0 10px; font-family:'RalewayHeavy', sans-serif;font-size:11px;}
.jugadores .item_jugador .nacionalidad { width:100%; border-bottom:solid 1px #cdced6; display: inline-block; margin-bottom: 10px; padding:8px 10px;}
.jugadores .item_jugador .bandera { background-size: 100%; width: 24px; height: 15px; display: inline-block; text-indent: -9000px; vertical-align: bottom; overflow: hidden; margin-right: 6px; background-repeat: no-repeat;}
.jugadores .item_jugador h3, .jugadores .item_jugador .nacionalidad, .jugadores .item_jugador .equipo { display:inline-block; box-sizing:border-box; width:100%; height:32px;}
.jugadores .item_jugador:hover, .jugadores .item_jugador.active { border:solid 3px #d60623;}
.jugadores .item_jugador.active { opacity:.7;}
.jugadores .item_jugador.active:before { content: 'X'; display: block; position: absolute; top: 2px; right: 2px; background: #d60623; padding: 5px; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; line-height:11px; width: 12px; height: 12px; color: #fff; font-weight: bold;}

.campo_mini { display:none;}

.pantalla_final { margin-top:50px; padding-bottom: 50px; border-bottom: 1px solid #e9e9e9;}
.pantalla_final h2 {font-family:'RalewayHeavy', sans-serif; font-size:40px; text-transform:uppercase; margin-top: 25px;}
.pantalla_final p { font-size:18px; margin-bottom:20px;line-height: 18px; margin-top: 15px;}
.pantalla_final p.comparte { font-size:14px; font-style:italic;}
.pantalla_final .barra_compartir { float:none; display: inline-block; margin: 0 auto; clear: both;}
.pantalla_final .loop { display: block; background: #495abe; clear: both; float: none; width: auto; color: #fff; font-family: 'RalewayHeavy', sans-serif; font-size: 18px; text-transform: uppercase; padding: 20px; margin: 40px 0;}
.pantalla_final .loop:after	{content: url('../img/loop.png'); vertical-align: -3px; margin-left: 20px;}



.acciones a{ width:100%;  background:#000; display: block; color: #fff; font-family: 'RalewayHeavy', sans-serif; font-size: 18px; text-transform: uppercase; padding: 20px; margin: 0 0 40px;}
.acciones a.loop{background: #87879A;}
.acciones .loop:after	{content: url('../img/loop.png'); vertical-align: -3px; margin-left: 20px;}
.acciones a.edit{ background: #87879A; float: left; display: inline; width:40%; }
.acciones .edit:after	{content: url('../img/edit.png'); vertical-align: -3px; margin-left: 20px;}
.acciones a.finish{ float: right; background: #C60F28; display: inline; width:40%; }
.acciones .finish:after	{content: url('../img/finish.png'); vertical-align: -3px; margin-left: 20px;}
.acciones a.terminado{ display: none;}
.acciones a.finalizado{ display: none;}

.principio .jugadores .item_jugador:hover, .principio .jugadores .item_jugador.active {border:solid 3px #DCDCE3; cursor: default;}
.principio{opacity: .3;}

footer { border-top:solid 1px #cdced6; padding:30px 20px; box-sizing:border-box; margin-top:100px;}
footer .logo, footer .barra_compartir { float:none; margin:0 auto 20px;}
footer .barra_compartir { margin-bottom:40px;}
footer .barra_compartir ul { display:inline-block;}
footer p { font-size:12px; text-transform:uppercase; line-height:16px; }

/*
#tabs ul.migas, #tabs ul.carrusel.principio, #tabs .pestanas, #tabs ul.carrusel.final, #tabs .pantalla_final, #tabs .contenedor_soltar, #tabs .campo_mini { display:none;}
*/

.aceptar_bases { display:none;}
#div_pregunta1{display:none;}

@media (max-width: 1200px) {
.jugadores .item_jugador {width: 20%;}
.jugadores .item_jugador h3, .jugadores .item_jugador .nacionalidad, .jugadores .item_jugador .equipo { height:auto;}
.contenedor_soltar { display:none;}
.tab_content p.movil { display:block;}
.tab_content p.web { display:none;}
.campo_mini { display:inline-block; margin-top:50px; position:relative;}
.campo_mini ul { display: block; position: absolute; top: 0; left: 50%; margin-left: -150px; width: 300px; text-align: center;}
.campo_mini ul li { position:absolute; width: 25%;line-height: 10px;}
.campo_mini ul li:after { content:url('../img/jugador_mini.png');}
.campo_mini ul li span { background: #d60623; color: #fff; text-transform: uppercase; font-family: 'RalewayLight', sans-serif; font-size: 10px; width: 100%; display: block; padding:5px 0;}
.campo_mini ul li#jmovil1 { top: -30px; left: 113px;}
.campo_mini ul li#jmovil2 { top: 30px; left: 13px;}
.campo_mini ul li#jmovil3 { top: 30px; left: 113px;}
.campo_mini ul li#jmovil4 { top: 30px; left: 213px;}
.campo_mini ul li#jmovil5 { top: 90px; left: -3px;}
.campo_mini ul li#jmovil6 { top: 90px; left: 74px;}
.campo_mini ul li#jmovil7 { top: 90px; left: 151px;}
.campo_mini ul li#jmovil8 { top: 90px; left: 228px;}
.campo_mini ul li#jmovil9 { top: 160px; left: 13px;}
.campo_mini ul li#jmovil10 { top: 160px; left: 113px;}
.campo_mini ul li#jmovil11 { top: 160px; left: 213px;}
}


@media (max-width: 1050px) {
.contenedor_soltar {background-size:100%;}
.contenedor_soltar img { margin-top:60px;}
.contenedor_soltar ul li.pivote, .contenedor_soltar ul li.pivote.active, .contenedor_soltar ul li.pivote.lleno { width: 90px; height: 120px; background-size:100%;}
.contenedor_soltar ul li.pivote span { width: 70px; height: 70px; }
}

@media (max-width: 900px) {
h1 {height: 148px; margin:40px auto;}
.contenedor_soltar img { margin-top:50px;}
.contenedor_soltar ul li.pivote, .contenedor_soltar ul li.pivote.active, .contenedor_soltar ul li.pivote.lleno { width: 80px; height: 104px; background-size:100%;}
.contenedor_soltar ul li.pivote span { width: 64px; height: 64px;}
#portero.jugadores .item_jugador {width: 33.333%;}
}

@media (max-width: 800px) {
.contenedor_soltar { display:none;}
}

@media (max-width: 700px) {
.jugadores .item_jugador, #portero.jugadores .item_jugador{width: 50%;}
#tabs ul.migas li a:before { display:block; margin: 0 auto 6px;}
#tabs ul.carrusel.principio { top: 80px;}
.tab_content h2 { font-size: 35px;}
#tabs ul.carrusel.final li.previous, #tabs ul.carrusel.final li.next { width:100%; margin-bottom:5px;}

}

@media (max-width: 500px) {
#tabs ul.carrusel.principio, #tabs ul.carrusel.final { display:block;}
h1 {height: 84px;}
body, p, .intro p { font-size:16px; line-height:22px;}
#tabs ul.migas { display:none;}
#tabs ul.carrusel.principio { top: -15px;}
.tab_content p { margin-top: 25px;}
.tab_content h2 {font-size: 25px;}
#tabs ul.carrusel.principio li.next a { background-position: right center !important; height: 38px;width: 16px;}
#tabs ul.carrusel.principio li.previous a { background-position: left center !important; height: 38px;width: 16px;}
.jugadores .item_jugador.active:before {padding: 3px 3px 10px 3px; width: 19px;}
.acciones a.finish, .acciones a.edit, .acciones a.loop{ float: none; width:90%; }
.jugadores .item_jugador.active::before{ line-height: 17px;}

}





