﻿.loading {
	display: none;
	position: fixed;
	
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	
	justify-content: center;
	align-items: center;
	
	font-size: 2em;
	color:#FFEECC;
	background-color:#110022;
	z-index:99999;
}
.loading--show {
	display:flex;
}

/*ADVERTENCIA VERTICAL*/

#advertencia{
	display:none;
	width:100vw;
	height:100vh;
}
.advertencia{
	width:75%;
	height:50vh;
	margin:auto;
}
.advertencia p{
	width:70%;
	margin:0 auto 10% auto;
	font-size:6em;
	line-height:1em;
	text-align:center;	
	color:#FFEECC;
}
.img-gira{
	width:40%;
	margin:10% auto;
}

/*RESET*/

*, html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, button, input, select, label, legend, table, caption, tbody, tfoot, thead, tr, th, td{
	margin: 0; padding: 0; border: 0; outline: 0; vertical-align: baseline; background-color: transparent; text-decoration: none; list-style-type: none; border-style: none;
	soutline: red inset thin; /*Delineado de todos estos objetos*/
}
ol, ul {
	list-style: none;
}

/* MESA DE TRABAJO / CONTAINERS */

html, body, #container {width: 100%; height: 100%;}

body {
	font-family: "Be Vietnam Pro Light", Arial, sans-serif;
	
	font-size:0.8em;/*FONT SIZE HEREDADO - Relativa al tamaño del body*/ /*NO TOCAR*/
	font-size:0.95vw;/*Relativa al 1% del ancho del viewport*/ /*REDUCE PROPORCIONAL*/ /*ANULA EL ZOOM*/ /*NO TOCAR*/

	color:#330033; /*mora*/
	background-color:#110022; /*darkmora*/
		
	soverflow:hidden;
}
#container{
	display:flex;
	sbackground-color:yellow;
	soverflow:hidden;
}
.main-carousel{
	width:100%;
	max-height:46.5em;
	display:flex;
	margin: auto; /*PADRE CON FLEX*/
	
	background-color:#FFEECC; /*hueso*/
	sbackground-color:blue;
	overflow:hidden; /*DEJARLO FIJO*/
}
.main-carousel .flickity-button, .main-carousel-inside .flickity-button{
	background-color:#FFEECC;
	border:3px #330033 solid;
	color: #330033;
}
.main-carousel .flickity-button:hover, .main-carousel-inside .flickity-button:hover{
	background: #FFCC88; 
	color: #330033;
}
.sub-container{
	max-width:80%; /* Responsive */
	max-height:46.5em;
	
	display:block;
	float:left;
	margin: auto; /*PADRE CON FLEX*/
	
	background-color:#FFEECC; /*hueso*/
	sbackground-color:red;	
	overflow:hidden;
}

.a-1-columnas, .a-2-columnas, .a-3-columnas, .a-4-columnas, .a-5-columnas, .a-6-columnas, .a-8-columnas, .a-10-columnas {float:left; display:inline-block;}
.a-1-columnas{width:99.96%;}
.a-2-columnas{width:49.98%;}
.a-3-columnas{width:33.32%;}
.a-4-columnas{width:24.99%;}
.a-5-columnas{width:20.00%;}
.a-6-columnas{width:16.66%;}
.a-8-columnas{width:12.49%;}
.a-10-columnas{width:10%;}

/*FUENTES Y ESTILOS*/

h1, h2, h3, h4, h5, h6, p{
	display:block;
}
h1{
	font-size: 6em;
	padding:0.025em 0.16em;
}
h2{
	font-size: 5em;
	padding:0.05em 0.20em;
}
h3{
	font-size: 4em;
	padding:0.10em 0.25em;
}
h4{
	font-size: 3em;
	padding:0.15em 0.38em;	
}
h5{
	font-size: 2em;
	padding:0.25em 0.50em;	
}
h6{
	font-size: 1em;
	padding:0.5em 1em;
}
p{
    padding: 1em;
}
b, strong {
  font-weight: bolder;
}
em{
	font-style:italic;
}

/* IMAGENES */

