* {
    box-sizing: border-box;
}


html {
    display: block;
}

:root {
    --color-textos: hsl(0 0% 15%);
    --color-textos-secundarios: hsl(0 0% 0% / .5);
    --color-textos-alfa: hsl(0 0% 0% / .2); 
    --color-fondo: #F7EBE8;
    --color-1: #f93e92;
    --color-2: #facfbe;
    --color-3: #FFFFFF; 
    --tipo-titulos: sans-serif;
    --tipo-textos: serif;
}

body {
    
    font-family: var(--tipo-textos); 
    margin: 0;
    color: var(--color-textos);
  
    
  }


section {
    padding-bottom: 2rem;
  }
  

.index {
    background-color: var(--color-3);
    color: var(--color-3);
    font-family: 'Helvetica', sans-serif;
    margin: 0;
}

header, footer {
    background-color: var(--color-1);
}

#logo img {
  size: 30px;
}

.contenedora {
    
  width: min( 75rem, 100% );
      
  margin-inline: auto;
      
  padding: 0.3rem;

  border-radius: 0.25rem

    }

 ul,
ol {
  list-style: none;
  padding-inline: 0;
}




header,
footer {

  background-color: var(--color-1);

  color: var(--color-fondo);
  
  
}

p {
  display: block;
  margin-block-start: 1em;
  margin-block-end: 1em;
  margin-inline-start: 0px;
  margin-inline-end: 0px;
}

header nav ul {
  display: flex;
  flex-direction: row;
  justify-content:space-between;

  border-radius: 0.5em;
}


footer p {

    color: var(--color-fondo);
    padding: 1em;
  }
 

nav ul li {
    display: inline;
    list-style: none;
    background-color: var(--color-3);
    color: var(--color-1);
    padding: 8px;
    margin: 3px;
    border-color: var(--color-3);
    border-radius: 5px;
}

nav ul li a {
    text-decoration: none;
    color: var(--color-1);
}

.individual {
  display: flex;
  flex-direction: row;
  background-color: var(--color-2);
  padding: 20px;
  border-radius: 10px;
  margin: 8;
  margin-top: 5px;
  margin-bottom: 5px;
  color: var(--color-1);

}

.individual img {
 
 background: var(--color-2);
 border-radius: 1em;
 border: solid 2px var(--color-3);
 width: 20em;
 object-fit: cover;
}
    
.individual article {
  margin-left: 20px;
  margin-top: 0em;
}

.individual h1 {
  font-size: 30px

}
.individual p {
  font-size: 18px ;
  
}

.individual h2 {
  color: var(--color-3);
  margin-block-start: 0px;
  margin-block-end: 0px;
}

h1,
h2,
h3,
h4 {
  font-family: var(--tipo-titulos);
  color: var(--color-1);
}


img{ max-width: 100%;}

a {
    text-decoration: none;
    color: var(--color-2);
    font-family: var(--tipo-titulos);
    font-weight: bold;
  }

  

  .botones {
    background-color: var(--color-2);
    padding: 20px;
    margin-top: 5px;
    margin-bottom: 5px;
    border-radius: 10px;
    color: var(--color-1);
 }

 .botones a {
    text-decoration: none;
    color: var(--color-3);
    background-color: var(--color-1);
    padding: 5px;
    border-radius: 5px;
}




.academicos {
  padding: 2em;
  font-size: small;
  background-color: var(--color-3);
  padding-left: 25px;
  padding-top: 20px;
  padding-bottom: 25px;
  margin: 8;
  margin-top: 5px;
  margin-bottom: 5px;
  border-radius: 10px;
  color: var(--color-1)

}
.academicos h4 {
 
  margin-block-start: 2;
}

.academicos > ul > li:not(:last-of-type) {
 
  border-bottom: solid 1px var(--color-2);
  padding-block-end: 1.5em;
  margin-block-end: 1.5em;
  gap: 1em;
  

}



.academicos img {
  width: 8em;
}

.academicos ul {
  display: flex;
  justify-content: space-around;
  align-items: center;
  margin: 0 0 0 1em;
}



  
@media (min-width: 60em) {

  .indiv {
    flex-direction: row;
}

 

.equipo article {
  width: calc(50% - .5em);
}

.academicos > ul {
 
  display: flex;

  gap: 1em;
}


.academicos > ul > li {
  width: calc(33% - .7em);
}

  
  footer p {
  
    margin-block-end: 0;
    margin-inline: none

    
  }
  
}