diff --git a/README.md b/README.md
index 072cd6b..edf4c9d 100644
--- a/README.md
+++ b/README.md
@@ -1,6 +1,8 @@
 # zeus.ugent.be
 [![Build Status](https://travis-ci.org/ZeusWPI/zeus.ugent.be.svg?branch=master)](https://travis-ci.org/ZeusWPI/zeus.ugent.be)
 [![Code Climate](https://codeclimate.com/github/ZeusWPI/zeus.ugent.be.png)](https://codeclimate.com/github/ZeusWPI/zeus.ugent.be)
+[![PageSpeed](https://pagespeed-badges.herokuapp.com/?url=zeus.ugent.be&strat=desktop&showStratLabel=true)](https://developers.google.com/speed/pagespeed/insights/?url=https%3A%2F%2Fzeus.ugent.be&tab=desktop)
+[![PageSpeed](https://pagespeed-badges.herokuapp.com/?url=zeus.ugent.be&strat=mobile&showStratLabel=true)](https://developers.google.com/speed/pagespeed/insights/?url=https%3A%2F%2Fzeus.ugent.be&tab=mobile)
 
 ## Setup
 
diff --git a/Rules b/Rules
index 158362d..d005ae7 100644
--- a/Rules
+++ b/Rules
@@ -16,7 +16,8 @@ preprocess do
   # We don't want to compile old blogposts in development
   ignore_old_blogposts if development?
   update_blog_attributes
-  create_blog_items
+  create_yearly_items('Blog')
+  create_yearly_items('Events')
   convert_event_time_to_timestamps
 end
 
@@ -42,7 +43,16 @@ end
 #
 # EVENTS
 #
-compile '/events/**/*' do
+
+# Overview page
+compile '/events/*' do
+  layout '/events.*'
+  layout '/generic.*'
+  layout '/default.*'
+  filter :erb
+end
+
+compile '/events/*/*' do
   filter :kramdown
 
   layout '/eventpost.*'
@@ -50,12 +60,12 @@ compile '/events/**/*' do
   filter :erb
 end
 
-compile '/events/**/*', rep: :text do
+compile '/events/*/*', rep: :text do
   filter :kramdown
   filter :strip_html
 end
 
-compile '/events/**/*', rep: :ical do
+compile '/events/*/*', rep: :ical do
   filter :ical
   write ext: 'ics'
 end
diff --git a/content/assets/stylesheets/includes/navbar.scss b/content/assets/stylesheets/includes/navbar.scss
index c706e72..a2fbc8e 100644
--- a/content/assets/stylesheets/includes/navbar.scss
+++ b/content/assets/stylesheets/includes/navbar.scss
@@ -35,7 +35,6 @@
 
   #logo-link {
     #logo {
-      padding-top: 10px;
       padding-left: 10px;
       width: 100px;
     }
@@ -75,3 +74,13 @@
     }
   }
 }
+
+.hero {
+  #logo {
+    padding-top: 25px;
+  }
+  
+  .nav-right {
+    padding-right: 10px;
+  }
+}
diff --git a/content/assets/stylesheets/includes/projects.scss b/content/assets/stylesheets/includes/projects.scss
index 4b3241e..2dce0e1 100644
--- a/content/assets/stylesheets/includes/projects.scss
+++ b/content/assets/stylesheets/includes/projects.scss
@@ -33,8 +33,12 @@
   margin-top: 30px;
 }
 
+.logo-wrapper {
+  padding-top: 0;
+  padding-bottom: 0;
+}
+
 .logo {
-  height:  10vw;
   width: 10vw;
   min-width: 100px;
   min-height: 100px;
@@ -42,12 +46,14 @@
   margin-right: auto;
   display: flex;
   align-items: center;
+
+  height: 100%;
 }
 
 .logo-initial {
   margin: auto;
   color: white;
-  font-size: 6vw;
+  font-size: 5rem;
   font-family: $family-sans-serif;
 }
 
diff --git a/content/cammie.erb b/content/cammie.erb
index 20c7b75..0ae23ce 100644
--- a/content/cammie.erb
+++ b/content/cammie.erb
@@ -9,7 +9,7 @@ title: Cammie
 <section id="cammie-section">
   <div id="cammie-body">
     <figure class="image is-16by9">
-    <img id="cammie-feed" alt="cammie" src="https://kelder.zeus.ugent.be/webcam/video/mjpg.cgi?profileid=2">
+      <img id="cammie-feed" alt="cammie" src="https://kelder.zeus.ugent.be/webcam/video/mjpg.cgi?profileid=2">
     </figure>
     <div id="cammie-ctrls">
       <div class="columns is-mobile">
@@ -29,7 +29,7 @@ title: Cammie
           <%= fa 'chevron-circle-left' %>
         </div>
         <div class="column">
-        <!-- blank space -->
+          <!-- blank space -->
         </div>
         <div class="column is-1 ctrl right" data-command="set_relative_pos" data-x="10" data-y="0">
           <%= fa 'chevron-circle-right' %>
diff --git a/content/events.erb b/content/events.erb
deleted file mode 100644
index 7dd7cda..0000000
--- a/content/events.erb
+++ /dev/null
@@ -1,34 +0,0 @@
----
-navigable: true
-title: Events
-order: 20
----
-<div class="container">
-  <div class="content">
-    <h1>Upcoming events</h1>
-  </div>
-  <% upcoming_events.each_slice(2) do |slice| %>
-  <div class="columns">
-    <% slice.each do |event| %>
-    <div class="tile is-parent ">
-      <%= render '/partials/_events_tile.*', event: event %>
-    </div>
-    <% end %>
-  </div>
-  <% end %>
-</div>
-
-<div class="container">
-  <div class="content">
-    <h1>Past events</h1>
-  </div>
-  <% past_events.each_slice(2) do |slice| %>
-  <div class="columns">
-    <% slice.each do |event| %>
-    <div class="tile is-parent ">
-      <%= render '/partials/_events_tile.*', event: event %>
-    </div>
-    <% end %>
-  </div>
-  <% end %>
-</div>
diff --git a/layouts/archive_page.erb b/layouts/archive_page.erb
index a77b803..7a93594 100644
--- a/layouts/archive_page.erb
+++ b/layouts/archive_page.erb
@@ -5,7 +5,7 @@
         Academiejaar
       </p>
       <ul class="menu-list">
-        <% academic_years_items.each do |year, item| %>
+        <% academic_years_blog_items.each do |year, item| %>
         <% if @item_rep && @item_rep.path == item.path %>
         <li>
           <a href="#" class="is-active">
diff --git a/layouts/default.erb b/layouts/default.erb
index 76e17b6..ab69cfc 100644
--- a/layouts/default.erb
+++ b/layouts/default.erb
@@ -18,37 +18,46 @@
 
     <meta property="fb:app_id" content="597670540410704">
 
-    <link href="https://cdnjs.cloudflare.com/ajax/libs/Tipue-Search/5.0.0/tipuesearch.css" rel="stylesheet">
-
+    <!-- Inline JS -->
     <!-- Google Analytics -->
     <script>
-    window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
-    ga('create', 'UA-25444917-1', 'auto');
-    ga('send', 'pageview');
+      window.ga=window.ga||function(){(ga.q=ga.q||[]).push(arguments)};ga.l=+new Date;
+      ga('create', 'UA-25444917-1', 'auto');
+      ga('send', 'pageview');
     </script>
+
+    <!-- CSS -->
+    <!-- TiptueSearch CSS -->
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/Tipue-Search/5.0.0/tipuesearch.css" >
+
+    <!-- Custom CSS -->
+    <%= asset :css, :main %>
+    
+    <!-- Font Awesome -->
+    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" integrity="sha384-T8Gy5hrqNKT+hzMclPo118YTQO6cYprQmhrYwIiQ/3axmI1hQomh7Ud2hPOy8SP1" crossorigin="anonymous">
+    
+    <!-- Animate.css -->
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css">
+    
+    <!-- External JS -->
+    <!-- Google Analytics -->
     <script async src='https://www.google-analytics.com/analytics.js'></script>
 
     <!-- Hotjar Tracking Code for zeus.ugent.be -->
     <script>
-(function(h,o,t,j,a,r){
-    h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)};
-    h._hjSettings={hjid:392303,hjsv:5};
-    a=o.getElementsByTagName('head')[0];
-    r=o.createElement('script');r.async=1;
-    r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv;
-    a.appendChild(r);
-})(window,document,'//static.hotjar.com/c/hotjar-','.js?sv=');
+      (function(h,o,t,j,a,r){
+          h.hj=h.hj||function(){(h.hj.q=h.hj.q||[]).push(arguments)};
+          h._hjSettings={hjid:392303,hjsv:5};
+          a=o.getElementsByTagName('head')[0];
+          r=o.createElement('script');r.async=1;
+          r.src=t+h._hjSettings.hjid+j+h._hjSettings.hjsv;
+          a.appendChild(r);
+      })(window,document,'//static.hotjar.com/c/hotjar-','.js?sv=');
     </script>
