html,
body {
  height: 100%;
}

.container {
  height: 100%;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: "Raleway";
  background-size: cover;
  background-repeat: no-repeat;
}

.container-box {
  display: inline-block;
  padding: 120px;
  background-color: whitesmoke;
  border: 1px solid #6a1330;
}

.map {
  height: 40rem;
  margin-bottom: 3rem;
}

.contact-form,
.travel-instructions {
  padding-left: 2rem;
  padding-right: 2rem;
}

@media (min-width: 48em) {
  .contact-form,
.travel-instructions {
    padding-left: 5rem;
    padding-right: 5rem;
  }
}
.contact-form form {
  display: flex;
  text-align: center;
  flex-direction: column;
  max-width: 75rem;
  padding: 15px;
}
.contact-form form button {
  align-self: flex-end;
  display: block;
  color: #6a1330;
}
.contact-form form button .hover {
  background-color: #364b5f;
}
.contact-form .message {
  border-radius: 1rem;
  padding: 2rem;
  color: white;
  font-size: 80%;
}
.contact-form .message.notice {
  background-color: #43534c;
}
.contact-form .message.error {
  background-color: #6a1330;
}

/*# sourceMappingURL=contact.css.map */