edit css

css/app.css

@@ -15,6 +15,48 @@ html { font-size: 100%; }
 
 /* Grid */
 
+*, *:before, *:after {
+  -moz-box-sizing: border-box;
+  -webkit-box-sizing: border-box;
+  box-sizing: border-box;
+}
+
+.container {
+  margin: 0 auto;
+  max-width: 48rem;
+  width: 90%;
+}
+
+@media (min-width: 40rem) {
+  .column {
+    float: left;
+    padding-left: 1rem;
+    padding-right: 1rem;
+  }
+  
+  .column.full { width: 100%; }
+  .column.two-thirds { width: 66.7%; }
+  .column.half { width: 50%; }
+  .column.third { width: 33.3%; }
+  .column.fourth { width: 25%; }
+  .column.three-fourths { width: 75%; }
+  .column.flow-opposite { float: right; }  
+}
+
+.clearfix:before,
+.clearfix:after {
+  content: " ";
+  display: table;
+}
+ 
+.clearfix:after {
+  clear: both;
+}
+ 
+.clearfix {
+  *zoom: 1;
+}
+
 /* Ditto */
 
 body {
@@ -28,7 +70,6 @@ body {
 
 #sidebar {
     position: fixed;
-    width: 300px;
     height: 100%;
 
     overflow-y: scroll;
@@ -93,9 +134,6 @@ body {
 }
 
 #content {
-    width: 580px;
-
-    margin-left: 350px;
     padding-top: 10px;
     padding-bottom: 150px;