*{
	margin: 0; padding: 0;}
body{
	font-family: 'Open Sans', sans-serif; line-height: 1.7em;}
img a, a, a img{
	text-decoration: none;}
img{
	height: auto;}
.idioma a{
	display: block; background: #000; color: #aaa; width: 60px; text-align: center; 
	padding: 7px 0; font-size: 0.7em; font-weight: bold; 
	position: absolute; z-index: 50; top: 0; left: 0;}
.idioma a:hover{
	background: #ccc; color: #000;}
#logo{
	font-size: 180px; line-height: 120px; color: #fff; opacity: 0.6; font-weight: 600;
	padding-top: 40px; }
.index #logo{
	opacity: 0.9;}
#menu{
	background: url(../imagenes/gris.png);}
#menu ul li{
	list-style-type: none;}
#menu ul li a{
	color: #fff; padding: 20px 0; display: block;}
#menu, .index .contenido, h1{
	font-family: 'Cutive', serif;}
#menu ul .v a, #menu ul li a:hover{
	color: #aaa;}
p{
	margin: 8px 0;}
.saludo{
	color: #fff; text-shadow: 5px 5px 10px #122d34;}
.gracias{
	color: #ccc; font-size: 1.3em;}
.bio .gracias{
	color: #555; border-bottom: 3px solid #555; margin-top: 60px;}
.libro {
	width: 200px; display: inline-block; margin: 60px 55px 0 0;}
.libro img{
	box-shadow: 2px 2px 5px #777;}
.libro a{
	display: block; color: #000;}
.libro a:hover{
	color: #aaa;}
.libro a:hover img{
	 filter: grayscale(100%); opacity: 0.6;}
.libro h4{
	margin-top: 10px;}
.libro h6{
	font-size: 15px; font-weight: normal;}
h2{
	font-size: 20px; margin-top: 40px;}
h3{
	margin-top: 20px;}
.texto h2{
	color: #444; font-size: 40px;}
.texto h3{
	font-size: 20px; margin-bottom: 40px;}
.texto .frase{
	line-height: 1.8em; font-family: 'Cutive', serif; margin: 25px 0;}
footer{
	background: #272729; color: #aaa;}
address{
	font-style: normal; display: inline;}	
.borra{
	clear: both;}
#aviso{ 
	font-size: 0.7em; text-align: right;}
#aviso a{
	color: #aaa; display: inline-block; padding: 5px 0;}
iframe{
	border: none; width: 100%; display: block;}
.email a{
	display: block; width: 195px; text-align: center; padding: 7px 5px 5px 5px; color: #fff; 
	text-transform:uppercase; background: #333; margin-bottom: 50px; font-size: 0.9em;}
.email a:hover{
	background: #000;}
.firma{
	text-align: right; display: block; margin-top: 50px; }

@media only screen 
and (max-width : 550px){
.container {
	width: 100%; margin: 0 auto;}
.todo {
	margin: 0 20px;}
.biblio{
	text-align: center; background: none !important;}
#cabecera{
	background: url(../imagenes/fondo2.jpg) no-repeat center center;
    background-size: cover;}
#logo{
	padding: 20px 0; font-size: 80px; letter-spacing: -6px;}
#menu{
	font-size: 1.2em; padding: 1% 3%; background: url(../imagenes/negro.png) !important;}
#menu ul li a {
    padding: 15px 0;}
.index{
	background: url(../imagenes/fondo2.jpg) no-repeat center center; 
	background-size: cover; text-align: center;}
.biblio{
	background: url(../imagenes/fondo2.jpg) no-repeat center center; 
	background-size: cover; background-attachment:fixed; height: 80vh !important;}
.banda p{
	padding: 5%; color: #ccc;}
.index .banda{
	background: url(../imagenes/peperei.jpg) no-repeat center center;
	background-size: cover; width: 300px; height: 350px; margin: 50px auto;}
.index .saludo{
	background: url(../imagenes/fondo2.jpg) no-repeat center center; }
.index .cont{
	padding: 150px 25% 100px 15%; }
.index .saludo{
	padding: 40px 30px; font-family: 'Open Sans', sans-serif;}
.sal{
	font-size: 1.1em; line-height: 2em; margin-bottom: 30px;}
.gracias{
	color: #fff;}
.bio h2{
	font-size: 29px;}
.biblio .contenido{
	background: #fff url(../imagenes/blanco.png);}
.biblio .cont{
	padding: 60px 7%; }
.biblio .banda{
	background: #fff; padding-bottom: 10px;}
.biblio .banda p{
	color: #333; padding: 50px 7% 0 7%; }
.libro{
	width: 200px; display: block; margin: 60px auto 0 auto;}
.libro img{
	height: auto; width: 200px;}
.email a{
	margin: 30px auto 50px auto;}
.firma{
	text-align: center;}
.firma img{
	margin: 40px auto; width: 70%; max-width: 200px;}
}

@media only screen 
and (min-width : 551px)
and (max-width : 820px) {
.container {
	width: 100%; margin: 0 auto;}
.todo {
	margin: 0 40px;}
.biblio{ background: none !important;}
#cabecera{
	background: url(../imagenes/fondo2.jpg) no-repeat center center;
    background-size: cover;}
#logo{
	width: 68%; float: left; margin: 20px 0; font-size: 110px; letter-spacing: -6px;
	padding-left: 2%;}
#menu{
	width: 22%; float: right; font-size: 1.2em; text-align: left; padding: 1% 3%;}
#menu ul li a {
    padding: 15px 0;}
.index{
	background: url(../imagenes/fondo2.jpg) no-repeat center center; 
	background-size: cover; }
.biblio{
	background: url(../imagenes/fondo2.jpg) no-repeat center center; 
	background-size: cover; background-attachment:fixed; height: 80vh !important;}
.banda p{
	padding: 5%; color: #ccc;}
.index .banda{
	background: url(../imagenes/peperei.jpg) no-repeat center center;
	background-size: cover; width: 300px; height: 350px; margin: 50px auto;}
.index .saludo{
	background: url(../imagenes/negro.png); padding: 40px;}
.index .cont{
	padding: 150px 25% 100px 15%; }
.index .saludo{
	padding: 40px 15% 80px 15%;}
.sal{
	font-size: 1.2em; line-height: 2em; margin-bottom: 30px;}
.biblio .contenido{
	background: #fff url(../imagenes/blanco.png);}
.biblio .cont{
	padding: 100px 7%; }
.biblio .banda{
	background: #fff; padding-bottom: 10px;}
.biblio .banda p{
	color: #333; padding: 50px 7% 0 7%; }
.libro{
	width: 180px;}
.libro img{
	height: 280px; width: auto;}
.bi{
	margin-right: 0 !important;}}
@media only screen 
and (min-width : 551px)
and (max-width : 650px) {
#logo{
	font-size: 96px;}}
@media only screen 
and (min-width : 770px)
and (max-width : 820px) {
.bi{
	margin-right: 55px !important;}
.ter{
	margin-right: 0 !important;}
}

@media only screen 
and (min-width : 821px)
and (max-width : 999px) {
.container {
	width: 100%; margin: 0 auto;}
.todo {
	margin: 0 40px;}
#logo{
	width: 70%; float: left; margin: 20px 0; font-size: 120px; letter-spacing: -8px;}
#menu{
	width: 22%; float: right; font-size: 1.6em; text-align: left; padding: 1% 3%;}
.index{
	background: url(../imagenes/fondo2.jpg) no-repeat center center; 
	background-size: cover; height: 80vh !important;}
.biblio{
	background: url(../imagenes/fondo2.jpg) no-repeat center center; 
	background-size: cover; background-attachment:fixed; height: 80vh !important;}
.banda{
	width: 28%; float: right;}
.banda p{
	padding: 2% 10%; color: #ccc;}
.index .banda{
	background: url(../imagenes/peperei.jpg) no-repeat center center;
	background-size: cover; height: 520px; }
.index .contenido{
	width: 72%; float: left; background: #fff;}
.index .salu{
	background: url(../imagenes/negro.png);}
.index .cont{
	padding: 150px 25% 100px 15%; }
.index .saludo{
	height: 340px; padding: 100px 10% 80px 10%; }
.sal{
	font-size: 1.1em; line-height: 2em; margin-bottom: 30px;}
.gracias{
	font-size: 1.1em;}
.firma{
	margin-top: 30px;}
.biblio .contenido{
	width: 72%; float: left; background: #fff url(../imagenes/blanco.png);}
.biblio .cont{
	padding: 100px 10%; }
.biblio .banda{
	padding-top: 140px;}
.libro img{
	height: 300px; width: auto;}
.bi{
	margin-right: 0 !important;}
}
	
@media only screen 
and (min-width : 1000px){ 
.container {
	width: 100%; margin: 0 auto;}
.todo {
	margin: 0 50px;}
#logo{
	width: 70%; float: left; margin: 20px 0; letter-spacing: -10px;}
#menu{
	width: 22%; float: right; font-size: 1.6em; text-align: left; padding: 1% 3%;}
.index{
	background: url(../imagenes/fondo2.jpg) no-repeat center center; 
	background-size: cover; height: 80vh !important;}
.biblio{
	background: url(../imagenes/fondo2.jpg) no-repeat center center; 
	background-size: cover; background-attachment:fixed; height: 80vh !important;}
.banda{
	width: 28%; float: right;}
.banda p{
	padding: 2% 12%; color: #ccc;}
.index .banda{
	background: url(../imagenes/peperei.jpg) no-repeat center center;
	background-size: cover; height: 550px; }
.index .contenido{
	width: 72%; float: left; background: #fff;}
.index .salu{
	background: url(../imagenes/negro.png);}
.index .cont{
	padding: 120px 15% 100px 15%; }
.index .saludo{
	height: 330px;}
.sal{
	font-size: 1.2em; line-height: 2em; margin-bottom: 30px;}
.biblio .contenido{
	width: 72%; float: left; background: #fff url(../imagenes/blanco.png);}
.biblio .cont{
	padding: 100px 10%; }
.biblio .banda{
	padding-top: 140px;}
.libro img{
	height: 300px; width: auto;}
.ter{
	margin-right: 0 !important;}
}
@media only screen 
and (min-width : 1001px)
and (max-width : 1400px) {
.libro{
	margin-right: 45px;}
}
@media only screen 
and (min-width : 1330px){
.libro{
	width: 220px;}
.libro img{
	height: 330px; width: auto;}}
@media only screen 
and (min-width : 1001px)
and (max-width : 1230px) {
.bi{
	margin-right: 0 !important;}
.libro, .ter{
	margin-right: 55px !important;}
#logo{
	font-size: 140px;}
}