body /*estilo BODY*/
{
  font-family: Arial;
  background-color: lightgrey;
  max-width: 100%;
}

header /*estilo HEADER*/
{
  background-color: #14365D; 
  padding: 30px;
  text-align: center;
  font-size: 35px;
  color: white;
}

h1 /*estilo H1*/
{
  display: block;
  padding: 13px;
  text-decoration: none;
  background-color: #A96762;
  width: 97.3%;
} 

h3/*estilo H3*/
{
    text-align: left;
    margin: 30px;
}

ul /*etilo de la tabla con los links a otras paginas*/ 
{
  list-style-type: none;
  width: 125px;  
}

li a /*estilo de los links a otras paginas*/
{
  display: block;
  padding: 8px;
  text-decoration: none; /*que los links no esten underlined*/
  background-color:gray ;
  color: white;
}
li :hover
{
  opacity: 0.6;
} 

article /*estilo donde va la info de lo que contiene la pagina*/
{
  float: left;
  width: 85%;
  background-color: #8999BE;
  height: 600px;
  text-align: center;
}

nav /*estilo del espacio conde estan los links a las diferentes paginas*/
{
  float: left;
  width: 15%;
  height: 600px;
  background:#2F5C8F;
}

@media (max-width: 600px) /*manera de poner el cuadrado de los links a otras cosas de la pagina y donde esta la info en la misma linea*/
{
  nav, article 
  {
    width: 100%;
    height: auto;
  }
}

footer /*estilo de la parte de abajo 'Other Stuff'*/
{
  background-color: #91847e;
  padding: 10px;
  text-align: left;
  color: white;
}

section::after /*rellena el espacio q falta entre el article y el nav*/
{
  content: "";
  display: table;
  clear: both;
}
label
{
    margin: 20px;
}