diff --git a/resources/assets/stylesheets/scss/system-notifications.scss b/resources/assets/stylesheets/scss/system-notifications.scss
index 9e817c108e7527289e867ede506210d6a1aee1c8..65a0f5d55e00bc8ede95ebe947dbc7bff0487b75 100644
--- a/resources/assets/stylesheets/scss/system-notifications.scss
+++ b/resources/assets/stylesheets/scss/system-notifications.scss
@@ -6,13 +6,13 @@
         right: 15px;
 
         .system-notification {
-            &.system-notification-slide-enter,
+            &.system-notification-slide-enter-from,
             &.system-notification-slide-leave-to {
                 opacity: 0;
                 transform: translateX(100%);
             }
 
-            &.system-notification-slide-leave,
+            &.system-notification-slide-leave-from,
             &.system-notification-slide-enter-to {
                 opacity: 1;
                 transform: translateX(0);
@@ -36,13 +36,13 @@
         top: 40px;
 
         .system-notification {
-            &.system-notification-slide-enter,
+            &.system-notification-slide-enter-from,
             &.system-notification-slide-leave-to {
                 opacity: 0;
                 transform: translateY(-100%);
             }
 
-            &.system-notification-slide-leave,
+            &.system-notification-slide-leave-from,
             &.system-notification-slide-enter-to {
                 opacity: 1;
                 transform: translateY(0);
@@ -121,11 +121,11 @@
             transition: width 5s linear;
         }
 
-        &.system-notification-timeout-enter {
+        &.system-notification-timeout-enter-from {
             width: 100%;
         }
 
-        &.system-notification-timeout-leave {
+        &.system-notification-timeout-leave-from {
             width: 0;
         }