* { 
    font: normal 300 16px/22px Sans-serif, Verdana, Arial  ;
box-sizing: inherit; 
margin:0px;
padding:0px;
text-align: center;
}

/* @font-face {
    font-family: 'Open Sans';
    font-style: normal;
    font-weight: 400;
    src: local('Open Sans'),
         url(opensans.woff2) format('woff2'),
         url(opensans.woff) format('woff'),
         url(opensans.ttf) format('truetype'),
         url(opensans.otf) format('opentype'),
         url(opensans.eot) format('embedded-opentype');
  } */

html { 
    box-sizing: border-box;
}

body{ 
    background-image: url(../img/ingenioET-fondo-1920.png); 
    width: 100%;
}

/* ****SECCIONES - general*/

h1 { font-size: 3em; height: auto; line-height: 2em; text-align: center;}
h2 { font-size: 2.0em; height: auto; line-height: 1em; text-align: center;}
h3 { font-size: 1em; height: auto; line-height: 1.2em; text-align: center;}
p,  li {  font-size: 0.8em; height: auto; line-height: 1.4em; text-align: center; }
a  {color: white; text-decoration: none; line-height: 12px; vertical-align:middle;}
br {line-height: 4px;}


.h2-titulo {
    border-bottom:solid 1px; border-color:black; 
    margin: 25px;

}

.p-textoParrafo{
    text-align: justify; 
    padding: 2%;  
}


section { 
    /* border-color:green; border-style: solid; border-width: 1px;   */
   
    /* background-repeat: no-repeat;  */
    /* background-attachment: fixed;   */
    /* background-position: center;  */
    position: relative;
    height: auto; 
    margin: 30px auto;  
    width: 98% ;
    z-index: 0;

}

section.tituloPagina { 
    /* border-color:green; border-style: solid; border-width: 1px;   */
     height: auto; 
     margin: 100px auto 10px auto;  
     width: 98% ;

}

section.enObras { 
    /* border-color:green; border-style: solid; border-width: 1px;   */
     height: auto; 
     margin: 100px auto 10px auto;  
     width: 98% ;

}


.secTresarticulos {
    width: 90% ;
}



/* ****NAV - MENU  V.20190324*/

.navflexRow {
    align-items: baseline; 
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    align-content: space-around;
    /* width: 100%; */

 }

.navflexRowItem { 
    /* border-color:yellow; border-style: solid; border-width: 1px; */
    display: inline; 
    flex-grow: 1;
}



.navflexColumn {
    display: flex;
    flex-direction: colunm;
    flex-wrap: wrap;
    justify-content: space-between;
}

.navflexColumnItem {  

    /* border-color:red; border-style: solid; border-width: 1px; */
    display: block; 
    margin: 1px auto;
    width: 100%;

}




#navbutton { 

    /*background-position: right top; */
            background-color: rgba(0,0,0,0.5);
    border:none; 
    cursor:pointer; 
    height: 40px; 
    left: 20px; 
    outline: inherit; 
    position: fixed; 
    top:-200px; 
    width: 40px; 
    z-index: 500;

        }

        #navbutton img{ 

        width: 100%;
        }

        @media screen and (max-width:730px){  /*pantalla PC **********************************************/
            #navbutton { 
            top:10px;  
            }  
        } 


.navlogoIngenio {
    /* border-color:green; border-style: solid; border-width: 1px;   */
    background-color: rgba(0,0,0,0.8);
    height: 60px;
    margin: 0px;
    position:fixed;
    top:0px;
    width: 100%;
    z-index:110; 

}

.navlogoIngenio main {
    /* border-color:green; border-style: solid; border-width: 1px;   */


}

.navlogoIngenio img {
    height: auto;
    width: 30% ;
    margin:auto;
    position: relative;
}

    @media screen and (min-width:730px){  /*pantalla PC **********************************************/

        .navlogoIngenio {
        height: 70px;
        margin:0px;
        width: 100% ;
        }



        .navlogoIngenio img {
            /* border-color:green; border-style: solid; border-width: 1px;  */
        height: auto;
        width: 10% ;
        margin: auto auto auto 0px;
        left: -40%;
        } 

    } 



