@font-face {
font-family: Ubuntu Regular;
src:url(fonts/ubuntu/Ubuntu-R.ttf);
}

@font-face {
font-family: Ubuntu Light;
src:url(fonts/ubuntu/Ubuntu-L.ttf);
}

@font-face {
font-family: Ubuntu Bold;
src:url(fonts/ubuntu/Ubuntu-B.ttf);
}

@charset "utf-8";

body{
	margin   : 0px;
	padding  : 0px;
	width    : 100%;
	height   : 100%;
	font-size: 16px;
}

html{
	margin : 0px;
	padding: 0px;
	width  : 100%;
	height : 100%;
}

h1 {
	font-size  : 2em;
	font-family: Ubuntu Regular;
	color      : #000;	

}

h2 {
	font-size  : 2em;
	font-family: Ubuntu Light;
	color      : #000;
    letter-spacing: 4px;


}

h3{
	font-size  : 1.2em;
	font-family: Ubuntu Light;
	color      : #000;
}

p{
	font-size  : 1.1em;
	font-family: Ubuntu regular;
	line-height: 1.5em;
	color      : #000;

}

h6{
	font-family: Ubuntu Bold;
	text-align: center;
	color: #5E5E5E;
	font-size: .7em;
}



#logo1{
	width      : 150px;
	position   : fixed;
	margin-left: 5px;
	margin-top : 0px;
	left: 10px;
}

#logo2{
	width      : 180px;
	position   : fixed;
	right: 20px;
	margin-top : 0px;
}

#nav{
	background-color: rgba(255,255,255,.8);
	position: fixed;
	height: 50px;
	padding-top: 5px;
	padding-bottom: 5px;
	z-index: 10;
}
.grupo{
	max-width: 1100px;
}

.ed-menu.nav-bar{
	padding-top: 10px;
	border: none;
}
.web-horizontal.nav-bar > li{
	border: 0px;
	background-color: none;
	height: auto;
}

.ed-menu.default, .ed-menu.nav-bar{
	background-color: transparent;
}


/*------menu-2000------*/

#menu{
	margin: 0px;
	padding: 0px;
}

label{
	cursor: pointer;
	display: none;
}
label img{
	width: 35px;
	margin-top: 7px;
}

#btn-menu{
	display: none;
}

#menu ul{
	list-style: none;
	padding: 0px;
	display: flex;
	width: auto;
	margin-top: 10px;


}

#menu ul li{
}

#menu ul h6{
	margin-top: 0px;
	margin-bottom: 20px;
	margin-left: 3vw;
	margin-right: 3vw;
	color: #8E8E8E;
	transition: all .3s;
}
#menu ul h6:hover{
	color: #000;
}


#menu ul ul{
	margin-top: 0px;
	display: none;
	width: auto;
	margin-left: 0px;
}

#menu ul ul p{
	text-transform: uppercase;
	font-size: .7em;
	padding: 15px 20px;
	background-color: rgba(255,255,255,.8); 
	transition: all .3s;
	color: #8E8E8E;
}

#menu ul ul p:hover{
	background-color: rgba(23,23,32,1);
	color: #fff;
}

#menu a{
	display: block;
}


#menu ul li:hover ul{
	display: block;
	position: absolute;
}


@media (max-width: 768px) {
	label{
		display: block;
	}
	#menu{
		position: absolute;
		top: 50px;
		left: 0px;
		width: 100%;
		transform: translateX(-100%);
		transition: all .3s;
	}
	#menu ul{
		padding: 10px;
		box-sizing: border-box;
		display: block;
		background-color: rgba(255,255,255,1); 
	}
	#menu ul h6{
		font-size: .8em;
		padding: 15px 15px;
		color: rgba(23,23,32,1);
	}
	#menu ul li:hover ul{
		display: none;
		position: static;
	}

	#btn-menu:checked ~ #menu{
		transform: translateX(0%);

	}

	#menu ul ul{
	}

	#menu ul ul p{
		background-color: rgba(23,23,32,.5);
		color: #fff;
		border: 1px solid rgba(23,23,32,.5);
		text-align: center;
	}

}





#des img{ 
	height: 25px;
	margin-top: 10px;
}

#cer img{
	height: 25px;
	margin-top: 100px;
}




.arrow-m{
	width: 15px;
}


@media (max-width: 768px) {
	#menu h2{
		font-size: 1.1em;
	}
}