img {
	width:100%; /* :100%; Estira la imagen al contenedor a lo ANCHO */
	height:auto; /* :100%; Estira la imagen al contenedor a lo ALTO / :auto; se deja controlar por el width: */
	
	max-width:100%; /* :100%; Estira la imagen al contenedor a lo ANCHO */
	min-width:100%; /* :100%; Estira las imagenes pequeñas al contenedor a lo ANCHO cuando sobrepasa su tamaño se deja de ver parte de la imagen */
	
	max-height:100%; /* :100%; ALTO minimo de la imagen*/
	smin-height:100%; /* :100%; igual al height:100%; en PX obliga a que sea el ALTO minimo *//* SOLUCIONA ESPACIOS BLANCOS EN EL CONTAINER*/
  
	svertical-align: middle;
}

.imgBG{
	background-size:100%;
	background-attachment:fixed;
	background-repeat:no-repeat;
	background-position:left top;
}

a, img, audio, video {
  display: inline-block;
}

a:hover, img:hover, audio:hover, video:hover {
  display: inline-block;
}

/*PREFIJOS

-webkit-	Chrome
-moz-		Firefox
-ms-		IE
-o-			Opera

*/

/* FUENTES TIPOGRAFICAS */

@font-face {
    font-family:"Beth Ellen";
    src: url("../fonts/BethEllen-Regular.ttf") format("truetype");
}

@font-face {
    font-family:"Be Vietnam Pro Light";
    src: url("../fonts/BeVietnamPro-Light.ttf") format("truetype");
}



/* IMAGENES VIDEOS FX */

/*PESTAÑA CAPSULAS*/

.pestana-container  {
	position:absolute;	
	width:100%;
	margin:0 auto; 	
	left:0;
	right:0;
	bottom:0; 		
	z-index:1;
}

/*
 ________  ________  ________  ________  ___  ___  ___       ________  ________      
|\   ____\|\   __  \|\   __  \|\   ____\|\  \|\  \|\  \     |\   __  \|\   ____\     
\ \  \___|\ \  \|\  \ \  \|\  \ \  \___|\ \  \\\  \ \  \    \ \  \|\  \ \  \___|_    
 \ \  \    \ \   __  \ \   ____\ \_____  \ \  \\\  \ \  \    \ \   __  \ \_____  \   
  \ \  \____\ \  \ \  \ \  \___|\|____|\  \ \  \\\  \ \  \____\ \  \ \  \|____|\  \  
   \ \_______\ \__\ \__\ \__\     ____\_\  \ \_______\ \_______\ \__\ \__\____\_\  \ 
    \|_______|\|__|\|__|\|__|    |\_________\|_______|\|_______|\|__|\|__|\_________\
                                 \|_________|                            \|_________|
                                                                                                                                                                   

CAPSULAS*/

.contenido-capsula{
	width:100%;
	max-height:46.5em;
	margin:auto;
	float:left;
}
.foto-capsula, .foto-portada{
	width:35%;
	position:absolute;
	top:20%;
	left:15%;
}
.capsula{
	width:79%;
	position:absolute;
	top:8%;
	left:9%;
	transform:rotate(-3deg);
}
.polaroid{
	position:absolute;
	z-index:10;
}
.textos-capsula{
	width:40%;
	position:absolute;
	top:25%;
	left:45%;
}
.titulo-tema{
	width:38%;
	float:left;	
}


h1, h2, h3{
	font-family: 'Beth Ellen', Arial, sans-serif;
}

h1{
	font-size: 4vw;
	line-height: 1.2em;
	padding:4% 0 0 4%;
	text-align:left;
}
h2, h3, h4{
	font-size: 3.8vw;
	line-height: 1.1em;
	padding:4% 0 0 8%;
	text-align:left;
}
p{
	font-size:1.36em;
	line-height: 1.26em;
	letter-spacing: -0.00em;
	stext-align:left;
}
.texto{
	padding:4% 10%;
}

.resaltador{
	background-color:#FFCC88;
	mix-blend-mode:multiply;
}
.mas{
	width:12%;
	position:absolute;
	z-index:99;
}
.mas-nu{
	width:12%;
	position:absolute;
	top:50%;
	left:8%;
}

