diff --git a/.gitignore b/.gitignore
index 3ad75cd..190fac0 100644
--- a/.gitignore
+++ b/.gitignore
@@ -1,3 +1,5 @@
 /sass/.DS_Store
 
 /.sass-cache
+
+/sass/.sass-cache/
diff --git a/less/buttons.less b/less/buttons.less
index 1378932..f00aa60 100644
--- a/less/buttons.less
+++ b/less/buttons.less
@@ -1,32 +1,21 @@
 .btn {
-	background: #fff;
-	color: #fff;
-	display: inline-block; /* Enables non-inline-block elements like <div>s to be buttons */
-	font-size: 2.5em; 
-	padding: 15px 40px 16px;
-	text-decoration: none; 
-	margin: .3em .2em 0 0;
-	cursor: pointer;
-	border: 0;
-	outline: 0; /* when the button is focused, don't show an outline */
+	background: #999;
 	border-radius: 10px; /* rounded corners */
+	border: 0;
+	color: #fff;
+	cursor: pointer;
+	display: inline-block; /* Enables non-inline-block elements like <div>s to be buttons */
+	font-size: 2.5em;
+	margin: .2em .3em .2em 0;
+	padding: 15px 40px 16px;
 }
 
 .btn:hover {
-	background: #eee;
+	background: #888;
 }
 
 .btn:active,.btn:focus {
-	background: #ddd;
-}
-
-.btn:not([class*='btn-']) {
-	color: #000;
-	border: 2px solid;
-	padding: 13px 38px 14px; /* This way we don't change the button size, as there's no border on other buttons */
-	&.small-btn {
-		padding: 8px 14px 9px; /* This padding is 2px smaller than the normal small-btn padding to account for the border */
-	}
+	background: #777;
 }
 
 .btn-a {
@@ -60,8 +49,8 @@
 	}
 }
 
