diff --git a/attendance/templates/attendance/period_list.html b/attendance/templates/attendance/period_list.html
new file mode 100644
index 0000000..865b067
--- /dev/null
+++ b/attendance/templates/attendance/period_list.html
@@ -0,0 +1,65 @@
+{% extends 'application.html' %}
+
+{% block content %}
+<article class="instructor__attendance_log">
+    <section class="panel">
+        <h1>Attendance log</h1>
+        {% if user.instructor %}
+        <a class="instructor__generate_reports action-button" href="">Generate Reports →</a>
+        {% endif %}
+        <table>
+            <thead>
+                <tr>
+                    {% if user.instructor %}
+                    <th>Student</th>
+                    {% endif %}
+                    <th>Station</th>
+                    <th>Date</th>
+                    <th>Clocked in</th>
+                    <th>Clocked out</th>
+                    <th colspan="2">Duration</th>
+                </tr>
+            </thead>
+            <tbody>
+                {% for period in page_obj %}
+                    {% if period.clocked_out %}
+                        <tr>
+                            {% if user.instructor %}
+                            <td>{{ period.student }}</td>
+                            {% endif %}
+                            <td>{{ period.station_number }}</td>
+                            <td>{{ period.clocked_in|date:"M d, y" }}</td>
+                            <td>{{ period.clocked_in|time:"P" }}</td>
+                            {% if period.clocked_out %}
+                                <td>{{ period.clocked_out|time:"P" }}</td>
+                                <td>{{ period.clocked_in|timesince:period.clocked_out }}</td>
+                            {% else %}
+                                <td colspan="2">Current sesson: {{ period.clocked_in|timesince }}</td>
+                            {% endif %}
+                        </tr>
+                    {% endif %}
+                {% empty %}
+                    <tr><td colspan="2">No periods yet.</td></tr>
+                {% endfor %}
+            </tbody>
+        </table>
+    </section>
+    <section class="pagination">
+        <span class="step-links">
+            {% if page_obj.has_previous %}
+                <a href="?page=1">&laquo; first</a>
+                <a href="?page={{ page_obj.previous_page_number }}">previous</a>
+            {% endif %}
+
+            <span class="current">
+                Page {{ page_obj.number }} of {{ page_obj.paginator.num_pages }}.
+            </span>
+
+            {% if page_obj.has_next %}
+                <a href="?page={{ page_obj.next_page_number }}">next</a>
+                <a href="?page={{ page_obj.paginator.num_pages }}">last &raquo;</a>
+            {% endif %}
+        </span>
+    </section>
+</article>
+{% endblock %}
diff --git a/static/scss/_home.scss b/static/scss/_home.scss
new file mode 100644
index 0000000..9c2a554
--- /dev/null
+++ b/static/scss/_home.scss
@@ -0,0 +1,5 @@
+.home {
+    h1, h2 {
+        text-align: center;
+    }
+}