diff --git a/app/static/css/partials/_film.scss b/app/static/css/partials/_film.scss
index 139597f..a098201 100644
--- a/app/static/css/partials/_film.scss
+++ b/app/static/css/partials/_film.scss
@@ -1,2 +1,36 @@
 
 
+.films {
+  width: 100vw;
+  .film {
+    width: 100vw;
+    display: flex;
+    flex-direction: row;
+    .left, .right {
+      width: 50%;
+      img {
+        max-width: 100%;
+      }
+    }
+    h1 {
+      font-weight: bold;
+      font-size: 20px;
+    }
+  }
+  @media screen and (max-width: 799px) {
+    .film {
+      margin-bottom: 16px;
+      flex-direction: column;
+      .left, .right {
+        width: 100%;
+        img {
+          max-width: 100%;
+        }
+      }
+      h2 {
+        margin-bottom: 8px;
+      }
+    }
+  }
+}
+
diff --git a/app/templates/film.html b/app/templates/film.html
index d4cffd1..e898943 100644
--- a/app/templates/film.html
+++ b/app/templates/film.html
@@ -3,6 +3,7 @@
 
 <video src="{{ settings.TIMELINE_PREFIX }}{{ film.padma_id }}/loop.mp4" autoplay loop muted></video>
 
+
 <h1>{{ film.data.title | safe }}</h1>
 <h2>{{ film.data.director|join:", "|safe }}</h2>
 <p>{{ film.data.summary|safe }}</p>
diff --git a/app/templates/films.html b/app/templates/films.html
index c40b174..53817ca 100644
--- a/app/templates/films.html
+++ b/app/templates/films.html
@@ -1,9 +1,18 @@
 {% extends "base.html" %}
 {% block main %}
+<div class="films">
 {% for film in films %}
-<div class="film">
-	<a href="{% url 'film' film.slug %}">{{ film.data.title | safe }}</a>
-	<span>{{ film.data.director|join:", "|safe }}</span>
-</div>
+	<div class="film">
+		<div class="left">
+			<h1><a href="{% url 'film' film.slug %}">{{ film.data.title | safe }}</a></h1>
+			<h2>{{ film.data.director|join:", "|safe }}</h2>
+		</div>
+		<div class="right">
+		<a href="{% url 'film' film.slug %}">
+			<img src="{{ settings.TIMELINE_PREFIX }}{{ film.padma_id }}/timeline.jpg">
+		</a>
+		</div>
+	</div>
 {% endfor %}
+</div>
 {% endblock %}
diff --git a/app/video/views.py b/app/video/views.py
index 353f6a1..cd745b9 100644
--- a/app/video/views.py
+++ b/app/video/views.py
@@ -1,23 +1,26 @@
 from django.shortcuts import render, redirect, get_object_or_404
 from django.views.decorators.csrf import csrf_exempt
-
+from django.conf import settings
 
 from . import models
 
 def films(request):
     context = {}
     context['films'] = models.Film.objects.filter(public=True).order_by('data__title')
+    context['settings'] = settings
     return render(request, 'films.html', context)
 
 def film(request, slug):
     context = {}
     context['film'] = get_object_or_404(models.Film, slug=slug)
+    context['settings'] = settings
     return render(request, 'film.html', context)
 
 def film_play(request, slug, lang):
     context = {}
     context['film'] = get_object_or_404(models.Film, slug=slug)
     context['lang'] = lang
+    context['settings'] = settings
     return render(request, 'film_play.html', context)
 
 def edits(request):
@@ -28,16 +31,19 @@ def edits(request):
 def edit(request, slug):
     context = {}
     context['edit'] = get_object_or_404(models.Edit, slug=slug)
+    context['settings'] = settings
     return render(request, 'edit.html', context)
 
 def edit_play(request, slug, lang):
     context = {}
     context['edit'] = get_object_or_404(models.Edit, slug=slug)
     context['lang'] = lang
+    context['settings'] = settings
     return render(request, 'edit_play.html', context)
 
 def tv(request):
     context = {}
+    context['settings'] = settings
     return render(request, 'tv.html', context)