Don't be a stranger. Let's get acquainted.

You can fill in the form below or:

How would you like to be addressed?

For receiving a reply, add your Email address:

How can I assist in your noble cause?

Please describe your plight in a few words

</label>
      <button class="button" type="submit">Send it!</button>
    </section>
  </form>
</div>
<ContactCanvas textsToCanvas={canvasTexts} />

& p {
      margin: 0;
    }
    & ul {
      list-style-type: none;
      display: flex;
      gap: .5em;
      margin: 0;
    }
    & .button {
      margin-top: 0.5em;
    }
  }
  section {
    box-sizing: border-box;
    margin: 0;
    min-height: 70vh;
    
    @media screen and (min-width: 768px) {
      // display: flex;
      // flex-direction: column;
      // justify-content: center;
      max-width: 75vw;
      margin: 0 auto;
      gap: 0;      
    }
  }
  label {
    font-size: 1.25em;
  }
  input[type='text'], input[type='email'], textarea {
    width: 100%;
    border: 0px solid var(--color-text);
    background-color: rgba(255, 205, 205, 0.2);
    color: var(--color-text);
    border-radius: 4px;
    font-family: 'Stratos', sans-serif;
    font-size: 1em;
    padding: .75em;
    transition: all 0.3s ease-out;
    margin: 0 auto 1em auto;
    display: block;
    max-width: 640px;
    
    &:focus {
      outline: none;
      color: var(--color-bg);
      background-color: var(--color-text);
    }
    &::placeholder {
      color: var(--color-text);
      opacity: .7;
    }
  }
  label p {
    max-width: 640px;
    margin: 0 auto 1em auto;
    display: block;
    font-size: .75em;
    margin-bottom: .5em;
  }
  button {
    display: block;
    width: 100%;
    margin: 0 auto;
    font-size: 1.25em;
    max-width: 640px;
    opacity: 0;
  }
</style>