diff -r 000000000000 -r a2f88c3bd824 httpdocs/style.css
--- /dev/null	Thu Jan 01 00:00:00 1970 +0000
+++ b/httpdocs/style.css	Mon Feb 20 15:10:53 2012 +0100
@@ -0,0 +1,140 @@
+@font-face {
+    font-family: TitilliumText1;
+    src: url(fonts/TitilliumText22L001-webfont.woff);
+}
+
+@font-face {
+    font-family: TitilliumText2;
+    src: url(fonts/TitilliumText22L002-webfont.woff);
+}
+
+@font-face {
+    font-family: TitilliumText3;
+    src: url(fonts/TitilliumText22L003-webfont.woff);
+}
+
+@font-face {
+    font-family: CPMonoBold;
+    src: url(fonts/CPMono_v07_Bold-webfont.woff);
+}
+
+body {
+    font-family: Helvetica Neue, Arial, Helvetica, 'Liberation Sans', FreeSans, sans-serif;  
+    padding: 0px;
+    text-align: center;
+    background-color: #222;
+    color: #ddd;
+    border-style: none;
+}
+
+#wrap { 
+    margin: 0px auto 0px auto;
+    width: 400px;
+    text-transform: uppercase;
+}
+
+#title-area {
+    margin-top: 8%;
+    color: #328EB5;
+    font-size: 3em;
+    font-family: TitilliumText1;
+}
+
+#compare-area {
+    margin-top: 8%;
+    height: 6em;
+    font-size: 1.3em;
+    font-weight: bold;
+}
+
+#compare-area #compare-left {  
+    position: relative;
+    height: 100%;
+    padding-top: 5em;
+    right: 51%;
+    text-align: right;
+    background-color: #111;
+}
+
+#compare-area #compare-right {  
+    position: relative;
+    height: 100%;
+    padding-top: 5em;
+    top: -11em;
+    left: 51%;
+    text-align: left;
+    background-color: #111;
+}
+
+#result-area { 
+    margin-top: 30%;
+    height: 3em;
+    font-weight: bold;
+}
+
+#result-area #result-left {  
+    position: relative;
+    height: 44px;
+    padding-top: 28px;
+    right: 51%;
+    width: 61.5%;
+    text-align: right;
+    background-color: #151515;
+    color: #222;
+}
+
+#result-area #result-left-rating {  
+    position: relative;
+    height: 40px;
+    padding-top: 26px;
+    top: -72px;
+    left: 30%;
+    width: 18%;
+    background-color: #3d910e;
+    color: #222;
+    font-family: CPMonoBold;
+    border: solid 3px #151515;
+}
+
+#result-area #result-right-rating {  
+    position: relative;
+    height: 40px;
+    padding-top: 26px;
+    top: -144px;
+    left: 51%;
+    width: 18%;
+    background-color: #AC4810;
+    color: #222;
+    font-family: CPMonoBold;
+    border: solid 3px #151515;
+}
+
+#result-area #result-right {  
+    position: relative;
+    height: 44px;  
+    padding-top: 28px;
+    top: -216px;
+    left: 69.5%;
+    width: 61.5%;
+    text-align: left;
+    background-color: #151515;
+    color: #222;
+}
+
+.hover-backlight:hover {
+    color: #5ad715;
+    background-color: #0a0a0a ! important;
+}
+
+.padding-left {
+    padding-left: 5em; 
+}
+
+.padding-right {
+    padding-right: 5em;
+}
+
+a:link { 
+    color: #ddd;
+    text-decoration: none; 
+}