/* GLOBALES */
@font-face{
	font-family:'Code Pro';
	src: url("media/fonts/code-pro-normal.eot");
	src: url("media/fonts/code-pro-normal.eot?#iefix") format("embedded-opentype");
	src: url("media/fonts/code-pro-normal.otf") format("truetype"), url("media/fonts/code-pro-normal.woff") format("woff"), url("media/fonts/code-pro-normal.svg#wf") format("svg");
	font-weight:400;
}
@font-face{
	font-family:'Code Pro';
	src: url("media/fonts/code-pro-bold.eot");
	src: url("media/fonts/code-pro-bold.eot?#iefix") format("embedded-opentype");
	src: url("media/fonts/code-pro-bold.otf") format("truetype"), url("media/fonts/code-pro-bold.woff") format("woff"), url("media/fonts/code-pro-bold.svg#wf") format("svg");
	font-weight:700;
}

html { box-sizing: border-box; }
*, *:before, *:after { box-sizing: inherit; }
body{ margin:0; padding:0; background:#fff;  font:normal 4vw 'Code Pro',Arial,sans-serif; color:#fff; background:#fff url("media/fondo-comun.jpg") top right repeat; background-size:100%; }
a{ text-decoration:none; }
input, textarea{ display:inline-block; border:0; background-color:#2d2d2d; color:#8de8f3; font:normal 90% 'Code Pro',Arial,sans-serif; padding:1.6% 2%; }
button, .button{ display:inline-block; border:0; background-color:red; font:700 90% 'Code Pro',Arial,sans-serif; line-height:130%; padding:1.4% 3%; text-align:center; color:white; text-transform:uppercase; cursor:pointer; }
strong{ font-weight:700; }

nav{ background-color:red; text-align:center; width:100%; margin:0 auto 0 auto; }
nav a{ display:inline-block; vertical-align:middle; padding:3% 2.5%; color:white; text-transform:uppercase; font-size:100%; font-weight:700; }
nav a.marcado{ color:black; }

header{ background-color:black; width:100%; text-align:center; padding:5% 0; }
header .logo-thevoice{ display:inline-block; width:28%; padding-bottom:15%; background:url("media/logo-thevoice-blanco.png") center left no-repeat; background-size:contain; vertical-align: middle; border-right:1px solid rgba(255,255,255,0.5); margin-right:5%; } 
header .logo-clubpremier{ display:inline-block; width:45%; padding-bottom:6%; background: url("media/logo-clubpremier-blanco.png") center right no-repeat; background-size:contain; vertical-align: middle; }

main{ width:90%; margin:5%; background-color:black; padding:2% 7%; text-align:center; }

.socials .fb{ background-position:0 0; background-repeat:no-repeat; background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20x%3D'0px'%20y%3D'0px'%20width%3D'100%25'%20height%3D'100%25'%20viewBox%3D'0%200%2090%2090'%3E%3Cpath%20d%3D'M90,15.001C90,7.119,82.884,0,75,0H15C7.116,0,0,7.119,0,15.001v59.998%20%20%20C0,82.881,7.116,90,15.001,90H45V56H34V41h11v-5.844C45,25.077,52.568,16,61.875,16H74v15H61.875C60.548,31,59,32.611,59,35.024V41%20%20%20h15v15H59v34h16c7.884,0,15-7.119,15-15.001V15.001z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E") }
.socials .tw{ background-position:0 0; background-repeat:no-repeat; background-image:url("data:image/svg+xml,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20%20x%3D'0px'%20y%3D'0px'%20viewBox%3D'0%200%20612%20612'%20width%3D'100%25'%20height%3D'100%25'%3E%3Cpath%20d%3D'M612,116.258c-22.525,9.981-46.694,16.75-72.088,19.772c25.929-15.527,45.777-40.155,55.184-69.411%20%20%20%20c-24.322,14.379-51.169,24.82-79.775,30.48c-22.907-24.437-55.49-39.658-91.63-39.658c-69.334,0-125.551,56.217-125.551,125.513%20%20%20%20c0,9.828,1.109,19.427,3.251,28.606C197.065,206.32,104.556,156.337,42.641,80.386c-10.823,18.51-16.98,40.078-16.98,63.101%20%20%20%20c0,43.559,22.181,81.993,55.835,104.479c-20.575-0.688-39.926-6.348-56.867-15.756v1.568c0,60.806,43.291,111.554,100.693,123.104%20%20%20%20c-10.517,2.83-21.607,4.398-33.08,4.398c-8.107,0-15.947-0.803-23.634-2.333c15.985,49.907,62.336,86.199,117.253,87.194%20%20%20%20c-42.947,33.654-97.099,53.655-155.916,53.655c-10.134,0-20.116-0.612-29.944-1.721c55.567,35.681,121.536,56.485,192.438,56.485%20%20%20%20c230.948,0,357.188-191.291,357.188-357.188l-0.421-16.253C573.872,163.526,595.211,141.422,612,116.258z'%20fill%3D'%23FFFFFF'%2F%3E%3C%2Fsvg%3E"); }

@media screen and (min-width:1025px){
	body{ font-size:1.8vw }
	header{ padding:2% 10%; width:90%; margin:0 auto; }
	main{ margin:0 5%; padding: 2% 10% }
	nav{ width:90%; margin-top:2%; }
	nav a{ font-size:90%; padding:1% 1.5%; }
}


/* HOME */
.phome{ background: url("media/fondo-home.jpg") 90% 65% no-repeat; background-size:110%; }
.phome main { margin-top:2%; padding:0; background-color:transparent;}
.phome nav{ position:absolute; top:0; left:0; width:100%;  }
.phome header{ background-color: transparent; padding-bottom:0; }
.phome header .logo-thevoice{ display:inline-block; width:60%; padding-bottom:35%;  background:url("media/logo-thevoice-negro.png") center center no-repeat; background-size:85%; margin-top:7%; margin-bottom:-3%; } 
.phome header .logo-clubpremier{ display:inline-block; width:70%;padding-bottom:12%;  background:url("media/logo-clubpremier-negro.png") center center no-repeat; background-size:100%; margin:0 }
.phome .subtitulo{ display:inline-block; width:80%; font-size:100%; color:#000; text-transform:uppercase; margin-top:0; }
.phome .acceso{ width:120%; background-color:black; padding:7% 10%; margin-top:60%; margin-left:-10%;}
.phome .acceso .intro{ text-transform:uppercase; font-size:85%; border-bottom:1px solid #333; background-color:black; position:absolute; width:45%; padding: 3%; top:47%; left:50%;}
.phome .acceso .intro strong{ color:red; }
.phome .acceso .registro{ text-align:left; }
.phome .acceso .registro .button{ display:inline-block; width:100%; color:#fff; background-color:red; text-transform:uppercase; vertical-align:top; padding:1.4% 3%; text-align:center; font-size:80%; font-weight:400;}
.phome .acceso .ingreso{ margin-top:5%; text-align:left; }
.phome .acceso .ingreso .texto{ text-transform:uppercase; font-size:70%;}
.phome .acceso .ingreso input{ width:65%; margin-top:1%;}
.phome .acceso .ingreso button{ width:34%; margin-top:1%; }
.phome .acceso .ingreso .texto.blink{ -webkit-animation: blink-animation 1s steps(5, start) infinite; animation: blink-animation 1s steps(5, start) infinite; }
.phome .acceso .ayuda{ font-size:55%; text-transform:uppercase; margin-top:5%; opacity:0.7}
.phome .acceso .ayuda a{ color:red; display:block; font-weight:700; }

@media screen and (min-width:1025px){
	.phome{ background-position:0 0; background-size:100%; }
	.phome nav{ position:relative; width:70%; }
	.phome nav a{font-size:70% }
	.phome nav a:first-child{ display:none }
	.phome header{ width:70%; padding:0; margin:0 auto;  }
	.phome header .logo-thevoice{ width:100%; margin-top:3%; background-size:60%; padding-bottom:40%; }
	.phome header .logo-clubpremier{ width:100%; }
	.phome main{ width:45%; margin-left:50%; padding-top:2%;}
	.phome .subtitulo{ padding:3%; }
	.phome .acceso{ margin:0; width:100%; padding:7%}
	.phome .acceso .intro{ position:relative; padding-bottom:5%; left:0; width:100%; padding:0 0 5% 0;} 
	.phome .acceso .registro{ margin-top:5% }
	.phome .acceso .registro .button{ font-size:90% }
	.phome .acceso .ingreso .texto{ font-size:80% }
	.phome .acceso .ayuda{ font-size:45% }
	.phome .acceso .ayuda a{ display:inline; }
}


/* INSCRIPCION */
.pform .subtitulo{ font-size:100%; color:red; text-transform:uppercase; margin-top:6%; text-align:left; font-weight:700; }
.pform .formulario{ text-align:left; text-transform:uppercase; font-size:80%; }
.pform label{ display:block; margin-top:1%; }
.pform input.opcion{ display:none }
.pform input.opcion + label:before { width:6%; height:130%; display: inline-block; background:#2d2d2d; content:"\00a0"; font:700 200%/60% sans-serif; margin: 0 10px 0 0; padding:0; vertical-align: top; cursor:pointer; }
.pform input.opcion:checked + label:before { background:#2d2d2d; color:#fff; content:"\2022"; text-align: center; cursor:pointer; }
.pform input.opcion + label{ cursor:pointer; }
.pform textarea{ width:100%; height:150px; margin-top:1%; }
.pform label a{ color:red }
.pform .tyc{ font-family:Arial,sans-serif; font-size:50%; text-transform:initial; overflow:auto; height:250px; margin-top:5%; scrollbar-face-color: #000; scrollbar-shadow-color: #000; scrollbar-highlight-color:#000; scrollbar-3dlight-color: #000; scrollbar-darkshadow-color: #000; scrollbar-track-color: #fff; scrollbar-arrow-color: #000; }
.pform .tyc::-webkit-scrollbar{ width: 8px; height: 8px; }
.pform .tyc::-webkit-scrollbar-track{ background: rgb(90, 90, 90); }
.pform .tyc::-webkit-scrollbar-thumb{ background: rgb(255, 0, 0); }
.pform .tyc a{ color:red }
.pform .enviar{ text-align:center; margin-top:2%; }
.pform .enviar button{ padding:3% 8%; }
.pform .enviar .errores{ font-size:80%; color:red; text-transform:uppercase; font-weight:700; -webkit-animation: blink-animation 1s steps(5, start) infinite; animation: blink-animation 1s steps(5, start) infinite; }
.pform .enviar button .spinner{ display:none }
.pform .enviar button.enviando .spinner{ display:inline-block; margin: 5px; height: 25px; width: 25px; -webkit-animation: rotar-spinner 0.8s infinite linear; animation: rotar-spinner 0.8s infinite linear; border: 8px solid #fff; border-right-color: transparent;  border-radius: 50%; vertical-align:middle; }
@keyframes rotar-spinner { 0%    { transform: rotate(0deg); } 100%  { transform: rotate(360deg); } }
@-webkit-keyframes rotar-spinner { 0%    { transform: rotate(0deg); } 100%  { transform: rotate(360deg); } }
@keyframes blink-animation { to { visibility: hidden; } }
@-webkit-keyframes blink-animation { to { visibility: hidden; } }

@media screen and (min-width:1025px){
	.pform header{ text-align:left; }
	.pform .subtitulo{ margin-top:4% }
	.pform textarea{ height: 50px }
	.pform input.opcion + label:before{ width:3%; }
	.pform .tyc{ font-size:70%; height:70px; margin-top:2%; padding-left:4%;}
	.pform .enviar button{ padding:1.5% 4%}
}

/* GRACIAS */
.pgracias .subtitulo{ padding:5% 2%; font-size:100%; text-transform:uppercase; font-weight:700; }
.pgracias .subtitulo strong{ color:red; font-size:170%; }
.pgracias .socials{ font-size:80%; text-transform:uppercase;  font-weight:400 }
.pgracias .socials span{ height:5%; vertical-align:middle; }
.pgracias .socials div{ width:20px; height:20px; display:inline-block; cursor:pointer; margin-left:10px; vertical-align:middle;}
.pgracias .foto{ overflow:hidden; }
.pgracias .foto img{ width:200%;  }

@media screen and (min-width:1025px){
	.pgracias .subtitulo{ display:none }
	.pgracias .socials{ font-size:100%; position:absolute; bottom:10%; right:22%; }
	.pgracias .foto{ width:120%; margin: 2% 0 0 -10%;  }
	.pgracias .foto img{ width:100% }
}

/* PREMIOS */
.ppremios .subtitulo{ text-transform:uppercase; margin-top:7%; font-size:130%}
.ppremios .subtitulo em{ color:red; font-style:normal; display:block;}
.ppremios .button{ margin-top:5%; }
.ppremios .premios{ width:118%; margin-left:-9%; margin-bottom:-11%; }

@media screen and (min-width:1025px){
	.ppremios .subtitulo{ margin-top:3%; }
	.ppremios .subtitulo br{ display:none }
	.ppremios .premios{ width:128.5%; margin-left:-14.3%; margin-bottom:-6%; }
}

/* LEGALES */
.plegales .texto h1, .plegales .texto h2{ text-align:center }
.plegales .texto{ text-align:left; margin:10% 0; font-size:70%; }
.plegales .texto li{ list-style:none; margin-top:3%; }
.plegales .texto a{ color:red; font-weight:700; }

@media screen and (min-width:1025px){
	.plegales .texto{ font-size:60%; margin:6% 0; }
}