/*#menu-float{
	position: fixed;
	display: block;
	margin-top: 40vh;
	z-index: 1000;
	right: 0px;
	text-align: center;
}

#float-1{
	width: 20px;
	background-color: #8A8A8A;
	display: inline;
	text-align: center;


}
*/

/*------uno------*/




#uno{
	height: 100%;
/*	background: url(imgs/prueba/prueba-fondo.jpg) no-repeat bottom;	
*/	background-size: cover; 
	background-attachment: fixed bottom;
	position: relative;
}

#cero{
	background: url(imgs/prueba/pruebas/uno.gif) no-repeat;
	background-size: cover;
	background-repeat:no-repeat; /* Indicamos que no se repetira */
	background-attachment: fixed bottom; /* Establecemos una posicion fija para la imagen */
	width: 100%;
	height: 320px;
	float: left;
	position: relative;
	text-align: center;
	background-opacity: 1;
	background-color: #fff;
	top:8vh;
}

#des-uno{
	margin-top: 45vh;
	display: inline-block;
	height: auto;
	text-align: center;
	bottom: 0px;
}


#des-uno h1{
    border-bottom: 2px solid #00ffaa;
    padding-bottom: 15px;
	font-size:5em;
	color: white;
    opacity: .6;
	text-shadow:
    3px 3px 0 #00ffaa,
   -1px -1px 0 #00ffaa,  
    1px -1px 0 #00ffaa,
   -1px  1px 0 #00ffaa,
    1px  1px 0 #00ffaa;
    letter-spacing: 3px;
}

#des-uno p{
	color: #323232;
    text-shadow: 3px 3px 40px #B1B1B1;
	font-size: 1.1em;
}

.arrow{
	bottom: 0px;
	position: relative;
	text-align: center;
	height: 50px;
}

#arrow img{
	transition: .5s;
	height: 25px;
	opacity: .5;
}

#arrow img:hover {
	opacity: 1;	
}

@media (min-width: 768px) {

	#des-uno {
		margin-top: 35vh;
	}
	p {
		font-size: 1em;
	}

	#menu ul ul p{
		text-transform: uppercase;
		font-size: .7em;
	}
}

@media (min-width: 1025px) {

	#des-uno {
		margin-top: 45vh;
	}
	p {
		font-size: .9em;
	}

	#menu ul ul p{
		text-transform: uppercase;
		font-size: .7em;
	}
}

@media (min-width: 1400px) {
	p {
		font-size: 1.1em;
	}

	#menu ul ul p{
		text-transform: uppercase;
		font-size: .7em;
	}
}



/*------dos------*/

#dos{
	background-color: #fff;
	height: 100vh;
}

#dos img{
	margin-top: 5vh;
	height: auto;
}



#des-dos{
	background-color:  rgba(23,23,32,1);
	bottom: 0px;
	padding-top: 10vh;
	margin-bottom:0px;


}

#des-dos h2{
	line-height: 1em;
	height: 0px;
	color: white;
	font-size: 2em;
    border-bottom: 1px solid #00ffaa;
    padding-bottom: 70px;
    text-align: center;

}

#estructura h2{
	line-height: 1.5em;
	height: 0px;
	color: #8E8E8E;
    border-bottom: 1px solid #8E8E8E;
    padding-bottom: 70px;
    text-align: center;
    margin-top: 10vh;

}

#des-dos p{
	color: #fff;
	line-height: 2em;
	text-align: left;
	padding-top: 20px;
	padding-bottom: 50px;
	font-size: 1.1em;

}

#arrow-2{
	text-align: center;
}

#arrow-2 img{
	min-width: 0px;
	margin-top: 0px;
	transition: .5s;
	height: 25px;
	opacity: .5;
}

#arrow-2 img:hover{
	opacity: 1;
}



@media (max-width: 768px) {

	
	#logo2{
		width: 100px;
	}

	#des-uno h1{
		font-size: 3.5em;
		border-bottom: none;
	}

	#estructura{
		margin-bottom: 50px;
	}

	#estructura img{
		margin-top: 5vh;
	}

  	#dos {
    	height: auto;
  	}

  	#des-dos p{
  		padding-bottom: 100px;
  	}

}

@media (max-height: 700px) {
	#estructura img{
		margin-top: 5vh;
	}

}

@media (max-width: : 1400px) {
	#estructura img{
		margin-top: 10vh;
	}

}


/*------dos_------*/