a:hover.pdf{
	transform:scale(1.01) rotate(-1deg);
}
.vigias{
	transform:scale(1) rotate(0deg);
}

a:hover.vigias{
	transform:scale(0.9) rotate(2deg);
}

.logo-portada{
	width:42%;
	position:absolute;
	top:34%;
	left:8%;
}
.container-textos-portada{
	width:42%;
	position:absolute;
	top:38%;
	left:49%;
}
.textos-portada{
	width:44%;
	position:absolute;
	top:23%;
	left:44%;
	text-align:justify;
}

.texto-portadas{
	padding:4% 10%;
	text-align:justify;
	font-size:1.5em;
}

.multimedia{
	padding-top:0.5%;
	float:right;
}
.multimedia-nu{
	position:absolute;
	top:63%;
	left:48%;
	spadding-top:0.5%;
	width:40%;
	height:10%;
	
}
/*GALERIA VENTANA*/



/*AUDIO*/

.capsula-audio{
	width:88%;
	padding:1% 2%;
	margin:3% 3% 0% 3%;

	outline-offset: 0px;
	color: white;
	background-color: rgba(230,105,16,0.55);
}
.audio-una{
	border-radius: 100%;
	width: 21%;
	padding: 2%;
	cursor: pointer;
}
.audio-una:focus{
	background-color:black;
}
.audio-play{
	float:left;
	margin-top:-100%;
}
.audio-titulo, .audio-info{
	width:75%;
	display:inline-block;
	float:left;
	max-height:2.1em;	
	overflow:hidden;	
}
.audio-titulo{
	font-size: 0.9vw;
	padding:1% 1% 0.5% 1%;
}
.audio-info{
	font-size:0.8vw;
	padding:0.5% 1% 0 1%;
}
.audio-titulo, .audio-info{
	line-height: 1em;
	letter-spacing: 0.080em;
	text-align:left;
}

/*AUDIO*/


/*VIDEO*/

.video-una{
	width:42%;
	padding:3% 3.5%;
}
.video-una-2{
	width:25%;
	padding:3% 3.5%;
}
.video-play{
	float:left;
	margin-top:-100%;
}



/*
 ___       ________  ________  ________  ________      
|\  \     |\   __  \|\   ____\|\   __  \|\   ____\     
\ \  \    \ \  \|\  \ \  \___|\ \  \|\  \ \  \___|_    
 \ \  \    \ \  \\\  \ \  \  __\ \  \\\  \ \_____  \   
  \ \  \____\ \  \\\  \ \  \|\  \ \  \\\  \|____|\  \  
   \ \_______\ \_______\ \_______\ \_______\____\_\  \ 
    \|_______|\|_______|\|_______|\|_______|\_________\
                                           \|_________|
                                                       

INICIO CONTAINER LOGOS*/

#container-logos{
	height:100vh;
	float:left;
	display:flex;
	margin:auto;
}
.franja-logos{
	height:44.9em;
	margin:auto; /*PADRE CON FLEX*/
}
.logos{
	width:80%;
	height:0em;	
	position: absolute;		
	z-index: 9999;
	left:10%;
	right:10%;
	margin:auto;
	margin-top:1.6em;
}
.logo-alcaldia a{
	width:12em;
	height:5em;
	display:inline-block;
	float:left;
	margin-left:1.95em;
}
.logo-barra{
	width:1em;
	height:5em;
	display:inline-block;
	float:left;
}
.logo-social a{
	width:6em;
	height:6em;
	display:inline-block;
	float:left;
	margin-top:-0.5em;
}
.logo-vigias a{
	width:7em;
	height:7em;
	display:inline-block;
	float:left;
	margin-top:-0.4em;
	margin-left:0.4em;	
}
.logo-muwa a{
	width:13.3em;
	height:6em;
	display:inline-block;
	float: right;
	margin-right:1.8em;
	margin-top:-0.5em;
}
.logos-redes{
	width:13em;
	height:2.5em;
	float: right;
	position: absolute;
	top:4.9em;
	right:1em;
}
.loguito a{
	width:3em;
	height:3em;
	display:inline-block;
	float: left;
	margin:0 0.1em;
}
.loguitoL{
	width:8em;
	height:3em;
	display:inline-block;
	float: left;
	margin:0 0.1em;
}

