@import url('https://fonts.googleapis.com/css?family=Playfair+Display+SC');
@import url('https://fonts.googleapis.com/css?family=Josefin+Sans');


html {
	overflow: hidden;
	touch-action: none;
	content-zooming: none;
}


body {
	margin: 0% 0% 0% 0%;
	padding: 0% 8% 0% 0%;
	background: #000;
	position: absolute;
	width: 100%;
	height: 100%;
}
.page {
	position: absolute;
	width: 100%;
	height: 100%;
	cursor: default;
	visibility: hidden;
	
}
.prxtitulo {
	position: absolute;
	color: #fff;
	font-family: 'Playfair Display SC', serif;
	overflow: hidden;
	line-height: 1em;
	font-weight:bold;
	font-size: 8em;
}
.prx {
	position: absolute;
	color: #fff;
	font-family: 'Josefin Sans', sans-serif;
	font-weight: bold;
	font-size: 1.2em;
	overflow: hidden;
}
.button {
	cursor: pointer;
	font-size: 1.2em;
	width: 150px;
	background-image: url("imagenes/Boton.png");
	background-repeat: no-repeat;
	background-size: contain;
	padding: 30px 10px;
	text-align: center;
	text-decoration: none;
	color: #fff;
}

.button:hover {
	cursor: pointer;
	font-size: 1.2em;
	width: 150px;
	background-image: url("imagenes/Boton-hover.png");
	background-repeat: no-repeat;
	background-size: contain;
	padding: 30px 10px;
	text-align: center;
	text-decoration: none;
	color: #fff;
}
.txt {
	color: #fff;
}

a{
	color: #f68e01;
	text-decoration: none;
	width: 150px;
	background-image: url("imagenes/Boton-hover.png");
	background-repeat: no-repeat;
	background-size: contain;
	padding: 30px 10px;
}

a:hover {
	color: #fff;
	text-decoration: none;
	width: 150px;
	background-image: url("imagenes/Boton.png");
	background-repeat: no-repeat;
	background-size: contain;
	padding: 30px 10px;
}


/*Responsive*/


@media only screen and (max-width: 980px) and (min-width: 821px) {  
  	body {
	margin: 0% 0%;
	padding: 0% 0% 0% 0%;
	background: #000;
	position: absolute;
	width: 100%;
	height: 100%;
	}
	
	.page {
	position: absolute;
	width: 50%;
	height: 50%;
	cursor: default;
	visibility: hidden;
	}
	
	.prxtitulo {
	position: absolute;
	color: #fff;
	font-family: 'Playfair Display SC', serif;
	overflow: hidden;
	font-weight:bold;
	font-size: 4em;
	}
	
	.prx {
	position: absolute;
	color: #fff;
	font-family: 'Josefin Sans', sans-serif;
	font-size: 1em;
	overflow: hidden;
	}
	
	
	.button {
	cursor: pointer;
	font-size: 1em;
	width: 150px;
	background-image: url("imagenes/Boton.png");
	background-repeat: no-repeat;
	background-size: contain;
	padding: -5px -5px;
	text-align: center;
	text-decoration: none;
	color: #fff;
}

	.button:hover {
	cursor: pointer;
	font-size: 1em;
	width: 150px;
	background-image: url("imagenes/Boton-hover.png");
	background-repeat: no-repeat;
	background-size: contain;
	padding: -5px -5px;
	text-align: center;
	text-decoration: none;
	color: #fff;
}
}  
  
 
@media only screen and (max-width: 820px) and (min-width: 621px) {  
  	body {
	margin: 0% 0%;
	padding: 0% 0% 0% 0%;
	background: #000;
	position: absolute;
	width: 30%;
	height: 30%;
	}
	
	.page {
	position: absolute;
	width: 30%;
	height: 30%;
	cursor: default;
	visibility: hidden;
	}
	
	.prxtitulo {
	position: absolute;
	color: #fff;
	font-family: 'Playfair Display SC', serif;
	overflow: hidden;
	font-weight:bold;
	font-size: 1.2em;
	}
	
	.prx {
	position: absolute;
	color: #fff;
	font-family: 'Josefin Sans', sans-serif;
	font-size: 1em;
	overflow: hidden;
	}
	
	
	.button {
	cursor: pointer;
	font-size: 0.6em;
	width: 40px;
	background-image: url("imagenes/Boton.png");
	background-repeat: no-repeat;
	background-size: contain;
	padding: -5px -5px;
	text-align: center;
	text-decoration: none;
	color: #fff;
}

	.button:hover {
	cursor: pointer;
	font-size: 0.6em;
	width: 40px;
	background-image: url("imagenes/Boton-hover.png");
	background-repeat: no-repeat;
	background-size: contain;
	padding: -5px -5px;
	text-align: center;
	text-decoration: none;
	color: #fff;
}
}  
  

