    
		body{
			background-attachment: fixed;
		background-color: #6F3F1A;
		background-image: url("../img/fondo_2.jpg");
		background-position: center center;
		background-repeat: no-repeat;
		background-size: cover;
		
		}
body{
overflow-x: hidden;
}
	h2, h3 {
			font-family: 'Metamorphous', cursive;
			color: #fff;
		}	
			
		.top-bar li {
			font-family: 'Metamorphous', cursive;
			color: #6F3F1A;
		}
		.top-bar a:hover{
			text-shadow: 0 0 2px #222;
		}
		p {
			font-family: 'Della Respira', serif;
			color: white;
			font-size: 1.15em;
			line-height: 1.5em;
		}	
		h2 {
		font-size: 2.25em;
		line-height: 2em;
		margin-top:2em;	
	}

	h3 {
		font-size: 1.55em;
		line-height: 1.85em;
		margin-top:1.25em;
	}

 .no-js .top-bar {
  display: none;
}

@media screen and (min-width: 40em) {
  .no-js .top-bar {
    display: block;
  }
	
  .no-js .title-bar {
    display: none;
  }
}
@media screen and (max-width: 40em){
			
	.title-bar .menu-icon.dark{
		margin-left: auto; 
			margin-right: 0;
		}
	
		}
	.title-bar p{
		font-size: 1.5em;
		color: #6F3F1A;
		margin-top: 0.55em;
		font-weight: normal;
		text-transform: uppercase;
		margin-left: 0.5em;
		font-family: 'Metamorphous', cursive;
	}
	.top-bar,
		.title-bar,
		.top-bar-right,
		.top-bar-left,
		.menu-text,
		ul.menu,
		.topbar-right li{
			background:#fff;
			}
		.top-bar li a{
			color:#584D3A;
		}
		.top-bar{
			text-align: center;
			
		}
		.top-bar li{
			background-image: url(../img/menu-fondo.png);
			background-position: center center;
			background-repeat: no-repeat;
			background-size: contain;
			padding: 0.5em 1.2em;
			max-width: 7em;
		}
		@media screen and (max-width:40em){
			.top-bar li{
				padding-left: 50%;
				background-image: none;
				padding-top: 0;
				padding-bottom: 0;
				
			}
		}
		
		#ppal2 {
			color: #fff;
			background: linear-gradient(180deg, rgba(255,255,255,0.7) 19%, rgba(0,0,0,0.5) 100%);
			padding-top: 2em;
			padding-bottom: 0;
			padding-left: 0;
			padding-right: 0;
		}
		
		footer h2{
			font-size: 1.5em;
			font-family: 'Della Respira', serif;
			line-height: 1.9em;
			color: #6F3F1A;
			font-weight: bold;
			margin-top: -0.5em;
		}
		
		footer {
			padding-top: 2em; 
			/* background-color: rgba(255,255,255,0.5); */
			background: linear-gradient(180deg, rgba(255,255,255,0.7) 25%, rgba(255,255,255,0.2) 100%);
		}
		
		.contenedor-central{
			 background-color: rgba(0,0,0,0.4);
		}
		.jannus{
			text-shadow: 0 0 3px #fff;
			text-transform: uppercase;
			font-family: 'Metamorphous', cursive;
		}
		.jannus-video{

			border: 4px solid #fff;
			margin-bottom: 2em;
		}
	
		.contenedor-callout{
			padding: 3.5em;
			border: none; 
			background: transparent;
		}
		@media screen and (max-width:40em){
			.contenedor-callout{
				padding:1.5em;
			}
			.sticky{
				top:0;
				position: absolute;
				width: 100%;
			} 
			
			#ppal2{
				margin-top:4em;
			}
		} 
		.button.secondary, .button.secondary.disabled, .button.secondary[disabled], .button.secondary.disabled:hover, .button.secondary[disabled]:hover, .button.secondary.disabled:focus, .button.secondary[disabled]:focus {
    background-color: #6F3F1A;
    color: #fefefe;
		margin-top: 1em;
	border: 1px solid #222;}
  .button.secondary:hover, .button.secondary:focus {
    background-color: #894D20;
    color: #fefefe; }
		#ppal2 .logo-ppal{
			width: 100%; 
			max-width: 396px; 
			height: auto;
		}
		.foto-bio{
			 margin-left: 1em;
		}
@media screen and (max-width:50em){
	.foto-bio{
		width: 100%;
		height: auto;
	}
}
		
#ppal2 .foto-runas{
			 width: 100%; 
			max-width: 212px; 
			height: auto;
		}
