@charset "utf-8"; 

/*Estilo para TODA LA PAGINA*/
* 
{   margin: 0;
    padding: 0;
    border: 0;
    box-sizing: border-box;
    font-family: 'Poppins', sans-serif; /*Es para todo los textos*/
    list-style: none;
}
/*-----------------------------*/

/*Estilo para el BODY*/

body 
{   background: linear-gradient(0deg, #2B4E72, #577B6D, #779551);
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    justify-content: space-between; /*No lleva al footer al fondo*/
}

/*---------------------------------*/

/*Estilo para el SEPARADPR*/

.separador
{  display:flex;
   height:0.05em;
   background-color:white;
   width:85%;
   margin-top:0.9em;
   margin-bottom:0.9em;
}

/*---------------------------------*/


/*Estilo para el HEADER*/

header
{  width: 100%;
   top: 0;
   background: linear-gradient(0deg, #2790B0, #296F91, #2B4E72);
   height: 5em; 
   display: flex;
   justify-content: center;
   align-items: center;
   align-content: center;
   flex-direction: column;    
   box-shadow: 0 1px 10px rgba(0,0,0,0.3);
}
.encabezado
{  display: flex;
   justify-content:center;
   flex-direction: column;
   align-content: center;
   align-items: center;    
   width: 100%;    
}

.encabezado a img
{  width: 4.5em;
   margin-top: 0.5em;       
}

.encabezado a
{  width: 5em;
   height: 3em;
   display: flex;
   align-content: center;
   align-items: center;
   justify-content: center;    
}

.sitios
{  display: flex;
   width: 19em;;
   height: 2em;
   display: flex;
   align-content: center;
   align-items: center;
   justify-content: space-between;
}

.sitios a
{  background-color: #296F91;
   height: 1.5em;
   width: 3.5em;
   text-decoration: none;    
}

.sitios a p
{  font-size: 0.7em;
   color: white;
}
/*---------------------------*/

/*Estilo para MAIN*/
main
{ display: flex;
  justify-content: center;
  align-content: center;
  align-items: center; 
  flex-direction: column;    
}

/*---------------------------*/

/*Estilo para AREATITULO*/

.presentacion
{ display: flex;
  flex-direction: column; 
  align-content: center;
  align-items: center;
  width: 92%    
}

.presentacion img
{ width: 18em;
  margin-bottom: 0.8em;
}

.presentacion p
{  font-size: 0.7em;
   color: white;
   text-align: center;    
}
/*---------------------------*/

/*Estilo para AREATITULO*/

.areatitulo
{ width: 92%;
  height: 2em;
  background-color: #2B4E72;
  border-radius: 8px 8px 8px 8px;    
  box-shadow: 0 1px 10px rgba(0,0,0,0.3); 
  display: flex;
  justify-content: center;
  align-content: center;
  align-items: center;    
}

.areatitulo h1
{  color: white;
   font-size: 0.8em;
   font-weight: 500;         
}

/*---------------------------*/

/*Estilo para INTEGRANTES*/

.integrantes
{ display: flex;
  align-content: center;
  justify-content:space-between;
  width: 82%
         
}

.alumno
{
    
}

.alumno a
{ width: 8.5em;
  height: 8.5em;
  display:flex;
  align-content: center;
  align-items: center;
  justify-content: center;    
  background-color:#2B4E72 ;
  border-radius: 100%;
  box-shadow: 0 1px 10px rgba(0,0,0,0.3);     
}
.alumno a img
{  width: 8em;
   border-radius: 100%    
}

.alumno h1
{  font-size: 1em;
   color: white;
   font-weight: 500;
   text-align: center;
   line-height: 1.2em;
   letter-spacing: 0.15em;
   margin-top: 0.4em;
   margin-bottom: 0.2em;    
}

.alumno p
{  font-size: 0.7em;
   text-align: center;
   color:white;
}

/*---------------------------*/

/*Estilo para DATOS ACADEMICOS*/

.datosacademicos 
{  display: flex;
   flex-direction: column; 
   width: 82%;    
}

.datosacademicos h2
{  font-size: 1em;
   color: white;
   font-weight: 500;
   text-align:left;
   line-height: 1.2em;
   letter-spacing: 0.15em;
   margin-bottom: 0.4em;
}

.dato1
{  display: flex;
   justify-content: space-between;    
   align-content: center:
}

.dato1 p
{ font-size: 0.8em;
  color: white;
  text-align: left;    
}

.dato2 span
{  font-weight: 600;
   margin-right: 0.3em;    
}

.dato2 p
{  font-size: 0.8em;
   color: white;
   text-align: left;    
}

.dato2
{  display: flex;
   flex-direction: column;    
   align-content: center:
}

/*---------------------------*/

/*Estilo para pie de pagina*/

.fotos
{  display: flex;
   width: 82%; 
   align-content: center;
   align-items: center;
   justify-content: space-between;
   margin-top: 0.5em;    
}

.fotos img
{  width: 8.5em;
   box-shadow: 0 1px 10px rgba(0,0,0,0.3);  
}

.botonsecundario
{  width: 17em;
   background-color: #2790B0;
   height: 2.2em;
   display: flex;
   flex-direction: row;
   align-items: center;
   justify-content: center;
   padding-left: 1em;
   padding-right: 1em;
   border-radius: 4.5px;
   text-decoration:none; 
}

.botonsecundario p
{  font-size: 0.7em;
   color: white;
   font-weight: 400;
}
/*---------------------------*/

/*Estilo para pie de pagina*/
footer 
{   background-color: #2B4E72; 
    padding: 0.7em;
    margin:auto;
    margin-top: 3em;
    display: flex;
    position: fixed;
    right: 0;
    left: 0;
    bottom: 0;
    z-index: 10;
    justify-content: center;
}

footer p
{   font-size: 0.4em;
    color: white;
    text-align: center;
}
/*-----------------*/