diff --git a/UI/Templates/MailerUI/UIxMailFolderTemplate.wox b/UI/Templates/MailerUI/UIxMailFolderTemplate.wox
index 64d100187..77a0e34fc 100644
--- a/UI/Templates/MailerUI/UIxMailFolderTemplate.wox
+++ b/UI/Templates/MailerUI/UIxMailFolderTemplate.wox
@@ -21,7 +21,7 @@
             <!--avatar-->
           </div>
           <div class="sg-tile-content">
-            <a ui-sref="mail.account.mailbox.message({accountId: account.id, mailboxId: (mailbox.path | encodeUri), messageId: currentMessage.uid})" ng-click="toggleRight()">
+            <a ui-sref="mail.account.mailbox.message({accountId: account.id, mailboxId: (mailbox.path | encodeUri), messageId: currentMessage.uid})">
               <div class="sg-md-subhead-multi subject">
                 {{currentMessage.subject}}
               </div>
@@ -41,6 +41,6 @@
     </md-list>
   </md-content>
 
-    <div layout="column" ui-view="message" md-component-id="right"><!-- message view --></div>
+    <div layout="column" ui-view="message" ng-animate="'view'"><!-- message view --></div>
 
 </container>
diff --git a/UI/WebServerResources/js/Common/ui.js b/UI/WebServerResources/js/Common/ui.js
index 28074f5e4..c301f40cc 100644
--- a/UI/WebServerResources/js/Common/ui.js
+++ b/UI/WebServerResources/js/Common/ui.js
@@ -8,7 +8,7 @@
 (function () {
   'use strict';
 
-  angular.module('SOGo.UI', ['ngMaterial'])
+  angular.module('SOGo.UI', ['ngMaterial', 'ngAnimate'])
 // md break-points values are hard-coded in angular-material/src/core/util/constant.js
 // $mdMedia has a built-in support for those values but can also evaluate others
 // For some reasons, angular-material's break-points don't match the specs
diff --git a/UI/WebServerResources/js/MailerUI.js b/UI/WebServerResources/js/MailerUI.js
index cf4dc335d..5fa370f07 100644
--- a/UI/WebServerResources/js/MailerUI.js
+++ b/UI/WebServerResources/js/MailerUI.js
@@ -7,7 +7,7 @@
   angular.module('SOGo.Common', []);
   angular.module('SOGo.ContactsUI', []);
 
-  angular.module('SOGo.MailerUI', ['ngSanitize', 'ui.router', 'vs-repeat', 'ck', 'ngTagsInput', 'angularFileUpload', 'SOGo.Common', 'SOGo.UI', 'SOGo.UIDesktop', 'SOGo.ContactsUI'])
+  angular.module('SOGo.MailerUI', ['ngSanitize', 'ui.router', 'vs-repeat', 'ck', 'ngTagsInput', 'angularFileUpload', 'SOGo.Common', 'SOGo.UI', 'SOGo.UIDesktop', 'SOGo.ContactsUI', 'ngAnimate'])
 
     .constant('sgSettings', {
       baseURL: ApplicationBaseURL,
diff --git a/UI/WebServerResources/scss/views/MailerUI.scss b/UI/WebServerResources/scss/views/MailerUI.scss
index 34afa0dff..e6c186a98 100644
--- a/UI/WebServerResources/scss/views/MailerUI.scss
+++ b/UI/WebServerResources/scss/views/MailerUI.scss
@@ -8,6 +8,23 @@
   min-width: ($detailView-width - $pitch);
   max-width: ($detailView-width + $pitch);
   margin: 0 auto;
+  &.ng-enter {
+    border: 4px solid red;
+    transition: all 1s linear;
+    &.ng-enter-active {
+      border: 4px solid green;
+      transition: all 1s linear;
+    }
+  }
+  &.ng-leave {
+    border: 4px solid blue;
+    transition: all 1s linear;
+    &.ng-leave-active {
+      border: 4px solid blue;
+      transition: all 1s linear;
+      filter: opacity(0);
+    }
+  }
 }
 
 // Message view header