@media only screen and (max-width: 768px) and (min-width: 650px) {  
  	body {
	margin: 10% 0%;
	padding: 0% 0% 0% 0%;
	background: #000;
	position: absolute;
	width: 100%;
	height: 100%;
	}
	
	.page {
	position: absolute;
	width: 100%;
	height: 100%;
	cursor: default;
	visibility: hidden;
	}
	
	.prxtitulo {
	position: absolute;
	color: #fff;
	font-family: 'Playfair Display SC', serif;
	overflow: hidden;
	font-weight:bold;
	font-size: 5em;
	}
	
	.prx {
	position: absolute;
	color: #fff;
	font-family: 'Josefin Sans', sans-serif;
	font-size: 1.3em;
	overflow: hidden;
	}
	
	
	.button {
	cursor: pointer;
	font-size: 1.3em;
	width: 150px;
	background-image: url("imagenes/Boton.png");
	background-repeat: no-repeat;
	background-size: contain;
	padding: -5px -5px;
	text-align: center;
	text-decoration: none;
	color: #fff;
}

	.button:hover {
	cursor: pointer;
	font-size: 1.3em;
	width: 150px;
	background-image: url("imagenes/Boton-hover.png");
	background-repeat: no-repeat;
	background-size: contain;
	padding: -5px -5px;
	text-align: center;
	text-decoration: none;
	color: #fff;
}
}  




@media only screen and (max-width: 620px) and (min-width: 501px) {  
  	body {
	margin: 0% 0%;
	padding: 0% 0% 0% 0%;
	background: #000;
	position: absolute;
	width: 100%;
	height: 100%;
	}
	
	.page {
	position: absolute;
	width: 50%;
	height: 50%;
	cursor: default;
	visibility: hidden;
	}
	
	.prxtitulo {
	position: absolute;
	color: #fff;
	font-family: 'Playfair Display SC', serif;
	overflow: hidden;
	font-weight:bold;
	font-size: 4em;
	}
	
	.prx {
	position: absolute;
	color: #fff;
	font-family: 'Josefin Sans', sans-serif;
	font-size: 1em;
	overflow: hidden;
	}
	
	
	.button {
	cursor: pointer;
	font-size: 1em;
	width: 150px;
	background-image: url("imagenes/Boton.png");
	background-repeat: no-repeat;
	background-size: contain;
	padding: -5px -5px;
	text-align: center;
	text-decoration: none;
	color: #fff;
}

	.button:hover {
	cursor: pointer;
	font-size: 1em;
	width: 150px;
	background-image: url("imagenes/Boton-hover.png");
	background-repeat: no-repeat;
	background-size: contain;
	padding: -5px -5px;
	text-align: center;
	text-decoration: none;
	color: #fff;
}
}  
  

@media only screen and (max-width: 500px) and (min-width: 341px) {  
  	body {
	margin: 0% 0%;
	padding: 0% 0% 0% 0%;
	background: #000;
	position: absolute;
	width: 100%;
	height: 100%;
	}
	
	.page {
	position: absolute;
	width: 50%;
	height: 50%;
	cursor: default;
	visibility: hidden;
	}
	
	.prxtitulo {
	position: absolute;
	color: #fff;
	font-family: 'Playfair Display SC', serif;
	overflow: hidden;
	font-weight:bold;
	font-size: 4em;
	}
	
	.prx {
	position: absolute;
	color: #fff;
	font-family: 'Josefin Sans', sans-serif;
	font-size: 1em;
	overflow: hidden;
	}
	
	
	.button {
	cursor: pointer;
	font-size: 1em;
	width: 100px;
	background-image: url("imagenes/Boton.png");
	background-repeat: no-repeat;
	background-size: contain;
	padding: -5px -5px;
	text-align: center;
	text-decoration: none;
	color: #fff;
}

	.button:hover {
	cursor: pointer;
	font-size: 1em;
	width: 100px;
	background-image: url("imagenes/Boton-hover.png");
	background-repeat: no-repeat;
	background-size: contain;
	padding: -5px -5px;
	text-align: center;
	text-decoration: none;
	color: #fff;
}
}  
  

@media only screen and (max-width: 375px) and (min-width: 5px)  {  
  	body {
	margin: 0% 0%;
	padding: 0% 0% 0% 0%;
	background: #000;
	position: absolute;
	width: 100%;
	height:100%;
	}
	
	.page {
	position: absolute;
	width: 100%;
	height: 100%;
	cursor: default;
	visibility: hidden;
	}
	
	.prxtitulo {
	position: absolute;
	color: #fff;
	font-family: 'Playfair Display SC', serif;
	overflow: hidden;
	font-weight:bold;
	font-size: 4em;
	}
	
	.prx {
	position: absolute;
	color: #fff;
	font-family: 'Josefin Sans', sans-serif;
	font-size: 1em;
	overflow: hidden;
	}
	
	
	.button {
	cursor: pointer;
	font-size: 0.8em;
	width: 100px;
	background-image: url("imagenes/Boton.png");
	background-repeat: no-repeat;
	background-size: contain;
	padding: -5px -5px;
	text-align: center;
	text-decoration: none;
	color: #fff;
}

	.button:hover {
	cursor: pointer;
	font-size: 0.8em;
	width: 100px;
	background-image: url("imagenes/Boton-hover.png");
	background-repeat: no-repeat;
	background-size: contain;
	padding: -5px -5px;
	text-align: center;
	text-decoration: none;
	color: #fff;
}
} 











/*Sobrevivientes*/


article {
  height: 300px;
  margin: 60px auto;
  overflow: auto;
}




/*Galeria */

.bx-wrapper{max-width: 1024px!important} /*ponemos el ancho de nuestras imágenes por defecto está al 100% */

