put some sidebars on the site for readability

incorporealcms/static/css/style.css

@@ -1,14 +1,29 @@
 html {
     font-family: sans-serif;
     padding: 0;
-    padding-bottom: 16px;
     color: #222;
 }
 
 body {
+    background: #888;
+
     margin: 0;
 }
 
+.site-wrap {
+    background: white;
+
+    max-width: 70pc;
+    height: 100vh;
+    margin: 0;
+    margin-left: auto;
+    margin-right: auto;
+
+    border: 1px solid #ddd;
+    border-top: none;
+    border-bottom: none;
+}
+
 h1,h2,h3,h4,h5,h6 {
     color: #811610;
 }
@@ -90,6 +105,7 @@ footer {
     font-size: 75%;
     color: #999;
     padding: 0 1em;
+    padding-bottom: 16px;
     margin-top: 15px;
 }
 

incorporealcms/templates/base.html

@@ -2,15 +2,17 @@
 <title>{{ title }}{% if title %} - {% endif %}{{ config.TITLE_SUFFIX }}</title>
 <link rel="stylesheet" href="{{ url_for('static', filename='css/style.css') }}">
 <link rel="icon" href="{{ url_for('static', filename='img/favicon.png') }}">
-<section class="nav">
-    {% for nav in navs %}
-    <a href="{{ nav.1 }}">{{ nav.0 }}</a>
-    {% if not loop.last %} &raquo; {% endif %}
-    {% endfor %}
+<section class="site-wrap">
+    <section class="nav">
+        {% for nav in navs %}
+        <a href="{{ nav.1 }}">{{ nav.0 }}</a>
+        {% if not loop.last %} &raquo; {% endif %}
+        {% endfor %}
+    </section>
+    <section class="content">
+    {{ content }}
+    </section>
+    <footer>
+        <i>Last modified: {{ mtime }}</i>
+    </footer>
 </section>
-<section class="content">
-{{ content }}
-</section>
-<footer>
-    <i>Last modified: {{ mtime }}</i>
-</footer>