@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&family=Roboto+Slab&display=swap');
*,
*::after,
*::before {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
}
body{
   font-family: "Roboto Slab", serif;
   font-optical-sizing: auto;
   font-weight: 400;
   font-style: normal;
    margin: 0 auto;
    color: #fff
}

img{
    max-width: 100%;
}  
header{
    background-color: #35757a;
    padding: 1.75rem;
    box-shadow:  0 4px 8px #344535;
    margin-bottom: 2rem;
}
.menu li a {
    text-decoration: none;
    color: #c6e4f7;
    font-weight: bold;
    font-size: 0.9rem;
    background-color: #355f7a;
    padding: 8px 20px; 
    border-radius: 0px; 
    transition: all 0.3s ease; 
}
 
    .menu li a:hover {
    background-color: #343645;
    color: #ffffff; 
}

    nav {
    width: 100%;
    max-width: 800px;
    margin: 0 auto 30px;
}

nav ul {
    display: flex;
    justify-content: center;
    gap: 20px;
}

nav ul li {
    width: 120px;
    text-align: center;
    list-style: none;
}

#logo{
    width: 35%;
    border-radius: 8px;
    padding: .5rem;
    margin-inline: auto;
    margin-bottom: 1.5rem;
}

#logo img{
    min-width: 80%;
    display: block;
}

.rotulos_individuales { /* le puse class=rotulos_individuales en el index  para  modificar acá*/
    max-width: 75em;
    margin: 0 auto;
}
.rotulos_individuales img {
    width: 180px;
    border-radius: 0.25em;
    border: solid 3px #efefef;
    box-shadow: 5px 5px 5px #7474747a;
    text-align: center;
}

.rotulos_individuales img:hover {
    border: solid 3px #60d7e0;
}
.datos_académicos img {
  display: block;
  width: 5em;
  aspect-ratio: 1;
  object-fit: contain;
  padding: .5rem;
  border-radius: .25rem;
  box-shadow: 0 4px 4px transparent;
  transition: box-shadow .6s ease;
}

footer{
    background-color: #35757a;
    padding: 1.75rem;
}
footer p{ 
    color: #ffff;
    font-size: .8em;
/* acá e especifica que es el pie de página, después en las sections que armaste, ponerle "un título" para aclarar que es para ese sector :)*/
}
main {
    background-color: #355f7a;
    padding: 5px 50px 25px 50px;
}