-.small-btn {
-	padding: 10px 15px 11px;
-	font-size: .9em;
+.btn-sm {
 	border-radius: 4px; /* rounded corners */
+	font-size: .9em;
+	padding: 10px 15px 11px;
 }
diff --git a/less/general.less b/less/general.less
index 313c3be..ed85c6b 100644
--- a/less/general.less
+++ b/less/general.less
@@ -1,18 +1,18 @@
 body, textarea {
-	font-family: Arial, sans-serif;
+	font: 16px Arial, sans-serif; /* Arial is used so that the navbar looks nice on iOS. */
 	margin: 0;
-	font-size: 16px;
 }
 
 .smooth {
 	transition: all .2s;
 }
 
-@media (max-width:870px) {
-	.row column {
-		width: 100%;
-		margin: 1% auto;
-	}
+.btn, .nav a {
+	text-decoration: none;
+}
+
+.btn, .nav {
+	outline: 0; /* when the button or navbar is focused, don't show an outline */
 }
 
 .container {
diff --git a/less/grid.less b/less/grid.less
index e9ecf75..e0c019a 100644
--- a/less/grid.less
+++ b/less/grid.less
@@ -1,12 +1,14 @@
 /* Grid system responsive code is in general.less */
 
-/* Since every column has 2% padding (1% on each side) its width is (((its number/12) * 100)-2) percent (truncated, to avoid spillage.) Thus, c12 has width 98%. */
+/*
+	Since every column has 2% padding (1% on each side) its width is (((its number/12) * 100)-2) percent (truncated, to avoid spillage.) Thus, c12 has width 98%.
+*/
 
 .row {
-	line-height: 2em;
 	margin-top: 2%;
-	overflow: auto;
+	overflow: auto; /* required - without this, the page layout is screwed up */
 }
+
 column {
 	float: left;
 	margin: auto 1%;
@@ -50,3 +52,11 @@ column {
 .c1 {
 	width: 6.33%;
 }
+
+/* For smaller screens, change all columns to 100% width */
+@media (max-width:870px) {
+	.row column {
+		margin: 1% auto;
+		width: 100%;
+	}
+}
diff --git a/less/icons.less b/less/icons.less
index f6fc2b9..3d28e36 100644
--- a/less/icons.less
+++ b/less/icons.less
@@ -1,4 +1,3 @@
 ico {
-	font-size: 2.04em;
-	font-family: Arial Unicode MS, Lucida Sans Unicode, sans-serif; /* This combo of Unicode fonts means Min's icons support OSX 10.5+, Windows 98+, and Ubuntu. */
+	font: 2.04em Arial Unicode MS, Lucida Sans Unicode; /* This combo of Unicode fonts means Min's icons support OSX 10.5+, Windows 98+, and Ubuntu. */
 }
diff --git a/less/inputs.less b/less/inputs.less
index 62812f0..6395bc8 100644
--- a/less/inputs.less
+++ b/less/inputs.less
@@ -1,8 +1,13 @@
+textarea, input, .addon-front {
+	border: 1px solid #ccc;
+	font-size: .8em;
+}
+
 textarea, input {
 	outline: 0;
 	padding: 6px;
 	&:focus {
-		border: 1px solid #5ab;
+		border-color: #5ab;
 	}
 }
 
@@ -11,12 +16,6 @@ textarea, input[type='text'] {
 }
 
 .addon-front {
-	padding: 6px 11px 6px 10px;
-	margin-right: -2px;
+	padding: 6px 11px;
 	border-right: 0;
 }
-
-textarea, input, .addon-front {
-	border: 1px solid #ccc;
-	font-size: .8em;
-}
diff --git a/less/navbar.less b/less/navbar.less
index 2b196f9..031386e 100644
--- a/less/navbar.less
+++ b/less/navbar.less
@@ -1,93 +1,70 @@
-nav {
+.nav, .nav-link:hover, .nav .pagename {
 	background: #000;
+	color: #fff;
 }
 
-.navbar {
-	color: #fff;
+.nav {
 	height: 1.5em;
 	padding: .7em 0 .95em;
-	outline: 0;
+	/* Uncomment for animations
+	max-height: 1.5em;
+	*/
 }
 
-.navbar a {
-	text-decoration: none;
-}
-
-.navbar-link {
+.nav a {
 	padding-right: 1em;
 	color: #aaa;
 	top: -1px;
-	position: relative;
 	font-size: 14px;
-	&:hover {
-		color: #fff;
-	}
+	position: relative;
 }
 
-button.btn.close.small-btn {
+.btn.btn-close {
 	background: #000;
 	visibility: hidden;
 	float: right;
-	margin-right: 4px;
-	margin-top: -51px;
+	margin-top: -54px;
 	font-size: 25px;
-	color: #fff;
-	border: 0;
 }
 
 .current {
-	color: #fff; /* make current page white */
+	color: #fff; /* make current page link white */
 }
 
-.pagename {
-	color: #fff;
+.nav .pagename {
 	font-size: 22px;
 	top: 1px;
-	position: relative;
 }
 
-.navbar input, .navbar .btn {
-	margin-top: -20px;
-	/* This ensures that any buttons and inputs in the navbar will not mess up its vertical alignment */
-}
-
-/* Necessary for animations
-.navbar {
-	max-height: 1.5em;
-}
-*/
-
 @media (max-width:500px) {
-	button.btn.close.small-btn {
+	.btn.btn-close {
 		visibility: visible;
 	}
-	.navbar {
+	.nav {
 		/* transition: max-height .5s ease-in-out, height .5s ease-in-out; */
 		overflow: hidden;
 	}
 	.pagename {
 		margin-top: -11px;
 	}
-	.navbar:focus {
+	.nav:focus {
 		/* Necesary for animations
 		max-height: 500px;
 		height: 100%;
 		*/
 		height: auto;
 	}
-	.navbar:before {
+	.nav div:before {
 		content: '_';
-		font-weight: bold;
 		border-bottom: 10px double;
-		line-height: 0;
 		float: right;
-		font-size: 32px;
-		margin-top: -10px;
+		top: 1px;
 		position: relative;
 		background: #000;
 		height: 21px;
+		font: bold 32px/0 sans-serif; /* bold, 32px sans-serif text with a line-height of zero */
 	}
-	.navbar a {
+	.nav a {
 		padding: .5em 0;
 		width: 50%;
 		display: block;
diff --git a/sass/_button.scss b/sass/_button.scss
index f6cfd1a..af76f13 100644
--- a/sass/_button.scss
+++ b/sass/_button.scss
@@ -15,36 +15,26 @@
 }
 
 
+
 @if $import-buttons == true {
 //-------------------------------------------------------------------
 // Button Styles & Classes
 //-------------------------------------------------------------------
 
-
-
 // Set Generic <button> and .btn styling.
 // use .btn on any element to give it the styling of a button
 .btn {
-  @include btn-style(#fff, #eee, #ddd);
-  border-radius: 10px; /* rounded corners */
+  @extend %no-underline;
+  @extend outline-0;
+  @include btn-style(#999, #888, #777);
   border: 0;
+  border-radius: 10px; // rounded corners
   color: #fff;
   cursor: pointer;
-  display: inline-block; /* Enables non-inline-block elements like <div>s to be buttons */
+  display: inline-block; // Enables non-inline-block elements like <a>s to be buttons
   font-size: 2.5em;
-  margin: .3em .7em;
-  outline: 0; /* when the button is focused, don't show an outline */
+  margin: .2em .3em .2em 0;
   padding: 15px 40px 16px;
-  text-decoration: none;
-
-  // to make sure buttons are visible when not paired with a coloring
-  // class, we give the <button> and .btn a dark border and text color
-  &:not([class*='btn-']) {
-    box-shadow: 0 0 0 2px inset;
-    color: #000;
-    // We use box shadow here because then we can
-    // apply a border without changing the element height
-  }
 }
 
 
@@ -65,10 +55,10 @@
 
 // Add this class to a <button> or element with a .btn class
 // to create a smaller sized button.
-.btn-small {
-  border-radius: 7px; /* rounded corners */
-  font-size: 1em;
-  padding: 7px 19px 8px;
+.btn-sm {
+  border-radius: 4px; /* rounded corners */
+  font-size: .9em;
+  padding: 10px 15px 11px;
 }
 
 
diff --git a/sass/_general.scss b/sass/_general.scss
index ab1944e..4a91f74 100644
--- a/sass/_general.scss
+++ b/sass/_general.scss
@@ -2,51 +2,36 @@
 //  General Min Styling
 //-------------------------------------------------------------------
 
-body {
-  font: 16px sans-serif;
+body, textarea {
+  font: 16px Arial, sans-serif;
   margin: 0;
+  // Arial is used so the nav bar looks nice in iOS
 }
 
+
+// apply a smooth transition effect to an element's state change
 .smooth {
   transition: all .2s;
 }
 
-hr {
-  margin: 2.5em auto;
+.container {
+  margin: auto;
+  width: 1270px;
 
-  &.mediumwidth {
-    margin: 2.5em auto;
-  }
-}
-
-.mediumwidth {
-  margin-bottom: .3em;
-  margin-left: 30%;
-  margin-top: .3em;
-  width: 40%;
-}
-
-@media (max-width:870px) {
-  .mediumwidth {
-    margin-left: 15%;
-    width: 70%;
-  }
-  .row [class*='c']{
-    display: block;
-    margin: 1% auto;
-    width: 100%;
-  }
-  .row:last-child column {
-    margin-bottom: 2.5em;
-  }
-}
-
-@media (max-width:520px) {
-  .mediumwidth {
-    margin-left: 0;
-    width: 100%;
-  }
-  hr.mediumwidth {
+  @media(max-width:1310px) {
+    margin: 0 20px;
     width: auto;
   }
 }
+
+
+
+// shared styling between btn and links in nav bars
+%outline-0 {
+  outline: 0;
+  // when button or nav bar is focused don't show an outline
+}
+
+%no-underline {
+  text-decoration: none;
+}
diff --git a/sass/_grid.scss b/sass/_grid.scss
index 037c871..5e384c4 100644
--- a/sass/_grid.scss
+++ b/sass/_grid.scss
@@ -2,12 +2,16 @@
 //-------------------------------------------------------------------
 //  Grid system responsive code is in _general.scss
 //  A hack (for old IEs) for the grid system is located in _iehacks.scss
+//
+//
+//  Every column has 2% padding (1% on each side) its width is
+//  (((its number/12) * 100)-2) percent (truncated, to avoid spillage.)
+//  Thus, c12 has width 98%.
 //-------------------------------------------------------------------
 
 .row {
-  line-height: 2em;
   margin-top: 2%;
-  overflow: auto;
+  overflow: auto; // needed for proper formed layout
 }
 
 column {
@@ -15,6 +19,11 @@ column {
   margin: auto 1%;
 }
 
+// IE Grid Fix
+.ie column {
+  margin: auto .7%;
+}
+
 .c12 {
 	width: 98%;
 }
@@ -52,6 +61,14 @@ column {
 	width: 6.33%;
 }
 
+
+@media (max-width:870px) {
+  .row column {
+    margin: 1% auto;
+    width: 100%;
+  }
+}
+
 //-------------------------------------------------------------------
 // End @if
 }
diff --git a/sass/_headings.scss b/sass/_headings.scss
index de33d5e..8bf369b 100644
--- a/sass/_headings.scss
+++ b/sass/_headings.scss
@@ -3,8 +3,7 @@
 //  Headings
 //-------------------------------------------------------------------
 
-/* Make the default heading style larger */
-// Set style for <h1>
+// Set style for <h1> -- larger than 'normal'
 h1 {
   font-size: 4em;
 }
diff --git a/sass/_icons.scss b/sass/_icons.scss
index e72a220..73df59d 100644
--- a/sass/_icons.scss
+++ b/sass/_icons.scss
@@ -1,11 +1,12 @@
-@if $import-icons == true{
+@if $import-icons == true {
 //-------------------------------------------------------------------
 //  Icons
 //-------------------------------------------------------------------
 
 ico {
-  font-size: 2.04em;
-  font-family: Arial Unicode MS, Lucida Sans Unicode, sans-serif; /* This combo of Unicode fonts means Min's icons support OSX 10.5+, Windows 98+, and Ubuntu. */
+  font: 2.04em Arial Unicode MS, Lucida Sans Unicode;
+  // This combo of Unicode fonts means Min's icons support
+  // OSX 10.5+, Windows 98+, and Ubuntu.
 }
 
 
diff --git a/sass/_iehacks.scss b/sass/_iehacks.scss
index 220dee6..e0bd4b2 100644
--- a/sass/_iehacks.scss
+++ b/sass/_iehacks.scss
@@ -1,24 +1,9 @@
-@if $import-ie-hacks == true{
+@if $import-ie-hacks == true {
 //-------------------------------------------------------------------
 //  Internet Explorer Hacks
 //-------------------------------------------------------------------
 
-// IE Medium Width
-.ie .mediumwidth {
-  margin-left: 0;
-  width: 70%;
-
-  hr {
-    margin: 100px auto;
-    padding-left: 200px;
-  }
-}
-
-
-// IE Grid System
-.ie column {
-  margin: auto .7%;
-}
+//  no hacks (outside of the ie grid hack found in the grid.scss file)
 
 //-------------------------------------------------------------------
 // End @if
diff --git a/sass/_inputs.scss b/sass/_inputs.scss
index 678a7a5..84eb7eb 100644
--- a/sass/_inputs.scss
+++ b/sass/_inputs.scss
@@ -12,12 +12,11 @@
 
 textarea, input {
   @extend %global-inputs;
-  font-family: sans-serif;
-  outline: none;
+  outline: 0;
   padding: 6px;
 
   &:focus {
-    border: 1px solid #5ab;
+    border-color: #5ab;
   }
 }
 
@@ -30,8 +29,7 @@ textarea, input[type='text'] {
 .addon-front {
   @extend %global-inputs;
   border-right: 0;
-  margin-right: -2px;
-  padding: 6px 11px 6px 10px;
+  padding: 6px 11px;
 }
 
 
diff --git a/sass/_navbar.scss b/sass/_navbar.scss
index e56c68a..030cd56 100644
--- a/sass/_navbar.scss
+++ b/sass/_navbar.scss
@@ -1,55 +1,96 @@
-@if $import-navbar == true{
+@if $import-navbar == true {
 //-------------------------------------------------------------------
 //  Navigation Bar
 //-------------------------------------------------------------------
 
-.navbar {
+// CSS reused in multiple selectors
+%nav-global {
   background: #000;
   color: #fff;
+}
+
+
+
+.nav {
+  @extend %nav-global;
   height: 1.5em;
-  padding: 1em 0 .6em;
-  text-align: left;
-  width: 100%;
+  padding: .7em 0 .95em;
+  // max-height: 1.5em; // needed for animations, uncomment to use
 
   a {
-    text-decoration: none;
+    @extend %no-underline;
+    @extend %nav-global;
+    color: #aaa;
+    font-size: 14px;
+    padding-right: 1em;
+    position: relative;
+    top: -1px;
   }
 
-  input, button, .btn {
-    margin-top: -20px;
-    // This ensures that any buttons and inputs in the
-    // navbar will not mess up its vertical alignment
+  .pagename {
+    @extend %nav-global;
+    font-size: 22px;
+    top: 1px;
   }
 
-  // Update styling of .navbar for small screens
-  @media(max-width:500px) {
-    height: 7.5em;
+  .current {
+    @extend %nav-global;
+  }
+}
+
+.btn.btn-close {
+  @extend %nav-global;
+  float: right;
+  font-size: 25px;
+  margin-top: -54px;
+  visibility: hidden;
+}
+
+
+
+// Update styling of .nav for small screens
+@media (max-width:500px) {
+  .btn.btn-close {
+    visibility: visible;
+  }
+
+  .nav {
+    overflow: hidden;
+    // transition: max-height .5s ease-in-out, height .5s ease-in-out;
+
+    &:focus {
+      /* Necesary for animations
+      max-height: 500px;
+      height: 100%;
+      */
+      height: auto;
+    }
+
+    & div:before {
+      background: #000;
+      border-top: 3px solid;
+      border-bottom: 10px double;
+      content: '';
+      float: right;
+      height: 4px;
+      position: relative;
+      right: 3px;
+      top: 14px;
+      width: 20px;
+    }
 
     a {
       display: block;
-      text-align: center;
+      padding: .5em 0;
+      width: 50%;
     }
   }
-}
 
-
-.pagename {
-  color: #fff;
-  padding: 0 1em 0 2em;
-  font-weight: bold;
-}
-
-
-.navbar-link {
-  color: #aaa;
-  padding: .5em;
-
-  &:hover {
-    color: #fff;
+  .pagename {
+    margin-top: -11px;
   }
 }
 
-
 //-------------------------------------------------------------------
 // End @if
 }
diff --git a/sass/_table.scss b/sass/_table.scss
index 8f6b9e1..ae0aacb 100644
--- a/sass/_table.scss
+++ b/sass/_table.scss
@@ -8,19 +8,21 @@ table {
   width: 100%;
 }
 
+
 tbody tr:nth-child(2n-1) {
-  background: #ccc; /* Shade every other table row */
+  background: #ccc; // Shade every other table row
+  // We use tbody to ensure that we don't shade the heading
+  // this preserves the order of the shading
 }
 
-.table {
-  th, td {
-    line-height: 1.4em;
-    padding: .5em;
-    text-align: left;
-  }
+
+th, td {
+  padding: .5em;
+  text-align: left;
 }
 
 
+
 //-------------------------------------------------------------------
 // End @if
 }
diff --git a/sass/min-master.scss b/sass/min-master.scss
index 58d0acc..cc05888 100644
--- a/sass/min-master.scss
+++ b/sass/min-master.scss
@@ -5,6 +5,7 @@
 @import 'general.scss';
 
 
+
 // ------------------------------------------------------------------
 //  Customize Optional Components
 //
@@ -28,19 +29,18 @@ $import-icons:                            true!default;
 
 $import-grid:                             true!default;
 
-$import-ie-hacks:                         true!default;
+$import-ie-hacks:                         false!default;
 
 
 // ------------------------------------------------------------------
 //  Import Components based on above customization
 // ------------------------------------------------------------------
 
-@import 'button.scss';
-@import 'grid.scss';
-@import 'headings.scss';
-@import 'icons.scss';
-@import 'inputs.scss';
-@import 'messages.scss';
-@import 'navbar.scss';
-@import 'table.scss';
-@import 'iehacks.scss';
+@import 'button';
+@import 'grid';
+@import 'headings';
+@import 'icons';
+@import 'inputs';
+@import 'navbar';
+@import 'table';
+@import 'iehacks';