make the header bigger, and align header and content padding better

the new way to do the links without adding links to images is probably
dumb and/or missing some stuff, but it works and does what I want, and I
think I like the old look of the colors better, so time to try it and
see if it sticks still

incorporealcms/static/css/base.css

@@ -12,11 +12,11 @@ body {
 }
 
 .site-wrap-normal-width {
-    max-width: 80pc;
+    max-width: 65pc;
 }
 
 .site-wrap-double-width {
-    max-width: 160pc;
+    max-width: 130pc;
 }
 
 .site-wrap {
@@ -34,8 +34,8 @@ a {
 div.header {
     display: flex;
     justify-content: space-between;
-    font-size: 0.75em;
-    padding: 0.5em 1em;
+    font-size: 0.9em;
+    padding: 1rem 1rem;
 }
 
 div.header a {
@@ -44,17 +44,10 @@ div.header a {
 
 div.content {
     font-size: 11pt;
-    padding: 0 1em;
+    padding: 0 1rem;
     line-height: 1.6em;
 }
 
-@media only screen and (min-width: 70pc) {
-    div.content, footer {
-        margin-left: 5pc;
-        margin-right: 5pc;
-    }
-}
-
 div.content p {
     margin: 1.25em 0;
 }

incorporealcms/static/css/dark.css

@@ -6,29 +6,28 @@ html {
 }
 
 body {
-    background: #090909;
+    background: #111;
 }
 
-strong {
-    color: #EEE;
-}
-
-.site-wrap {
-    background: black;
-}
-
-a:link, a:visited {
+h1, h2, h3, h4, h5, h6 {
     color: #B31D15;
 }
 
-a:hover, a:active {
+p a, ul a, ol a {
+    color: #DDD;
+    border-bottom: 1px solid #DDD;
+}
+
+p a:hover, ul a:hover, ol a:hover {
     color: #B31D15;
     border-bottom: 1px solid #B31D15;
 }
 
+div.site-wrap {
+    background: black;
+}
+
 div.header {
-    background: #222;
-    border-bottom: 1px solid #222;
     color: #BBB;
 }
 
@@ -36,6 +35,10 @@ div.header a {
     color: #BBB;
 }
 
+div.header a:hover, div.header a:active {
+    border-bottom: 1px solid #BBB;
+}
+
 table, th, td {
     border: 1px solid #333;
 }

incorporealcms/static/css/light.css

@@ -6,29 +6,28 @@ html {
 }
 
 body {
-    background: #F6F6F6;
+    background: #EEE;
 }
 
-strong {
-    color: #111;
+h1, h2, h3, h4, h5, h6 {
+    color: #811610;
 }
 
-.site-wrap {
+p a, ul a, ol a {
+    color: #222;
+    border-bottom: 1px solid #222;
+}
+
+p a:hover, ul a:hover, ol a:hover {
+    color: #811610;
+    border-bottom: 1px solid #811610;
+}
+
+div.site-wrap {
     background: white;
 }
 
-a:link, a:visited {
-    color: #811610;
-}
-
-a:hover, a:active {
-    color: #811610;
-    border-bottom: 1px solid #B31D15;
-}
-
 div.header {
-    background: #DDD;
-    border-bottom: 1px solid #DDD;
     color: #444;
 }
 
@@ -36,6 +35,10 @@ div.header a {
     color: #444;
 }
 
+div.header a:hover, div.header a:active {
+    border-bottom: 1px solid #444;
+}
+
 table, th, td {
     border: 1px solid #CCC;
 }