diff --git a/.gitignore b/.gitignore
index 424bc20..f2a50e0 100644
--- a/.gitignore
+++ b/.gitignore
@@ -4,6 +4,7 @@
 /logs/*
 silex.log
 /config/parameters.yml
+/config/scss-vars.scss
 /.vagrant
 node_modules/
 web/css/*
diff --git a/config/scss-vars.scss.dist b/config/scss-vars.scss.dist
new file mode 100644
index 0000000..1970cb7
--- /dev/null
+++ b/config/scss-vars.scss.dist
@@ -0,0 +1,15 @@
+$background: #000000;
+$background-list-item: #1a1a1a;
+
+$color-text: #ffffff;
+
+$logo: '/img/logo.png';
+
+$background-list-item-hover: #212121;
+$list-item-current-color: rgba(179, 255, 151, 1.0);
+$color-list-item-text: #ffffff;
+
+$winner-background-color: rgba(0,0,0, 0.6);
+
+$raffle-highlight-border-color: #f00;
+
diff --git a/source/scss/main.scss b/source/scss/main.scss
index 47d8379..c1161dc 100644
--- a/source/scss/main.scss
+++ b/source/scss/main.scss
@@ -1,3 +1,6 @@
+/* Config vars */
+@import "../../config/scss-vars";
+
 $total-columns: 12;
 $column-width:  4em;
 $gutter-width:  1em;
@@ -11,8 +14,8 @@ $grid-padding:  $gutter-width;
 @import "susy";
 
 body {
-    color: #ffffff;
-    background: #000000;
+    color: $color-text;
+    background: $background;
     font-family: 'Open Sans', Arial, Helvetica, sans-serif;
     font-size: 20px;
     font-weight: 300;
@@ -28,7 +31,7 @@ body {
     line-height: 120px;
 
     a {
-        color: #ffffff;
+        color: $color-text;
         text-decoration: none;
     }
 
@@ -37,7 +40,7 @@ body {
         width: 444px;
         height: 80px;
         text-indent: -9999px;
-        background-image: url("/img/logo.png");
+        background-image: url($logo);
     }
     .secondary {
         display: inline-block;
@@ -76,21 +79,20 @@ body {
     }
 
     a {
-        background: #1a1a1a;
+        background: $background-list-item;
         display: block;
-        color: #fff;
+        color: $color-list-item-text;
         text-decoration: none;
         padding: 0.5em;
         margin-bottom: 1px;
 
         &:hover {
-            background: #212121;
+            background: $background-list-item-hover;
         }
     }
 
     .first a {
-        color: rgba(179, 255, 151, 1.0);
-        text-shadow: 0 -1px 0 #000,0px 0 5px rgba(179,255,151,.8);
+        color: $list-item-current-color;
         font-size: 1.2em;
     }
 }
@@ -115,7 +117,7 @@ body {
         }
 
         &.selected {
-            border-color: #f00;
+            border-color: $raffle-highlight-border-color;
         }
 
         &.loser {
@@ -135,7 +137,7 @@ body {
                 width: 100%;
                 display: block;
                 font-size: 2em;
-                background-color: rgba(0,0,0, 0.6);
+                background-color: $winner-background-color;
                 padding: 3px;
             }
         }
@@ -144,7 +146,7 @@ body {
     .checkin-link {
         margin-bottom: 1em;
         a:link, a:visited {
-            color: white;
+            color: $color-text;
         }
     }
 }