body{
    margin: 0;
    padding: 0;
}

.conta {

    display:flex;
  position:relative;
  align-items:center;
  justify-content:center;



}

/*INICIA directores*/




.direc {
 flex-wrap: wrap; 

; }


  .direc  {  display:flex ;
  align-items:  center;
  justify-content: left;
margin-top:100px;
font-family: Arial, sans-serif;
	width:100%;
}


.direc  li  {
flex: 1 1 300px; /* mínimo 300px, se expande según espacio */ margin: 0px;
	width: 100%;
    	height: auto;
font-family: Arial, sans-serif;
    	overflow: hidden;
   	position: relative;
	margin-top:10px;	
	margin-bottom:0px;
	margin-left: 0px;
	margin-right: 0px;
        border:3px solid #fff;

box-shadow: 1px -1px 20px rgba(0,0,0,0.2);
        transition: all 400ms linear;  
      


color:#fff;
border-radius:30px;
background: #03729E;
background: linear-gradient(90deg,rgba(3, 114, 158, 1) 0%, rgba(0, 0, 0, 0.73) 2%, rgba(3, 114, 158, 1) 57%);

}
       




.direc h3{
    position: relative; 
 overflow-wrap: normal;
 right: 50px;
top:120px;
 
font-family: Arial, sans-serif;
    width: 90%;
    height: 100%;

font-size: 20px;
line-height: 130%;
     color: #fff;
 text-decoration:none;
text-align: right;
font-weight:100;
letter-spacing:2px; 

  
}





.direc h3 span{
line-height: 130%;
 margin-bottom:140px;
font-size: 35px;

     color: #fff;


  
}



.direc img{
  transition: all 1s linear;
  float:right;
 filter: opacity(100%);
 z-index:-10;
}



.direc img:hover{
filter: opacidad(80%) contrast(0.2);
}
  



.direc li:hover{

border: 3px solid #fff;
border-radius:30px;
box-shadow: -1px -1px 16px rgba(171,176,192,0.6);
  transition: all 1s linear;
}







.img-responsive {
    display: block;
    max-width: 100%;
    height: auto;
}


.image {
    display: block;
    max-width:50%;
    height: auto;

}

 .objetivo {  display:flex ;

  align-items:  center;
  justify-content: center;
      width:100%;
margin-left:0px;
font-family: Arial, sans-serif;

}

.objetivo{
    position: relative; 
    display:block;
      background-color:  rgba(0, 93, 181, 0.01); 
      width:100%;
      height: auto;
      padding:20px;
      font-size: 17px;
      margin-bottom:30px;
box-shadow: -2px 5px 10px rgba(96,100,105,0.5);
      border-radius:15px 15px 0 0px;
      border-bottom: 5px solid #03729E;
      
}
/*FIN directores*/


 /*INICIO Subdirectores*/

.sub { display: flex;
 flex-wrap: wrap; 
   align-items:  left;
 justify-content: center;
 overflow-wrap: normal;

 }
 .sub { 
 margin-top:0px;
 	margin-left: 30px;
	margin-right: 0px;

 
 }


.sub li {

        float:left;
	display:block;
	width:100%;
    	height:130px;
      

   	position: relative;

	margin-bottom:30px;
margin-left:-40px;
  
box-shadow: 5px 5px 30px rgba(0,0,0,0.1);

      
  background: linear-gradient(90deg, rgba(255,255,255,0.5) 0%, rgba(34,126,145,0.0) 100%);

border-radius:10px 10px 10px 10px;

  




}
       

 


.sub h6{

    position: absolute;
 z-index:3;


 font-family: 'Poppins', sans-serif;
  
    width: 100%;
    height: 300px;
    top: 5%;
padding:35px;
font-size: 17px;
line-height: 140%;

 background: linear-gradient(90deg,rgba(0, 97, 174, 0.0) 10%, rgba(0, 97, 174, 0.0) 100%);
     color: #043C61;
 text-decoration:none;
text-align: center;
font-weight:600;
letter-spacing:1px;
border-radius:10px 0px 0px 10px;
  
}









.image {
    display: block;
    max-width:50%;
    height: auto;

}



