Add some basic styles

app/assets/stylesheets/layout.scss

@@ -0,0 +1,112 @@
+$content-width: 800px;
+$content-max-width: 100%;
+
+body {
+  font-family: "Open Sans", Helvetica, Arial, sans-serif;
+  font-weight: 400;
+}
+
+#wrapper {
+  width: 100%;
+  text-align: center;
+
+  > header {
+    margin: 0 auto;
+    padding: 4rem 0;
+    text-align: center;
+    background: #0d4f99;
+    background: linear-gradient(35deg, #8955a0 0, #0d4f99 100%);
+
+    h1 {
+      font-size: 1.8rem;
+      color: #fff;
+
+      span.project-name {
+        display: none;
+        // font-size: .5em;
+        // text-transform: none;
+        // vertical-align: super;
+      }
+
+      span.beta {
+        font-size: .5em;
+        font-style: italic;
+        text-transform: none;
+        vertical-align: super;
+      }
+
+      span.bolt {
+        color: #ffd000;
+      }
+    }
+
+    p.current-user {
+      margin-top: 2rem;
+      color: rgba(255,255,255,0.6);
+
+      strong {
+        font-weight: 400;
+        color: #fff;
+        // color: #ffd000;
+        // color: #ccff40;
+      }
+    }
+
+    a {
+      color: rgba(255,255,255,0.6);
+      transition: color 0.1s linear;
+
+      &:hover, &:active {
+        color: #fff;
+      }
+    }
+  }
+}
+
+.flash-msg {
+  width: 100%;
+  text-align: center;
+  padding: 2rem 0;
+
+  &.notice {
+    background: #efffc4;
+  }
+
+  &.alert {
+    background: #fff4c2;
+  }
+}
+
+main {
+  width: $content-width;
+  max-width: $content-max-width;
+  margin: 4rem auto;
+  text-align: left;
+
+  h2, h3 {
+    margin-bottom: 1.5em;
+  }
+
+  h2 {
+    font-size: 1.5rem;
+  }
+
+  h3 {
+    font-size: 1.25rem;
+  }
+
+  p {
+    line-height: 1.5rem;
+    margin-bottom: 1rem;
+
+    &.notice {
+      text-align: center;
+    }
+  }
+
+  section {
+    border-bottom: 1px dotted #ccc;
+    padding-bottom: 4rem;
+    margin-bottom: 4rem;
+  }
+}