styling updates

src/scss/base.scss

@@ -2,35 +2,29 @@
 
 * {
     box-sizing: border-box;
+    padding: 0;
+    margin: 0;
 }
 
 html, body {
-    margin: 0;
-    padding: 0;
     height: 100%;
     background-color: $background-color-alt2;
-    overflow: hidden;
     font-family: $font-family-sans-serif;
     font-size: $font-size-base;
     color: $text-color;
-    line-height: 1.42857143;
+    line-height: $line-height-base;
 }
 
 h1, h2, h3, h4, h5, h6 {
     font-family: $font-family-sans-serif;
     color: $text-color;
-    margin: 0;
-    padding: 0;
 }
 
 p {
-    margin: 0 0 10px 0;
-    padding: 0;
+    margin-bottom: 10px;
 }
 
 img {
-    margin: 0;
-    padding: 0;
     border: none;
 }
 
@@ -45,7 +39,6 @@ input, select, textarea, button {
 }
 
 button {
-    padding: 0;
     white-space: nowrap;
 }
 

src/scss/pages.scss

@@ -1,6 +1,6 @@
 @import "variables.scss";
 
-#login, #register {
+#login {
     display: flex;
     justify-content: center;
     align-items: center;
@@ -15,7 +15,17 @@
         height: calc(100% + 300px);
         margin-top: -300px;
     }
+}
 
+#register {
+    margin-top: 20px;
+
+    .content {
+        margin: 0 auto;
+    }
+}
+
+#login, #register {
     .content {
         max-width: 300px;
 

src/scss/variables.scss

@@ -10,6 +10,7 @@ $border-color-dark: #ddd;
 $list-item-hover: #fbfbfb;
 $list-icon-color: #c7c7cd;
 $border-radius: 3px;
+$line-height-base: 1.42857143;
 
 $gray: #555;
 $gray-light: #777;

src/scss/vault.scss

@@ -1,7 +1,7 @@
 @import "variables.scss";
 
 #vault {
-    height: 100vh;
+    height: 100%;
     display: flex;
 
     #groupings {