diff --git a/rowers/templates/list_graphs.html b/rowers/templates/list_graphs.html
index cd60eaad..15174455 100644
--- a/rowers/templates/list_graphs.html
+++ b/rowers/templates/list_graphs.html
@@ -1,4 +1,4 @@
-{% extends "base.html" %}
+{% extends "newbase.html" %}
 {% load staticfiles %}
 {% load rowerfilters %}
 
@@ -8,61 +8,88 @@
 {% include "monitorjobs.html" %}
 {% endblock %}
 
-{% block content %}
+{% block main %}
 <h1>Recent Graphs</h1>
 
-<form id="searchform" action="."
-      method="get" accept-charset="utf-8">
-  <button class="button blue small" type="submit">
-    Search
-  </button>
-  <input class="searchfield" id="searchbox" name="q" type="text" placeholder="Search">
-</form>
-	{% if graphs1 %}
-		<div class="grid_1 alpha">
-		<p>&nbsp;</p>
-		</div>
+<ul class="main-content">
+  {% if graphs %}
+  <li class="grid_2">
+    <form id="searchform" action="."
+          method="get" accept-charset="utf-8">
+      <button class="button blue small" type="submit">
+        Search
+      </button>
+      <input class="searchfield" id="searchbox" name="q" type="text" placeholder="Search">
+    </form>
+  </li>
+  <li class="grid_2">
+    <p>
+      <span>
+        {% if graphs.has_previous %}
+        {% if request.GET.q %}
+        <a class="wh" href="?page=1&q={{ request.GET.q }}">
+          <i class="fas fa-arrow-alt-to-left"></i>
+        </a>
+        <a class="wh" href="?page={{ workouts.previous_page_number }}&q={{ request.GET.q }}">
+          <i class="fas fa-arrow-alt-left"></i>
+        </a>
+        {% else %}
+        <a class="wh" href="?page=1">
+          <i class="fas fa-arrow-alt-to-left"></i>
+        </a>
+        <a class="wh" href="?page={{ graphs.previous_page_number }}">
+          <i class="fas fa-arrow-alt-left"></i>
+        </a>
+        {% endif %}
+        {% endif %}
+        
+        <span>
+          Page {{ graphs.number }} of {{ graphs.paginator.num_pages }}.
+        </span>
+        
+        {% if graphs.has_next %}
+        {% if request.GET.q %}
+        <a class="wh" href="?page={{ graphs.next_page_number }}&q={{ request.GET.q }}">
+          <i class="fas fa-arrow-alt-right"></i>
+        </a>
+        <a class="wh" href="?page={{ graphs.paginator.num_pages }}&q={{ request.GET.q }}">
+          <i class="fas fa-arrow-alt-to-right">
+        </a>
+        {% else %}
+        <a class="wh" href="?page={{ graphs.next_page_number }}">
+          <i class="fas fa-arrow-alt-right"></i>
+        </a>
+        <a class="wh" href="?page={{ graphs.paginator.num_pages }}">
+          <i class="fas fa-arrow-alt-to-right"></i>
+        </a>
+        {% endif %}
+        {% endif %}
+      </span>
+    </p>
+  </li>
+  {% for graph in graphs %}
+  <li>
+    <p class="caption">
+      <a href="/rowers/graph/{{ graph.id }}/">
+	<img src="/{{ graph.filename }}" 
+	     onerror="this.src='/static/img/rowingtimer.gif'"
+	     alt="{{ graph.filename }}" width="120" height="100">
+      </a>
+    </p>
+    <p class="caption">{{ graph.workout.name }}</p>
+  </li>
+  {% endfor %}
+  {% else %}
+  <li class="grid_4">
+    <p>
+      No charts found
+    </p>
+  </li>
+  {% endif %}
+</ul>
 
-		{% for graph in graphs1 %}
-		<div id="thumb-container" class="grid_2">
-		<p class="caption"><a href="/rowers/graph/{{ graph.id }}/">
-		<img src="/{{ graph.filename }}" 
-			onerror="this.src='/static/img/rowingtimer.gif'"
-			alt="{{ graph.filename }}" width="120" height="100"></a></p>
-		<p class="caption">{{ graph.workout.name }}</p>
-		</div>
-		{% endfor %}
-
-		<div class="grid_1 omega">
-		<p>&nbsp;</p>
-		</div>
-
-
-		<div class="grid_12">
-		<p>&nbsp;</p>
-		</div>
-
-		<div class="grid_1 alpha">
-		<p>&nbsp;</p>
-		</div>
-
-		{% for graph in graphs2 %}
-		<div id="thumb-container" class="grid_2">
-		<a href="/rowers/graph/{{ graph.id }}/">
-		<p class="caption"><img src="/{{ graph.filename }}" 
-			onerror="this.src='/static/img/rowingtimer.gif'"
-			alt="{{ graph.filename }}" width="120" height="100"></a></p>
-		<p class="caption">{{ graph.workout.name }}</p>
-		</div>
-		{% endfor %}
-
-
-		<div class="grid_1 omega">
-		<p>&nbsp;</p>
-		</div>
-
-
-	{% else %}
-		<p> No graphs found </p>
-	{% endif %}
 {% endblock %}
+
+{% block sidebar %}
+{% include 'menu_workouts.html' %}
+{% endblock %}                
diff --git a/rowers/views.py b/rowers/views.py
index 55b6c67e..7d103e7b 100644
--- a/rowers/views.py
+++ b/rowers/views.py
@@ -10616,16 +10616,24 @@ def graphs_view(request):
                 )
 
 	g = GraphImage.objects.filter(workout__in=workouts).order_by("-creationdatetime")
-	if (len(g)<=5):
-	    return render(request, 'list_graphs.html',
-			  {'graphs1': g[0:4],
-                          'teams':get_my_teams(request.user),
-                          })
-	else:
-	    return render(request, 'list_graphs.html',
-			  {'graphs1': g[0:5],
-                           'teams':get_my_teams(request.user),
-			   'graphs2': g[5:10]})
+
+
+        paginator = Paginator(g,8)
+        page = request.GET.get('page')
+
+        try:
+            g = paginator.page(page)
+        except PageNotAnInteger:
+            g = paginator.page(1)
+        except EmptyPage:
+            g = paginator.page(paginator.num_pages)
+            
+	return render(request, 'list_graphs.html',
+		      {'graphs': g,
+                       'active':'nav-workouts',
+                       'teams':get_my_teams(request.user),
+                      })
+
     except Rower.DoesNotExist:
 	raise Http404("User has no rower instance")