diff --git a/ietf/group/info.py b/ietf/group/info.py
index f0241b39e..e18551af8 100644
--- a/ietf/group/info.py
+++ b/ietf/group/info.py
@@ -296,25 +296,28 @@ def chartering_groups(request):
                        group_types=group_types))
 
 def concluded_groups(request):
-    group_types = GroupTypeName.objects.filter(slug__in=("wg", "rg"))
+    sections = OrderedDict()
 
-    for t in group_types:
-        t.concluded_groups = Group.objects.filter(type=t, state__in=("conclude", "bof-conc")).select_related("state", "charter").order_by("acronym")
+    sections['WGs'] = Group.objects.filter(type='wg', state="conclude").select_related("state", "charter").order_by("parent__name","acronym")
+    sections['RGs'] = Group.objects.filter(type='rg', state="conclude").select_related("state", "charter").order_by("parent__name","acronym")
+    sections['BOFs'] = Group.objects.filter(type='wg', state="bof-conc").select_related("state", "charter").order_by("parent__name","acronym")
 
+    for name, groups in sections.items():
+        
         # add start/conclusion date
-        d = dict((g.pk, g) for g in t.concluded_groups)
+        d = dict((g.pk, g) for g in groups)
 
-        for g in t.concluded_groups:
+        for g in groups:
             g.start_date = g.conclude_date = None
 
-        for e in ChangeStateGroupEvent.objects.filter(group__in=t.concluded_groups, state="active").order_by("-time"):
+        for e in ChangeStateGroupEvent.objects.filter(group__in=groups, state="active").order_by("-time"):
             d[e.group_id].start_date = e.time
 
-        for e in ChangeStateGroupEvent.objects.filter(group__in=t.concluded_groups, state="conclude").order_by("time"):
+        for e in ChangeStateGroupEvent.objects.filter(group__in=groups, state="conclude").order_by("time"):
             d[e.group_id].conclude_date = e.time
 
     return render(request, 'group/concluded_groups.html',
-                  dict(group_types=group_types))
+                  dict(sections=sections))
 
 def get_group_materials(group):
 #   return Document.objects.filter(group=group, type__in=group.features.material_types, session=None).exclude(states__slug="deleted")
diff --git a/ietf/templates/group/concluded_groups.html b/ietf/templates/group/concluded_groups.html
index 1489b431f..abe6b9b43 100644
--- a/ietf/templates/group/concluded_groups.html
+++ b/ietf/templates/group/concluded_groups.html
@@ -6,23 +6,41 @@
 <link rel="stylesheet" href="{% static "jquery.tablesorter/css/theme.bootstrap.min.css" %}">
 {% endblock %}
 
+{% block morecss %}
+
+.fixed { position: fixed; }
+
+.bs-docs-sidebar .nav .nav>li>a { padding-left: 20px; }
+
+.bs-docs-sidebar .nav ul.nav { display: none; }
+
+.bs-docs-sidebar .nav>.active>ul.nav { display: block; }
+
+{% endblock %}
+
+{% block bodyAttrs %}data-spy="scroll" data-target="#navscroller"{% endblock %}
+
 {% block title %}Concluded groups{% endblock %}
 
 {% block content %}
   {% origin %}
+  <div class="col-md-10">
   <h1>Concluded groups</h1>
 
   <p class="alert alert-info">Note that the information on historical groups may be inaccurate.</p>
 
-  {% for t in group_types %}
-    <h2>{{ t.name }}s</h2>
+  {% for label, groups in sections.items %}
+   <div class="anchor-target" id="{{label}}">
+    <div class="panel panel-default">
+      <div class="panel-heading">{{label}}</div>
+      <div class="panel-body">
 
-    {% if t.slug == "wg" %}
+    {% if label == "WGs" %}
       <p>
         Some additional concluded WGs may
         be present <a href="https://tools.ietf.org/wg/concluded">here</a>.
       </p>
-    {% elif t.slug == "rg" %}
+    {% elif label == "RGs" %}
       <p>
         The information below is incomplete and misses a few older RGs.
         Please check the <a href="https://irtf.org/groups">IRTF site</a>
@@ -30,36 +48,69 @@
       </p>
     {% endif %}
 
-    {% if not t.concluded_groups %}
+    {% if not groups %}
       <p><b>No groups found.</b></p>
     {% else %}
-      <table class="table table-condensed table-striped tablesorter">
-        <thead>
-          <tr>
-            <th>Group</th>
-            <th>Name</th>
-            <th>Start</th>
-            <th>Concluded</th>
-          </tr>
-        </thead>
-        <tbody>
-          {% for g in t.concluded_groups %}
-            <tr>
-              <td>
-	        <a href="{{ g.about_url }}">{{ g.acronym }}</a>
-              </td>
-              <td>{{ g.name }}</td>
-              <td>{{ g.start_date|date:"Y-m" }}</td>
-              <td>{{ g.conclude_date|date:"Y-m" }}</td>
-            </tr>
-          {% endfor %}
-        </tbody>
-      </table>
+      {% regroup groups by parent as grouped_by_areas %}
+      {% for area_grouping in grouped_by_areas %}
+       <div class="anchor-target" id="{{label}}-{{area_grouping.grouper.name|default:'unknown'|slugify}}">
+        <div class="panel panel-default">
+          <div class="panel-heading">{{area_grouping.grouper.name|default:'Unknown area'}}</div>
+          <div class="panel-body">
+            <table class="table table-condensed table-striped tablesorter">
+              <thead>
+                <tr>
+                  <th class="col-md-1">Group</th>
+                  <th class="col-md-7">Name</th>
+                  <th class="col-md-1">Start</th>
+                  <th class="col-md-1">Concluded</th>
+                </tr>
+              </thead>
+              <tbody>
+                {% for g in area_grouping.list %}
+                  <tr>
+                    <td>
+  	            <a href="{{ g.about_url }}">{{ g.acronym }}</a>
+                    </td>
+                    <td>{{ g.name }}</td>
+                    <td>{{ g.start_date|date:"Y-m" }}</td>
+                    <td>{{ g.conclude_date|date:"Y-m" }}</td>
+                  </tr>
+                {% endfor %}
+              </tbody>
+            </table>
+          </div>
+        </div>
+       </div>
+      {% endfor %}
     {% endif %}
+     </div>
+   </div>
+  </div>
   {% endfor %}
+ </div>
 
+  <div class="col-md-2 hidden-print bs-docs-sidebar" id="navscroller">
+    <ul class="nav nav-pills nav-stacked small fixed" >
+      {% for label, groups in sections.items %}
+        <li>
+          <a href="#{{label}}">{{label}}</a>
+          {% regroup groups by parent as grouped_by_areas %}
+          <ul class="nav nav-pills nav-stacked">
+          {% for area_grouping in grouped_by_areas %}
+            <li>
+               <a href="#{{label}}-{{area_grouping.grouper.name|default:'unknown'|slugify}}">
+                 {{area_grouping.grouper.name|default:'Unknown area'}}
+               </a>
+            </li>
+          {% endfor %}
+          </ul>
+        </li>
+      {% endfor %}
+    </ul>
+  </div>
 {% endblock %}
 
 {% block js %}
 <script src="{% static "jquery.tablesorter/js/jquery.tablesorter.combined.min.js" %}"></script>
-{% endblock %}
\ No newline at end of file
+{% endblock %}