.inferior {
 display: grid;

 background-color:  rgba(0, 97, 174, 0.08); 


      
border:5px solid #E6F4FF;

  


 height: auto;



}



.tit { display: flex;
 flex-wrap: wrap; 
   align-items:  center;
 justify-content: center;
   flex-grow: 1;

 
 }



.tit {
  
    width:100%;
    
  text-align:  center;

	font-family:Myriad pro, Arial, Tahoma;
	font-size:25px; 
letter-spacing: 2px;	
	color:#fff;
	display:block;
	outline:0;
	text-decoration:none;
        padding: 20px;
    margin-bottom:0px;
	 border-radius: 5px;
	 font-weight:700;
	text-shadow: 1px 1px 1px #9da3b5;
	box-shadow: 3px 3px 1px #dce8eb;	
       
background-color:  rgba(0, 97, 174, 0.5);
 }








#btnOtros

{  
    display: flex;
  align-items: center;
  justify-content: center;
font-family:Arial;


margin-bottom:30px;

	


}



#btnOtros span{
	display:block;
    font-family: 'Arial', cursive;
    text-decoration:none;
    font-size:20px;
line-height: 1.4;
font-weight:500;
    text-align: center;
	width: 200px;
	color:#000;

}



#btnOtros li

{ 
       float:left;
	display:inline;
margin:80px;
	color:#03729E;
	text-align:center;

} 




#btnOtros li a 

{ 
	margin-left: 30px;
	margin-right: -20px;
 text-align:center;
   border:1px solid #8caab0;
	border-radius:140px;
    	width: 140px;
    	height: 140px;
  overflow:hidden ;
    cursor: pointer;
    transition: all  300ms;
	font-size:30px; 
	color:#000;
	display:block;
	outline:0;
	text-decoration:none;
     

	font-weight:700;
	box-shadow: 3px 5px 10px #D3D9E0;
      
	background: #fff;
		 -webkit-transition: color .4s linear; -moz-transition: color .4s linear; -ms-transition: color .4s linear; -o-transition: color .4s linear; transition: color .4s linear;    transition: all 300ms;}

#btnOtros img{
    display: inline-block;
   width:150px;


    opacity: 10%;

}

#btnOtros li a img{
opacity: 5;

}

#btnOtros li a:hover 
{ background: rgba(53,122,136,0); color: #333; webkit-transition: color .4s linear; -moz-transition: color .4s linear; -ms-transition: color .4s linear; -o-transition: color .4s linear; transition: color .4s linear; 
    transition: all 300ms;
transform: scale(1.1);}    
    

#btnOtrosli a:active {
  color:#9489f5;
}







.deptos {
       position:relative;

	display:block;
width:100%;

font-family: 'Arial', sans-serif;

	margin-bottom:10px;




}



 .deptos ul {
  list-style: none;
	
  display: inline;
}


.deptos li  {

        float:left;
	display:block;
	width:38%;
    	height:230px;
      
  
   	position: relative;
	margin-top:40px;	
	margin-bottom:30px;
	margin-left: 120px;
	margin-right: 0px;
 
  
box-shadow: 5px 5px 30px rgba(0,0,0,0.1);

      
  background: linear-gradient(90deg,rgba(0, 97, 174, 0.4) 0%, rgba(0, 97, 174, 0.01) 100%);

border-radius:10px 0px 60px 10px;
/*transition:  0.5s ease-in-out;*/
transition: all 400ms linear;  

}
       






.deptos h6{
    position: absolute;
 z-index:3;



 font-family: 'Poppins', sans-serif;
    right: 20%;
    width: 85%;
    height: 100%;
    top: 5%;
padding:35px;
font-size: 15px;
line-height: 140%;

 background: linear-gradient(90deg,rgba(0, 97, 174, 0.2) 10%, rgba(0, 97, 174, 0.0) 100%);
     color: #043C61;
 text-decoration:none;
text-align: right;
font-weight:700;
letter-spacing:.5px;
border-radius:10px 0px 0px 10px;
  
}



.deptos h6 span{

 margin-bottom:px;
font-size: 20px;

     color: #043C61;


  
}