@media screen and (max-width:64em){
	#ppal2 .logo-ppal{
		width: 80%;
		height: auto;
	}
	#ppal2 .foto-runas{
		width: 80%;
		height: auto;
	}
}
@media screen and (max-width:40em){
	#ppal2 .logo-ppal{
		width: 100%;
		max-width: 350px;
		height: auto;
		padding: 0 1.5em;
	}
	#ppal2 .foto-runas{
		width: 212px;
		height: auto;
	}
}
		
		footer i{
			color: #684B35;
			margin: 0 0.5em;
			
		}
		footer i:hover,
			footer i:focus{
			text-shadow: 0 0 2px #684B35;
		}
.copyright{
	 padding-top: 1.5em; 
	padding-bottom: 1.5em; 
	border-top: 1px solid rgba(0,0,0,0.5);
}
.copyright a{
	color: #222;
	text-decoration: none;
	font-weight: bold;
}
.copyright a:hover,
.copyright a:focus{
	text-shadow: 0 0 3px #fff;
}
footer .mapa li{
	font-family: 'Della Respira', serif;
			font-size: 1.15em;
			line-height: 1.95em;
	
}
footer .mapa li a{
	text-decoration: none;
	border-bottom: 1px solid #684b35;
	color: #684B35;
	font-weight: bold;
	padding-top:0.35em;
	padding-bottom: 0.25em;
}
footer .mapa li a:hover,
footer .mapa li a:focus{
	
	color: #684B35;
	border-bottom: 1px solid #fff;
	font-weight: bold;
}
.pic-jannus{
	width: 100%;
	height: auto;
}
#canciones h3{
	line-height: 1em;
}
.subtit_autores{
	font-size: 0.85em;
	line-height: 1.55em;
}
.label{
	background: #f5f5f5;
	color: #222;
	font-family: 'Della Respira', serif;
}
.videos{
	border: 2px solid #fff;
}
.fotos{
	width: 100%;
	height: auto;
}
.fotos2{
	height: 300px;
	max-height: 300px;
	width: auto;
}
footer .contacto a{
	padding-top: 0.55em;
	padding-bottom: 0.25em;
}
.copyright br{
	display: none;
}
@media screen and (max-width:64em){
	.copyright .separador {
		display:none;
	}
	.copyright br{
		display: inline;
	}
}

	  .video-container {
  position: relative;
  padding-bottom: 56.25%;
}

.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.video-container .video {
  aspect-ratio: 16 / 9;
  width: 100%;
}
.copyright .arriba2{
	display:none;
}
@media screen and (max-width:40em){
	.copyright .arriba2 {
		display:block;
	}
	.copyright .arriba1{
		display:none;
	}
}
.playlist{
	box-shadow: 0 0 5px 2px #fff;
}
.separador{
	background: linear-gradient(90deg, rgba(255,255,255,0.4) 0%, rgba(255,255,255,1) 50%, rgba(255,255,255,0.4) 100%);
	height: 1px;
	width: 90%;
	margin:0 auto;
	margin-top:1.5em;
}
.contenedor-callout a {
	color: white;
	text-decoration: underline;
}
.contenedor-callout a:hover,
.contenedor-callout a:focus{
	color: white;
	text-decoration: underline;
	background-color: rgba(0, 0, 0, 0.5);
}