Full width header/footer with background colors

1 files changed, 18 insertions, 5 deletions

diff --git a/style.css b/style.css
index ef63fc7..6d8027e 100644
--- a/style.css
+++ b/style.css
@@ -318,12 +318,17 @@ html {
   font-size: 100%; }
 
 body {
-  max-width: 740px;
   margin: 0 auto;
   background: white;
   font: 18px/1.4 Helvetica, Arial, sans-serif;
   color: #333333; }
 
+.container {
+  margin: 0 auto;
+  max-width: 740px;
+  padding: 0 20px;
+  width: 100%; }
+
 h1, h2, h3, h4, h5, h6 {
   font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
   color: #222222;
@@ -409,10 +414,12 @@ img {
   color: black;
   background: #eeeeee; }
 
+.wrapper-masthead {
+  background-color: #e8e8f2;
+  margin-bottom: 50px; }
+
 .masthead {
-  margin: 20px 0 30px;
-  padding-bottom: 20px;
-  border-bottom: 1px dotted #aaaaaa; }
+  padding: 25px 0; }
 
 .avatar {
   float: left;
@@ -439,7 +446,8 @@ img {
   float: left;
   font-size: 16px;
   margin: 0;
-  margin-top: -5px; }
+  margin-top: -5px;
+  color: #333333; }
 
 nav {
   float: right;
@@ -466,6 +474,7 @@ nav {
     width: 100%;
     text-align: center; } }
 
+
 .posts > .post {
   padding-bottom: 2em;
   border-bottom: 1px solid #eeeeee; }
@@ -478,6 +487,10 @@ nav {
   padding: 0.1em 1em;
   color: #666666; }
 
+.wrapper-footer {
+  background-color: #eeeeee;
+  border-top: 1px solid #dddddd; }
+
 footer {
   padding: 20px 0;
   text-align: center; }