.deptos li:hover{

border: px solid #fff;

box-shadow: -1px -1px 16px rgba(171,176,192,0.3);

transition: all 400ms linear;  
}


.deptos img{
 float:right;
width:28%;
	height:auto;
margin-right:-30px;
margin-top:-20px;
 background: linear-gradient(50deg,rgba(0, 97, 174, 0.03) 30%, rgba(0, 97, 174, 0.8) 80%);   

box-shadow: 5px 5px 30px rgba(0,0,0,0.2);
border-radius:50% ;
padding:8px 20px;
transition: all 400ms linear;  
  
}


.deptos img:hover{
    background: linear-gradient(90deg,rgba(0, 97, 174, 0.8) 20%, rgba(0, 97, 174, 0.03) 100%);
transform: scale(1.1);
filter: opacity(90%);

transition: all 400ms linear;  
  
}




.subdi { display: flex;
 flex-wrap: wrap; 
   align-items:  center;
 justify-content: center;
  

 
 }

   .subdi  {  display:flex ;
   overflow-wrap: normal;

  text-align: center;
   align-items:  center;
 justify-content: center;
 

font-family: Arial, sans-serif;

}


 .subdi ul {
  list-style: none;
	
  display: inline;
}


.subdi li  {


	display:block;
	width:65%;
    	height:300px;
      

   	position: relative;
	margin-top:150px;	
	margin-bottom:30px;

 
  
box-shadow: 5px 5px 30px rgba(0,0,0,0.1);

      
  background: linear-gradient(90deg,rgba(0, 97, 174, 0.4) 0%, rgba(0, 97, 174, 0.01) 100%);

border-radius:10px 0px 60px 10px;

transition: all 400ms linear;  

}

   .subdi2 li  {        	height:150px;
   border-radius:10px;}


.subdi h6{
    position: absolute;
 z-index:3;



 font-family: 'Poppins', sans-serif;
    right: 30%;
    width: 68%;
    height: 90%;
    bottom:-10%;
padding:35px;

font-size: 17px;
line-height: 140%;

 background: linear-gradient(90deg,rgba(0, 97, 174, 0.2) 10%, rgba(0, 97, 174, 0.0) 100%);
     color: #043C61;
 text-decoration:none;
text-align: right;
font-weight:600;
letter-spacing:.5px;
border-radius:10px 0px 0px 10px;
  
}

.subdi2 h6{        width: 90%; right: 10%; text-align:center;}

.subdi h6 span{

line-height: 140%;
font-size: 25px;
font-weight:700;
     color: #043C61;


  
}



.subdi li:hover{

border: px solid #fff;

box-shadow: -1px -1px 16px rgba(171,176,192,0.3);
/*transition:  0.5s ease-in-out;*/
transition: all 400ms linear;  
}


.subdi img{
 float:right;
width:21%;
	height:auto;
margin-right:50px;
margin-top:-20px;
 background: linear-gradient(50deg,rgba(0, 97, 174, 0.03) 30%, rgba(0, 97, 174, 0.8) 80%);   

box-shadow: 5px 5px 30px rgba(0,0,0,0.2);
border-radius:50% ;
padding:8px 20px;
transition: all 400ms linear;  
  
}


.subdi img:hover{
    background: linear-gradient(90deg,rgba(0, 97, 174, 0.8) 20%, rgba(0, 97, 174, 0.03) 100%);
transform: scale(1.1);
filter: opacity(90%);

transition: all 400ms linear;  }