/*
 ___       ________  ________  ________  ________      
|\  \     |\   __  \|\   ____\|\   __  \|\   ____\     
\ \  \    \ \  \|\  \ \  \___|\ \  \|\  \ \  \___|_    
 \ \  \    \ \  \\\  \ \  \  __\ \  \\\  \ \_____  \   
  \ \  \____\ \  \\\  \ \  \|\  \ \  \\\  \|____|\  \  
   \ \_______\ \_______\ \_______\ \_______\____\_\  \ 
    \|_______|\|_______|\|_______|\|_______|\_________\
                                           \|_________|
                                                       
FIN CONTAINER LOGOS*/


/*
MENu + VeNTANAS EMERGENTES
 _____ ______   _______   ________   ___  ___     
|\   _ \  _   \|\  ___ \ |\   ___  \|\  \|\  \    
\ \  \\\__\ \  \ \   __/|\ \  \\ \  \ \  \\\  \   
 \ \  \\|__| \  \ \  \_|/_\ \  \\ \  \ \  \\\  \  
  \ \  \    \ \  \ \  \_|\ \ \  \\ \  \ \  \\\  \ 
   \ \__\    \ \__\ \_______\ \__\\ \__\ \_______\
    \|__|     \|__|\|_______|\|__| \|__|\|_______|

*/
#container-menu-secciones{/*1*/
	height:100vh;
	display:flex;
	soverflow:hidden;
}
.menu-secciones{ /*2*/
	width:100%;
	min-height:46.5em;
	display:flex;
	margin: auto; /*PADRE CON FLEX*/
	
	soverflow:hidden;
}
.boton-menu-secciones{
	width: 4%;
	display: block;
	position: absolute;
	margin: 3% 0;
	left: 48.5%;
	right: 48.5%;
	z-index: 9997;
	border-radius: 100%;
	background-color:#FFEECC;
	border:medium #FFEECC solid;
}
.menu-mascara{ /*3*/ 
	width:100%;
	min-height:46.5em;
	margin: auto; /*PADRE CON FLEX*/

	position:absolute;
	background:#110022;

	right: 0;
	left: 0;

	pointer-events: none;
	z-index: 9999;
	opacity:0;	
	
	transition: opacity 400ms ease-in;
	-moz-transition: opacity 400ms ease-in;
	-webkit-transition: opacity 400ms ease-in;
	
	overflow:hidden;
}


.menu-mascara:target{
	opacity:1;
	pointer-events: auto;
}
.fade {
	opacity:0;
}
.menu-mascara:target .fade{
	opacity:1;
}
.ventana-contenido{ /*4*/ /*TODAS LAS INSTANCIAS EMERGENTES*/
	width:100%;
	height:46.5em;
	min-height:46.5em;
	margin: auto; /*PADRE CON FLEX*/
	display:inline-block;	
	float:left;
		
	transition: all 500ms ease-in;
	-moz-transition: all 500ms ease-in;
	-webkit-transition: all 500ms ease-in;
	
	soverflow:hidden;
}

.contenido-menu-secciones{ /*5*/
	width:100%; /* Fijo */
	max-height:46.5em;
	margin: auto;
	
	overflow:hidden;
}
.seccion-item{/*6*/
	width:15.66%;
	max-height:46.5em;
	margin:0 0.5%;
	
	display:inline-block;
	float:left;
	
	-webkit-transform: skew(-10deg);
	-moz-transform: skew(-10deg);
	-ms-transform: skew(-10deg);
	-o-transform: skew(-10deg);
	transform: skew(-10deg);
	
	overflow:hidden;
}

