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

* {	padding: 0;
	margin: 0;}


#estructura1{ width:100%;        min-width: 100%;
			  height:48.4vw;     min-height: 48.4vw;
			  display:flex;
			  top:6.1vw;
			  position:relative;
			  margin: auto;}

/*-------------------------------------------------------------------------------------------------------------------------*/

#estructura2{ width: 100%;	min-width: 100%;
			  height: 39vw;	min-height: 36vw;
			  display: flex;
			  position: relative;
			  margin: auto;
			  background-image: -webkit-linear-gradient(179deg,rgba(4,100,214,1.00) 0%,rgba(92,185,207,1.00) 85.49%);
			  background-image: -moz-linear-gradient(179deg,rgba(4,100,214,1.00) 0%,rgba(92,185,207,1.00) 85.49%);
			  background-image: -o-linear-gradient(179deg,rgba(4,100,214,1.00) 0%,rgba(92,185,207,1.00) 85.49%);
			  background-image: linear-gradient(271deg,rgba(4,100,214,1.00) 0%,rgba(92,185,207,1.00) 85.49%);}




.container2{ width: 100%;
		     height: auto;
		     display: flex;
		     flex-direction: row;
		     justify-content: space-around;
		     flex-flow:nowrap;}




.box1{ width:50vw;    min-width: 46vw;
	   height: 36vw;  min-height: 26vw;
	   margin: 1.6%;
	background-image: url(../../img/margen.png);
	background-size: 100% 100%;
	   position: relative;
	   top: 1.7%;
	   left: -1%;
	   box-sizing: 10px;}
	



.box2{ width:40vw;    min-width: 40vw;
	   height: 30vw;  min-height: 26vw;
	   top: 5.2vw;
	   background-image: url(../../img/unidos.jpg);
	   background-size: 100% 100%;
	   background-repeat: no-repeat;
	   position: relative;
	   left: -0.9%;
	   box-sizing: 10px;}

	
.inicio{
	width: 100%;
	color: white;
	font-size: 6.5vw;
	text-align: center;
	margin-top: 4%;
	font-family: Calibri;
	font-weight: inherit;
}




h3{ font-size: 2.4vw;
	width: 84%;
	position: relative;
	color: white;
	left: 7.2%;
	top: -1%;
	text-align:justify;}
/*-------------------------------------------------------------------------------------------------------------------------*/

#estructura3{ width: 100%;	    min-width: 100%;
			  height: 62vw;  	min-height: 62vw;
			  display: flex;
			  position: relative;
			  margin: auto;
			  background-image: -webkit-linear-gradient(179deg,rgba(200,78,35,1.00) 10.36%,rgba(143,5,5,1.00) 89.12%);
              background-image: -moz-linear-gradient(179deg,rgba(200,78,35,1.00) 10.36%,rgba(143,5,5,1.00) 89.12%);
			  background-image: -o-linear-gradient(179deg,rgba(200,78,35,1.00) 10.36%,rgba(143,5,5,1.00) 89.12%);
			  background-image: linear-gradient(271deg,rgba(200,78,35,1.00) 10.36%,rgba(143,5,5,1.00) 89.12%);}



.container3{ width: 100%;
		     height: auto;
		     display: flex;
		     flex-direction: row;
		     justify-content: space-around;
		     flex-flow:nowrap;}


/*-------------------------------------------------------------------------------------------------------------------------*/


.box3{ width:54vw;    min-width: 40vw;
	   height: 35vw;  min-height: 35vw;
	   background-image: url( ../../img/capacitados.png);
	   background-size: 100% 100%;
	   overflow: hidden;
       position: relative;
       top: 14.8vw;
	   left: 5.3vw;
	   box-sizing: 10px;}



.cajaH2{ width: 100%;
		 height: 29vw;
		 position: relative;
		 top: 4.6%;}



.ParrafoE4 { width: 90%;
			 font-size: 2.3vw;
			 position: absolute;
			 top: 3.6%;
			 left: 4.8%;
			 text-align: justify;}

/*-------------------------------------------------------------------------------------------------------------------------*/

.box4{ width:50vw;      min-width: 50vw;
	   /* para alargar el texto*/
	   height: 77vw;    min-height: 77vw;
	   margin: 3.9%;
	   left: 3vw;
	background-image: url(../../img/margen.png);
	background-size: 100% 72%;
	   background-repeat: no-repeat;
	   position: relative;
	   overflow: hidden;}




.vision{
	font-size: 5vw;
	top: -4vw;
	position: relative;
	text-align: center;
	font-family: Calibri;
	font-weight: inherit;
}



.PV{ width: 90%;
	 height: 45vw; 
	 top: -4vw;
	 left: 1vw;
	 position: relative;
	 overflow: hidden;}


.parrafovision{  color: white;
				 width: 92%;
				 height: 20vw;
				 position: absolute;
				 text-align: justify;
				 font-size:2.3vw;}