#dos-{
	background-image: url(imgs/vison/par-cachorros.jpg) ;
	background-size: cover;
	background-repeat:repeat; /* Indicamos que no se repetira */
	background-attachment: fixed; /* Establecemos una posicion fija para la imagen */
	width: 100%;
	height: 250px;
	float: left;
	position: relative;
	text-align: center;
	background-opacity: 1;
	background-color: #fff;
	padding-top: 100px;
}

#dos- p{
	font-size: 1.1em;
	line-height: 1.8em;
}


/*------tres------*/

#tres{
	padding-top: 10vh;
	background-color: rgba(23,23,32,1);
	height: auto;
	position: relative;
}




.fieb{
	color: #00ffaa;
	font-size: 2em;
	margin-top: 15px;
}

#tres a{
	opacity: .6;
	transition: .5s;
}

#tres a:hover{
	opacity: 1;
}



#tres p{
	color: #fff;
	line-height: 2em;
	font-size: 1.1em;
}

#tres h2{
	color: #fff;
    border-bottom: 1px solid #00ffaa;
    padding-bottom: 5vh;
    margin-bottom: 5vh;
    text-align: center;

}

#tres h3{
	color: #fff;
	text-align: center;
}

#des-g{
	margin-bottom: 5vh;
	text-align: center;
}



#graficas{
	margin-top: 50px;
	height: auto;
}


#graficas h3 {
	color: #B3B3B3;
}

#graficas h3 a{
	color: #B3B3B3;
	opacity: 1;
}



#plano {
	border: solid 1.5px #00ffaa;

}

#plano-img{
	background-image: url(imgs/desc/prueba/map-bn.png);
	background-size: cover;
	background-position: center;
	height: 300px;
	cursor: pointer;
	opacity: .8;
	transition: .5s;
	width: 100%
}

#plano-img:hover{
	opacity: 1;
}



#infra{
	margin-bottom: 2px;
	border: solid 1.5px #00ffaa;
	height: 300px;
	margin-top: 10px;
}

#infra-img{
	background-image: url(imgs/desc/prueba/infra-1.jpg);
	background-size: cover;
	height: auto;
	background-position: center;
	cursor: pointer;
	opacity: .6;
	transition: .5s;
	width: 100%
}

#infra-img:hover{
	opacity: 1;
}



#dash{
	margin-top: 2px;
	border: solid 1.5px #00ffaa;
	height: 300px;
	margin-top: 10px;
	transition: .5s;
}

#dash:hover{
	border: solid 2.5px #00ffaa;

}

#dash-img{
	background-image:url(imgs/desc/prueba/dash1.png);
	background-size: cover;
	background-position: center;
	cursor: pointer;
	opacity: .6;
	transition: .5s;
	height: auto;
	width: 100%;
}

#dash-img:hover{
	opacity: 1;
}





#content{
	padding-top: 10%;
	padding-bottom: 10%;

}

ul.img-list {
  list-style-type: none;
  margin: 0;
  padding: 0;
  text-align: center;
}

ul.img-list li {
  display: inline-block;
  margin: 0 1em 1em 0;
  position: relative;
  height: 350px;
  width: 100%;
}

span.text-content {
  background: rgba(0,0,0,0.7);
  color: #00ffaa;
  cursor: pointer;
  display: table;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  height: 300px;
  opacity: 0;
  -webkit-transition: opacity 500ms;
  -moz-transition: opacity 500ms;
  -o-transition: opacity 500ms;
  transition: opacity 500ms;
}

span.text-content span {
	font-family: Ubuntu Regular;
    letter-spacing: 5px;
  display: table-cell;
  text-align: center;
  vertical-align: middle;
  font-size: 2.7em;
}

ul.img-list li:hover span.text-content {
  opacity: 1;
}








@media (max-width: 800px) {

	span.text-content span {
		font-family: Ubuntu Regular;
		display: table-cell;
		text-align: center;
		vertical-align: middle;
		font-size: 2em;
	}

	span.text-content {
		opacity: .8;
	}
	#graficas{
		margin-top: 25px;
		height: auto;
	}




}

@media (max-width: 480px) {

	span.text-content span {
		font-family: Ubuntu Regular;
		display: table-cell;
		text-align: center;
		vertical-align: middle;
		font-size: 1.5em;
	}

	span.text-content {
		opacity: .8;
	}
	#graficas{
		margin-top: 25px;
		height: auto;
	}




}
/*.vertical-line{
	width: 1px;
	background-color: white;
	border: .5px inset;
	height: 300px;
}
*/


