* /* reglas generales*/
{
    box-sizing: border-box;
    margin-top: 0;
    margin-left: 0;
    margin-right: 0;
    
    
    
 }


 :root {
--color-textos: hsl(280, 38%, 8%);
--color-textos-secundarios: hsl(0, 0%, 100%);
--color-violetaS: hsl(269, 34%, 86%);
--color-celesteF:hsl(160, 40%, 56%);
--color-celesteS:hsla(167, 89%, 35%, 0.336);
--color-violetaF:hsl(266, 43%, 34%);

--tipo-titulos: sans-serif;
--tipo-textos: serif;
 }


 /* mobile first */

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

img {
    width: 100%;
    height: auto;
}

head {
    font-size: medium;
}
body {
font-size: medium;
}


h1,
h2,
h3,
h4 {
 font-family: var(--tipo-titulos); 
}
/* que las imagenes no sean 
mayores que las cajas que las 
contienen */


/*header*/

img {
    max-width: 30%;
}
a {
    text-decoration: none;
    color: var (--color-1)
}


/* caja contenedora centrada y con ancho maximo */

.contenedora {
    width: min( 50rem, 100%); 
    margin-inline: auto;
}

/* grandes componentes*/

header {
    color: var(--color-textos);
    background-color: var(--color-celesteF);
    margin: 0rem;
    padding-block: .125em;
    padding-inline: 1em;
    
}  

header nav {
margin: 0rem;

}

header nav a{
    color: var(--color-textos-secundarios);
    background-color: var(--color-violetaF);
    display: block;
    width: max-content;
    border-radius: 0.25em;
    margin: 0.125rem;
    padding-block: .125em;
    padding-inline: 1em;
    list-style-type: none;
}  

header ul {

list-style: none;
margin-block: 0 ;
padding:0% ;
}



header nav a:hover {
    color: var(--color-textos);
    background-color: var(--color-violetaS);
    
}  



/* main */
main {

    margin: 1.1rem;
    
}
main img {

    max-width: 40%;

}

.integrante  {
    color: var(--color-textos-secundarios);
    background-color: var(--color-violetaF);
    display: block;
    width: 11rem;
    border-radius: 0.25em;
    margin: 0.125rem;
    padding-block: .125em;
    padding-inline: 1em;
    list-style-type: none;

}
.integrante {
    color: var(--color-textos);
    background-color: var(--color-celesteF);
    border-radius: 0.25em;
    padding: 1rem;
    

}
.integrante img {

    margin: 1.1rem;
    border-radius: 0.50em;
    

}
.integrante p {

    padding-block: 1rem;
    margin: 1.1rem;
    margin-top: 0rem;
    margin-bottom: 0rem;
}

.integrante {
    color: var(--color-textos);
    background-color: var(--color-celesteF);
    width: 100% ;
    display: row;
        margin-block-start: 0em;
        margin-block-end: 0em;
        margin-inline-start: 0px;
        margin-inline-end: 0px;
}


.integrante  {

list-style-type: none;
padding: 0%;


}

.boceto nav a  {
    color: var(--color-textos-secundarios);
    background-color: var(--color-violetaF);
    display: block;
    width: max-content;
    border-radius: 0.25em;
    margin: 0.125rem;
    padding-block: .125em;
    padding-inline: 1em;
    list-style-type: none;
}
.boceto{
    padding-block: 1.1rem;
}




.equipo ul {
    list-style-type: none;
    padding: 0%;

}
.equipo li {
    background-color: var(--color-celesteF);
    margin-block: 0.5em;
    padding: 1em;
    border-radius: 0.50em;
    display: list-item;
    gap: 1em;
    align-items: flex-start;
    text-align: none;
    padding-block: 0.5rem;
}

.equipo figure img {

    background: var(--color-2);
    border: solid 0.4em var(--color-3);
    border-radius: 0.50em;
    box-shadow: var(--sombras), var(--sombras) inset;
    width: 8em;
    aspect-ratio: 1;
}

.equipo ul a{
    color: var(--color-textos-secundarios);
    background-color: var(--color-violetaF);
    display: block;
    width: 11rem;
    border-radius: 0.25em;
    margin: 0.125rem;
    padding-block: .125em;
    padding-inline: 1em;
    list-style-type: none;

}

.equipo ul h3{
    padding-block: 1rem;
margin: 0rem;
}

h2{
    margin: 0rem;
    margin-block-start: 0em;
    margin-block-end: 0em;
}

.equipo ul{
    display: flex;
    flex-direction: column; 
}

 h2 {

padding-block: 1rem;

}


.aprobadas ul {

    color: var(--color-textos);
    background-color: var(--color-celesteF);
    list-style-type: none;
    padding: 0rem;
    padding-block: 0.5rem;

}
.aprobadas  {

    color: var(--color-textos);
    background-color: var(--color-celesteF);
    list-style-type: none;
    border-radius: 0.50em;
    padding: 1rem;
   
    
}


.aprobadas figure {
width: 100% ;
display: flex;
    margin-block-start: 0em;
    margin-block-end: 0em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;

}

.mapa img {

max-width: 400%;

}

.academicos ul {

    color: var(--color-textos);
    background-color: var(--color-celesteF);
    list-style-type: none;
    padding: 0rem;
    padding-block: 0.5rem;

}
.academicos  {

    color: var(--color-textos);
    background-color: var(--color-celesteF);
    list-style-type: none;
    border-radius: 0.50em;
    padding: 1rem;
   
    
}


.academicos figure {
width: 100% ;
display: flex;
    margin-block-start: 0em;
    margin-block-end: 0em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;

}

.mapa img {

max-width: 400%;

}



/* footer */
footer  {
    color: var(--color-textos-secundarios);
    background-color: var(--color-violetaF);
    margin-bottom: 0;
    margin: 0rem;
    margin-block-start: 0em;
    margin-block-end: 0em;
    
}

footer p {
    padding-inline: 1rem;
    padding-block: 1rem;
    margin-block-start: 0em;
    margin-block-end: 0em;
    box-sizing: border-box;
    margin: 0rem;
    font-size: small;

}


 /*tamaño escritorio*/

 @media screen and (min-width:768px){
     body{
         background-color: var(--color-celesteS);
         
     }
     .integrante img {
      width: auto;
         
     }
    
     .contenedora {
         margin: 0rem;
     }
     .equipo ul{

        flex-direction: row;
        gap: 1rem;
        text-align: none;
    }
    }