-
-    <%= asset :css, :main %>
-
-    <!-- Font Awesome -->
-    <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-T8Gy5hrqNKT+hzMclPo118YTQO6cYprQmhrYwIiQ/3axmI1hQomh7Ud2hPOy8SP1" crossorigin="anonymous">
-
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.5.2/animate.min.css">
-
+    
     <%= content_for(@item, :head) %>
   </head>
+
   <body class="site">
     <div class="wrapper">
       <%= yield %>
diff --git a/layouts/events.erb b/layouts/events.erb
new file mode 100644
index 0000000..df95b69
--- /dev/null
+++ b/layouts/events.erb
@@ -0,0 +1,56 @@
+<div class="columns">
+  <div class="column is-2 is-narrow">
+    <aside class="menu">
+      <p class="menu-label">
+        Academiejaar
+      </p>
+      <ul class="menu-list">
+        <% academic_years_event_items.each do |year, item| %>
+        <% if @item_rep && @item_rep.path == item.path %>
+        <li>
+          <a href="#" class="is-active">
+            <%= pretty_year(year) %>
+          </a>
+        </li>
+        <% else %>
+        <li>
+          <%= link_to pretty_year(year), item %>
+        </li>
+        <% end %>
+        <% end %>
+      </ul>
+    </aside>
+  </div>
+
+  <div class="column">
+    <% unless upcoming_events(@item[:academic_year]).empty? %>
+      <div class="content">
+        <h1>Upcoming events</h1>
+      </div>
+      <% upcoming_events(@item[:academic_year]).each_slice(2) do |slice| %>
+      <div class="columns">
+        <% slice.each do |event| %>
+        <div class="tile is-parent ">
+          <%= render '/partials/_events_tile.*', event: event %>
+        </div>
+        <% end %>
+      </div>
+      <% end %>
+    <% end %>
+
+    <% unless past_events(@item[:academic_year]).empty? %>
+      <div class="content">
+        <h1>Past events</h1>
+      </div>
+      <% past_events(@item[:academic_year]).each_slice(2) do |slice| %>
+      <div class="columns">
+        <% slice.each do |event| %>
+        <div class="tile is-parent ">
+          <%= render '/partials/_events_tile.*', event: event %>
+        </div>
+        <% end %>
+      </div>
+      <% end %>
+    <% end %>
+  </div>
+</div>
diff --git a/layouts/partials/_project.erb b/layouts/partials/_project.erb
index a217c44..34c49b5 100644
--- a/layouts/partials/_project.erb
+++ b/layouts/partials/_project.erb
@@ -1,6 +1,6 @@
 <div id="<%= project.identifier.without_ext.split('/')[-1] %>" class="container project content">
   <article class="columns is-mobile">
