redesign

1 files changed, 44 insertions, 0 deletions

diff --git a/_sass/_respond.scss b/_sass/_respond.scss
new file mode 100644
index 0000000..1acbecc
--- /dev/null
+++ b/_sass/_respond.scss
@@ -0,0 +1,44 @@
+// Set up default container
+.container {
+  display: block;
+  width: 100%;
+  margin-left: auto;
+  margin-right: auto;
+  margin-top: 0;
+  margin-bottom: 0;
+}
+
+// If we have a decent size screen, we can split columns if we want to
+@media only screen and (min-width: 768px) {
+  .split {
+    @include clearfix;
+
+    .left, .right {
+      width: 50%;
+      margin: 0;
+      padding: 0;
+    }
+
+    .left {
+      float: left;
+    }
+
+    .right {
+      float: right;
+    }
+  }
+}
+
+// Set a layout breakpoint at 768px for tablets
+@media only screen and (min-width: 768px) and (max-width: 899px) {
+  .container {
+    width: 768px;
+  }
+}
+
+// Set a layout breakpoint at 900px for desktops
+@media only screen and (min-width: 900px) {
+  .container {
+    width: 900px;
+  }
+}