/*
 _____ ______   _______   ________   ___  ___     
|\   _ \  _   \|\  ___ \ |\   ___  \|\  \|\  \    
\ \  \\\__\ \  \ \   __/|\ \  \\ \  \ \  \\\  \   
 \ \  \\|__| \  \ \  \_|/_\ \  \\ \  \ \  \\\  \  
  \ \  \    \ \  \ \  \_|\ \ \  \\ \  \ \  \\\  \ 
   \ \__\    \ \__\ \_______\ \__\\ \__\ \_______\
    \|__|     \|__|\|_______|\|__| \|__|\|_______|

FIN MENu + VeNTANAS EMERGENTES
*/


/*   ___      ___ _______   ________   _________  ________  ________   ________  ________                       
    |\  \    /  /|\  ___ \ |\   ___  \|\___   ___\\   __  \|\   ___  \|\   __  \|\   ____\                      
    \ \  \  /  / | \   __/|\ \  \\ \  \|___ \  \_\ \  \|\  \ \  \\ \  \ \  \|\  \ \  \___|_                     
     \ \  \/  / / \ \  \_|/_\ \  \\ \  \   \ \  \ \ \   __  \ \  \\ \  \ \   __  \ \_____  \                    
      \ \    / /   \ \  \_|\ \ \  \\ \  \   \ \  \ \ \  \ \  \ \  \\ \  \ \  \ \  \|____|\  \                   
       \ \__/ /     \ \_______\ \__\\ \__\   \ \__\ \ \__\ \__\ \__\\ \__\ \__\ \__\____\_\  \                  
        \|__|/       \|_______|\|__| \|__|    \|__|  \|__|\|__|\|__| \|__|\|__|\|__|\_________\                 
                                                                                   \|_________|                 
 _______   _____ ______   _______   ________  ________  _______   ________   _________  _______   ________      
|\  ___ \ |\   _ \  _   \|\  ___ \ |\   __  \|\   ____\|\  ___ \ |\   ___  \|\___   ___\\  ___ \ |\   ____\     
\ \   __/|\ \  \\\__\ \  \ \   __/|\ \  \|\  \ \  \___|\ \   __/|\ \  \\ \  \|___ \  \_\ \   __/|\ \  \___|_    
 \ \  \_|/_\ \  \\|__| \  \ \  \_|/_\ \   _  _\ \  \  __\ \  \_|/_\ \  \\ \  \   \ \  \ \ \  \_|/_\ \_____  \   
  \ \  \_|\ \ \  \    \ \  \ \  \_|\ \ \  \\  \\ \  \|\  \ \  \_|\ \ \  \\ \  \   \ \  \ \ \  \_|\ \|____|\  \  
   \ \_______\ \__\    \ \__\ \_______\ \__\\ _\\ \_______\ \_______\ \__\\ \__\   \ \__\ \ \_______\____\_\  \ 
    \|_______|\|__|     \|__|\|_______|\|__|\|__|\|_______|\|_______|\|__| \|__|    \|__|  \|_______|\_________\
                                                                                                    \|_________|
*/
#container-ventanas{
	sheight:100vh;
	sdisplay:flex;
}
.padre{
	height:100vh;
	display:flex;
}
.ventana-mascara, .ventana-mascara-galeria, .ventana-mascara-video {
	width:80%;
	smin-height:46.5em;
	max-height:46.5em;
	margin: auto; /*PADRE CON FLEX*/
	
	position:absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;	
		
	opacity:0;
	transition: opacity 400ms ease-in;
	-moz-transition: opacity 400ms ease-in;	
	-webkit-transition: opacity 400ms ease-in;
	
	pointer-events: none;
	z-index: 9999;
	soverflow:hidden;
}

.ventana-mascara-video{
	background-color:#110022; /*darkmora*/
}

.ventana-mascara:target, .ventana-mascara-galeria:target, .ventana-mascara-video:target {
	opacity:1;
	pointer-events: auto;
}

.fade {
	opacity:0;
}

.ventana-mascara:target .fade, .ventana-mascara-galeria:target .fade,  .ventana-mascara-video:target .fade{
	opacity:1;
}

