@charset "utf-8"; 

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

/*Estilo para el BODY*/

body 
{   background: linear-gradient(0deg, #160913, #541014, #A41916);
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    justify-content: space-between; /*No lleva al footer al fondo*/
}
main
{ display: flex;
  justify-content: center;
  flex-direction: column; 
  align-content: center;
  align-items: center;    
}

.propuesta
{ display: flex;
  justify-content: center;
  align-content: center;
  align-items: center;
  position: absolute;
  top: 0;
  margin-top: 8em;    
}

.propuesta img
{ width: 95%;
}
/*---------------------------------*/

/*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, #E73F12, #7B1511, #6A140F);
   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;
   align-content: center;
   align-items: center;
   justify-content: space-between;
}

.sitios a
{  background-color: #6A140F;
   height: 1.5em;
   width: 4.5em;
   text-decoration: none;
}

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

/*Estilo para INTEGRANTE*/

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

.integrante a
{  width: 12.7em;
   height: 12.7em;
   background-color:#7B1511;
   border-radius: 100%;  
   box-shadow: 0 1px 10px rgba(0,0,0,0.3);    
   display: flex;
   justify-content: center;
   align-items: center;    
   align-content: center:       
}

.integrante a img
{  width: 12em;
   border-radius: 100%    
}

.datosintegrante
{  display: flex;
   flex-direction: column;
   margin-top: 1em;    
}

.datosintegrante h1
{  font-size: 1.5em;
   font-weight: 600; 
   color: white;
   text-align: center;    
}

.datosintegrante p
{  font-size: 1em;
   font-weight: 500;
   color:#E73F12 ;
   text-align: center;    
}

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

/*Estilo para MATERIAS*/

.materias
{ display: flex;
  flex-direction: column;
  justify-content: center;
  width: 18em;    
}

.materias h2
{ font-size: 1.2em;
  text-align: center;
  color: white; 
  margin-bottom: 0.2em;     
}

.columnamaterias
{ display: flex;
  width: 18em; 
  justify-content: space-between;    
}

.columnamaterias h5
{ font-size: 0.8em;
  color:#e3785c;
  margin-bottom: 0.3em;    
}

.columnadato h3
{ font-size: 1em;
  color:#E73F12;
  margin-bottom: 0.4em;    
}

.columnadato h4
{ font-size: 0.8em;
  color:#e3785c;
  margin-bottom: 0.3em;    
}

.columnadato p
{ font-size: 0.7em;
  color: white;
  margin-bottom: 0.5em;    
}

.columnadato span
{ font-weight: 700;
  margin-right: 0.2em;    
    
}
/*---------------------------*/

/*Estilo para pie de pagina*/
footer 
{   background-color: #160913; 
    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.5em;
    color: white;
    text-align: center;
}
/*-----------------*/

.QUISBERT
{ display: flex;
  width: 75%;   
  justify-content:space-between;
  align-content: flex-start;
  align-items: flex-start;    
  margin-top: -50em;    
}

/*Para RESPONCIVE*/

@media (max-width:340px)
{ 
.QUISBERT
{ display: flex;
  width: 90%; 
  flex-direction: column;    
  justify-content:center;
  align-content: center;
  align-items:center;;    
  margin-top: 0em;    
}    
}

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