.mision{ font-size: 5vw;
		 top: 5.3vw;
		 position: relative;
	     text-align: center; }




.PM{ width: 90%;
	 height: 21vw;/* texto*/
	 top: 5.4vw;
	 left: 2.2vw;
	 position: relative;
	 overflow: hidden;}




.parrafomision{  width: 93%;height: 20vw;
				 position: absolute;	
				 color: white;
				 left: 1.4vw;
				 text-align: justify;
				 font-size:2.3vw;}

/*-------------------------------------------------------------------------------------------------------------------------*/

#estructura4{ width: 100%;	min-width: 100%;
			  height: 37vw;	min-height: 37vw;
			  display: flex;
			  position: relative;
			  margin: auto;
			  background-image: -webkit-linear-gradient(183deg,rgba(23,92,95,1.00) 2.07%,rgba(129,212,216,1.00) 97.41%);
			  background-image: -moz-linear-gradient(183deg,rgba(23,92,95,1.00) 2.07%,rgba(129,212,216,1.00) 97.41%);
			  background-image: -o-linear-gradient(183deg,rgba(23,92,95,1.00) 2.07%,rgba(129,212,216,1.00) 97.41%);
			  background-image: linear-gradient(267deg,rgba(23,92,95,1.00) 2.07%,rgba(129,212,216,1.00) 97.41%);}



.container4{ width: 100%;
		     height: auto;
		     display: flex;
		     flex-direction: row;
		     justify-content: space-around;
		     flex-flow:nowrap;}


/*-------------------------------------------------------------------------------------------------------------------------*/


.box5{ width:54vw;    min-width: 40vw;
	   height: 35vw;  min-height: 35vw;
	   background-image: url( ../../img/mundo.png);
	   background-size: 72% 98%;
	   background-repeat: no-repeat;
	   position: relative;
	   overflow: hidden;
	   top: 1vw;
	   left: 2vw;
	   box-sizing: 10px;}


.h1{ width: 100%;	
	 color: white;}


.tituloE4{ font-size: 4vw;
		   text-align: center;}


.cajaH2{ width: 100%;
		 height: 29vw;
		 position: relative;
		 top: 4.6%;}



.ParrafoE4 { width: 90%;	
			 color: white;
			 font-size: 2.3vw;
			 position: absolute;
			 top: 3.6%;
			 left: 4.8%;
			 text-align: justify;}

/*-------------------------------------------------------------------------------------------------------------------------*/

.box6{ width:45vw;    min-width: 40vw;
	   height: 35vw;  min-height: 35vw;
	   top: 2.3vw;
	   background-image: url(../../img/margen.png);
	   background-size: 100% 94%;
	   background-repeat: no-repeat;
	   margin-left: -10vw;
	   position: relative;
	   overflow: hidden;}


.materia{ font-size: 5vw;
		  margin-top: 3.8vw;
		  text-align: center;}



.parrafomateria{
	color: white;
	width: 84%;
	height: 50vw;
	position: absolute;
	left: 3.3vw;
	text-align: justify;
	font-size: 2.3vw;
	font-family: "Source Sans Pro Semibold";
	font-style: normal;
	font-weight: 400;
}


.cajaparrafo{ width: 100%;
		 	  position: relative;
			  height: 55vw;}



/*-------------------------------------------------------------------------------------------------------------------------*/
footer{  width:100%;   min-width: 100%;
	     height:6vw;   min-height:6vw;
		 background-color:#353535;
		 box-shadow: 1px 2px 3px 4px #212121;
		 position:relative;}



.iconos{ width: 60%;
		 height:5.1vw;
		 top: 7%;
		 left: 19vw;
		 position: relative;
		 display: flex;
		 flex-direction: row;
		 justify-content: space-around;
		 flex-flow: nowrap;}


/*-------------------------------------------------------------------------------------------------------------------------*/

.facebook{ width:5.4vw;    min-width: 5.4vw;
		   height: 100%;   min-height: 100%;
		   background-image: url(../../img/face.png);
		   background-size: 100% 100%;
		   background-repeat: no-repeat;
		   box-sizing: 10px;
	       border-radius: 100% 100% 100% 100%;}


/*-------------------------------------------------------------------------------------------------------------------------*/


.instragram{ width:5.4vw;    min-width: 5.4vw;
		     height: 100%;   min-height: 100%;
		     background-image: url( ../../img/Ins.png);
		     background-size: 100% 100%;
		     background-repeat: no-repeat;
		     box-sizing: 10px; 
		     border-radius: 100% 100% 100% 100%;}

/*-------------------------------------------------------------------------------------------------------------------------*/


.twiter{ width:5.4vw;    min-width: 5.4vw;
	     height: 100%;   min-height: 100%;
 		 background-image: url( ../../img/Tw.png);
		 background-size: 100% 100%;
		 background-repeat: no-repeat;	    
		 box-sizing: 10px;
 	     border-radius: 100% 100% 100% 100%;}