html{
  background-image: url("BACKGROUND.png");
  background-repeat: repeat;
  font-family: Calibri;
}

main{
  display: flex;
  flex-flow: column nowrap;
  max-width: 700px;
  background: white;
  justify-content: center;
  align-items: stretch;
  margin: 50px auto;
  padding: 40px 10px;
}

main header{
  text-align: center;
  flex: 1 1;
  margin-bottom: 10px;
}

main section{
  text-align: center;   
  flex: 1 1;
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
}

main section a{
  flex: 1 1 40%;
  border: 1px solid #f5b53a;
  background-color: #f4f4f4;
  text-decoration: none;
  margin: 10px;
  color: black;
  padding: 10px 20px;
  max-width: 300px;
  box-shadow: 0 0 0px #f5b53a;  
  transition: all 1250ms cubic-bezier(0.19, 1, 0.22, 1);
  
  /* min-height: 50px; */
}

a:hover{
  box-shadow: 0 0 20px #f5b53a;
  transform: translateY(-5px)
}

a:active{
  transform: translateY(5px)
  
}

.boton-principal{
  background: white;
  flex: 1 1 100%;
  align-self: center;
  text-align: center;
  min-height: 50px;
  font-size: 1.5rem;
  font-weight: 100;
}

main footer{
  margin-top: 20px;
  text-align: center;   
  flex: 1 1;
}