diff --git a/lms/static/sass/base/_grid-settings.scss b/lms/static/sass/base/_grid-settings.scss
index 54bb349d8c..6fdfaf9174 100644
--- a/lms/static/sass/base/_grid-settings.scss
+++ b/lms/static/sass/base/_grid-settings.scss
@@ -1,2 +1,9 @@
 /* Override the default global box-sizing */
-$border-box-sizing: false;
\ No newline at end of file
+@import "neat/neat-helpers"; // or "neat-helpers" when in Rails
+
+$border-box-sizing: false;
+
+/* Breakpoints */
+$mobile: new-breakpoint(max-width 320px 4);
+$tablet: new-breakpoint(min-width 321px max-width 768px, 8);
+$desktop: new-breakpoint(min-width 769px 12);
\ No newline at end of file
diff --git a/lms/static/sass/views/_login-register.scss b/lms/static/sass/views/_login-register.scss
index d077947115..2dd91b4871 100644
--- a/lms/static/sass/views/_login-register.scss
+++ b/lms/static/sass/views/_login-register.scss
@@ -3,8 +3,9 @@
 
 .login-register {
     @include box-sizing(border-box);
-    @include span-columns(6);
-    @include shift(3);
+    @include span-columns(4);
+    width: 100%;
+    max-width: 1200px;
 
     /* Temp. fix until applied globally */
     & > {
@@ -81,10 +82,18 @@
         display: inline;
     }
 
+    @include media( $tablet ) {
+        @include span-columns(6);
+        @include shift(1);
+    }
 
-
+    @include media( $desktop ) {
+        @include span-columns(6);
+        @include shift(3);
+    }
 }
 
+
     /*// individual fields
     .field {