{% extends "base.html" %}
{% load static %}
{% block title %}Join our team · {{ SITE_NAME }}{% endblock %}
{% block og_title %}Join our team · {{ SITE_NAME }}{% endblock %}
{% block twitter_title %}Join our team · {{ SITE_NAME }}{% endblock %}
{% block meta_description %}Apply to join College Craft’s interior and exterior painting team in Wheaton — job foreman, painter, sales, and sub-contractor openings.{% endblock %}
{% block og_description %}Apply to join College Craft’s painting team in Wheaton.{% endblock %}
{% block twitter_description %}Apply to join College Craft’s painting team in Wheaton.{% endblock %}
{% block extra_head %}
<link rel="stylesheet" href="{% static 'css/address-autocomplete.css' %}">
{% endblock %}
{% block content %}
  {% include "public/_breadcrumbs.html" with title="Careers" subtitle="Join our professional interior & exterior painting team" %}
  <section class="section section-lg bg-default">
    <div class="container">
      <div class="row row-40">
        <div class="col-lg-5">
          <h4>Work with College Craft</h4>
          <p class="big">We hire careful, hard-working people who take pride in prep, paint, and how they treat a customer’s home. A foreman is on every job. Apply below and we will follow up.</p>
          <ul class="list-marked-2">
            <li>Job Foreman</li>
            <li>Painter</li>
            <li>Sales</li>
            <li>Sub-Contractor</li>
          </ul>
          <p>{% if CONTACT_PHONE %}Call {{ CONTACT_PHONE }} or {% endif %}stop by {{ CONTACT_ADDRESS }}.</p>
        </div>
        <div class="col-lg-7">
          <form class="rd-form form-boxed" method="post" action="{% url 'public:careers' %}">
            {% csrf_token %}
            <div class="row row-30">
              <div class="col-md-6">
                <div class="form-wrap">
                  <label class="form-label-outside" for="{{ form.first_name.id_for_label }}">First name</label>
                  {{ form.first_name }}
                  {{ form.first_name.errors }}
                </div>
              </div>
              <div class="col-md-6">
                <div class="form-wrap">
                  <label class="form-label-outside" for="{{ form.last_name.id_for_label }}">Last name</label>
                  {{ form.last_name }}
                  {{ form.last_name.errors }}
                </div>
              </div>
              <div class="col-md-6">
                <div class="form-wrap">
                  <label class="form-label-outside" for="{{ form.email.id_for_label }}">Email</label>
                  {{ form.email }}
                  {{ form.email.errors }}
                </div>
              </div>
              <div class="col-md-6">
                <div class="form-wrap">
                  <label class="form-label-outside" for="{{ form.phone.id_for_label }}">Phone</label>
                  {{ form.phone }}
                  {{ form.phone.errors }}
                </div>
              </div>
              <div class="col-12">
                <p class="form-label-outside">Address</p>
              </div>
              <div class="col-12" data-address-autocomplete data-suggest-url="{% url 'address_suggest' %}">
                <div class="form-wrap address-ac-wrap">
                  <label class="form-label-outside" for="{{ form.address_line1.id_for_label }}">Street address</label>
                  {{ form.address_line1 }}
                  {{ form.address_line1.errors }}
                </div>
                <div class="row row-30">
                  <div class="col-md-6">
                    <div class="form-wrap">
                      <label class="form-label-outside" for="{{ form.address_line2.id_for_label }}">Apt / suite</label>
                      {{ form.address_line2 }}
                    </div>
                  </div>
                  <div class="col-md-6">
                    <div class="form-wrap">
                      <label class="form-label-outside" for="{{ form.address_city.id_for_label }}">City</label>
                      {{ form.address_city }}
                    </div>
                  </div>
                  <div class="col-md-6">
                    <div class="form-wrap">
                      <label class="form-label-outside" for="{{ form.address_state.id_for_label }}">State</label>
                      {{ form.address_state }}
                    </div>
                  </div>
                  <div class="col-md-6">
                    <div class="form-wrap">
                      <label class="form-label-outside" for="{{ form.address_zip.id_for_label }}">ZIP</label>
                      {{ form.address_zip }}
                    </div>
                  </div>
                </div>
              </div>
              <div class="col-12">
                <div class="form-wrap">
                  <p class="form-label-outside">Which positions are you applying for?</p>
                  <ul class="choice-list">
                    {% for value, label in form.positions.field.choices %}
                    <li>
                      <label>
                        <input type="checkbox" name="{{ form.positions.html_name }}" value="{{ value }}" {% if form.positions.value and value in form.positions.value %}checked{% endif %}>
                        {{ label }}
                      </label>
                    </li>
                    {% endfor %}
                  </ul>
                  {{ form.positions.errors }}
                </div>
              </div>
              <div class="col-12">
                <div class="form-wrap">
                  <label class="form-label-outside" for="{{ form.qualifications.id_for_label }}">Work history &amp; qualifications</label>
                  {{ form.qualifications }}
                  {{ form.qualifications.errors }}
                </div>
              </div>
              <div class="col-12">
                <div class="form-wrap">
                  <label class="form-label-outside" for="{{ form.start_date.id_for_label }}">When can you start?</label>
                  {{ form.start_date }}
                  {{ form.start_date.errors }}
                </div>
              </div>
              <div class="col-md-6">
                <div class="form-wrap">
                  <p class="form-label-outside">{{ form.drivers_license.label }}</p>
                  <ul class="choice-list">
                    {% for value, label in form.drivers_license.field.choices %}
                    <li>
                      <label>
                        <input type="radio" name="{{ form.drivers_license.html_name }}" value="{{ value }}" {% if form.drivers_license.value == value %}checked{% endif %}>
                        {{ label }}
                      </label>
                    </li>
                    {% endfor %}
                  </ul>
                  {{ form.drivers_license.errors }}
                </div>
              </div>
              <div class="col-md-6">
                <div class="form-wrap">
                  <p class="form-label-outside">{{ form.has_vehicle.label }}</p>
                  <ul class="choice-list">
                    {% for value, label in form.has_vehicle.field.choices %}
                    <li>
                      <label>
                        <input type="radio" name="{{ form.has_vehicle.html_name }}" value="{{ value }}" {% if form.has_vehicle.value == value %}checked{% endif %}>
                        {{ label }}
                      </label>
                    </li>
                    {% endfor %}
                  </ul>
                  {{ form.has_vehicle.errors }}
                </div>
              </div>
              {% if form.captcha %}
              <div class="col-12">{{ form.captcha }}{{ form.captcha.errors }}</div>
              {% endif %}
              <div class="col-12">
                <p style="font-size:13px;color:#6b7280;margin:0 0 20px;">By submitting, you agree we may contact you about this application by email and SMS (if you provide a phone number).{% if form.captcha %} Protected by reCAPTCHA.{% endif %}</p>
                <button class="button button-primary button-md" type="submit" data-tianji-event="careers_form_submit">Submit application</button>
              </div>
            </div>
          </form>
        </div>
      </div>
    </div>
  </section>
{% endblock %}
{% block tracking_events %}
{% if "sent" in request.GET %}
<script>
  if (window.aimlTrackWhenReady) {
    window.aimlTrackWhenReady('careers_form_success');
  }
</script>
{% endif %}
{% endblock %}
{% block extra_js %}
<script src="{% static 'js/address-autocomplete.js' %}"></script>
{% endblock %}