diff --git a/docs/templates/index.jade b/docs/templates/index.jade
index fd3f8dc0..ce7898e3 100644
--- a/docs/templates/index.jade
+++ b/docs/templates/index.jade
@@ -34,7 +34,7 @@ block content
           p We have put a lot of efforts and carefully selected each color and font for this template!
         div.why-item
           img(src=contents.images['why-practices.svg'].url)
-          h4 Ease for customization
+          h4 Ease of customization
           p Check out #[a(href='/ng2-admin/articles/011-changing-color-scheme') our article], where we describe how you can create different look in just 2 minutes!
   div.index-block.black
     div.wrap
diff --git a/package.json b/package.json
index 4a9ce3f3..348de319 100644
--- a/package.json
+++ b/package.json
@@ -17,6 +17,7 @@
     "@angular/router-deprecated": "2.0.0-rc.1",
     "amcharts3": "github:amcharts/amcharts3",
     "ammap3": "github:amcharts/ammap3",
+    "animate.css": "^3.5.1",
     "bootstrap": "^4.0.0-alpha.2",
     "bootstrap-loader": "^1.0.8",
     "chart.js": "^1.1.1",
diff --git a/src/app/theme/components/baCard/baCard.html b/src/app/theme/components/baCard/baCard.html
index aaee1d91..8ccba5c8 100644
--- a/src/app/theme/components/baCard/baCard.html
+++ b/src/app/theme/components/baCard/baCard.html
@@ -1,4 +1,4 @@
-<div baCardBlur class="card {{cardType}} {{baCardClass || ''}}" zoom-in>
+<div baCardBlur class="animated fadeIn card {{cardType}} {{baCardClass || ''}}" zoom-in>
     <div *ngIf="title" class="card-header clearfix">
         <h3 class="card-title">{{title}}</h3>
     </div>
diff --git a/src/app/theme/theme.scss b/src/app/theme/theme.scss
index defecff7..4f38c1d0 100644
--- a/src/app/theme/theme.scss
+++ b/src/app/theme/theme.scss
@@ -1,5 +1,6 @@
 @import "sass/conf/conf";
 @import "sass/bootstrap-overrides/overrides";
+@import "~animate.css/animate";
 @import "sass/typography";
 @import "sass/buttons";
 @import "sass/icons";