h1:hover {           /*cada vez que el mouse pase por el h1*/
  color: #ffc83f     /* la letra tendra ese color*/
}
h1 {
  background: #000000;  /*el fondo es negro*/
  margin: 0;            /*margen de 0 para que se aline a los menus*/  
  text-align: center;    /*centra el texto en medio */          
  padding: 20px;   /*una distancia del texto de con la caja h1 de 20 px*/
  color: #FFFFFF;  /*un color de letra blanca*/
}
.container {
  width: 80%;
  margin: 0 auto;

}
form {
  width: 450px;
  margin: auto;
  background: rgba(0, 0, 0, .4);
  padding: 10px 20px;
  box-sizing: border-box;
  margin-top: 20px;
  margin-bottom: 20px;
  border-radius: 7px;
}
input, textarea {
  width: 100%;
  margin-bottom: 20px;
  padding: 7px;
  box-sizing: border-box;
  font-size: 17px;
  border: none;
}

textarea {
  min-height: 100px;
  max-height: 200px;
  max-width: 100%;
}
#boton {
  background: #31384A;
  color: #fff;
  padding: 20px;

}
#boton:hover {
  cursor: pointer;
  color: #ffc83f;
}
@media (max-width: 500px) {
  form {
    width: 100%;
  }
}
.GRACIAS {
  text-align: center;
  color: white;
  font-size: 40px;
  background: rgba(0, 0, 0, .4);
  margin-top: 20px;
}