move .content responsive css to site.scss

fixes #412

h/css/common.scss

@@ -587,13 +587,9 @@ blockquote {
     }
   }
 
-  .inner {
-    max-width: grid(12);
-    margin: 0 auto;
-    & > * {
+  .inner > * {
     padding: .3em;
   }
-  }
 
   .tinyman {
     border-left: 1px solid $grayLighter;
@@ -845,56 +841,3 @@ blockquote {
     display: none;
   }
 }
-
-
-
-/*
-    Mobile layout
-    240-479 px
-    Zoomed out below 320 px
-*/
-
-@media screen and (min-width: 15em) {
-  .content { padding: 3em 1em; }
-}
-
-/*
-    Wide mobile layout
-    480-767 px
-    Zoomed in above 480 px
-*/
-
-@media screen and (min-width: 30em) {
-}
-
-/*
-    Tablet layout
-    600-911 px
-    Zoomed in above 600 px
-*/
-
-@media screen and (min-width: 37.5em) {
-  .content { padding: 6em; }
-}
-
-/*
-    Widescreen layout
-    912-1887 px
-    Zoomed in above 912 px
-*/
-
-@media screen and (min-width: 57em) {
-  .content {
-    max-width: grid(12);
-    margin: auto;
-  }
-}
-
-/*
-    Huge-screen layout
-    1888-2520 px
-    Zoomed in above 1920 px
-*/
-
-@media screen and (min-width: 118em) {
-}

h/css/site.scss

@@ -70,6 +70,8 @@ hgroup {
 @media screen and (min-width: 15em) {
   .auth { width: 100%; }
 
+  .content { padding: 3em 1em; }
+
   header {
     margin-bottom: 2em;
     text-align: center;
@@ -99,6 +101,7 @@ hgroup {
 */
 
 @media screen and (min-width: 37.5em) {
+  .content { padding: 6em; }
 }
 
 /*
@@ -108,6 +111,15 @@ hgroup {
 */
 
 @media screen and (min-width: 57em) {
+  .content {
+    max-width: grid(12);
+    margin: auto;
+  }
+
+  .topbar .inner {
+    max-width: grid(12);
+    margin: 0 auto;
+  }
 }
 
 /*