* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    background-color: black;
    color: white;
    text-decoration: none;
    font-family: 'Roboto';
    font-size: 1em;
    font-weight: 100;
    min-height: 100vh;
    
    
    
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    
}



header {
    height: 3.5em;
    background: #3f3f3f;
    font-weight: 400;
    text-transform: capitalize;
    font-size: 0.8rem;
    font-family: 'Roboto Mono', monospace;
    font-weight: 400;
    display: flex;
    justify-content: center;
}

#cajaheader {padding: 0 5vh; display: flex; justify-content: space-between; align-items: center; width: 100%;}


#vm35 {
   color: white;   
   font-weight:700;
   justify-content: flex-start;
        font-size: 1rem;
    text-decoration: none;
    
    
}

#menuheader {width: 5rem; display: flex; justify-content: space-between; align-items: center;}
#info {height: 1.8em; cursor: pointer;}
#menu {height: 1.6em; cursor: pointer;} 
#vm35:hover {color: #f8f8f8;}
#menudesplegable {
    position: fixed; display: flex; height: 90vh; width: 100vw; margin-top: 3.5rem;}

#menudesplegable nav {position: absolute; right: 5vh; width: 14em; height: 22em; padding: 2em; display: flex; flex-direction: column; background-color: #3f3f3f; font-size: 0.9em;
}
#menudesplegable nav a {margin: 0.6em 0; text-decoration: none;}
#menudesplegable {display:none;}
#desplegado {display: none;}
#menudesplegable a {color: #f8f8f8;} 


main {
    
    padding: 3em;
    
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    
    
    

}

.nombre {
    
    background-color: darkblue;
    padding: 1em;
    border-color: blue;
    
    
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    align-items: center;

}

.materias_aprobadas {
    display: flex;
    flex-direction: column;
    padding: 2em;
    background-color: blue;
    
    
    
}

.materias_en_curso {
    padding: 1em;
    background-color: blue;
    
    
    display: flex;
    flex-direction: column;
    
}

.comitente {
    
    background-color: blue;
    
    display: flex;
    flex-direction: column;
    margin-top: 3em;
    padding: 0.5em;
}






















footer {
    background: #262626;
    color: #eaeaea;
    margin-top: 7em;
    padding: 4em;
    font-family: 'Roboto', sans-serif;
    font-size: 0.7em;
    font-weight: 400;
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    align-items: center;
    
}


#datos {
    display: flex;
    justify-content: space-between;
    width: 100%;
    
}

#autoria {
    display: flex;
    padding: 2em 0 0 0;
    
    
}

#logos {
    display: flex;
    justify-content: space-between;
    
    
  
   
    
}

footer img {
    height: 3.5em;
    width: auto;
    padding: 0 1em;

    
}


#dgpc a {
    text-decoration: none;
    color: white;
    font-weight: 900;
}

#directivos a {
    text-decoration: none;
    color: white;
    font-weight: 900;

}









@media (max-width: 600px) {
header {font-size: 0.9em;
    }
    
    
   
    
#datos {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    height: 20em;
        
        
    }
    
    .nombre {
        font-size: 0.7em;
        box-sizing: border-box;
            
    }
    
    main img {
        
        width: 100%;
        height: auto;
    }
    
    footer img {
        padding: 0 0.5em;
    }