1 files changed, 23 insertions, 17 deletions
diff --git a/www/css/index.scss b/www/css/index.scss
index 2f246a7..81d5a1a 100644
--- a/www/css/index.scss
+++ b/www/css/index.scss
@@ -5,14 +5,19 @@ html, body, table {
 	height: 100%;
 	padding: 0;
 	margin: 0;
+
 	background-color: $red;
+	color: $yellow;
+
+	font-family: sans-serif;
+	font-weight: bolder;
 }
 
 table {
 	width: 100%;
 	border-collapse: collapse;
 	td, th {
-		border: solid 1px black;
+		border: solid 1px $yellow;
 	}
 	td {
 		text-align: center;
@@ -22,34 +27,35 @@ table {
 	thead {
 		height: 10%;
 		background-color: $yellow;
+		color: $red;
 	}
 	tbody {
 		td {
 			width: 33%;
 			height: 30%;
-			a {
-				/*display: inline-block;*/
-				display: table-cell;
+			div {
+				/* A wrapper round cell contents allowing us to use fancy
+				   table-positioning inside of the cell */
+				display: table;
 				width: 100%;
 				height: 100%;
-				text-decoration: none;
-				/* What this does is insert a 0-width, but tall, element to the left
-				   of the text, to stretch the line-height to the full
-				   height of the <a> element. *//*
-				span:before {
-					content: " ";
-					display: inline-block;
+				a {
+					display: table-cell;
 					height: 100%;
+					width: 100%;
 					vertical-align: middle;
 				}
-				span {
-					display: inline-block;
-				}*/
 			}
 		}
 	}
 }
-a:hover, a:active, a:focus {
-	text-decoration: underline;
-	background-color: $yellow;
+
+a {
+	text-decoration: none;
+	color: $yellow;
+	&:hover, &:active, &:focus {
+		text-decoration: underline;
+		background-color: $yellow;
+		color: $red;
+	}
 }