.main-carousel-inside{
	width:100%;
	max-height:46.5em;
	
	display:block;
	float:left;

	margin: auto; /*PADRE CON FLEX*/
	
	background-color:#FFEECC;/*DEJARLO FIJO*/
	overflow:hidden; 
}
.main-carousel-inside .flickity-prev-next-button {
  width: 4%;
  height: 7%;
}
.main-carousel-inside .flickity-prev-next-button.previous {
	left: 3.0%;
}
.main-carousel-inside .flickity-prev-next-button.next {
	right: 3.0%;
}

.boton-cerrar{
	font-size:2em;
	line-height: 1.5em;

	width:1.5em;	
	height:1.5em;
	
	right: 2%;
	top: 4%;

	position: absolute;

	background: #FAAC58; 
	color:#222;
			
	text-align: center;
	text-decoration: none;
	font-weight: bold;

	border-radius:3px;
	z-index:99999;	
}
.boton-cerrar:hover { 
	background: #606061;
	color: #FFFFFF;
}

.slide-texto, .slide-imagen{
 	width: 100%;
	max-height:46.5em;
	
	sdisplay:block;
	sfloat:left;
	smargin: auto; /*PADRE CON FLEX*/
	soverflow:hidden;	
}

.contenedor-texto-galeria-emergente{
	width: 50%;
	padding: 5%;

	position:absolute;
	display:flex;
	margin: auto; /*PADRE CON FLEX*/
	
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
}

.texto-galeria-emergente{
	text-align: justify;
	margin: auto; /*PADRE CON FLEX*/
	color:#330033;/*mora*/
}


/*   ___      ___ _______   ________   _________  ________  ________   ________  ________                       
    |\  \    /  /|\  ___ \ |\   ___  \|\___   ___\\   __  \|\   ___  \|\   __  \|\   ____\                      
    \ \  \  /  / | \   __/|\ \  \\ \  \|___ \  \_\ \  \|\  \ \  \\ \  \ \  \|\  \ \  \___|_                     
     \ \  \/  / / \ \  \_|/_\ \  \\ \  \   \ \  \ \ \   __  \ \  \\ \  \ \   __  \ \_____  \                    
      \ \    / /   \ \  \_|\ \ \  \\ \  \   \ \  \ \ \  \ \  \ \  \\ \  \ \  \ \  \|____|\  \                   
       \ \__/ /     \ \_______\ \__\\ \__\   \ \__\ \ \__\ \__\ \__\\ \__\ \__\ \__\____\_\  \                  
        \|__|/       \|_______|\|__| \|__|    \|__|  \|__|\|__|\|__| \|__|\|__|\|__|\_________\                 
                                                                                   \|_________|                 
 _______   _____ ______   _______   ________  ________  _______   ________   _________  _______   ________      
|\  ___ \ |\   _ \  _   \|\  ___ \ |\   __  \|\   ____\|\  ___ \ |\   ___  \|\___   ___\\  ___ \ |\   ____\     
\ \   __/|\ \  \\\__\ \  \ \   __/|\ \  \|\  \ \  \___|\ \   __/|\ \  \\ \  \|___ \  \_\ \   __/|\ \  \___|_    
 \ \  \_|/_\ \  \\|__| \  \ \  \_|/_\ \   _  _\ \  \  __\ \  \_|/_\ \  \\ \  \   \ \  \ \ \  \_|/_\ \_____  \   
  \ \  \_|\ \ \  \    \ \  \ \  \_|\ \ \  \\  \\ \  \|\  \ \  \_|\ \ \  \\ \  \   \ \  \ \ \  \_|\ \|____|\  \  
   \ \_______\ \__\    \ \__\ \_______\ \__\\ _\\ \_______\ \_______\ \__\\ \__\   \ \__\ \ \_______\____\_\  \ 
    \|_______|\|__|     \|__|\|_______|\|__|\|__|\|_______|\|_______|\|__| \|__|    \|__|  \|_______|\_________\
                                                                                                    \|_________|
*/


.hide{
	display:none;
}


