diff --git a/static/stylesheet/style.less b/static/stylesheet/style.less
index 2a5c17f..3f161a5 100644
--- a/static/stylesheet/style.less
+++ b/static/stylesheet/style.less
@@ -1,12 +1,4 @@
-@orange: #D9411E;
-@light-orange: #FF5A09;
-@white:  #ffffff;
-@grey: #333333;
-@light-grey:  #eeeeee;
-@med-grey:  #999999;
-@dark-grey: #242121;
-@sans: 'Source Sans Pro', 'Verdana', sans-serif;
-@mono: 'Source Code Pro', 'Consolas', monospace;
+@import "variables.less";
 
 html, body {
   width: 100%;
@@ -50,20 +42,20 @@ h6 {
 body {
   margin: 0;
   padding: 0;
-  background-color: @white;
-  color: @dark-grey;
+  background-color: @body-bg;
+  color: @text-color;
   font-family: @sans;
   font-size: 1.02em;
   line-height: 1.2em;
 }
 
 a {
-  color: @orange;
+  color: @link-color;
   text-decoration: none;
 }
 
 a:hover {
-  color: @light-orange;
+  color: @link-hover-color;
 }
 
 hr {
@@ -80,16 +72,16 @@ img {
 }
 
 aside {
-  background-color: @grey;
-  color: @white;
+  background-color: @sidebar-bg;
+  color: @sidebar-text-color;
   text-align: center;
 
   a {
-    color: @white;
+    color: @sidebar-link-color;
   }
 
   a:hover {
-    color: @light-grey;
+    color: @sidebar-link-hover-color;
   }
 
   div {
@@ -129,15 +121,15 @@ main {
     text-transform: uppercase;
     font-size: .72em;
     padding: 14px 0 14px 0;
-    border-bottom: @light-grey 1px solid;
+    border-bottom: @nav-border-color 1px solid;
 
     a {
       padding: 0 4px 0 4px;
-      border-right: @light-grey 1px solid;
+      border-right: @nav-border-color 1px solid;
     }
 
     :first-child {
-      border-left: @light-grey 1px solid;
+      border-left: @nav-border-color 1px solid;
     }
   }
 
@@ -161,7 +153,7 @@ main {
       }
 
       p {
-        color: @med-grey;
+        color: @header-text-color;
         font-size: 0.86em;
       }
     }
@@ -242,13 +234,13 @@ main {
 
   footer {
     padding-top: 4px;
-    border-top: @light-grey 1px solid;
+    border-top: @footer-border-color 1px solid;
 
     p {
       margin: 2px;
       text-align: center;
       padding: 0 40px 0 40px;
-      color: @med-grey;
+      color: @footer-text-color;
       font-size: 11px;
     }
   }
@@ -256,11 +248,11 @@ main {
 
 .tag-cloud {
   a {
-    background-color: @orange;
+    background-color: @tag-bg;
     padding: .2em .6em .2em;
     font-size: .74em;
     line-height: 1;
-    color: @white;
+    color: @tag-text-color;
     text-align: center;
     white-space: nowrap;
     vertical-align: baseline;
@@ -268,16 +260,16 @@ main {
   }
 
   a:hover {
-    background-color: @light-orange;
+    background-color: @tag-hover-color;
   }
 }
 
 a.btn {
-  background-color: @orange;
+  background-color: @btn-bg;
   padding: .6em .6em;
   font-size: .8em;
   line-height: 1;
-  color: @white;
+  color: @btn-text-color;
   text-align: center;
   white-space: nowrap;
   vertical-align: baseline;
@@ -285,7 +277,7 @@ a.btn {
 }
 
 a.btn:hover {
-  background-color: @light-orange;
+  background-color: @btn-hover-color;
 }
 
 .center, .text-center {
@@ -305,8 +297,8 @@ a.btn:hover {
 div.related-posts {
   margin: 15px 0 15px 0;
   padding-bottom: 20px;
-  border-top: @light-grey 1px solid;
-  border-bottom: @light-grey 1px solid;
+  border-top: @rel-post-border-color 1px solid;
+  border-bottom: @rel-post-border-color 1px solid;
 
   h4 {
     margin: 20px 0 25px 0;
@@ -361,51 +353,51 @@ ul.social {
   }
 
   a.sc-facebook {
-    background-color: #3e5b98;
+    background-color: @facebook-bg-color;
   }
 
   a.sc-google {
-    background-color: #d93e2d;
+    background-color: @google-bg-color;
   }
 
   a.sc-pinterest {
-    background-color: #c92619;
+    background-color: @pinterest-bg-color;
   }
 
   a.sc-linkedin {
-    background-color: #3371b7;
+    background-color: @linkedin-bg-color;
   }
 
   a.sc-rss {
-    background-color: #f26109;
+    background-color: @rss-bg-color;
   }
 
   a.sc-stack-overflow {
-    background-color: #ff9900;
+    background-color: @stack-overflow-bg-color;
   }
 
   a.sc-twitter {
-    background-color: #4da7de;
+    background-color: @twitter-bg-color;
   }
 
   a.sc-youtube {
-    background-color: #e02a20;
+    background-color: @youtube-bg-color;
   }
 
   a.sc-github, a.sc-github-alt {
-    background-color: #111010;
+    background-color: @github-bg-color;
   }
 
   a.sc-envelope-o {
-    background-color: #578AD6;
+    background-color: @email-bg-color;
   }
 
   a.sc-reddit {
-    background-color: #ff4500;
+    background-color: @reddit-bg-color;
   }
 
   a.sc-soundcloud {
-    background-color: #ff5500;
+    background-color: @soundcloud-bg-color;
   }
 }
 
@@ -442,13 +434,17 @@ ul.social {
 
   main {
     width: 75%;
+    height: 100%;
     position: absolute;
     top: 0;
     left: 25%;
-    overflow-x: hidden;
-    overflow-y: hidden;
 
     article {
+
+      &.single {
+        min-height: 80%;
+      }
+
       ul.list {
         li {
           padding: 2px;
diff --git a/static/stylesheet/variables.less b/static/stylesheet/variables.less
new file mode 100644
index 0000000..b36a47d
--- /dev/null
+++ b/static/stylesheet/variables.less
@@ -0,0 +1,64 @@
+// Flex colors
+@orange: #D9411E;
+@light-orange: #FF5A09;
+@white:  #ffffff;
+@grey: #333333;
+@light-grey:  #eeeeee;
+@med-grey:  #999999;
+@dark-grey: #242121;
+
+// Font family
+@sans: 'Source Sans Pro', 'Verdana', sans-serif;
+@mono: 'Source Code Pro', 'Consolas', monospace;
+
+// Body
+@body-bg: @white;
+@text-color: @dark-grey;
+
+// Links
+@link-color: @orange;
+@link-hover-color: @light-orange;
+
+// Sidebar (aside)
+@sidebar-bg: @grey;
+@sidebar-text-color: @white;
+@sidebar-link-color: @white;
+@sidebar-link-hover-color: @light-grey;
+
+// Buttons
+@btn-bg: @orange;
+@btn-text-color: @white;
+@btn-hover-color: @light-orange;
+
+// Tag cloud
+@tag-bg: @orange;
+@tag-text-color: @white;
+@tag-hover-color: @light-orange;
+
+// Header
+@header-text-color: @med-grey;
+
+// Footer
+@footer-text-color: @med-grey;
+@footer-border-color: @light-grey;
+
+// Relativer posts
+@rel-post-border-color: @light-grey;
+
+// Nav
+@nav-border-color: @light-grey;
+
+// Social buttons
+
+@email-bg-color: #578AD6;
+@facebook-bg-color: #3e5b98;
+@github-bg-color: #111010;
+@google-bg-color: #d93e2d;
+@linkedin-bg-color: #3371b7;
+@pinterest-bg-color: #c92619;
+@reddit-bg-color: #ff4500;
+@rss-bg-color: #f26109;
+@soundcloud-bg-color: #ff5500;
+@stack-overflow-bg-color: #ff9900;
+@twitter-bg-color: #4da7de;
+@youtube-bg-color: #e02a20;
diff --git a/templates/archives.html b/templates/archives.html
index c92ba57..23df1e5 100644
--- a/templates/archives.html
+++ b/templates/archives.html
@@ -2,7 +2,7 @@
 {% block title %} – {{ _('Archives') }}{% endblock %}
 
 {% block content %}
-<article>
+<article class="single">
   <header>
     <h1>{{ _('Archives') }}</h1>
   </header>
diff --git a/templates/article.html b/templates/article.html
index f453e84..521a1ad 100644
--- a/templates/article.html
+++ b/templates/article.html
@@ -10,7 +10,7 @@
 {% block title %} &ndash; {{ article.title|striptags }}{% endblock %}
 
 {% block content %}
-<article>
+<article class="single">
   <header>
     <h1 id="{{ article.slug }}">{{ article.title }}</h1>
     <p>
diff --git a/templates/authors.html b/templates/authors.html
index 96f2edc..d802130 100644
--- a/templates/authors.html
+++ b/templates/authors.html
@@ -2,7 +2,7 @@
 {% block title %} &ndash; {{ _('Authors') }}{% endblock %}
 
 {% block content %}
-<article>
+<article class="single">
   <header>
     <h1>{{ _('Authors') }}</h1>
   </header>
diff --git a/templates/categories.html b/templates/categories.html
index aa1c44b..1153874 100644
--- a/templates/categories.html
+++ b/templates/categories.html
@@ -2,7 +2,7 @@
 {% block title %} &ndash; {{ _('Categories') }}{% endblock %}
 
 {% block content %}
-<article>
+<article class="single">
   <header>
     <h1>{{ _('Categories') }}</h1>
   </header>
diff --git a/templates/page.html b/templates/page.html
index 874d575..fff05c9 100644
--- a/templates/page.html
+++ b/templates/page.html
@@ -2,7 +2,7 @@
 {% block title %} &ndash; {{ page.title }}{% endblock %}
 
 {% block content %}
-<article>
+<article class="single">
   <header>
     <h1 id="{{ page.slug }}">{{ page.title }}</h1>
   </header>
diff --git a/templates/tags.html b/templates/tags.html
index 99bd5d7..1005fa9 100644
--- a/templates/tags.html
+++ b/templates/tags.html
@@ -2,7 +2,7 @@
 {% block title %} &ndash; {{ _('Tags') }}{% endblock %}
 
 {% block content %}
-<article>
+<article class="single">
   <header>
     <h1>{{ _('Tags') }}</h1>
   </header>