diff --git a/content/assets/stylesheets/includes/blogpost.scss b/content/assets/stylesheets/includes/blogpost.scss
index bd7ee28..a23d397 100644
--- a/content/assets/stylesheets/includes/blogpost.scss
+++ b/content/assets/stylesheets/includes/blogpost.scss
@@ -3,3 +3,14 @@
     font-size: 4em;
   }
 }
+
+.padbox{
+  margin-bottom:10px;
+}
+
+.bolder a{
+  color:#565C5E;
+  font-weight: bold;
+  font-size: 20pt;
+  font-family: 'Avenir';
+}
diff --git a/content/posts/16-17/moar-review.md b/content/posts/16-17/moar-review.md
new file mode 100644
index 0000000..bbdd7d5
--- /dev/null
+++ b/content/posts/16-17/moar-review.md
@@ -0,0 +1,7 @@
+---
+title: moar review
+description: blub
+banner: https://i.ytimg.com/vi/tntOCGkgt98/maxresdefault.jpg
+created_at: 24-10-2016
+---
+blub
diff --git a/content/posts/16-17/review-c.md b/content/posts/16-17/review-c.md
index 7bdbd4d..ed38a66 100644
--- a/content/posts/16-17/review-c.md
+++ b/content/posts/16-17/review-c.md
@@ -1,4 +1,5 @@
 ---
+banner: http://dailydropcap.com/images/C-9.jpg
 title: C review
 description: We hebben even wat dingen in C geschreven, en dit zijn onze meningen
 created_at: 23-10-2016
diff --git a/layouts/archive_page.erb b/layouts/archive_page.erb
index 7b8cfc2..54a28a5 100644
--- a/layouts/archive_page.erb
+++ b/layouts/archive_page.erb
@@ -1,19 +1,32 @@
-<% posts_in_year(item[:academic_year]).each do |post| %>
-<a href="<%= relative_path_to(post) %>">
-  <div class="box">
-    <article class="media">
-      <figure class="media-left">
-        <p class="image is-64x64">
-          <img src="<%= post[:banner] %>">
-        </p>
-      </figure>
-      <div class="media-content">
-        <div class="content">
-          <h2><%= post[:title] %></h2>
-          <%= excerptize(post.reps[:text].compiled_content, length: 200) %>
-        </div>
+<div class="columns" >
+  <div class="column">
+  <% posts_in_year(item[:academic_year]).each do |post| %>
+    <a href="<%= relative_path_to(post) %>" >
+      <div class="box padbox">
+        <article class="media">
+          <figure class="media-left">
+            <p class="image is-64x64">
+            <img src="<%= post[:banner] %>">
+            </p>
+          </figure>
+          <div class="media-content">
+            <div class="content">
+              <h2><%= post[:title] %></h2>
+              <%= excerptize(post.reps[:text].compiled_content, length: 200) %>
+            </div>
+          </div>
+        </article>
       </div>
-    </article>
+    </a>
+  <% end %>
   </div>
-</a>
-<% end %>
+  <div class="column is-narrow">
+    <ul class = "archive_list">
+      <% academic_years_items.each do |year, item| %>
+        <li class="bolder">
+          <%= link_to pretty_year(year), item %>
+        </li>
+      <% end %>
+    </ul>
+  </div>
+</div>
diff --git a/lib/helpers/archives.rb b/lib/helpers/archives.rb
index f11d29f..0af010a 100644
--- a/lib/helpers/archives.rb
+++ b/lib/helpers/archives.rb
@@ -11,7 +11,7 @@ module ArchiveHelper
   end
 
   def academic_years_items
-    academic_years.map { |y| [y, items["/archives/#{y}-#{y + 1}.html"]] }.to_h
+    academic_years.to_a.reverse.map { |y| [y, items["/archives/#{y}-#{y + 1}.html"]] }.to_h
   end
 
   def pretty_year(year)