Make overall styles lighter

public/style.css

@@ -12,7 +12,7 @@ body
 
 .warning {
   padding: 10px 15px;
-  background-color: beige;
+  background-color: #fcfcfc;
   margin: 25px 0;
 }
 
@@ -39,47 +39,45 @@ input.postcode
 }
 
 tr.footer {
-  border-top: 2px solid #777;
+  border-top: 1px solid #eee;
   border-bottom: 0px solid black;
 }
 
 tr.header {
-  border-bottom: 2px solid #777;
+  border-bottom: 1px solid #eee;
 }
 
 
-#footer
+#header
 {
   font-size: 100%;
-  background-color: #555;
-  color: #fff;
+  background-color: #e8f3f4;
+  color: #999;
   text-align: left;
-  margin: 40px 0 0 0;
+  margin: 0 0 0px 0;
   height: 100%;
 }
 
-#footer_inner {
+#header_inner {
   margin: 0 auto;
-  padding: 30px 0;
+  padding: 10px 0;
   width: 930px;
 }
 
-#footer h1 {
+#header h1 {
   font-size: 180%;
-  color: #fff;
+  color: #555;
 }
 
 a
 {
-  background-color: #dce9b0;
   padding: 1px 4px;
-  color: #111;
+  color: #999;
   text-decoration: none;
 }
 
 a:visited
 {
-  background-color: #eee;
   padding: 1px 4px;
   color: #111;
   text-decoration: none;
@@ -95,19 +93,20 @@ a:hover
 Show icon for external links
 https://stackoverflow.com/questions/18168286/how-can-i-style-external-links-like-wikipedia
 */
-a[href^="//"]:after, 
-a[href^="http://"]:after, 
+
+/*a[href^="//"]:after,
+a[href^="http://"]:after,
 a[href^="https://"]:after {
   content: url(/external-link.png);
   margin: 0 0 0 5px;
-}
+}*/
 
 h1
 {
   margin-top: 20px;
   line-height: 1.4em;
   font-weight: bold;
-  color: #86a11d;
+  color: #555;
 }
 
 h2
@@ -115,7 +114,7 @@ h2
   margin-top: 40px;
   line-height: 1.5em;
   font-weight: bold;
-  color: #86a11d;
+  color: #555;
 }
 
 h3
@@ -123,7 +122,7 @@ h3
   margin: 30px 0 10px 0;
   line-height: 1.5em;
   font-weight: bold;
-  color: #86a11d;
+  color: #555;
 }
 
 
@@ -145,7 +144,7 @@ form
 
 .highlight
 {
-  background-color: #fff7c0;
+  background-color: #e8f3f4;
 }
 
 strong
@@ -156,6 +155,7 @@ strong
 table
 {
   border-collapse: collapse;
+  margin: 60px 0;
 }
 
 td, th
@@ -179,11 +179,11 @@ tr
 
 .elected
 {
-  background-color: #777;
-  color: white;
+  background-color: #e8f3f4;
+  color: #333;
   padding: 2px 5px;
   font-weight: normal;
-  text-transform: uppercase;
+  text-transform: lowercase;
 }
 
 .noborder
@@ -192,8 +192,8 @@ tr
 }
 
 #lookup {
-  background-color: beige;
-  padding: 10px 25px;
+  background-color: #fafafa;
+  padding: 0px 10px;
 }
 
 #notice {