#arrow-3{
	margin-top: 10vh;
	margin-bottom: 5vh;
	bottom: 0px;
	text-align: center;
	position: relative;
}

#arrow-3 img{
	min-width: 0px;
	margin-top: 0px;
	transition: .5s;
	height: 25px;
}

#arrow-3 img:hover{
	opacity: 1;
}



/*------dos_------*/

#tres-{
	background-image: url(imgs/vison/mod.jpg) ;
	background-size: cover;
	background-repeat:repeat; /* Indicamos que no se repetira */
	background-attachment: fixed; /* Establecemos una posicion fija para la imagen */
	width: 100%;
	height: 300px;
	position: relative;
	text-align: center;
	padding-top: 125px;
}

#dos- p{
	font-size: 1em;
	line-height: 1.8em;
}




/*------cuatro------*/

#cuatro{
	background-color: rgba(225,225,225,.1);
	padding-top: 10vh;
	padding-bottom: 20vh;
	position: relative;
}



#cuatro h2{
    border-bottom: 1.5px solid #00ffaa;
    padding-bottom: 5vh;
    margin-bottom: 5vh;
    text-align: center;

}

#cuatro h3{
	text-align: center;
	padding-top: 2vh;
}

#cuatro h5{
	font-family: Ubuntu Regular;
	text-align: center;
	color: #5E5E5E;
	font-size: .7em;
}

#cuatro p{
	text-align: center;
	line-height: 2em;
	color: #8E8E8E;
	margin-top: 5vh;
}

#vison{
	opacity: .7;
	transition: .6s;
}


#vison:hover{
	opacity: 1;
}

#lechuza{
	opacity: .7;
	transition: .6s;
}

/*#lechuza:hover{
	opacity: 1;
}*/

#lemur{
	opacity: .7;
}

#cuatro .caja{
	margin-bottom: 20px;
}

#cuatro .caja{
	margin-top: 20px;
}



/*------cuatro_------*/

#cuatro-{
	background-image: url(imgs/parallax/fondo-blanco.gif) ;
	background-size: cover;
	background-repeat:repeat; /* Indicamos que no se repetira */
	background-attachment: fixed; /* Establecemos una posicion fija para la imagen */
	width: 100%;
	height: 250px;
	float: left;
	position: relative;
	text-align: center;
	background-opacity: 1;
	background-color: #fff;
	padding-top: 80px;
}

#cuatro- h1{
	font-size: 1.7em;
	line-height: 2.5em;
    border: 1px solid;
    transition: .3s;
    letter-spacing: 4px;

}

#cuatro- h1:hover{
    border: 2px solid #ff0080;

}





/*------footer------*/

footer{
	background-color: #fff;
	bottom: 0;
	float: left;
	width: 100%;
	position: relative;
	overflow: hidden;


}

footer h2{
    border-bottom: solid thick  #F7F2F4;
    margin-top: 20px;
    padding-left: 2%;
    padding-bottom: 10px;
    color: black;
}


#cont {
	text-align: center;
	padding-top: 10vh;
	padding-bottom: 10vh;
}

#cont p{
	font-size: 1em;
}

#cont a{
	color: #ff0080;
    text-decoration: underline;
}

#log-con{
	margin-bottom: 50px;
}

#fieb-con img{
	width: 100px;
	padding-top: 2%;
}

#tfca-con img{
	width: 200px;
	padding-top: 10%; 
}

#copy {
	bottom: 0px;
	background-color: rgba(28,29,36,1);
	margin-top: 20px;
	padding-top: 15px;
	padding-bottom: 15px;
	padding-left: 2%;
	color:  #00ffaa;


}

#by{
	text-align: right;
	font-family: Ubuntu Light;
}


@media (max-width: 768px) {
	
	#tres{
		padding-bottom: 5vh;
	}

	#cuatro{
	padding-bottom: 15vh;
	}
	#cuatro img{
		margin-top: 5vh;
	}
	#cuatro h2{
    	margin-bottom: 0;
	}
	#tfca-con{
		margin-top: 15px;
	}
	#cont {
		padding-top: 8vh;
		padding-bottom: 5vh;
	}
	#dos-{
		background-position: fixed;
		height: 200px;
	}
	#tres-{
		background-position: fixed;
		height: 200px;
	}
	#cuatro-{
		background-position: fixed;
	}
  
}