Simplify .content width/margins.

Reduce magic numbers by switching fixed width to a margin elsewhere.
This has the added bonus of making the 'middle-width' .content
have a pleasing right margin.

1 files changed, 4 insertions, 14 deletions

diff --git a/web/cobrands/sass/_layout.scss b/web/cobrands/sass/_layout.scss
index 9ebe149cc..17d155527 100644
--- a/web/cobrands/sass/_layout.scss
+++ b/web/cobrands/sass/_layout.scss
@@ -204,9 +204,7 @@ h1 {
 // The narrow single column box
 .content {
   width: 27em;
-  margin-top: 3em;
-  margin-bottom: -1em;
-  margin-left: 0.5em;
+  margin: 3em 0.5em -1em;
   padding: 1em 1em 3em;
   background: #fff;
   color: #222;
@@ -217,7 +215,7 @@ h1 {
     // If no box-shadow, just want a boring black border to stand it out from the map.
     border: 1px solid #666;
     //take off margins so we line up properly
-    margin: 0 0 0 0.5em;
+    margin: 0 0.5em;
   }
 }
 
@@ -298,10 +296,7 @@ body.mappage {
 // full width page
 body.fullwidthpage {
   .content {
-    width: 57em;
-  }
-  .intro {
-    width:40em;
+    width: auto;
   }
 }
 // two thirds width page, also has option for a sidebar which can be sticky or not
@@ -798,7 +793,7 @@ textarea.form-error {
 body.frontpage {
   .table-cell {
     .content {
-      margin: 1em auto 0;
+      margin: 1em 0.5em 0;
     }
   }
   .nav-wrapper-2{
@@ -1195,11 +1190,6 @@ $button_bg_col: #a1a1a1;  // also search bar (tables)
     margin: 0em -1em 0 -1em;
   }
 
-  //make fullpage auto width
-  body.fullwidthpage .content {
-    width: auto;
-  }
-
   //make twothirdswidthpage nearly as small as main
   //.content: just enough to still fit the sidebar in
   body.twothirdswidthpage {