/*! HTML5 Boilerplate v4.3.0 | MIT License | http://h5bp.com/ */

/*
 * What follows is the result of much research on cross-browser styling.
 * Credit left inline and big thanks to Nicolas Gallagher, Jonathan Neal,
 * Kroc Camen, and the H5BP dev community and team.
 */

/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */

html,
button,
input,
select,
textarea {
    color: #222;
}

html {
    font-size: 1em;
    line-height: 1.4;
}

/*
 * Remove text-shadow in selection highlight: h5bp.com/i
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */

::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}

::selection {
    background: #b3d4fc;
    text-shadow: none;
}

/*
 * A better looking default horizontal rule
 */

hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}

/*
 * Remove the gap between images, videos, audio and canvas and the bottom of
 * their containers: h5bp.com/i/440
 */

audio,
canvas,
img,
video {
    vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
    resize: vertical;
}

/* ==========================================================================
   Browse Happy prompt
   ========================================================================== */

.browsehappy {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}

/* ==========================================================================
   Author's custom styles
   ========================================================================== */
* {	padding:0;margin:0; }
img { max-width:100%; height:auto; border:none; padding:0; margin:0; }
BODY, HTML { height:100%; }
BODY { background-color:#dedc00; }

A { font-family: 'Yanone Kaffeesatz', sans-serif; text-transform:none; text-decoration:none; font-size:105%; color:#166936; font-weight:400; }		
A:hover { color:#93c349; }

header { width:98%; padding:1%; max-width:1000px; margin:0 auto; padding-bottom:0; }
header.interior { max-width:1032px; }

#img_logo { width:15%;  padding:0; margin:0; display:inline-block; }
#menu-wrap { width:75%; padding:0; margin:0; display:inline-block; }
	#menu, #menu ul { margin: 0; padding: 0; list-style: none; text-align:center;}
	#menu { width: auto; margin: 0 auto; }
	#menu:before, #menu:after {	content: ""; display: table; }
	#menu:after { clear: both; }
	#menu {	zoom:1;	}
	#menu li { position: relative; display:inline-block; padding:1%; }
	#menu a { font-family: 'Yanone Kaffeesatz', sans-serif; text-transform:uppercase; text-decoration:none; font-size:100%; color:#166936; font-weight:400; }
	#menu a:hover, #menu a.seleccionado { color:#93c349; }	
		
	#menu ul {	margin:0; opacity: 0; visibility: hidden; position: absolute; top: 40px; left: 0; z-index: 9999999; background-color: #dedc00; }
	#menu li:hover > ul { opacity: 1; visibility: visible; margin: 0; }
	
	#menu ul ul { top: 0; left: 150px; margin: 0 0 0 20px; 	}
	#menu ul li { float: none; display: block; text-align:left; }
	#menu ul a { padding:0px 5px; width: 130px; display: block; white-space: nowrap; float: none; text-transform: none; font-weight:300; font-size:95%; }
	#menu ul a:hover { color:#93c349; }	
	#menu ul li:first-child > a:after { content: ''; position: absolute; left: 40px; top: -6px;	}
	#menu ul ul li:first-child a:after { left: -6px; top: 50%; margin-top: -6px; }
	
	#menu-trigger {	display: none; }
	
	ul.iconos { list-style:none; width:10%; padding:0; margin:0; display:inline-block; text-align:right; }
	ul.iconos li { list-style:none; padding:0 1%; margin:0; display:inline-block; }
	ul.iconos li:last-child { padding-right:0; }

#main {	width:98%; padding:1%; max-width:1000px; margin:0 auto; padding-top:0;  }
	h2 { font-family: 'Yanone Kaffeesatz', sans-serif; font-size:115%; color:#166936; font-weight:400; text-transform:uppercase;
	border-bottom:1px #166936 solid; padding:0; margin:0;  margin-bottom:0.15em; padding-bottom:0.15em; }
	h3 { font-family: 'Yanone Kaffeesatz', sans-serif; font-size:115%; color:#166936; font-weight:700; }
	h3.concierto { font-family: 'Yanone Kaffeesatz', sans-serif; font-size:115%; color:#166936; font-weight:400; text-transform:uppercase; line-height:18px; }
	h3.small { font-size:95%; }	
	h4 { font-family: 'Yanone Kaffeesatz', sans-serif; font-size:175%; color:#166936; font-weight:300; padding:0; margin:0; text-transform:uppercase; }
	h4.concierto { font-family: 'Yanone Kaffeesatz', sans-serif; font-size:300%; color:#166936; font-weight:300; padding:0; margin:0.25em 0; text-transform:uppercase; line-height:50px;  }
	h4 A { font-family: 'Yanone Kaffeesatz', sans-serif; color:#166936; font-weight:300; padding:0; margin:0; text-transform:uppercase; font-size:95%; }
	h4 A:hover { color:#0d4322; }
	h4 a span {  visibility:hidden; padding:0; margin:0; color:#166936; background-image:url(../img/cuadrado.jpg); background-repeat:no-repeat; background-position: center center; }
	h4 A:hover span { visibility:visible; }
	.negrita { font-weight:700; }
	.verde { color:#166936; }
				
	#main aside { width:6.50%; padding:1%; margin-left:1%; margin-top:3%; vertical-align:top; position:absolute; background-color:#dedc00; z-index:1; display:block;  }
		#main aside ul { list-style:none; margin:0; padding:0; text-align:left; border-bottom:1px #166936 solid; margin-bottom:0.15em; padding-bottom:0.15em; }
		#main aside ul li { list-style:none; margin:0; padding:0 1%; display:inline-block; width:100%; }	
		#main aside ul li A { font-family: 'Yanone Kaffeesatz', sans-serif; text-transform:none; text-decoration:none; font-size:105%; color:#166936; font-weight:400; }		
		#main aside ul#lista-categorias A { text-transform:uppercase; }
		#main aside ul li A:hover { text-decoration:underline; }
	#img_atrapalo { display:block; }
	#img_atrapalo IMG { margin-top:1em; }
	#main section { width:100%;  vertical-align:top; font-family: 'Yanone Kaffeesatz', sans-serif; font-size:105%; color:#166936; font-weight:400; }
	#main section article { width:21%; display:inline-block;  vertical-align:top; padding:0; margin:0;  height:340px; margin-right:1.50%; overflow:hidden; text-align:left; }
	#main section article div.contenedor { background:rgba(255,255, 255 , 1); text-align:center; border-radius:4px; }
	.img_rrss { margin-bottom:5px;}
	#main section article:last-child { margin-right:0; }
	#main section article#anima { width:30%; padding:0 2%; text-align:left; background-color: transparent; margin-right:0; border:0; }
	#main section article#anima ul.videos { list-style:none; padding:0; margin:0; }
	#main section article#anima ul.videos li { list-style:none; padding:0; padding-right:2%; margin:0; width:48%; display:inline-block; }
	#main section#rrss { margin-top:5em; }
	
#main.interior { background-color:#bfc700; margin-bottom:1%; padding-top:3em; }
	h2.interior { text-align:right; }
	#main.interior aside { width:9.50%; padding:1%; margin-left:0; margin-top:5em; vertical-align:top; background-color:#dedc00; z-index:1; display:inline-block; position:relative;  }
	#main.interior section { width:84.50%; vertical-align:top; font-family: 'Yanone Kaffeesatz', sans-serif; font-size:105%; color:#166936; font-weight:400; display:inline-block; padding-right:4%;  }
	#main.interior section article { width:96%; display:block; vertical-align:top; padding-top:3em; padding-left:4%; padding-right:0; padding-bottom:0; margin:0; height:auto;  }
#main.interior section article #contenido_nota { display:inline-block; width:60%; padding:0 1%; padding-right:9%; vertical-align:top; margin-top:2em; }
#main.interior section article #contenido_nota A { font-weight:700; }
#main.interior section article #contenido_nota A:hover { color:#0d4322; }
#main.interior section article #contenido_nota h3 { padding:0; margin:0; line-height:18px; }
#main.interior section article aside { display:inline-block; width:28%; vertical-align:top; margin-top:1.50em; background-color:#bfc700; padding-top:0; }
#main.interior section article aside ul { border-bottom:0; }
#main.interior section article aside ul li {  border-bottom:1px #166936 solid; padding:3% 0; line-height:18px; }
#main.interior section article aside ul li:fisrt-child {  padding-top:0; }
#main.interior section article aside ul li A { font-size:95%;  }
#main.interior section article aside ul li A:hover { text-decoration:none; color:#0d4322; }
/*--------- Fichas de grupos ---------------------*/
#main.interior section article #contenido_nota.ficha { width:38%; padding:0 1%;  }
#main.interior section article aside.ficha { width:58%; padding:0; padding-left:2%; padding-right:0; }
#main.interior section article aside.ficha IMG {  }
/*---------- Programacion-------------------------*/
#main.interior section#contenido_programacion article div { width:50%; display:inline-block; vertical-align:top;  } 
/*---------- Galer&#237;as de imagenes-------------------------*/
#main.interior section article ul.galeria_imagenes { margin: 0; padding: 0; list-style: none; }
#main.interior section article ul.galeria_imagenes li { margin: 0; padding: 0; list-style: none; display:inline-block; width:24.25%; margin-left:1%; margin-top:1em; vertical-align:top;margin-bottom:1em; }
#main.interior section article ul.galeria_imagenes li:nth-child(4n-3) { margin-left:0; }
#main.interior section article ul.galeria_imagenes li IMG { margin-bottom:0.25em; -webkit-transition:opacity 0.3s ease-out; -o-transition:opacity 0.3s ease-out; -moz-transition:opacity 0.3s ease-out; transition:opacity 0.3s ease-out;  }
#main.interior section article ul.galeria_imagenes li A { margin:0; padding:0;font-family: 'Yanone Kaffeesatz', sans-serif; font-size:150%; color:#166936; text-transform:uppercase; font-weight:300;  }
#main.interior section article ul.galeria_imagenes li A:hover IMG  { opacity:0.5; padding:0;  }
#main.interior section article ul.galeria_imagenes li A span {  padding-left:0.50em; }
#main.interior section article ul.galeria_imagenes li span.grupo { margin:0; padding:0; padding-left:0.50em; font-family: 'Yanone Kaffeesatz', sans-serif; font-size:150%; color:#166936; text-transform:uppercase; font-weight:300;  }

form { padding:1% 0; }
form fieldset { width:100%; padding:0.50em 0; }
form fieldset.envio { text-align:right; width:61%; }
label { width:10%; text-align:left; display:inline-block; }
form fieldset input { font-family: 'Yanone Kaffeesatz', sans-serif; font-size:105%; color:#166936; border:1px #166936 solid; background-color:#bfc700; display:inline-block; width:50%; padding:0.25em; }
form fieldset textarea { height:5em; font-family: 'Yanone Kaffeesatz', sans-serif; font-size:105%; color:#166936; border:1px #166936 solid; background-color:#bfc700; display:inline-block; width:50%; padding:0.25em; }
form fieldset input[type="submit"] { width:auto; background-color:transparent; padding:0.25em 1em;  }
#contenedor_mensaje { text-align:center; margin:1em 0;}
#contenedor_mensaje IMG { width:20%; margin:auto; }

footer { width:98%; padding:1%;  max-width:970px; margin:0 auto; border-top:1px #166936 solid; border-bottom:1px #166936 solid; margin-bottom:1%; }
	footer ul { list-style:none; margin:0; padding:0; }
	footer ul li { list-style:none; margin:0; padding:0; display:inline-block; width:50%; }
	footer ul li:first-child IMG { width:60%; }
footer.interior { max-width:1000px; }	

article.negro p { color:#000000; }
article.negro p .negrita { color:#166936; }

/*-------------------*/

#anima { overflow:hidden; perspective:500; height:340px; position:relative; padding:0; margin:0; text-align:left; z-index:20000; }
#anima img { position:absolute; left:0; top:0; padding:0; margin:0; }

@-webkit-keyframes vibra1 {
  0% { -webkit-transform: scale(0.70, 0.70); }	  10% {-webkit-transform: scale(0.62, 0.62); }  20% {-webkit-transform: scale(0.55, 0.55); }  30% {-webkit-transform: scale(0.58, 0.58); }
  40% {-webkit-transform: scale(0.62, 0.62); }  50% {-webkit-transform: scale(0.63, 0.63); }  60% {-webkit-transform: scale(0.65, 0.65); }  70% {-webkit-transform: scale(0.72, 0.72); }
  80% {-webkit-transform: scale(0.68, 0.68); }  90% {-webkit-transform: scale(0.64, 0.64); }  100%{-webkit-transform: scale(0.72, 0.72); } 
}
@keyframes vibra1 {
  0% { transform: scale(0.70, 0.70); }	  10% { transform: scale(0.62, 0.62); }  20% { transform: scale(0.55, 0.55); }  30% { transform: scale(0.58, 0.58); }
  40% { transform: scale(0.62, 0.62); }  50% {transform: scale(0.63, 0.63); }  60% {transform: scale(0.65, 0.65); }  70% {transform: scale(0.72, 0.72); }
  80% {transform: scale(0.68, 0.68); }  90% { transform: scale(0.64, 0.64); }  100%{ transform: scale(0.72, 0.72); } 
}

/*-------------------------------------------------------------------------------------*/

@-webkit-keyframes vibra2 {
  0% { -webkit-transform: scale(0.75, 0.75); }	  10% {-webkit-transform: scale(0.70, 0.70); }  20% {-webkit-transform: scale(0.69, 0.69); }  30% {-webkit-transform: scale(0.65, 0.65); }
  40% {-webkit-transform: scale(0.71, 0.71); }  50% {-webkit-transform: scale(0.78, 0.78); }  60% {-webkit-transform: scale(0.65, 0.65); }  70% {-webkit-transform: scale(0.60, 0.60); }
  80% {-webkit-transform: scale(0.68, 0.68); }  90% {-webkit-transform: scale(0.72, 0.72); }  100%{-webkit-transform: scale(0.73, 0.73); } 
}
@keyframes vibra2 {
  0% {  transform: scale(0.75, 0.75); }	  10% {transform: scale(0.70, 0.70); }  20% {transform: scale(0.65, 0.65);  }  40% { transform: scale(0.71, 0.71);  }
  50% { transform: scale(0.78, 0.78);  }  60% { transform: scale(0.65, 0.65);  }  70% { transform: scale(0.60, 0.60);  }  80% {transform: scale(0.68, 0.68);  }
  90% { transform: scale(0.72, 0.72);  }  100%{ transform: scale(0.73, 0.73);  } 
}

/*-------------------------------------------------------------------------------------*/

@-webkit-keyframes vibra3 {
  0% { -webkit-transform: scale(0.90, 0.90);  }	  10% {-webkit-transform: scale(0.70, 0.70);  }  20% {-webkit-transform: scale(0.75, 0.75);  }  30% {-webkit-transform: scale(0.76, 0.76);  }
  40% {-webkit-transform: scale(0.88, 0.88);  }  50% {-webkit-transform: scale(0.81, 0.81);  }  60% {-webkit-transform: scale(0.65, 0.65);  }  70% {-webkit-transform: scale(0.80, 0.80);  }
  80% {-webkit-transform: scale(0.82, 0.82);  }  90% {-webkit-transform: scale(0.86, 0.86);  }  100%{-webkit-transform: scale(0.88, 0.88);  } 
}
@keyframes vibra3 {
  0% { transform: scale(0.90, 0.90);  }	  10% {transform: scale(0.70, 0.70);  }  20% {transform: scale(0.75, 0.75);  }  30% {transform: scale(0.76, 0.76);  }
  40% {transform: scale(0.88, 0.88);  }  50% {transform: scale(0.81, 0.81);  }  60% {transform: scale(0.65, 0.65);  }  70% {transform: scale(0.80, 0.80);  }
  80% {transform: scale(0.82, 0.82);  }  90% {transform: scale(0.86, 0.86);  }  100%{transform: scale(0.88, 0.88);  } 
}

/*-------------------------------------------------------------------------------------*/

@-webkit-keyframes vibra4 {
  10% {-webkit-transform: scale(0.90, 0.90);  }  20% {-webkit-transform: scale(0.80, 0.80);  } 30% {-webkit-transform: scale(0.70, 0.70);  }  40% {-webkit-transform: scale(0.80, 0.80);  }
  50% {-webkit-transform: scale(0.90, 0.90);  }  60% {-webkit-transform: scale(0.80, 0.80);  }  70% {-webkit-transform: scale(0.70, 0.70);  }  80% {-webkit-transform: scale(0.60, 0.60);  }
  90% {-webkit-transform: scale(0.70, 0.70);  }  100%{-webkit-transform: scale(0.80, 0.80);  } 
}
@keyframes vibra4 {
  10% {transform: scale(0.90, 0.90);  }  20% {transform: scale(0.80, 0.80);  } 30% {transform: scale(0.70, 0.70);  }  40% {transform: scale(0.80, 0.80);  }
  50% {transform: scale(0.90, 0.90);  }  60% {transform: scale(0.80, 0.80);  }  70% {transform: scale(0.70, 0.70);  }  80% {transform: scale(0.60, 0.60);  }
  90% {transform: scale(0.70, 0.70);  }  100%{transform: scale(0.80, 0.80);  } 
}

/*-------------------------------------------------------------------------------------*/

@-webkit-keyframes vibra5 {
  10% {-webkit-transform: scale(0.10, 0.10); opacity:0.1; }  20% {-webkit-transform: scale(0.20, 0.20); opacity:0.2; }  30% {-webkit-transform: scale(0.30, 0.30); opacity:0.3; }
  40% {-webkit-transform: scale(0.40, 0.40); opacity:0.4; }  50% {-webkit-transform: scale(0.50, 0.50); opacity:0.5; }  60% {-webkit-transform: scale(0.60, 0.60); opacity:0.6; }
  70% {-webkit-transform: scale(0.70, 0.70); opacity:0.7; }  80% {-webkit-transform: scale(0.80, 0.80); opacity:0.8; }  90% {-webkit-transform: scale(0.90, 0.90); opacity:0.9; }
  100%{-webkit-transform: scale(1, 1); opacity:1;  } 
}

@keyframes vibra5 {
  10% {transform: scale(0.10, 0.10); opacity:0.1; }  20% {transform: scale(0.20, 0.20); opacity:0.2; }  30% {transform: scale(0.30, 0.30); opacity:0.3; }
  40% {transform: scale(0.40, 0.40); opacity:0.4; }  50% {transform: scale(0.50, 0.50); opacity:0.5; }  60% {transform: scale(0.60, 0.60); opacity:0.6; }
  70% {transform: scale(0.70, 0.70); opacity:0.7; }  80% {transform: scale(0.80, 0.80); opacity:0.8; }  90% {transform: scale(0.90, 0.90); opacity:0.9; }
  100%{transform: scale(1, 1); opacity:1;  } 
}

/*-------------------------------------------------------------------------------------*/

@-webkit-keyframes tiembla {
  0%, 20%, 40%, 60%, 80%, 100% {  -webkit-transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); }
  0% {   opacity: 1; -webkit-transform: scale3d(.97, .97, .97); }
  20% {  -webkit-transform: scale3d(1.1, 1.1, 1.1);  }
  40% {  -webkit-transform: scale3d(.97, .97, .97); }
  60% {  opacity: 1; -webkit-transform: scale3d(1.03, 1.03, 1.03); }
  80% {  -webkit-transform: scale3d(.97, .97, .97); }
  100% { opacity: 1; -webkit-transform: scale3d(1, 1, 1); }
}
@keyframes tiembla {
  0%, 20%, 40%, 60%, 80%, 100% {  transition-timing-function: cubic-bezier(0.215, 0.610, 0.355, 1.000); }
  0% {   opacity: 1; transform: scale3d(.97, .97, .97); }
  20% {  transform: scale3d(1.1, 1.1, 1.1);  }
  40% {  transform: scale3d(.97, .97, .97); }
  60% {  opacity: 1; transform: scale3d(1.03, 1.03, 1.03); }
  80% {  transform: scale3d(.97, .97, .97); }
  100% { opacity: 1; transform: scale3d(1, 1, 1); }
}

/*-------------------------------------------------------------------------------------*/

#img_logo_anima { z-index:12000; -webkit-transform: scale(0, 0); opacity:0;
-webkit-animation:vibra5 2s linear 2s, tiembla 0.75s 4s forwards; -o-animation:vibra5 2s linear 2s, tiembla 0.75s 4s forwards; animation:vibra5 2s linear 2s, tiembla 0.75s 4s forwards;
-ms-animation:vibra5 2s linear 2s, tiembla 0.75s 4s forwards; -moz-animation:vibra5 2s linear 2s, tiembla 0.75s 4s forwards;	
}
#img_tapa { z-index:10000; -webkit-transform:scale(0.90, 0.90); }
#img_lineas { z-index:8000;
-webkit-animation:vibra4 2s linear 0s infinite alternate; -o-animation:vibra4 2s linear 0s infinite alternate; -ms-animation:vibra4 2s linear 0s infinite alternate;
-moz-animation:vibra4 2s linear 0s infinite alternate; animation:vibra4 2s linear 0s infinite alternate;
}
#img_circ1 { z-index:6000;
-webkit-animation:vibra1 2s linear 0s infinite alternate forwards; -o-animation:vibra1 2s linear 0s infinite alternate forwards; 
-ms-animation:vibra1 2s linear 0s infinite alternate forwards; -moz-animation:vibra1 2s linear 0s infinite alternate forwards;
animation:vibra1 2s linear 0s infinite alternate forwards;
}
#img_circ2 { z-index:4000; opacity:0.6; 
-webkit-animation:vibra2 2s linear 0s infinite alternate forwards; -o-animation:vibra2 2s linear 0s infinite alternate forwards; -moz-animation:vibra2 2s linear 0s infinite alternate forwards; 
-ms-animation:vibra2 2s linear 0s infinite alternate forwards; animation:vibra2 2s linear 0s infinite alternate forwards; 
}
#img_circ3 { z-index:2000; opacity:0.3;
-webkit-animation:vibra3 2.8s linear 0s infinite alternate; -moz-animation:vibra3 2.8s linear 0s infinite alternate; -ms-animation:vibra3 2.8s linear 0s infinite alternate;
-o-animation:vibra3 2.8s linear 0s infinite alternate; animation:vibra3 2.8s linear 0s infinite alternate;
}

/* ==========================================================================
   Helper classes
   ========================================================================== */

/*
 * Image replacement
 */

.ir {
    background-color: transparent;
    border: 0;
    overflow: hidden;
    /* IE 6/7 fallback */
    *text-indent: -9999px;
}

.ir:before {
    content: "";
    display: block;
    width: 0;
    height: 150%;
}

/*
 * Hide from both screenreaders and browsers: h5bp.com/u
 */

.hidden {
    display: none !important;
    visibility: hidden;
}

/*
 * Hide only visually, but have it available for screenreaders: h5bp.com/v
 */

.visuallyhidden {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

/*
 * Extends the .visuallyhidden class to allow the element to be focusable
 * when navigated to via the keyboard: h5bp.com/p
 */

.visuallyhidden.focusable:active,
.visuallyhidden.focusable:focus {
    clip: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    position: static;
    width: auto;
}

/*
 * Hide visually and from screenreaders, but maintain layout
 */

.invisible {
    visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix:before,
.clearfix:after {
    content: " "; /* 1 */
    display: table; /* 2 */
}

.clearfix:after {
    clear: both;
}

/*
 * For IE 6/7 only
 * Include this rule to trigger hasLayout and contain floats.
 */

.clearfix {
    *zoom: 1;
}

/* ==========================================================================
   EXAMPLE Media Queries for Responsive Design.
   These examples override the primary ('mobile first') styles.
   Modify as content requires.
   ========================================================================== */
@media screen and (min-width: 1500px) {
	#main aside { width:5%;	}
}

@media screen and (max-width: 1150px) {
	#menu li { padding:1%; }
	#img_logo { width:15%; }
	#menu-wrap { width:100%; }
	ul.iconos { position:absolute; bottom:0; display:block; width:90%; padding:1% 0; display:none; }
	#menu a {  font-size:95%;  }
	#menu, #menu ul { text-align:left;}
	#main aside { width:15%; }
	#main.interior {  padding-top:0em; }
	#main.interior aside { margin-top:3.25em; }
	#main.interior section article { padding-top:1.50em; }
	
}

@media screen and (max-width: 768px) {
	#img_logo { width:100%; }
	header { text-align: center; }
	#main aside { display:none; }
	#main {	width:98%; padding:1%;  }	
	#main section { width:98%; margin:0 auto; }
	#main section article { width:100%; }
	#main section article#anima { width:100%; height:500px; }
	.img_rrss { margin-bottom:5px; display:block;}
	footer ul li { width:98%; padding:2% 1%; }
	footer ul li:first-child IMG { width:100%; }	
	
	#main.interior { padding-top:0em; margin-top:1em; font-size:115%;  }
	#main.interior aside { width:96%; padding:1% 2%; margin-left:0; margin-top:0.50em; position:relative;  }
	#main.interior section { width:98%; vertical-align:top; display:block; padding:1%; }
	#main.interior section article { width:100%; display:block; padding:0; }

	form { padding:1%; font-size:115%; }	
	label { width:98%; }
	form fieldset.envio { width:98%; }
	form fieldset input { width:90%; }
	form fieldset textarea { width:90%;  }
	form fieldset input[type="submit"] { width:98%; bpadding:1em 0; }	
	
	#main.interior section article #contenido_nota { width:98%; padding:0 1%; border-bottom:3px #166936 solid; }
	#main.interior section article aside { width:98%; }

	#main.interior section article #contenido_nota.ficha { width:98%; padding:0 1%; border-bottom:0;  }
	#main.interior section article aside.ficha { width:98%; padding:0 1%; }
		
	#main.interior section#contenido_programacion article div { width:100%; border-bottom:1px #166936 solid;  } 
	
	#main.interior section article ul.galeria_imagenes li { width:100%; margin-left:0%; margin-top:1em; }
	
	#main section article#anima ul.videos li { list-style:none; padding:0; padding:1%; margin:0; width:100%; display:inline-block; }
	#main section#rrss { margin-top:2em; }	
}

@media screen and (max-width: 768px) {
	#menu-wrap { position: relative; }
	#menu-wrap * {	-moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box;	}
	#menu-trigger {	display: block; height: 40px; line-height: 40px; cursor: pointer; padding: 0 0 0 10px; color: #fafafa; font-weight: bold; background-color: #166936; }
	#menu {	margin: 0; padding: 10px; position: absolute; top: 40px; width: 100%; z-index: 9999999; background-color: #444; display: none; box-shadow: none; }
	#menu:after { content: ''; position: absolute; left: 25px; top: -8px; border-left: 8px solid transparent; border-right: 8px solid transparent; border-bottom: 8px solid #444; }	
	#menu ul { position: static; visibility: visible; opacity: 1; margin: 0; background: none; box-shadow: none;	}
	#menu ul ul { margin: 0 0 0 20px !important; box-shadow: none; }
	#menu li { position: static; display: block; float: none; border: 0; margin: 5px; box-shadow: none; }
	#menu ul li{ margin-left: 20px;	box-shadow: none; text-align:left;}
	#menu a { display: block;	float: none; padding: 0;	color: #999; text-align:left; }
	#menu a:hover{	color: #fafafa; }	
	#menu ul a{ padding: 0;	width: auto; }
	#menu ul a:hover{ background: none;	 }
	#menu ul li:first-child a:after, #menu ul ul li:first-child a:after { border: 0; }		

	}

	@media screen and (min-width: 768px) {
		#menu {
			display: block !important;
		}
	}	

	/* iPad */
	.no-transition {
		transition: none;
		opacity: 1;
		visibility: visible;
		display: none;  		
	}

	#menu li:hover > .no-transition {
		display: block;
	}
	
@media only screen and (min-width: 35em) {
}

@media print,
       (-o-min-device-pixel-ratio: 5/4),
       (-webkit-min-device-pixel-ratio: 1.25),
       (min-resolution: 120dpi) {
    /* Style adjustments for high resolution devices */
}

/* ==========================================================================
   Print styles.
   Inlined to avoid required HTTP connection: h5bp.com/r
   ========================================================================== */

@media print {
    * {
        background: transparent !important;
        color: #000 !important; /* Black prints faster: h5bp.com/s */
        box-shadow: none !important;
        text-shadow: none !important;
    }

    a,
    a:visited {
        text-decoration: underline;
    }

    a[href]:after {
        content: " (" attr(href) ")";
    }

    abbr[title]:after {
        content: " (" attr(title) ")";
    }

    /*
     * Don't show links for images, or javascript/internal links
     */

    .ir a:after,
    a[href^="javascript:"]:after,
    a[href^="#"]:after {
        content: "";
    }

    pre,
    blockquote {
        border: 1px solid #999;
        page-break-inside: avoid;
    }

    thead {
        display: table-header-group; /* h5bp.com/t */
    }

    tr,
    img {
        page-break-inside: avoid;
    }

    img {
        max-width: 100% !important;
    }

    @page {
        margin: 0.5cm;
    }

    p,
    h2,
    h3 {
        orphans: 3;
        widows: 3;
    }

    h2,
    h3 {
        page-break-after: avoid;
    }
}