/*
  ___    ___ ________  ___  ___  _________  ___  ___  ________  _______      
 |\  \  /  /|\   __  \|\  \|\  \|\___   ___\\  \|\  \|\   __  \|\  ___ \     
 \ \  \/  / | \  \|\  \ \  \\\  \|___ \  \_\ \  \\\  \ \  \|\ /\ \   __/|    
  \ \    / / \ \  \\\  \ \  \\\  \   \ \  \ \ \  \\\  \ \   __  \ \  \_|/__  
   \/  /  /   \ \  \\\  \ \  \\\  \   \ \  \ \ \  \\\  \ \  \|\  \ \  \_|\ \ 
 __/  / /      \ \_______\ \_______\   \ \__\ \ \_______\ \_______\ \_______\
|\___/ /        \|_______|\|_______|    \|__|  \|_______|\|_______|\|_______|
\|___|/                                                                      

YOUTUBE RESPONSABLE*/

.youtube-player{
  overflow: hidden;
  max-width: 100%;
}

.youtube-player iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 100;
  background: transparent;
  background-color:#110022;
}

.youtube-player img {
  width: 100%;
  height: auto;
  max-width: 100%;
  
  position: absolute;
  display: block;
  margin: auto;

  object-fit: cover;
  
  left: 0;
  bottom: 0;
  right: 0;
  top: 0;
  
  border: none;
  cursor: pointer;
  
  -webkit-transition: 0.4s all;
  -moz-transition: 0.4s all;
  transition: 0.4s all;
}

.youtube-player img:hover {
  -webkit-filter: brightness(75%);
  -moz-filter: brightness(75%);
  filter: brightness(75%);
}

.youtube-player .play {
  height: 48px;
  width: 68px;
  left: 50%;
  top: 50%;
  margin-left: -34px;
  margin-top: -24px;
  position: absolute;
  background: url('../img/base/yt.png') no-repeat;
  cursor: pointer;
}

/*
  ___    ___ ________  ___  ___  _________  ___  ___  ________  _______      
 |\  \  /  /|\   __  \|\  \|\  \|\___   ___\\  \|\  \|\   __  \|\  ___ \     
 \ \  \/  / | \  \|\  \ \  \\\  \|___ \  \_\ \  \\\  \ \  \|\ /\ \   __/|    
  \ \    / / \ \  \\\  \ \  \\\  \   \ \  \ \ \  \\\  \ \   __  \ \  \_|/__  
   \/  /  /   \ \  \\\  \ \  \\\  \   \ \  \ \ \  \\\  \ \  \|\  \ \  \_|\ \ 
 __/  / /      \ \_______\ \_______\   \ \__\ \ \_______\ \_______\ \_______\
|\___/ /        \|_______|\|_______|    \|__|  \|_______|\|_______|\|_______|
\|___|/                                                                      

YOUTUBE RESPONSABLE*/



/*
 ________ ___    ___             ___  _____ ______   ________     
|\  _____\\  \  /  /|           |\  \|\   _ \  _   \|\   ____\    
\ \  \__/\ \  \/  / /___________\ \  \ \  \\\__\ \  \ \  \___|    
 \ \   __\\ \    / /\____________\ \  \ \  \\|__| \  \ \  \  ___  
  \ \  \_| /     \/\|____________|\ \  \ \  \    \ \  \ \  \|\  \ 
   \ \__\ /  /\   \                \ \__\ \__\    \ \__\ \_______\
    \|__|/__/ /\ __\                \|__|\|__|     \|__|\|_______|
         |__|/ \|__|                                              
                                                                  
FX IMAGENES*/

.seccion-item a{
	filter: sepia(95%) grayscale(10%) contrast(95%) saturate(95%) opacity(95%) brightness(95%) blur(0px)  ;
	transition:all .4s linear .01s;
}

.seccion-item a:hover{
	filter: sepia(15%) grayscale(0%) contrast(125%) saturate(125%) opacity(100%) brightness(100%) blur(0px);
}


/*FOTO CAPSULA ON:HOVER*/
                   
.foto-capsula img, .multimedia-nu img, .multimedia img{
	filter: sepia(15%) grayscale(5%) contrast(111%) saturate(105%) opacity(100%) brightness(100%) blur(0px);
	transition:all .3s linear .0s;
}