.navMenu { 
    height: 0px;
    position: absolute;
    top: 20px;
    left: 0px;

    width: 20px;
    overflow: hidden;
    z-index: 400;

}

.navMenu-m {  
    position: absolute;
    top: 60px;
    width: 100%;
    z-index: 400;
}



.navMenuUl {  

    align-items: baseline; 
    display: flex;
    flex-direction: column;
    justify-content: space-around;
    align-content: space-around;
} 

.navMenuLi {  

    display: inline; 
    flex-grow: 1;
    height: 40px;
   list-style: none;
   width: 100%;
} 

.navMenuLi a {  


   text-decoration: none;
   text-decoration-color: inherit;

} 





.navMenuCabecera {  
    background-color: rgba(0,0,0,0.8);
    border-bottom: solid 1px; 
    border-color:white;
    height: 40px;

}

.navMenuCabecera p{  

    line-height: 40px; 

}

.navMenuCabecera img{ 
/* border-color:green; border-style: solid; border-width: 1px;   */

cursor:pointer; 
height: auto; 
outline: inherit; 
width: 16px; 
flex-grow: 0;
}


.navMenuItems {  
    /* border-color:green; border-style: solid; border-width: 1px; */

    align-items: bottom;
    background-color: steelblue;

    justify-content: center;
    height: 0px;
    overflow: hidden;

        /* border-color:red; border-style: solid; border-width: 1px; */
       
        height: 0px;
        width: 20px;


}

.navMenuItems a{  
    /* border-color:green; border-style: solid; border-width: 1px; */
    font-size: 0.5em;
    color: white;

}
    


    .navMenuItems-m {  
        /* border-color:red; border-style: solid; border-width: 1px; */
        background-color: steelblue;
        align-items: top;
        /* display:grid; */
        /* grid-row-gap: 10px; grid-column-gap: 10px; */
        /* grid-template-rows: 1fr 1fr 1fr 1fr 1fr; */
        /* grid-template-columns:  auto;  */
        /* height: 600px; */
        justify-content: center;
        /* overflow: hidden; */
    }




.navMenu p{
/* border-color:red; border-style: solid; border-width: 1px; */
color:white;
font-size: 1em;
height: auto; 
line-height: 1.4em; 
text-align: center;

}

.navItem-on{
color:steelblue;
font-weight: bold;
font-size: 1.2em; 
}

        @media screen and (min-width:730px){  /*pantalla PC **********************************************/

                    .navMenu { 
                        /* border-color:green; border-style: solid; border-width: 1px;   */
                        height: auto;
                        position:fixed;
                        top:20px;
                        left: 45%;
                        margin: 0px 5px;
                        width: 50% ;


                    } 

                    .navMenuUl {  

                        align-items: baseline; 
                        display: flex;
                        flex-direction: row;
                        justify-content: space-around;
                        align-content: space-around;
                    } 

                    .navMenuLi {  

                    display: inline; 
                    flex-grow: 1;
                    margin: 0px 5px;
                    width: 150px;
                    } 


                    .navMenuCabecera {  
                        background-color: transparent;
                        border-bottom: solid 1px; 
                        border-color:white;

                    }



        } 

/* ****NAV - MENU  V.20190324*  FINAL/






footer { 
    background-color: steelblue;
    /* border-color:green; border-style: solid; border-width: 1px;   */
    color:white; 
    height: auto;  min-height: 300px;
    margin: 0px;    
    /* position:fixed;
    bottom:0px;
    width: 100%;
    z-index:100; */

}



 main { 
    margin: 5px auto; 
    position: relative; 

} 


/* ****SECCIONES - general*/




