@import url('https://fonts.googleapis.com/css2?family=Roboto&display=swap');
/* Graficos de pagina de alumno*/

/* Seccion 1 */
.mapa{background: rgb(255, 255, 255); color: rgb(255, 255, 255); padding: 0.5rem; font-family: 'Nunito', sans-serif; font-weight: bold; font-size: 0.75rem; position:fixed;
    top: 0px; width: 100%; text-align: center; }
.mapa .VN23{text-decoration: none; font-family: 'Roboto', sans-serif; font-weight: bold; padding: 0.3rem; text-align:left; }
.mapa a{padding-inline: 1rem;}
.link{text-decoration: none; font-family: 'Roboto', sans-serif; font-weight: bold; padding: 0.3rem; text-align: right;  }
.foto{width: 18rem; height: 18rem; border-radius: 10rem; object-fit: cover; object-position: center; border-color: white; border-style: solid; border-width: 0.3.rem;}
h1{color:white; font-family: 'Roboto', sans-serif; font-size: 6rem; text-align:start;}
.matias{justify-content: center ; display: flex;
	flex-direction:column;
	flex-wrap: nowrap;
	justify-content: center;
	align-items: center;
	align-content: stretch;
    margin: 0.5rem;
    padding: 1rem;
    text-align:start;
    }
/* Seccion 2 */
.integrantes{background: rgb(255, 255, 255); color: black; padding: 0.5rem; 
	font-family: 'Nunito', sans-serif; font-weight: bold; font-size: 0.8rem}
    
/* Seccion 3 */
.materias{font-size: 2rem; font-family: 'Nunito', sans-serif;}
li{text-align: center; font-family: 'Nunito', sans-serif; }
p{text-align: center;}
/* Seccion 4 */
.datos1{background:rgb(255, 255, 255) ; font-size: 0.75rem;}
.logotipos{object-fit: cover; object-position: center; height: 5rem}
footer p{color: grey; font-size: 0.6rem;}

/* Estilos generales */
*{ box-sizing: content-box; transition: 1seg;}
body{background: rgb(179, 222, 241); font-family: "Roboto, sans- serif"  ; text-align: center; margin: 0rem;}
header{background: rgb(12, 169, 241); }
h2{color: blue; font-family: 'Roboto', sans-serif; font-size: 1rem; }
main{text-align: left; background: rgb(179, 222, 241);}
ol{display:flex;
	flex-direction:row;
	flex-wrap: nowrap;
	justify-content: space-between;
	align-items:center;
	align-content:center;
    padding: 0.5rem;
    display:inline;
   }
li{background-color: rgb(161, 215, 238); }




    @media (min-width:576px) {
        body {background: rgb(198, 224, 245); float: none;  padding: 0.5rem; text-align: center;}
        /* flexbox.help/ para ver ubicacion columnas */
        section article {width: 48%;}
        section {display: flex; justify-content: space-around; margin: 0 0 0 1rem; text-align: left; padding: 0.5rem;}
        .matias{justify-content: center ; display: flex;
            flex-direction:row;}
      .mapa a{padding-inline: 3rem;}
      .logotipos{object-fit: cover; object-position: center; height: 14rem}
        }