@media (max-width: 1200px) 
{



.image {

    max-width: 750px;
    height: auto;
}

.direc h3{
    position: relative; 


 font-family: 'Poppins', sans-serif;

      left: -1%;
    width: 95%;
    height: 100%;
    top: 30%;

padding:20px;
font-size: 20px;
line-height: 130%;
     color: #fff;
 text-decoration:none;
text-align: right;
font-weight:100;
letter-spacing:2px; 


}  

.direc h3 span{
line-height: 130%;
 margin-bottom:140px;
font-size: 30px;

     color: #fff;


  
}



.subdi li  {

        float:center;
	display:block;
	width:90%;
    height:260px;    
   	position: relative;
	margin-top:150px;	
	margin-bottom:40px;
    box-shadow: 5px 5px 30px rgba(0,0,0,0.1);
    background: linear-gradient(90deg,rgba(0, 97, 174, 0.4) 0%, rgba(0, 97, 174, 0.01) 100%);

border-radius:10px 0px 60px 10px;

transition: all 400ms linear;  

}
       






.subdi h6{
    position: absolute;
 z-index:3;



 font-family: 'Poppins', sans-serif;
    right: 30%;
    width: 70%;
    height: 245px;
    top: 10%;
padding:35px;
font-size: 15px;
line-height: 140%;

 background: linear-gradient(90deg,rgba(0, 97, 174, 0.2) 10%, rgba(0, 97, 174, 0.0) 100%);
     color: #043C61;
 text-decoration:none;
text-align: right;
font-weight:700;
letter-spacing:.5px;
border-radius:10px 0px 0px 10px;
  
}

.subdi img{

width:25%;

  
}







.deptos li  {

        float:center;
	display:block;
	width:85%;
    	height:250px;
      

   	position: relative;
	margin-top:70px;	
	margin-bottom:10px;
	margin-left: 50px;
	margin-right: 0px;
 
  
box-shadow: 5px 5px 30px rgba(0,0,0,0.1);

      
  background: linear-gradient(90deg,rgba(0, 97, 174, 0.4) 0%, rgba(0, 97, 174, 0.01) 100%);

border-radius:10px 0px 60px 10px;

transition: all 400ms linear;  

}
       






.deptos h6{
    position: absolute;
 z-index:3;



 font-family: 'Poppins', sans-serif;
    right: 20%;
    width: 80%;
    height: 240px;
    top: 10%;
padding:35px;
font-size: 15px;
line-height: 140%;

 background: linear-gradient(90deg,rgba(0, 97, 174, 0.2) 10%, rgba(0, 97, 174, 0.0) 100%);
     color: #043C61;
 text-decoration:none;
text-align: right;
font-weight:700;
letter-spacing:.5px;
border-radius:10px 0px 0px 10px;
  
}

.deptos img{

width:20%;

  
}


.sub li {

        float:left;
	display:block;
	width:100%;
    	height:150px;
      

   	position: relative;
	margin-top:50px;	
	margin-bottom:70px;

  
box-shadow: 5px 5px 30px rgba(0,0,0,0.1);

      
  background: linear-gradient(90deg, rgba(255,255,255,0.5) 0%, rgba(34,126,145,0.0) 100%);

border-radius:10px 10px 10px 10px;

transition: all 400ms linear;  

}


}


