From 6bc7a0883fb0c55c21c60d87d382ed8eac8600b8 Mon Sep 17 00:00:00 2001
From: Zach Cole <zach.a.cole@gmail.com>
Date: Thu, 19 May 2016 16:20:09 -0700
Subject: [PATCH] nested media queries

---
 simple-grid.scss | 22 +++++++++-------------
 1 file changed, 9 insertions(+), 13 deletions(-)

diff --git a/simple-grid.scss b/simple-grid.scss
index 4ef1fc1..49a3881 100644
--- a/simple-grid.scss
+++ b/simple-grid.scss
@@ -112,6 +112,15 @@ $breakpoint-large: 60em; // 960px
   width: 90%;
   margin-left: auto;
   margin-right: auto;
+
+  @media only screen and (min-width: $breakpoint-small) {
+    width: 80%;
+  }
+
+  @media only screen and (min-width: $breakpoint-large) {
+    width: 75%;
+    max-width: 60rem;
+  }
 }
 
 .row {
@@ -159,12 +168,6 @@ $breakpoint-large: 60em; // 960px
 .col-11-sm { width: ($width / (12 / 11)) - ($gutter * 1 / 12); }
 .col-12-sm { width: $width; }
 
-@media only screen and (min-width: $breakpoint-small) {
-  .container {
-    width: 80%;
-  }
-}
-
 @media only screen and (min-width: $breakpoint-med) {
   .col-1 { width:($width / 12) - ($gutter * 11 / 12); }
   .col-2 { width: ($width / 6) - ($gutter * 10 / 12); }
@@ -183,10 +186,3 @@ $breakpoint-large: 60em; // 960px
     display: block;
   }
 }
-
-@media only screen and (min-width: $breakpoint-large) {
-  .container {
-    width: 75%;
-    max-width: 60rem;
-  }
-}