diff --git a/app/assets/javascripts/newflow/newflow_ui.js.coffee b/app/assets/javascripts/newflow/newflow_ui.js.coffee
index 0bbee6c45..9a0b9352c 100644
--- a/app/assets/javascripts/newflow/newflow_ui.js.coffee
+++ b/app/assets/javascripts/newflow/newflow_ui.js.coffee
@@ -2,17 +2,11 @@ NewflowUi = do () ->
   disableButton: (selector) ->
     $(selector).attr('disabled', 'disabled')
     $(selector).addClass('ui-state-disabled ui-button-disabled')
-    $(selector).css({
-        'background': '#ccc',
-        'box-shadow': 'none',
-        'color': '#666'
-      })
 
   enableButton: (selector) ->
     $(selector).removeAttr('disabled')
     $(selector).removeClass('ui-state-disabled ui-button-disabled')
     $(selector).button()
-    $(selector).css({ 'background': '', 'box-shadow': '', 'color': '' })
 
   renderAndOpenDialog: (html_id, content, modal_options = {}) ->
     if $('#' + html_id).exists() then $('#' + html_id).remove()
diff --git a/app/assets/stylesheets/newflow.scss b/app/assets/stylesheets/newflow.scss
index 7b87f14e3..0735f4285 100644
--- a/app/assets/stylesheets/newflow.scss
+++ b/app/assets/stylesheets/newflow.scss
@@ -223,7 +223,7 @@ label.required::after {
         top: 3.7rem;
         right: 1.8rem;
 
-        color: #027EB5;
+        color: #0070af;
         font-weight: bold;
         cursor: pointer;
 
@@ -665,7 +665,7 @@ $very-narrow: 37rem * $scale-factor;
             padding-right: 0;
 
             background-color: #f1f1f1;
-            color: #c1c1c1;
+            color: #666666;
 
             @include title-font(2.4rem);
             text-align: center;
@@ -765,10 +765,12 @@ $very-narrow: 37rem * $scale-factor;
 
     input[type=submit] {
         &:disabled {
+            background-color: #ccc;
+            box-shadow: none;
+            color: #666;
             opacity: 0.85;
         }
 
-        -webkit-appearance: none;
         border-radius: 0;
     }
 }
diff --git a/app/views/newflow/login/login_form.html.erb b/app/views/newflow/login/login_form.html.erb
index 3f7d141a7..d9082565f 100644
--- a/app/views/newflow/login/login_form.html.erb
+++ b/app/views/newflow/login/login_form.html.erb
@@ -93,7 +93,8 @@
                     <%= f.submit I18n.t(:"login_signup_form.continue_button"),
                                 disable_with: I18n.t(:"login_signup_form.continue_button"),
                                 class: 'primary',
-                                data: { ga_category: 'Login', ga_action: 'Click', ga_label: 'Email' }
+                                data: { ga_category: 'Login', ga_action: 'Click', ga_label: 'Email' },
+                                disabled: 'disabled'
                     %>
                 </div>
 
@@ -118,5 +119,18 @@
 
 <script type="text/javascript">
     NewflowUi.focusOnFirstErrorItem();
+    const $requiredInputs = $('form input[aria-required="true"]');
+    const handleDisable = () => {
+        const disableSubmit = $requiredInputs.toArray().some((i) => i.value.length == 0);
+
+        if (disableSubmit) {
+            NewflowUi.disableButton('form [type="submit"]');
+        } else {
+            NewflowUi.enableButton('form [type="submit"]');
+        }    
+    }
+
+    $requiredInputs.on('input', handleDisable);
+    handleDisable();
 </script>