@media (max-width: 900px) 
{ 


 
.direc h3{
    position: relative; 


 font-family: 'Poppins', sans-serif;

      left: 0%;
    width: 100%;
    height: 100%;
    top: 30%;

padding:20px;
font-size: 20px;
line-height: 130%;
     color: #fff;
 text-decoration:none;
text-align: center;
font-weight:100;
letter-spacing:2px; 


}   

.direc h3 span{
line-height: 130%;
 margin-bottom:140px;
font-size: 35px;

     color: #fff;


  
}



.image {
    display: block;
    max-width: 100%;
    height: auto;
}


.subdi li  {

        float:center;
	display:block;
	width:90%;
    height:330px;
   	position: relative;
	margin-top:140px;	
	margin-bottom:30px;

    box-shadow: 5px 5px 30px rgba(0,0,0,0.1);

      
  background: linear-gradient(90deg,rgba(0, 97, 174, 0.4) 0%, rgba(0, 97, 174, 0.01) 100%);

border-radius:10px 0px 60px 10px;

transition: all 400ms linear;  

}
       






.subdi h6{
 position: absolute;
 z-index:3;
 font-family: 'Poppins', sans-serif;
 left: 5%;
 width: 60%;
 height: 290px;
top: 15%;
padding:35px;
font-size: 15px;
line-height: 140%;
background: linear-gradient(90deg,rgba(0, 97, 174, 0.2) 10%, rgba(0, 97, 174, 0.0) 100%);
color: #043C61;
text-decoration:none;
text-align: right;
font-weight:700;
letter-spacing:.5px;
border-radius:10px 0px 0px 10px;
  
}

.subdi img{

width:30%;

  
}









.deptos li  {

        float:center;
	display:block;
	width:90%;
    	height:250px;
      

   	position: relative;
	margin-top:70px;	
	margin-bottom:10px;
	margin-left: 10px;
	margin-right: 30px;
 
  
box-shadow: 5px 5px 30px rgba(0,0,0,0.1);

      
  background: linear-gradient(90deg,rgba(0, 97, 174, 0.4) 0%, rgba(0, 97, 174, 0.01) 100%);

border-radius:10px 0px 60px 10px;

transition: all 400ms linear;  

}
       






.deptos h6{
    position: absolute;
 z-index:3;



 font-family: 'Poppins', sans-serif;
    left: 5%;
    width: 75%;
    height: 200px;
    top: 15%;
padding:35px;
font-size: 15px;
line-height: 140%;

 background: linear-gradient(90deg,rgba(0, 97, 174, 0.2) 10%, rgba(0, 97, 174, 0.0) 100%);
     color: #043C61;
 text-decoration:none;
text-align: right;
font-weight:700;
letter-spacing:.5px;
border-radius:10px 0px 0px 10px;
  
}

.deptos img{

width:25%;

  
}
.sub li {

        float:left;
	display:block;
	width:100%;
    	height:110px;
      

   	position: relative;
	margin-top:20px;	
	margin-bottom:20px;
margin-left:-40px;
  
box-shadow: 5px 5px 30px rgba(0,0,0,0.1);

      
  background: linear-gradient(90deg, rgba(255,255,255,0.5) 0%, rgba(34,126,145,0.0) 100%);

border-radius:10px 10px 10px 10px;



}

}




@media (max-width: 600px) 
{

.direc h3{

 


      left: 5%;
    width: 95%;
    height: 100%;
    top: 20%;

padding:20px;
font-size: 18px;
line-height: 140%;
     color: #fff;
 text-decoration:none;
text-align: center;
font-weight:400;
letter-spacing:0px; 


}   

.direc h3 span{
line-height: 130%;
 margin-bottom:140px;
font-size: 30px;

     color: #fff;


  
}
.subdi li  {

    float:center;
	display:block;
	width:95%;
    height:430px;
   	position: relative;
	margin-top:140px;	
	margin-bottom:10px;

 
  
box-shadow: 5px 5px 30px rgba(0,0,0,0.1);

      
  background: linear-gradient(90deg,rgba(0, 97, 174, 0.4) 0%, rgba(0, 97, 174, 0.01) 100%);

border-radius:10px 0px 60px 10px;
/*transition:  0.5s ease-in-out;*/
transition: all 400ms linear;  

}

.subdi h6{
    position: absolute;
 z-index:3;



 font-family: 'Poppins', sans-serif;
    left: 5%;
    width: 100%;
    height: 230px;
    top: 45%;
padding:35px;
font-size: 14px;
line-height: 140%;


     color: #043C61;
 text-decoration:none;
text-align: center;
font-weight:700;
letter-spacing:.5px;
border-radius:10px 0px 0px 10px;
  
}


.subdi h6 span{font-size: 22px;}
.subdi img{

width:50%;
margin-right:50px;
  
}

       
.deptos li  {

    float:center;
	display:block;
	width:90%;
    height:430px;
     
   	position: relative;
	margin-top:70px;	
	margin-bottom:10px;
	margin-left: 10px;
	margin-right: 10px;
 
  
box-shadow: 5px 5px 30px rgba(0,0,0,0.1);

      
  background: linear-gradient(90deg,rgba(0, 97, 174, 0.4) 0%, rgba(0, 97, 174, 0.01) 100%);

border-radius:10px 0px 60px 10px;
transition: all 400ms linear;  

}
       





.deptos h6{
    position: absolute;
 z-index:3;



 font-family: 'Poppins', sans-serif;
    left: 5%;
    width: 100%;
    height: 210px;
    top: 50%;
padding:10px;
font-size: 15px;
line-height: 140%;

 background: linear-gradient(90deg,rgba(0, 97, 174, 0.2) 10%, rgba(0, 97, 174, 0.0) 100%);
     color: #043C61;
 text-decoration:none;
text-align: center;
font-weight:600;
letter-spacing:.5px;
border-radius:10px 0px 0px 10px;
  
}

.deptos img{

float: center;
width:45%;
margin-right:5px;
margin-top:0px;
  
}

}






