html{font-family: sans-serif}
#logo{width:15%;color:aquamarine;display: block;margin-top: 1em; margin-bottom: 1em; margin-left: 43%;}
h1{color:skyblue;font-size: 2em}
ul{list-style: none; margin:0; padding:0;}
nav{background-color: gray; padding: 0.1em;border: solid; width: 50%; margin-left: 25%; }
nav ul li a{color:black;font-style:none;display:block; text-align: center; text-decoration: none; font-family: sans-serif; font-size: 1em; padding: 0.3em}

nav ul li a:hover{background-color: white; color: skyblue;}
section h2{color:skyblue}
p{font-size:0.85em}
.fuente {font-size:0.85em;}
#estudiantes{width: 25%; margin-left: 25%; border: 1px black solid; text-align: center; padding-bottom: 1.5em;float: left; margin-right: 1em; line-height: 2em; }
#docentes{width: 25%; border: 1px black solid; text-align: center; padding-bottom: 3.8em;float: left; margin-right: 1em; margin-bottom:  1em;line-height: 2em;}
footer{width: 50%; margin-left:25%; clear:both; margin-top: 5%;font-size: 0.85em; margin-bottom: 2%; border: 2px solid grey; padding: 2%;}
.espacio {margin-top: 1.96em;}
.redes{margin-left: 40%; width:20% ;display: block; text-align: center; padding-bottom: 1em; border-bottom: black 1px solid;}
.foto{border: black 2px solid;display:block;text-align: center; width: 10%; margin-left: 45%; margin-top: 2%}
.iconos{width: 100px;height: 100px; margin: 1em;}
.datos{margin-left: 40%; width: 20%;display: block; text-align: center; padding-bottom: 1em; border-bottom: black 1px solid;margin-top: 2em;}
.datos a{font-size: 1em; color: skyblue; text-decoration: none;}
.datos a:hover{font-size: 1.2em; color: skyblue; text-decoration: none;}
#estudiantes a{text-decoration: none; color: black;}
#estudiantes a:hover{font-size: 1.2em; color:skyblue;}

@media screen and (max-width: 62em){
    
    body{font-size: 1.2em}
    article{width: 90%; margin-left: 5%;}
    section{width: 90%; margin: 5%}
    .datos{width: 100%; margin-left: 0}
    .foto{width: 30%; margin-left:35% }
    footer{ width: 90%; margin-left: 5%;}
}