Improve sizing of entire layout

app/styles/app.scss

@@ -2,7 +2,6 @@
   margin: 0;
   padding: 0;
   box-sizing: border-box;
-  font-size: 14px;
 }
 
 *:hover, *:active, *:focus {
@@ -17,13 +16,17 @@
 
 $font-family-sans: 'Open Sans', sans-serif;
 
-body {
+html, body {
   font-family: $font-family-sans;
   font-weight: 300;
+  font-size: 12px;
+  color: $body-text-color;
+}
+
+body {
   background-image: linear-gradient(to bottom, rgba(22, 21, 40, .4), rgba(0, 0, 0, .75)), url('/img/bg.jpg');
   background-repeat: none;
   background-attachment: fixed;
-  color: $body-text-color;
 }
 
 @media screen and (min-width: 900px) {