/*  Class= "flexRow"  Class= "flexRowItem" */

    .flexRow {
        align-items: baseline; 
        display: flex;
        flex-direction: row;
        justify-content: space-around;
        align-content: space-around;
        /* width: 100%; */

       

    }

    .flexRowItem { 
        /* border-color:yellow; border-style: solid; border-width: 1px; */
        display: inline; 
        flex-grow: 1;
    }



    .flexColumn {
        display: flex;
        flex-direction: colunm;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    
    .flexColumnItem {  
  
        /* border-color:red; border-style: solid; border-width: 1px; */
        display: block; 
        margin: 1px auto;
        width: 100%;

    }



    /* GRID PARAMETRIZACION GENERAL */

    .grid {  
    
      /* border-color:red; border-style: solid; border-width: 1px; */
        display:grid;
        grid-row-gap: 10px; grid-column-gap: 10px;
        grid-template-rows: 10px auto 1fr 10px;
        grid-template-columns:  20px 2fr 1fr 20px;
        justify-content: center;
        
    }
 
 
    




/* SECCION PRESENTACION INGENIO */



    .gridPresentacionIngenio {  
        
            display: grid;
            grid-row-gap: 10px; grid-column-gap: 10px;
            grid-template-rows:  auto 1fr ;
            grid-template-columns:  2fr 1fr;
            justify-content: center;
            
        }
    
        .gridPresentacionIngenio div{ 
            /* border-color:blue; border-style: solid; border-width: 1px; */
            justify-content: stretch; 
        }
        .gridPresentacionIngenio p{ 
            /* border-color:red; border-style: solid; border-width: 1px; */
            text-align: justify;
            width: 98%;
        }

        .presentacionIngenio main {
            background-image: url(../img/ingenioET-img1-secction-.png); 
            background-repeat:no-repeat; 
            background-size: cover;
            width: 60%;}
    
        .gridPresentacionIngenio div img{ 
        /* border-color:red; border-style: solid; border-width: 1px;  */
            width: 75%; 
          
        }
      
  



/* ****SECCION - TEXTO - NEW SSSSS parrafos ****************************************************************************************/

.artRow{
    display: inline-flex;
    height:auto; min-height:450px;
    width: 90%; 
}


.artRow img {
    max-height:200px;
    display: block;
    margin: 0px auto;
    width: auto;
}

/* .seccion-1{
    background: no-repeat 30% top; background-image: url(../img/ingenioET-img1-secction-.png); 
    background-size: 80% auto;  
   
    height: 400px;
} */




        .article1 {  
           
            display:grid;
            grid-row-gap: 5px; grid-column-gap: 10px;
            grid-template-rows: 1fr;
            grid-template-columns: 1fr;
            
            /* max-height: 500px ;  */
            
            
          
        }
            
        .article1 div:nth-child(1) {  border-color:red; border-style: solid; border-width: 1px;
               
                grid-row: 1 / 1;
                grid-column: 1 / 1; 
    
                
            }

    
            .article1 div:nth-child(2) {  border-color:red; border-style: solid; border-width: 1px;
                grid-row: 1 / 1;
                grid-column: 1 / 1; 

                 
            }
        


        section article:nth-child(2) {
            grid-row: 2 / 3;
            grid-column: 1 / 2;
            height: auto;

        }

        section article:nth-child(3) {
            grid-row: 2 / 3;
            grid-column: 2 / 3;
            height: auto;
        }





section.socialMedia { 
    bottom:50px;
    height: auto;
    position: fixed;
    right: 0px;
    z-index: 200;
    width: auto;
    
}

ul.social { 
    list-style: none;
 
} 



    section ul.social li img{  
        max-height: 40px;
        width: auto;

    }


.equipoIngenio {

    justify-content: center;
}
.equipoIngenio main {
    /* border-color:blue; border-style: solid; border-width: 1px; */
    justify-content: center;
}

.gridEquipo {  
 
 
    display:grid;
    grid-row-gap: 10px; grid-column-gap: 10px;
    grid-template-rows: repeat(2, 350px);
    grid-template-columns: repeat(5, 180px);
    justify-content: center;
    align-items: top;
  
}
.gridEquipoItem{ 
/* border-color:red; border-style: solid; border-width: 1px; */

overflow: hidden; 
max-height: 450px; 
z-index: 50;
}

.gridEquipoItem div:nth-child(2){ 
    /* border-color:red; border-style: solid; border-width: 1px; */
    background-repeat: no-repeat;
    background-size:  auto 350px;
    background-position: top left; 

    height: 550px;
    width: 350px;
    }

    .tarjeta-equipo-div {
    -webkit-box-shadow: 0px 0px 10px -4px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 10px -4px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 10px -4px rgba(0,0,0,0.75);
    }

#tarjeta-equipo-div-img1 { background-image: url(../img/EQUIPO/maika1.png); transition: background-image 1s; }
#tarjeta-equipo-div-img1:hover { background-image: url(../img/EQUIPO/maika1.png); transition: background-image 1s;}

#tarjeta-equipo-div-img2 { background-image: url(../img/EQUIPO/estela1.png); transition: background-image 1s;}
#tarjeta-equipo-div-img2:hover { background-image: url(../img/EQUIPO/estela1.png); transition: background-image 1s;}


#tarjeta-equipo-div-img3 { background-image: url(../img/EQUIPO/juan1.png); transition: background-image 1s;}
#tarjeta-equipo-div-img3:hover { background-image: url(../img/EQUIPO/juan2.png); transition: background-image 1s;}


#tarjeta-equipo-div-img4 { background-image: url(../img/EQUIPO/jesus1.png); transition: background-image 1s;}
#tarjeta-equipo-div-img4:hover { background-image: url(../img/EQUIPO/jesus2.png); transition: background-image 1s;}

#tarjeta-equipo-div-img5 { background-image: url(../img/EQUIPO/angel1.png); transition: background-image 1s;}
#tarjeta-equipo-div-img5:hover { background-image: url(../img/EQUIPO/angel2.png); transition: background-image 1s;}

#tarjeta-equipo-div-img6 { background-image: url(../img/EQUIPO/sandra1.png); transition: background-image 1s;}
#tarjeta-equipo-div-img6:hover { background-image: url(../img/EQUIPO/sandra2.png); transition: background-image 1s;}


#tarjeta-equipo-div-img7 { background-image: url(../img/EQUIPO/raluca1.png); transition: background-image 1s;}
#tarjeta-equipo-div-img7:hover { background-image: url(../img/EQUIPO/raluca2.png); transition: background-image 1s;}


#tarjeta-equipo-div-img8 { background-image: url(../img/EQUIPO/sonia1.png); transition: background-image 1s;}
#tarjeta-equipo-div-img8:hover { background-image: url(../img/EQUIPO/sonia2.png); transition: background-image 1s;}

#tarjeta-equipo-div-img9 { background-image: url(../img/EQUIPO/kevin1.png); transition: background-image 1s;}
#tarjeta-equipo-div-img9:hover { background-image: url(../img/EQUIPO/kevin2.png); transition: background-image 1s;}

#tarjeta-equipo-div-img10 { background-image: url(../img/EQUIPO/kevin1.png); transition: background-image 1s;}
#tarjeta-equipo-div-img10:hover { background-image: url(../img/EQUIPO/kevin2.png); transition: background-image 1s;}




.tarjeta-equipo-div-texto { height: 22px; 
    position: relative; overflow:hidden; transition: height 2s; top:0px; width: 99%; z-index: 60;}
.tarjeta-equipo-div-texto:hover {  height: 200px; transition: height 4s;  }


.gridEquipoItem h2 { color: steelblue;}
.gridEquipoItem h3 { color: steelblue; top:15px;}
.gridEquipoItem p {  color: #666;  top:30px;}




@media screen and (max-width:750px){
    .gridEquipo {  
  

        grid-template-rows: repeat(4, 350px);
        grid-template-columns: repeat(3, 180px);
    }


}
@media screen and (max-width:450px){
    .gridEquipo {  
  
        grid-template-rows: repeat(5, 350px);
        grid-template-columns: repeat(2, 180px);

    }


}

    /* SECCION CLASE secTresArticulos */

    .tresArticulos{  
        /* background-color: grey; */
      
        display:grid;
        grid-row-gap: 10px; grid-column-gap: 10px;
        grid-template-rows: auto auto;
        grid-template-columns: 1fr 1fr 1fr;
        justify-content: center;
      
    }

    .tresArticulos div{  
        border-color:blue; border-style: solid; border-width: 1px;
        align-items: center;

    }
    .tresArticulos div{  /*foto de 500 x 500 px*/
        border-color:yellow; border-style: solid; border-width: 1px;
        height: auto;
        width: 80%;
      
    }
    .tresArticulos p{  
        border-color:yellow; border-style: solid; border-width: 1px;
        text-align: justify;
        width: 80%;
      
    }

   
    @media screen and (max-width:750px){
        .tresArticulos{
        grid-template-rows: auto auto;
        grid-template-columns: 1fr 1fr;
        }

    }
    @media screen and (max-width:450px){
        .tresArticulos{
        grid-template-rows: auto auto;
        grid-template-columns: 1fr;
        }

    }


  

  .gridObjetivosIngenio {  
    /* background-color: grey; */
  
    display:grid;
    grid-row-gap: 10px; grid-column-gap: 10px;
    grid-template-rows:  auto;
    grid-template-columns:  3fr auto;
    justify-content: center;
    align-items: center;
}

.ObjetivosIngenio main{  
    border-color:blue; border-style: solid; border-width: 1px;

}



.objetivosIngenio div{ 
    /* border-color:blue; border-style: solid; border-width: 1px; */


}

.objetivosIngenio li{ 
    /* border-color:blue; border-style: solid; border-width: 1px; */
    text-align: justify;
    margin:20px;

}

.objetivosIngenio ul{ 
    /* border-color:yellow; border-style: solid; border-width: 1px; */
    list-style: circle;
}

.objetivosIngenio img{ 
    /* border-color:blue; border-style: solid; border-width: 1px; */
    height: auto;
    width: 50%;

}




@media screen and (max-width:750px){
    .gridObjetivosIngenio{
    grid-template-rows: auto auto;
    grid-template-columns:  1fr;
    }
    .objetivosIngenio main{
        width: 50%;
        }


}
@media screen and (max-width:450px){
    .gridObjetivosIngenio{
    grid-template-rows: auto auto;
    grid-template-columns: 1fr;
    }

}


.trabajaConNosotros img{
    height: auto;
    width: 60%;
}

@media screen and (max-width:750px){
    .trabajaConNosotros img{

        width: 75%;
    }

}
@media screen and (max-width:450px){
    .trabajaConNosotros img{

        width: 98%; 
    }

}

/* EVENTOS - INGENIOGAME */

.ingenioEventos { 
    /* border-color:blue; border-style: solid; border-width: 1px; */
    width: 98%;
}


.gridEventos {
    /* border-color:red; border-style: solid; border-width: 1px; */

    display: grid;
    grid-row-gap: 15px; grid-column-gap: 5%;
    grid-template-rows: 1fr;
    grid-template-columns: 1fr 1fr ;
    justify-content: center;
    justify-items: center;
    margin: 5px auto;
    width: 100%; max-width: 1050px ;
    
}


.gridEventos article{

    -webkit-box-shadow: 0px 0px 10px -4px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 0px 10px -4px rgba(0,0,0,0.75);
    box-shadow: 0px 0px 10px -4px rgba(0,0,0,0.75);
}

.gridEventos article:nth-child(1) { 
    /* border-color:green; border-style: solid; border-width: 1px; */
    grid-column: 1 / 2;
    grid-row: 1 / 2;  
    width: 100%;
}

.gridEventos article:nth-child(2) { 
    /* border-color:pink; border-style: solid; border-width: 1px; */
    grid-column: 2 / 3;
    grid-row: 1 / 2;
    height: auto;
    width: auto;
}

.gridEventos article:nth-child(3) { 
    /* border-color:pink; border-style: solid; border-width: 1px; */
    grid-column: 3 / 4;
    grid-row: 1 / 2;
    height: auto;
    width: auto;
}

.gridEventos p:nth-child(1) { 
    /* border-color:pink; border-style: solid; border-width: 1px; */
    grid-column: 3 / 4;
    grid-row: 1 / 2;
    height: auto;
    width: auto;
}

@media screen and (max-width:750px){
    .gridEventos {
        /* border-color:red; border-style: solid; border-width: 1px; */
  
        grid-row-gap: 15px; grid-column-gap: 5%;
        grid-template-rows: 1fr;
        grid-template-columns: 100%;
    }
    .gridEventos article:nth-child(1) { 
        /* border-color:pink; border-style: solid; border-width: 1px; */
        grid-column: 1 / 2;
        grid-row: 1 / 2;
        height: auto;
        width: auto;
    }
    
    .gridEventos article:nth-child(2) { 
        /* border-color:pink; border-style: solid; border-width: 1px; */
        grid-column: 1 / 2;
        grid-row: 2 / 3;
        height: auto;
        width: auto;
    }
    
    .gridEventos article:nth-child(3) { 
        /* border-color:pink; border-style: solid; border-width: 1px; */
        grid-column: 1 / 2;
        grid-row: 3 / 4;
        height: auto;
        width: auto;
    }


}


.gridEdicion{
      /* border-color:red; border-style: solid; border-width: 1px; */
      background-color: steelblue;
      color: white;
      display:grid;
      grid-row-gap: 0px; grid-column-gap: 0px;
      grid-template-rows: auto;
      grid-template-columns:  24% 74%;
      justify-content: center;
      margin: 5px auto;
      width: 100%;     
  }

  .gridEdicion div:nth-child(1){
    /* border-color:red; border-style: solid; border-width: 1px; */
    border-right: 1px solid white; 
    background-color: steelblue;
    height: 100%;
  
}

  .gridEdicion p { 
    /* border-color:blue; border-style: solid; border-width: 1px; */
    margin: 0px auto;
}
  .gridEdicionItem { 
      /* border-color:blue; border-style: solid; border-width: 1px; */
      margin: 0px auto;
  }



  .contactaConNosotros {
    /* border:solid 1px; border-color:red;  */
    min-height: 300px;

}

  .contactaConNosotros h2{
          border-bottom:solid 1px; border-color:black; 
          /* border-style: solid; border-width: 1px;  */
  }

  .contenedorMixto img{
    display:inline;
    width:30px;

  }

  .contenedorMixto h3{
    display:inline;
    

  }


.cursosMenu{
    margin: 50px 0px;
}

  .gridCursosMenu {
    border:solid 1px; border-color:red;
    display:grid;
    grid-row-gap: 5px; grid-column-gap: 5px;
    grid-template-rows: repeat(1, 500px);
    grid-template-columns:  repeat(4, 300px);
    justify-content: center;
    margin: 5px auto;
    width: 100%;     

}

.gridCursosMenu div {
    border:solid 1px; border-color:black; 
    height: 400px;
    width: 300px;     

}




.gridProyectoEdu {

        display:grid;
        grid-row-gap: 5px; grid-column-gap: 5px;
        grid-template-rows: auto;
        grid-template-columns:  repeat(3, 350px);
        justify-content: center;
        margin: 5px auto;
        width: 100%;     

}

.gridProyectoEduItem img{

    height: auto;
    width: 100%;     

}

.gridPE-kids {
    border:solid 1px; border-color:red;
    display:grid;
    grid-row-gap: 5px; grid-column-gap: 5px;
    grid-template-rows: repeat(2, 100px);
    grid-template-columns:  repeat(2, 100px);
    justify-content: center;
    margin: 5px auto;
    width: 100%;     

}

.gridPE-kids div {
    border:solid 1px; border-color:black; 
    height: 100px;
    width: 100px;     

}

.gridPE-kidPrimaria {
    border:solid 3px; border-color:red;
    display: grid;
    grid-row-gap: 2px; 
    grid-column-gap: 2px;
    grid-template-rows: repeat(2, 50%);
    grid-template-columns:  repeat(3, 30%);
    justify-content: center;
    align-items: center;
    width: 100%;     

}

.gridPE-kidPrimaria div {
    border:solid 2px; border-color:red; 
    height: 30px;
    width: 30px;

}


.gridPE-highShool {
    border:solid 1px; border-color:red;
    display:grid;
    grid-row-gap: 5px; grid-column-gap: 5px;
    grid-template-rows: repeat(2, 100px);
    grid-template-columns:  repeat(2, 100px);
    justify-content: center;
    margin: 5px auto;
    width: 100%;     

}

.gridPE-highShool div {
    border:solid 1px; border-color:black; 
    height: 100px;
    width: 100px;     

}

.gridPE-creative {
    border:solid 1px; border-color:red;
    display:grid;
    grid-row-gap: 5px; grid-column-gap: 5px;
    grid-template-rows: repeat(1, 100px);
    grid-template-columns:  repeat(3, 100px);
    justify-content: center;
    margin: 5px auto;
    width: 100%;     

}

.gridPE-creative div {
    border:solid 1px; border-color:black; 
    height: 100px;
    width: 100px;     

}