1 files changed, 16 insertions, 9 deletions

diff --git a/templates/issues/welcome.html b/templates/issues/welcome.html
index 38c0dcd..daef11b 100644
--- a/templates/issues/welcome.html
+++ b/templates/issues/welcome.html
@@ -1,15 +1,22 @@
 {% extends "issues/index.html" %}
+{% load bootstrap3 %}
 {% load i18n %}
 
+{% block nav %}
+    <li class="active"><a href="#">{% trans "Product" %}</a></li>
+    <li><a href="#">{% trans "Issue" %}</a></li>
+    <li><a href="#">{% trans "Your info" %}</a></li>
+    <li><a href="#">{% trans "Done" %}</a></li>
+{% endblock nav %}
+
 {% block main %}
-    <form method="post" action="{% url 'issues-warranty' %}">
-        {% csrf_token %}
-        <div class="form-group">
-            <label for="exampleInputEmail1">Serial Number</label>
-            <input type="email" class="form-control" id="exampleInputEmail1" placeholder="{% trans "Serial Number" %}" value="DGKFL06JDHJP">
-      </div>
-      <div class="form-group">
+<h2>1. {% trans "Product" %}</h2>
+<p>Let's start by identifying your device. Please enter your <a href="http://support.apple.com/kb/HT1349" target="_blank">serial number</a> or click Skip.</p>
+<form method="post" action="{% url 'issues-warranty' %}">
+    {% csrf_token %}
+    {% bootstrap_form form %}
+    <div class="form-group">
         <a href="{% url 'issues-choose_device' %}" class="btn btn-default">{% trans "Skip" %}</a>
-      </div>
-    </form>
+    </div>
+</form>
 {% endblock main %}