<template>
  <div class="contact">
    <ContentDoc id="content" />

    <form>
      <div class="group">
        <label for="name">Name<span aria-hidden="true">*</span></label>
        <input name="name" id="name" type="text" placeholder="Your name" required="true" />
      </div>

      <div class="group">
        <label for="subject">Subject<span aria-hidden="true">*</span></label>
        <select name="subject" id="subject" >
          <option value="General" >General</option>
          <option value="Project Request" >Project Request</option>
          <option value="Other" >Other</option>
          <option disabled selected hidden >---</option>
        </select>
      </div>

      <div class="group">
        <label for="company">Company</label>
        <input name="company" id="company" type="text" placeholder="Your company" required="false" />
      </div>

      <div class="group">
        <label for="email">Email<span aria-hidden="true">*</span></label>
        <input name="email" id="email" type="email" placeholder="Email address" required="true" />
      </div>

      <div class="group message">
        <label for="message">Message<span aria-hidden="true">*</span></label>
        <textarea name="message" id="message" placeholder="Start typing here" required="true" ></textarea>
      </div>

      <button type="submit" >Submit</button>
    </form>
  </div>
</template>