Better index display. Adjust positioning.

1 files changed, 41 insertions, 4 deletions

diff --git a/style/style.css b/style/style.css
index c9e9178..688afa8 100644
--- a/style/style.css
+++ b/style/style.css
@@ -1,11 +1,20 @@
+html {
+    background: url(background.png) left top no-repeat #fffedf;
+    padding: 0;
+}
+
 body {
 	width: 920px;
-	margin: auto auto;
+        padding-top: 2em;
+	margin: -20px auto 0 auto;
 	font-family: Georgia, serif;
-	background: url(background.png) left top no-repeat #fffedf;
+        background: rgba(255, 248, 200, 0.7);
+
 }
 
-header {}
+header {
+    border-bottom: 1px dotted #f60;
+}
 
 h1 {
 	text-align: center;
@@ -18,6 +27,7 @@ a, a:link, a:hover, a:visited {
 
 nav {
 	text-align: center;
+        margin-bottom: 1em;
 }
 
 nav a, nav span, footer a {
@@ -40,6 +50,7 @@ nav a:hover, footer a:hover {
 }
 
 article {
+        margin-top: 2em;
 	float: left;
 	text-align: center;
 }
@@ -52,7 +63,8 @@ article img {
 
 article#prev, article#next {
 	width: 180px;
-	margin: 0 2.5%
+	margin: 2em 2.5%;
+	padding-top: 10%; 
 }
 
 article#now {
@@ -68,4 +80,29 @@ footer {
 	clear: both;
 	text-align: center;
 	padding: 1em;
+        border-top: 1px dotted #ff6600;
+}
+
+ul {
+    background: rgba(255, 248, 200, 0.7);
+    padding: 1em;
+    column-count: 5;
+    text-align: center;
+}
+
+ul li {
+    list-style: none;
+    margin-bottom: 1em;
+}
+
+ul li a {
+    display: inline-block;
+    background: #ff6600;
+    padding: 2px 5px;
+    border: 1px solid #000;
+    border-radius: 4px;
+}
+
+ul li a:hover {
+    background: #fffedf;
 }