* {
       box-sizing: border-box;
}


body{
    font-family:'montserrat', sans-serif;
    background-color:#515151;
     color:#333;
    display:flex;
    align-items:center;
    align-content: center;
    justify-content: center;
    margin:0 auto;
    padding-top:0rem;
           }

#contenido{
    background-color:#fff;
    text-align:center;
    margin:0 auto;
  }

.carta2{background-color:rgba(52,186,152,0.8);}
.grupo2{background-color:rgba(253,181,21,0.8);}
.mapa2{background-color:rgba(229,52,70,0.8);}
.app2{background-color:rgba(0,149,179,0.8);}


header{
    background-color:#fff; 
  text-transform:uppercase;
    font-style:normal;
    
      }

.grupo{
    font-style: normal;
    font-family:'montserrat', sans-serif;
    line-height:140%;
    padding:1.5rem;;
    margin:0 auto;
    text-align:left;

 }

.academicos{
   display:none;
    }

a{  
    text-decoration: none;
    color:#515151;
 }

span {
    font-weight: 600;
    }


.headgris{
    background-color:#515151;
    color:#fff;
    padding:3rem;
}

h1{
    margin:0 auto;
    padding-top:10px;
    letter-spacing:1px;
    font-family:'roboto slab', serif;
     font-size:2.5rem;
    line-height:100%
  }

h2{
    font-size:18px;
    font-family:'roboto slab', serif;
    font-weight:400;
    color:#fff;
    margin:0 auto;
   }

footer{
    background-color:rgba(255,255,255,0.6);
    font-size:11px;
    color:#333;
    font-weight:500;
    padding:1rem;
 margin:0 auto;
    text-align:center;
    width:89%;
    padding-bottom:5rem;
    }

.imagen{
    border-radius:100%;
    width:20rem;
}

.carta{
    width:50vw;
    font-size:11px;
    text-align:justify;
    line-height:140%;
    background-color:#eee;
    padding:1rem;
}

.academicos2{
        display:block!important;
    font-size:0.8rem;
    padding:2rem;
    color:#777;
    margin:0 auto;
    font-family:'roboto slab', serif;
    text-align:center;
     border-top:1px solid #ddd;
        border-bottom:1px solid #ddd;
        line-height:145%;
     text-align:left;
    max-width:85%!important;
    }

li {
    font-size:2rem;
    border-bottom:1px solid #fff;
        }

li a {
    margin: 0 auto;
    display: block;
    color: white;
    font-family: 'roboto slab', serif;
    text-align: center;
    padding: 10px 20px;
    text-decoration: none;
     }


     
.grupo a{
   display:block;
  text-align:center;
    margin:0 auto;
    line-height:250%;
    }

ul {
    list-style-type: none;
    margin: 0 auto;
    padding: 0;
    overflow: hidden;
      background-color:#fff;
    
   }

     .mapa{
        display:block!important;
        padding:2rem;
    margin:0 auto;
   border-top:1px solid #ddd;
    border-bottom:1px solid #ddd;
        }
    
    .mapa img{
   height:40vh; 
    }

.perfil img{
    width:100vw;
}

.perfil h1{
    margin:0 auto;
    font-size: 2rem;
    text-align:left;
    padding:3rem;
   width:90vw;
    border-bottom:1px solid #515151;
  
}

.perfil{
    height:85vh;
}
.fotopersonal{
    float:left;
    
}

.materias{
font-size:1rem;
text-align:left;
color:#444;
 line-height:160%;
    padding-left:5rem;
}



/***********MEDIA QUERIES*******************/

/*
cuando la ventana del navegador mida
como mínimo 560px de ancho
*/
@media screen and (min-width: 560px) {
    
    li {
    float:left; 
    margin: 1 auto;
    width:25vw;
    font-size:1.5rem!important;
    border-bottom:0px solid #fff;}
    

    #contenido{
 width:100vw;
height:90vh;
 background-color:#fff;
    }

h1{
    margin:0 auto;
    padding-top:10px;
    letter-spacing:1px;
    font-family:'roboto slab', serif;
     font-size:2.5rem;
    line-height:100%
  }

    .grupo {
           margin:0 auto;
    }
    
.grupo a{
   display:inline-block!important;
  text-align:center;
        line-height:170%;
     width:22vw;
 
    }

    .academicos{
        display:block!important;
    font-size:0.8rem;
    padding:2rem;
    width:90%;
        color:#999;
    margin:0 auto;
    font-family:'roboto slab', serif;
    text-align:center;
     border-top:1px solid #ddd;
        border-bottom:1px solid #ddd;
        line-height:160%
    }
    
         .academicos2{
     width:60%!important;

    }
    
    .perfil img{
    width:50vw;
        padding-right:2rem;
        }


    .perfil{
    height:40vh;
}
    
    
}

/*
cuando la ventana del navegador mida
como mínimo 800px de ancho
*/

@media screen and (min-width: 800px) {
    
      li {
    float:left; 
    margin: 1 auto;
    width:25%;
    font-size:2rem!important;
    border-bottom:0px solid #fff;}
    
    .grupo a{
   display:inline-block!important;
    width:23vw;
    text-align:center;
    }


    .academicos2{
     width:50%;

    }
    
    .perfil img{
    width:40vw;
}

     .perfil{
    height:50vh;
}

    }

/*
cuando la ventana del navegador mida
como mínimo 1200px de ancho
*/

@media screen and (min-width: 1200px) {
 
      li {
    float:left; 
    margin: 1 auto;
    width:25%;
    font-size:2rem;
    border-bottom:0px solid #fff;}
    
    
   .academicos2{
     width:30%;

    }
    
    .perfil img{
    width:35vw;
}
    
     .perfil{
    height:52vh;
    
}
    

}



@media screen and (min-width: 1600px) {
 
      li {
    float:left; 
    margin: 1 auto;
    width:25%;
    font-size:2rem;
    border-bottom:0px solid #fff;}
    
    
   .academicos2{
     width:30%;

    }
    
    .perfil img{
    width:25vw;
}
    
     .perfil{
    height:50vh;
}
    

}
/*fin media queries*/