@font-face {
	font-family: 'Din';
    src: url('../fonts/original_DIN_Condensed_Bold.eot?#iefix') format('embedded-opentype'), 
         url('../fonts/original_DIN_Condensed_Bold.woff') format('woff'),
         url('../fonts/original_DIN_Condensed_Bold.ttf') format('truetype'),
         url('../fonts/original_DIN_Condensed_Bold.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}
@font-face {
	font-family: 'Bureau';
    src: url('../fonts/original_Bureau.eot?#iefix') format('embedded-opentype'), 
         url('../fonts/original_Bureau.woff') format('woff'),
         url('../fonts/original_Bureau.ttf') format('truetype'),
         url('../fonts/original_Bureau.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Din-reg';
    src: /*url('../fonts/original_Bureau.eot?#iefix') format('embedded-opentype'), */
         url('../fonts/D-DINCondensed.woff') format('woff'),
         url('../fonts/D-DINCondensed.ttf') format('truetype'),
         url('../fonts/D-DINCondensed.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

::placeholder { color: #000; opacity: 1; }
:-ms-input-placeholder { color: #000;}
::-ms-input-placeholder { color: #000;}
.rojo {color:#ec1c23;}
.bg_rojo {background-color:#ec1c23;}
.boton_off { background: #9d182f; padding: 9px 15px 5px; text-align: center; width: 120px; color:#fff; text-transform: uppercase; font-size: 16px;}
.boton_on { background: #60c3dc; padding: 9px 15px 5px; text-align: center; width: 120px; color:#fff; text-transform: uppercase; font-size: 16px;}

body, html {text-rendering: optimizeLegibility !important; -webkit-font-smoothing: antialiased !important;padding: 0; border: 0; margin:0; min-height:100%;}
body { font-family: 'Din', Sans-Serif; font-size: 16px; padding-top:40px;}
body.fondo { background:url(../img/back-top.png) center top no-repeat, url(../img/back-bottom.png) center bottom no-repeat; background-size:100% auto; }
#footer {  width:100%; max-width:1080px; margin-left: calc(50% - 540px); padding-top:60px; border-top:2px solid #000; float:left;}
#footer_login img, #footer img { padding-bottom:20px; max-width:1080px;}

#header.visibility { width:100%; max-width:1080px; margin:auto; padding-bottom:60px; border-bottom:2px solid #000;}
#header { width:100%; max-width:1080px; margin:auto; padding-bottom:60px;border-bottom:2px solid #000;}
img.logo { width:220px;}
#header.no_border { border-bottom:none !important;}
#header ul { float:right; padding-top:40px;}
#header ul li { display:inline; padding:0 10px 3px; border-left:2px solid #636066;}
#header ul li:first-child, #header ul li.no-line { border-left:0;}
#header ul li.selected a, #header ul li a:hover {color:#a90f0b;}
#header ul li a, #header ul li { color:#636066; text-transform:uppercase;font-family: 'Din', sans-serif; font-weight:700; cursor: pointer;}
#header ul li:hover > ul.submenu { display: block;}
ul, li { list-style:none;}
.contenido_bases li {    font-size: 20px;
    font-family: 'Din-reg', Sans-Serif;}
a { text-decoration:none; cursor:pointer; color:#636066;}
.bold { font-weight:bold;}
#header ul.submenu {display:none; position: absolute; background: #fff; padding: 10px; border:1px solid #333; margin-left: 300px;}

@media only screen and (max-width: 800px){
#footer { margin-left:0;}
}
	
/* LOGIN */
.cabecera_login { text-align:center; margin:40px 0 0; font-family: 'Din', Sans-Serif; text-transform:uppercase;}
.cabecera_login img { max-width:450px; width:80%;} 

.contenido_login { text-align:center; /*text-transform:uppercase;*/ width:100%; max-width:1080px; margin:auto; }

.contenido { text-align:center; width:100%; max-width:808px; margin-top:80px; padding: 10px 20px 100px; height: auto; float: left; margin-left: calc(50% - 424px);}
.contenido_login img { max-width:1080px; width:94%; padding-bottom: 40px; vertical-align: bottom; margin: auto;}

#index form {float: right; /*margin-top: 50px;*/}
form { max-width:540px; width:94%; /*float:right;*/ margin:auto;  }
input, textarea { border-bottom:2px #00acc5 solid; width:100%; border-top:0; border-left:0; border-right:0; background:none; text-align:left; padding:10px 0; font-size: 18px; font-family: 'Din-reg', Sans-Serif;}
#index {font-size: 12px; color:#000;}
.user_pass input { font-size:26px;}

textarea:focus, input:focus{  outline: none;}

#index { background-image:url(../img/bg-login.png); background-size:cover; background-position:bottom; background-repeat:no-repeat;}

.login_nuevo { max-width:800px; margin:0 auto 130px;}
.participa { float:left; width: 220px; text-align:left; font-size: 42px; letter-spacing: 2px; text-transform: uppercase; line-height: 44px; color: #666; margin-top:10px;}

.builders { text-align:center; font-size: 42px; letter-spacing: 2px; text-transform: uppercase; line-height: 46px; color: #222; margin:2px 0;}

@media only screen and (max-width: 1080px){
	.contenido { margin-left: 0;width: calc(100% - 40px);}
	.contenido_login { background-size:100% 260px;}
	.contenido_login img { padding-bottom: 60px; /*bottom:180px; vertical-align: bottom;*/}
	.participa { margin-left:3%; text-align: left}
	form { margin-right:3%; margin-bottom:50px;}
}

#perfect-venue img { max-width: 32%;}

/* ADMIN */

#admin .contenido { margin-top: 10px;}
form.admin { background:#fff; padding:15px;}
form.admin input, form.admin textarea { background:#f6f6f6; margin-bottom: 15px;}
form.admin input.enviar { border:0; background:#090; color:#fff; width:150px; border-radius:28px; text-transform:uppercase; font-size:12px; cursor:pointer; text-align:center;}
form.admin input.enviar:hover { background:#060;}
form.admin select {width: 100%;
    padding: 12px;
	border: 2px solid #00acc5; margin-bottom: 15px;}
.hero_admin { float:right; margin-top:30px;}
.hero_admin a { background:#096; padding:6px 15px; margin:15px 5px 0; border-radius:20px; color: #FFF;}


/* VISIBILITY */

.cabecera_visibility { text-align:right; margin:40px 0 0;}
.cabecera_visibility img { max-width:450px; width:80%; }
.item {width:200px;height:200px;margin:1px; background-size:cover; background-position:center; float:left; background-color:#ccc;}
.hero_image {width:100%; background:#eafbff; height:500px; max-height:calc(95vh - 250px); margin:15px 0;float:left; background-size:contain; background-position:center; background-repeat:no-repeat;}
#hero1, #hero2, #hero3, #hero4, #hero5, #hero6, #hero7, #hero8, #hero9, #hero10, #hero11, #hero12, #hero13, #hero14, #hero15, #hero16, #hero17, #hero18, #hero19, #hero20, #hero21, #hero22, #hero23, #hero24, #hero25, #hero26, #hero27, #hero28, #hero29, #hero30, #hero31, #hero32, #hero33, #hero34, #hero35, #hero36, #hero37, #hero38, #hero39, #hero40, #hero41, #hero42, #hero43, #hero44, #hero45, #hero46, #hero47, #hero48, #hero49, #hero50, #hero51, #hero52, #hero53, #hero54, #hero55, #hero56, #hero57, #hero58, #hero59, #hero60, #hero61, #hero62, #hero63, #hero64, #hero65, #hero66, #hero67, #hero68, #hero69, #hero70 { display:none; float:left; width:100%; }
#hero { text-align:left; color:#636066; margin:6px 6px 20px; float:left; width: calc(100% - 12px);}
.hero_name {color:#900707;text-transform:uppercase;font-family: 'Din', Sans-Serif;}
.hero_left { width:50%;}
.hero_cincuenta, .hero_mes { float:right;}
.hero_cincuenta img, .hero_mes img { height:90px; width:auto; margin-left:7px; padding-bottom: 0;}
#close1, #close2, #close3, #close4, #close5, #close6, #close7, #close8, #close9, #close10, #close11, #close12, #close13, #close14, #close15, #close16, #close17, #close18, #close19, #close20, #close21, #close22, #close23, #close24, #close25, #close26, #close27, #close28, #close29, #close30, #close31, #close32, #close33, #close34, #close35, #close36, #close37, #close38, #close39, #close40, #close41, #close42, #close43, #close44, #close45, #close46, #close47, #close48, #close49, #close50  { position:absolute; width:30px; height:30px; margin-left:750px; margin-top:30px; cursor:pointer;}

.semanales #close1, .semanales #close2, .semanales #close3, .semanales #close4, .semanales #close5, .semanales #close6, .semanales #close7, .semanales #close8, .semanales #close9, .semanales #close10, .semanales #close11, .semanales #close12, .semanales #close13, .semanales #close14, .semanales #close15, .semanales #close16, .semanales #close17, .semanales #close18, .semanales #close19, .semanales #close20, .semanales #close21, .semanales #close22, .semanales #close23, .semanales #close24, .semanales #close25, .semanales #close26, .semanales #close27, .semanales #close28, .semanales #close29, .semanales #close30, .semanales #close31, .semanales #close32, .semanales #close33, .semanales #close34, .semanales #close35  { margin-left:1040px;}

.menu_contenido { text-align:left;color:#636066; font-size:20px;text-transform:uppercase; margin:10px 0;overflow-wrap: break-word;}
.menu_contenido span { border-right:1px solid #000; padding:0 5px; height:20px;}
.menu_contenido span.current { color:#a54018; }
.menu_contenido span:last-child { border-right:none;}

.ganadoras { float:right;}
.ganadoras span { border-right:none;}
 
@media only screen and (max-width: 800px){
	.hero_cincuenta img, .hero_mes img { display: none;}
	.cabecera_visibility { margin:0 0;}
	.cabecera_visibility img { padding:20px;}
}
 
/* LISTADO */

.listado { max-width:1080px; margin:auto; width:94%;}
.listado_top { background-image:url(../img/listado_top.png); background-size:90% auto; background-position:bottom; background-repeat:no-repeat; height:80px; width:100%;}
.listado_content { height:auto; width:100%; padding:100px 0;}
.listado_content table { width:74%; margin:auto; font-size:20px; text-transform:uppercase;}
.listado_content table tr td { border-bottom:1px solid #333; padding: 10px 0 0; color:#636066}
.listado_content table tr.listado_titular td { padding:20px 0; margin-bottom:10px;}
.listado_content table tr td.derecha { text-align:right; color:#900707;}
.listado_bottom { background-image:url(../img/listado_bottom.png); background-size:90% auto; background-position:top; background-repeat:no-repeat; height:92px; width:100%;}

.listado_content_puntos { background-image:url(../img/listado_content.png); background-size:90% auto; background-position:bottom; background-repeat:repeat-y; height:auto; width:100%; padding-bottom:50px;}
.listado_content_puntos table { width:84%; margin:auto; font-size:16px; text-transform:uppercase;}
.listado_content_puntos table tr td { border-bottom:1px solid #333; padding: 10px 0 0; color:#636066}
.listado_content_puntos table tr.listado_titular td { padding:20px 0; margin-bottom:10px;}


/* GANADORES */
.contenido_ganadores { text-align:center;  width:100%; max-width:1080px; margin:auto;color:#636066; padding: 10px 20px 100px; height: auto; float: left; margin-left: calc(50% - 560px);}
.contenido_ganadores .unidad { width:258px; margin:6px; float:left;min-height: 410px;}
.contenido_ganadores .unidad .item { width:258px;height:258px; background-size:cover; background-position:center; background-color:#ccc; margin-bottom:15px;}
.contenido_ganadores .menu_contenido { text-align:left;}
.contenido_ganadores .unidad .text { width:258px; text-align:left; color:#636066; margin-left:6px;}


@media only screen and (max-width: 1080px){
	.contenido_ganadores { margin-left: 0;width: calc(100% - 40px); }
	.vota_img img { display:none;}
}

/* MENSUALES */

#hero_mensual { width:31%; height:auto; text-align:left; /*float:left; */margin:1%; padding-bottom: 70px;display:inline-block;}

.mensual_image { /*width:fit-content;*/ margin:auto; height: 300px; background-size: cover; background-position: center;/*padding:92px 102px; background:url(../img/cuadro-left.png) left top no-repeat, url(../img/cuadro-right.png) right top no-repeat, url(../img/cuadro-repeat.png) left top repeat-x, #a57836; background-size: auto 640px;*/}
.mensual_image img { height:350px; width:100%; max-width:100%; margin:auto;}
.like { text-align:center; width:80px; height:40px; position:absolute; background-repeat:no-repeat; color:#666; padding:36px 0 0; background-size:34px; margin:270px 0 0 190px;font-family: 'Din', Sans-Serif; background-position-x: center;}
.like.over:hover { background-image:url(../img/like.png) !important;}
.vota {color:#900707; font-size:40px;  font-family: 'Din', Sans-Serif;}
.vota_img img { width:40px; -webkit-animation: zoom 5s ease-out infinite;
    -moz-animation: zoom 5s ease-out infinite;
    -o-animation: zoom 5s ease-out infinite;
    animation: zoom 5s ease-out infinite;}
.vota_mes { font-size:40px; text-transform: uppercase; text-align:left; color:#636066;font-family: 'Din';}
.vota_mes.primero { margin:30px 0 -40px;}
.vota_mes.segundo { padding-bottom:10px; border-bottom:2px solid #000;}
.seleccion_meses { text-align:left; margin: 50px 0 20px; font-size:20px;font-family: 'Din';}
.seleccion_meses a.selected { color:#900707;}

  
 /* ON OFF */
 .on_off { display:inline-block;}
 .on_off img { width:30%; margin:1.5%;}
.on_off img:hover { opacity: 0.8;} 

@media only screen and (max-width: 800px){
	 .on_off img { width:94%; margin:3%;}
}

@-webkit-keyframes zoom{0%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}33%{-webkit-transform:scale(0.8);-moz-transform:scale(0.8);-ms-transform:scale(0.8);-o-transform:scale(0.8);transform:scale(0.8)}66%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}100%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}}@-moz-keyframes zoom{0%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}33%{-webkit-transform:scale(0.8);-moz-transform:scale(0.8);-ms-transform:scale(0.8);-o-transform:scale(0.8);transform:scale(0.8)}66%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}100%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}}@-o-keyframes zoom{0%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}33%{-webkit-transform:scale(0.8);-moz-transform:scale(0.8);-ms-transform:scale(0.8);-o-transform:scale(0.8);transform:scale(0.8)}66%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}100%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}}@keyframes zoom{0%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}33%{-webkit-transform:scale(0.8);-moz-transform:scale(0.8);-ms-transform:scale(0.8);-o-transform:scale(0.8);transform:scale(0.8)}66%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}100%{-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);transform:scale(1)}}


/* BASES */

.cabecera_bases { text-align:center; margin:40px 0 0;}
.cabecera_bases img { max-width:1080px; width:80%; margin: 80px 0 30px;}
.contenido_bases {max-width:1080px; margin:auto; color:#3d322d;  width:94%; margin-top:60px;}
.contenido_bases p { margin-bottom:30px; font-size: 20px; font-family: 'Din-reg', Sans-Serif;}
.titular_bases { font-size:42px; text-align:left; font-family: 'Din', Sans-Serif; color:#ec1c23;padding-top:40px;}
.premio {/*background-image:url(../img/fondo_premios.png); background-size: contain; background-repeat:no-repeat; padding-top:180px;*/}
.premio h3 { font-family: 'Din', Sans-Serif; text-transform:uppercase;font-size:36px; margin-bottom:0;}
a.rojo { color:#a54018;}


/* MENU MOVIL */

.bocadillo, .menu_responsive { display:none;}
.bocadillo, .cerrar { position:absolute;top:35px;right:25px; height:18px; width:20px;background-size:cover; cursor:pointer;}
.bocadillo { background-image: url(../img/bocadillo.svg); }
.cerrar { background-image: url(../img/close.svg); }
.menu_responsive { height:100vh; width:100vw; top:0;left:0;position:fixed; background:#fff; text-align:center; padding-top:30vh;}
.menu_responsive a {color:#000; font-size:28px;text-transform:uppercase;}

.menu_movil { padding:0;margin:0;}

@media only screen and (max-width: 800px){
	.bocadillo {display:block;}
	#header ul { float:inherit;}
	#header ul li { border-left:none;}
	ul.menu { display:none;}
 .item, .vota, .vota_desc, .hero_image {/* width: calc(100% - 40px);*/ width:100%;}
 .vota_mes { width:100%;}
 .vota_mes img { width:30%; display: none;}
#close1, #close2, #close3, #close4, #close5, #close6, #close7, #close8, #close9, #close10, #close11, #close12, #close13, #close14, #close15, #close16, #close17, #close18, #close19, #close20, #close21, #close22, #close23, #close24, #close25, #close26, #close27  { margin-left:86%;}
 img.logo { padding-left:10px;width: 220px;}
 .contenido_ganadores .unidad { width: 100%; margin:0;}
 .contenido_ganadores .unidad .item { width: 100%;}
 /* mensuales */
 #hero_mensual { width: 100%; height: auto;}
 .mensual_image {padding: 35px 35px; background-size: cover;}
 .mensual_image img { max-height: 170px;}
 /*input[type=submit] { margin-left:-60px !important;}*/
 .like {right:10px;}
}

.modal { display:none; position:fixed; inset:0; z-index:9999; }
.modal.is-open { display:block; }
.modal__backdrop { position:absolute; inset:0; background:rgba(0,0,0,.6); }

.modal__content {
  position:relative;
  width:min(980px, 92vw);
  max-height: 88vh;
  margin: 6vh auto;
  background:#fff;
  border-radius:14px;
  overflow:auto;
  padding: 18px;
}

.modal__close{
  position:absolute; right:14px; top:10px;
  font-size:28px; line-height:1;
  border:0; background:transparent; cursor:pointer;
}

.modal__grid{ display:grid; grid-template-columns: 1.1fr .9fr; gap:16px; }

.modal__image{
  min-height: 420px;
  background:#eafbff;
  background-size:contain;
  background-position:center;
  background-repeat:no-repeat;
  border-radius:10px;
}

.modal__title{ margin:0 0 10px; text-transform:uppercase; color:#900707; }
.modal__meta{ color:#636066; font-size:16px; line-height:1.45; margin-bottom:10px; }
.modal__desc{ color:#333; font-size:16px; white-space: pre-wrap; }

.modal__actions a{
  display:inline-block;
  background:#096;
  color:#fff;
  padding:8px 12px;
  border-radius:18px;
  margin-right:8px;
  text-transform:uppercase;
  font-size:12px;
}

.modal__actions a.danger{ background:#C00; }
@media (max-width: 800px){
  .modal__grid{ grid-template-columns: 1fr; }
  .modal__image{ min-height: 260px; }
}