1 files changed, 33 insertions, 34 deletions

diff --git a/src/scss/auth.scss b/src/scss/auth.scss
index 5f4fb91..962641c 100644
--- a/src/scss/auth.scss
+++ b/src/scss/auth.scss
@@ -1,51 +1,50 @@
 @import "./variables";
 @import "./mixins";
 
-#main-content {
-	padding-top: 20rem;
-	padding-bottom: 5rem;
-	display: flex;
-	flex-direction: row;
+main#main {
+	padding-top: 20em;
+	padding-bottom: 5em;
+	@include row;
 	justify-content: center;
-}
 
-.branding {
-	max-width: 100%;
-	width: 30rem;
-	margin-right: 5rem;
-}
+	.branding {
+		max-width: 100%;
+		width: 30em;
+		margin-right: 5em;
 
-.branding h1 {
-	color: $blue;
-	font-family: facebook;
-	font-size: 3.5rem;
-}
+		h1 {
+			color: $blue;
+			font-family: $header-font;
+			font-size: 3.5em;
+		}
 
-.branding span {
-	font-size: 1.5rem;
-}
+		span {
+			font-size: 1.5em;
+		}
+	}
 
-.form {
-	display: flex;
-	flex-direction: column;
-	width: 30rem;
-	max-width: 100%;
+	.form {
+		@include column;
+		max-width: 100%;
+		width: 30em;
+	}
 }
 
+
 @media(max-width: 1200px) {
-	#main-content {
-		flex-direction: column;
+	main#main {
+		@include column;
 		align-items: center;
-		width: 100%;
-		padding: 10rem 1rem;
-	}
+		padding: 10rem $outer-gap;
 
-	.branding {
-		margin: 0;
-	}
+		.branding {
+			margin: 0;
+		}
 
-	.form {
-		margin-top: 4rem;
+		.form {
+			margin-top: 4rem;
+		}
 	}
+
 }