@charset "utf-8";
/* CSS Document */

/** {
	margin: 0;
	padding: 0;
}
*/
html{ height:100%; 
 }



body {
/*	background: #144bed;*/
	margin: 0;
	height:100%;
	display: flex;
	justify-content: flex-end;
	  display: -webkit-box;
      display: -moz-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      justify-content: center;
      align-items: center;
}

.limboFactory {
	height: 450px; 
    width: 368px; 
	z-index: 10;
	}
	
.limboDiv {

	z-index: 10;
	background-color:#154bec; 
    opacity: 0.8;
	min-width: 300px;
	max-width: 360px;
	width: 25%;
  	height: auto;
 	position: absolute;
	margin: 10px;
	padding: 20px;
	z-index: 1000;
	border: 6px solid #15de00;
	}
	
@media screen and (max-width: 580px) {
  .limboDiv {
    width: calc(100% - 80px);
		min-width: 200px;
			max-width: 360px;
  }
}
	

video {
	  background: rgb(20%, 40%, 90%);
	position:fixed;
	min-width: 100%;
	min-height: 100%;
	top: 50%;
	left:50%;
	transform: translateX(-50%)	translateY(-50%);
	z-index: -1;
	  -webkit-filter: brightness(30%); /* Safari */
  filter: brightness(30%);
  
/*    -webkit-filter: opacity(30%); 
  filter: opacity(30%);*/
 -webkit-filter: saturate(600%);
  filter: saturate(600%);
 /* -webkit-filter: invert(40%);
  filter: invert(40%);*/
    mix-blend-mode: darken;
	}
	video:after {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: linear-gradient(rgb(60%, 100%, 60%), rgba(40%, 20%, 60%, 50%));
  mix-blend-mode: darken;
}

.subtitulo{
	font-size: 1.2rem;
   font-family: 'Saira Semi Condensed';
   font-weight: 700; 
    font-style: normal;
	text-align: justify;
	color: #000000;
	line-height: 1.1rem;
	text-align: left;
	letter-spacing: -0.01em;
	}	
	
.cuerpo {
	font-family: 'Cuprum', sans-serif;
	FONT-WEIGHT: lighter;
	FONT-SIZE: 1rem;
	COLOR: #C5DEFE;
	line-height: 115%;
/*	letter-spacing: -0.02em;*/
	text-align: justify;
 /*	text-justify: inter-word;*/
	text-justify:inter-character;
	}	

.epigrafe {
	FONT-WEIGHT: normal;
	FONT-SIZE: 1rem;
	font-style: normal;
	font-family: 'Cuprum', sans-serif;
	TEXT-DECORATION: none;
	color: #15de00;
	line-height: normal;
}
	
.recolor {
  background: rgb(40%, 20%, 60%);
  border: 10px solid rgb(40%, 20%, 60%);
  display: inline-block;
  position: relative;
}
.recolor img {
  display: block;
  mix-blend-mode: lighten;
  filter: grayscale(100%);
}
.recolor:after {
  content: '';
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  background: linear-gradient(rgb(60%, 100%, 60%), rgba(40%, 20%, 60%, 50%));
  mix-blend-mode: darken;
}
	
a:link {
	color: #FC0;
}
a:visited {
	color: #FC0;
}
a:hover {
	color: #FFF;
}
	
	
.contenedor {
/*		background: #144bed;*/
		width: 100%;
		height:100%;
		margin: 0px auto;
        display: flex;
       /* align-items: center;*/
		align-items: start;
		justify-content: center;
    	align-items: center;
		 z-index: -100;
}



.logo {
/*	background: #144bed;*/

	text-align: center;
	width: 400px;
  	height: 560px;
 
 	position: absolute;
  	top: 50%;
  	left: 50%;
 
 	margin-top: -200px;   /* height/2 = 500px / 2 */
  	margin-left: -200px;  /* width/2 = 600px / 2 */
		z-index: 10;
}

#logo {
	text-align: center;
	text-align: center;
	width: 400px;
  	height: 600px;
 	position: absolute;
  	top: 50%;
  	left: 50%;
 	margin-top: -200px;   /* height/2 = 500px / 2 */
  	margin-left: -200px;  /* width/2 = 600px / 2 */
}

.tablalogo {
	width: 100%;
  	height: auto;
	
	}

.bordeTabla {
	border: 6px solid #15de00;
	background-color:#154bec; 
}

main {
/*	background-color: rgba (255,0,0,0.5);*/
	background-color:#154bec; 
    opacity: 0.8;
	width: 360px;
  	height: 450px;
 	position: absolute;
  	top: 50%;
  	left: 50%;
 	margin-top: -300px;   /* height/2 = 500px / 2 */
  	margin-left: -200px;  /* width/2 = 600px / 2 */
	z-index: 1000;
	}




/*#SLIDE_BG {
	width:100%;
	height:100%;
	background-position: center center;
	background-size: cover;
	background-repeat:no-repeat;
	backface-visibility:hidden;
	animation: slideBg 14s linear infinite 1s;
	animation-timing-function: ease-in-out;
	background-image: url('../img/01.jpg');
	}
	
@keyframes slideBg{ 
	0% { background-image: url('../img/01.jpg');
	}
	25% { background-image: url('../img/02.jpg');
	}
	50% { background-image: url('../img/03.jpg');
	}
	75% { background-image: url('../img/04.jpg');
	}
	100% { background-image: url('../img/05.jpg');
	}


}*/



@media (max-width: 768px) and (max-heigth: 500px) {
    .textoLeft {
        font-size: 50px;
    }
}