-    <div class="column is-one-quarter">
+    <div class="column is-gapless is-narrow logo-wrapper">
       <% if project[:logo_image] %>
         <div class="logo">
           <%= asset :img, project[:logo_image] %>
diff --git a/lib/helpers/archives.rb b/lib/helpers/archives.rb
index b4362d6..71f1a7c 100644
--- a/lib/helpers/archives.rb
+++ b/lib/helpers/archives.rb
@@ -3,7 +3,7 @@ module ArchiveHelper
     Set.new(items.find_all('/blog/*/*').map { |i| i.identifier.to_s[/\d\d-\d\d/] }).to_a
   end
 
-  def academic_years_items
+  def academic_years_blog_items
     academic_years.reverse.map { |y| [y, items["/blog/#{y}.html"]] }
   end
 
diff --git a/lib/helpers/events.rb b/lib/helpers/events.rb
index 72f190c..a430d7e 100644
--- a/lib/helpers/events.rb
+++ b/lib/helpers/events.rb
@@ -1,17 +1,31 @@
+# frozen_string_literal: true
+
 require 'uri'
+
 module EventsHelper
-  def all_events
-    @items.find_all('/events/*/*.md').sort_by { |x| x[:time] }
+  def all_events(year = nil)
+    items_ = if year
+               @items.find_all("/events/#{year}/*.md")
+             else
+               @items.find_all('/events/*/*.md')
+             end
+
+    items_.sort_by { |x| x[:time] }
   end
 