.foto-capsula:hover img:hover {
	sfilter: sepia(90%) grayscale(10%) contrast(95%) saturate(95%) opacity(95%) brightness(95%) blur(0px)  ;
	stransition:all .100s linear .0s;
}


/*
 ________ ___    ___             ___  _____ ______   ________     
|\  _____\\  \  /  /|           |\  \|\   _ \  _   \|\   ____\    
\ \  \__/\ \  \/  / /___________\ \  \ \  \\\__\ \  \ \  \___|    
 \ \   __\\ \    / /\____________\ \  \ \  \\|__| \  \ \  \  ___  
  \ \  \_| /     \/\|____________|\ \  \ \  \    \ \  \ \  \|\  \ 
   \ \__\ /  /\   \                \ \__\ \__\    \ \__\ \_______\
    \|__|/__/ /\ __\                \|__|\|__|     \|__|\|_______|
         |__|/ \|__|                                              
                                                                  
FX IMAGENES*/


/* SELECCIÓN */

::selection{
	color:rgba(51,0,51 ,1 );
	background-color:rgba(255,204,136 ,0.5 );
}
::-moz-selection{
	color:rgba(51,0,51 ,1 );
	background-color:rgba(255,204,136 ,0.5 );
}
::-webkit-selection{
	color:rgba(51,0,51 ,1 );
	background-color:rgba(255,204,136 ,0.5 );
}
a:focus{
	color:rgba(51,0,51 ,1 );
	background-color:rgba(255,204,136 ,0.5 );
}

/*
 _____ ______   _______   ________  ___  ________ 
|\   _ \  _   \|\  ___ \ |\   ___ \|\  \|\   __  \
\ \  \\\__\ \  \ \   __/|\ \  \_|\ \ \  \ \  \|\  \
 \ \  \\|__| \  \ \  \_|/_\ \  \ \\ \ \  \ \   __  \
  \ \  \    \ \  \ \  \_|\ \ \  \_\\ \ \  \ \  \ \  \
   \ \__\    \ \__\ \_______\ \_______\ \__\ \__\ \__\
    \|__|     \|__|\|_______|\|_______|\|__|\|__|\|__|
 ________  ___  ___  _______   ________  ___  _______   ________ 
|\   __  \|\  \|\  \|\  ___ \ |\   __  \|\  \|\  ___ \ |\   ____\ 
\ \  \|\  \ \  \\\  \ \   __/|\ \  \|\  \ \  \ \   __/|\ \  \___|_ 
 \ \  \\\  \ \  \\\  \ \  \_|/_\ \   _  _\ \  \ \  \_|/_\ \_____  \ 
  \ \  \\\  \ \  \\\  \ \  \_|\ \ \  \\  \\ \  \ \  \_|\ \|____|\  \ 
   \ \_____  \ \_______\ \_______\ \__\\ _\\ \__\ \_______\____\_\  \
    \|___| \__\|_______|\|_______|\|__|\|__|\|__|\|_______|\_________\
          \|__|                                           \|_________|

MEDIA QUERIES */

@media screen and (max-width: 960px)  /* LAPTOP 99.99% - 960px X 540px */ {
.contenedor-texto-galeria-emergente{
	width: 75%;
}
.texto-galeria-emergente{
	font-size:1.8em;
	line-height: 1.23em;
}
.loading {
	font-size: 3em;
}

}


@media screen and (max-width: 720px) {
.contenedor-texto-galeria-emergente{
	width: 85%;
}
.texto-galeria-emergente{
	font-size:2em;
	line-height: 1.20em;
}

}

@media screen and (max-width: 640px)  /* CELULARES GRANDES 66.66% - 640px X 360px */ {

#container{
	display:none;
}
#advertencia{
	display:flex;
	z-index:999999;
}
.advertencia{
	display:block;
}
.advertencia p{
	display:block;
}
.img-gira{
	display:block;
}

}

@media screen and (max-width: 480px) {

}

@media screen and (max-width: 320px) /* CELULARES PEQUEÑOS 33.33% - 320px X 570px */ {

}

@media screen and (max-width: 240px) {

}
