diff --git a/plugins/Login/javascripts/login.js b/plugins/Login/javascripts/login.js
index 573a3225b4a4027602f6765ee7606daae412c207..981f02b64324fc2ec9ce6de264461d4325dc6f83 100755
--- a/plugins/Login/javascripts/login.js
+++ b/plugins/Login/javascripts/login.js
@@ -60,7 +60,7 @@
             var ajaxDone = function (response) {
                 $('.loadingPiwik').hide();
 
-                var isSuccess = response.indexOf('message_error') === -1,
+                var isSuccess = response.indexOf('piwik-notification') === -1,
                     fadeOutIds = '.resetForm .message_container';
                 if (isSuccess) {
                     fadeOutIds += ',#reset_form,#reset_form_nav';
@@ -72,6 +72,7 @@
                     }
 
                     $('.resetForm .message_container').html(response).fadeIn(300);
+                    piwikHelper.compileAngularComponents('.resetForm .message_container');
                 });
             };
 
diff --git a/plugins/Login/stylesheets/login.less b/plugins/Login/stylesheets/login.less
index c3acd40afd1247bd759d5e5129aeae5eeaffcc80..2d9e34f39fe0c06ddf060a4ec243706376582cfa 100644
--- a/plugins/Login/stylesheets/login.less
+++ b/plugins/Login/stylesheets/login.less
@@ -76,21 +76,11 @@
 
     /* MESSAGE
     ***********************/
-    .message_error,
     .message {
         margin: 0 auto;
-        border: 1px solid;
+        border: 1px solid #e6db55;
         padding: 12px;
-    }
-
-    .message_error {
-        background-color: #ffebe8;
-        border-color: #c00;
-    }
-
-    .message {
         background-color: #ffffe0;
-        border-color: #e6db55;
     }
 
     /* NAVIGATION
diff --git a/plugins/Login/templates/_formErrors.twig b/plugins/Login/templates/_formErrors.twig
index 2eaf82c2ab28772b84663c96032ecb3dab188dd7..acfdf1e583e132c050c34b427ad7f8a1815eb124 100644
--- a/plugins/Login/templates/_formErrors.twig
+++ b/plugins/Login/templates/_formErrors.twig
@@ -1,6 +1,8 @@
 
 {% if formErrors is defined and formErrors is not empty %}
-    <div class="message_error">
+    <div piwik-notification
+         noclear="true"
+         context="error">
         {% for data in formErrors %}
             <strong>{{ 'General_Error'|translate }}</strong>: {{ data|raw }}
             <br/>
diff --git a/plugins/Login/templates/login.twig b/plugins/Login/templates/login.twig
index 27f14d420e50fef761a52e59a1cac74a6ca2b657..6a124465a129bc6bfaf57a30e2c5471ec13e764a 100644
--- a/plugins/Login/templates/login.twig
+++ b/plugins/Login/templates/login.twig
@@ -72,7 +72,9 @@
                         {{ include('@Login/_formErrors.twig', {formErrors: form_data.errors } )  }}
 
                         {% if AccessErrorString %}
-                            <div class="message_error">
+                            <div piwik-notification
+                                 noclear="true"
+                                 context="error">
                                 <strong>{{ 'General_Error'|translate }}</strong>: {{ AccessErrorString|raw }}<br/>
                             </div>
                         {% endif %}
diff --git a/tests/UI/expected-screenshots/Login_login_fail.png b/tests/UI/expected-screenshots/Login_login_fail.png
index 2cc18891826e19b5fe7d0a2eef7ee369f798a1a3..1a38acc1069a5e8093238dd6e2fdcb32741703fd 100644
Binary files a/tests/UI/expected-screenshots/Login_login_fail.png and b/tests/UI/expected-screenshots/Login_login_fail.png differ
diff --git a/tests/UI/expected-screenshots/Login_password_reset_error.png b/tests/UI/expected-screenshots/Login_password_reset_error.png
index bb69b9fdb4cbdfaabe330c97855aaa7139493201..8f0cd15d6ea28d64203e4aa1566340812288b9ac 100644
Binary files a/tests/UI/expected-screenshots/Login_password_reset_error.png and b/tests/UI/expected-screenshots/Login_password_reset_error.png differ