-  def upcoming_events
-    all_events.reject { |x| x[:time] <= Date.today }
+  def upcoming_events(year = nil)
+    all_events(year).reject { |x| x[:time] <= Date.today }
   end
 
-  def past_events
-    all_events.reject { |x| x[:time] > Date.today }.reverse
+  def past_events(year = nil)
+    all_events(year).reject { |x| x[:time] > Date.today }.reverse
   end
 
+  def academic_years_event_items
+    items.find_all('/events/*').map { |e| [e[:academic_year], e] }.reverse
+  end
+
+
   def grouped_events
     @items.find_all('/events/*/*/main.md')
   end
diff --git a/lib/helpers/preprocess.rb b/lib/helpers/preprocess.rb
index 546197c..d68dc21 100644
--- a/lib/helpers/preprocess.rb
+++ b/lib/helpers/preprocess.rb
@@ -18,17 +18,19 @@ module PreprocessHelper
     end
   end
 
-  def create_blog_items
-    # academic_years is defined in archives.rb
-    academic_years.each do |year|
+  def create_yearly_items(type)
+    type = type.to_s
+    years = @items.find_all("/#{type.downcase}/*/*").map { |i| i.identifier.to_s[/\d\d-\d\d/] }.uniq
+
+    years.each do |year|
       @items.create(
         '',
-        { academic_year: year, title: 'Blog' },
-        "/blog/#{year}.html"
+        { academic_year: year, title: type },
+        "/#{type.downcase}/#{year}.html"
       )
     end
 
-    academic_years_items[0][1].update_attributes(
+    @items["/#{type.downcase}/#{years[-1]}.html"].update_attributes(
       navigable: true,
       order: 10
     )
diff --git a/package-lock.json b/package-lock.json
new file mode 100644
index 0000000..91b30af
--- /dev/null
+++ b/package-lock.json
@@ -0,0 +1,11 @@
+{
+  "name": "zeus.ugent.be",
+  "version": "0.0.1",
+  "lockfileVersion": 1,
+  "dependencies": {
+    "bulma": {
+      "version": "https://registry.npmjs.org/bulma/-/bulma-0.4.2.tgz",
+      "integrity": "sha1-O+jIMs9mWL/EIey0H23FqKDHwOU="
+    }
+  }
+}
diff --git a/package.json b/package.json
index a255e50..104075a 100644
--- a/package.json
+++ b/package.json
@@ -7,6 +7,6 @@
   "license": "MIT",
   "repository": "https://github.com/ZeusWPI/zeus.ugent.be",
   "dependencies": {
-    "bulma": "0.4.1"
+    "bulma": "0.4.2"
   }
 }