@media (max-width: 375px) 
{
.deptos li{
	margin-top:20px;	
	margin-bottom:30px;
	margin-left: 0px;
	margin-right: 0px;
}





     
.deptos h6{

    left: 5%;
    width: 100%;
    height: 250px;
    top: 43%;
padding:20px;
font-size: 14px;
line-height: 140%;

text-align: center;
font-weight:600;
letter-spacing:.5px;
border-radius:10px 0px 0px 10px;
  
}

.deptos h6 span{

letter-spacing:.5px;
font-size: 18px;
line-height: 140%;
     color: #043C61;


  
}
    
.deptos img{
    
 float:center;
width:70%;
	height:auto;
margin-right:10px;
margin-top:-10px;
}





.sub li {

        float:left;
	display:block;
	width:100%;
    	height:200px;
      

   	position: relative;

	margin-bottom:30px;
margin-left:-50px;
  
box-shadow: 5px 5px 30px rgba(0,0,0,0.1);

      
  background: linear-gradient(90deg, rgba(255,255,255,0.5) 0%, rgba(34,126,145,0.0) 100%);

border-radius:10px 10px 10px 10px;}

  
.sub h6{

    position: absolute;
 z-index:3;


 font-family: 'Poppins', sans-serif;
  
    width: 100%;
    height: 100%;
    top: 0%;
    right:20px;
padding:35px;
font-size: 17px;
line-height: 140%;

 background: linear-gradient(90deg,rgba(0, 97, 174, 0.0) 10%, rgba(0, 97, 174, 0.0) 100%);
     color: #043C61;
 text-decoration:none;
text-align: center;
font-weight:600;
letter-spacing:1px;
border-radius:10px 0px 0px 10px;
  
}



.subdi li  {

    float:center;
	display:block;
	width:100%;
    height:450px;
   	position: relative;
	margin-top:140px;	
	margin-bottom:10px;


}


.subdi h6{
    position: absolute;
 z-index:3;



 font-family: 'Poppins', sans-serif;
    left: 5%;
    width: 100%;
    height: 250px;
    top: 40%;
padding:20px;
font-size: 14px;
line-height: 140%;

}

.subdi h6 span{

line-height: 140%;
font-size: 20px;
font-weight:700;
     color: #043C61;


  
}

.subdi img{

width:60%;

  
}

.subdi img{
 float:center;
width:65%;
	height:auto;
margin-right:0;
margin-top:0;

  
}




 .objetivo {  display:flex ;
 
  align-items:  center;
  justify-content: center;
      width:100%;

font-family: Arial, sans-serif;

}

.objetivo{
    position: relative; 
    display:block;
      background-color:  rgba(0, 93, 181, 0.01); 
      width:100%;
      margin-top:30px;
      height: auto;
      padding:20px;
      font-size: 17px;
      margin-bottom:30px;
box-shadow: -2px 5px 10px rgba(96,100,105,0.5);
      border-radius:15px 15px 0 0px;
      border-bottom: 5px solid #03729E;
      
}




.sub h6{

    position: absolute;
 z-index:3;


 font-family: 'Poppins', sans-serif;
  
    width: 100%;
    height: auto;
    bottom: 5%;
padding:35px;
font-size: 17px;
line-height: 140%;

 background: linear-gradient(90deg,rgba(0, 97, 174, 0.0) 10%, rgba(0, 97, 174, 0.0) 100%);
     color: #043C61;
 text-decoration:none;
text-align: center;
font-weight:600;
letter-spacing:1px;
border-radius:10px 0px 0px 10px;
  
}
}

/*FIN Subdirectores*/