2 new animations: .slideInLeft and .slideInRight

Mobile transitions between the slides

static/css/base.css

@@ -496,11 +496,13 @@ pre code {
   padding: 0;
 }
 
+
 /*=== 1.2 Animations ================
-Just 3 basic animations:
+Just 5 basic animations:
-.fadeIn, .fadeInUp, .zoomIn.
+.fadeIn, .fadeInUp, .zoomIn, .slideInLeft, slideInRight  
 https://github.com/daneden/animate.css*/
 
+/*-- fadeIn -- */
 @-webkit-keyframes fadeIn {
   from {
     opacity: 0;
@@ -532,6 +534,7 @@ https://github.com/daneden/animate.css*/
   animation: fadeIn 1s;
 }
 
+/*-- fadeInUp -- */
 @-webkit-keyframes fadeInUp {
   from {
     opacity: 0;
@@ -561,12 +564,11 @@ https://github.com/daneden/animate.css*/
 }
 
 .fadeInUp {
-  -webkit-animation-name: fadeInUp;
+  -webkit-animation: fadeInUp 1s;
-  animation-name: fadeInUp;
+  animation: fadeInUp 1s;
-  -webkit-animation-duration: 1s;
-  animation-duration: 1s;
 }
 
+/*-- zoomIn -- */
 @-webkit-keyframes zoomIn {
   from {
     opacity: 0;
@@ -596,6 +598,42 @@ https://github.com/daneden/animate.css*/
   animation: zoomIn 1s;
 }
 
+/*-- slideInLeft -- */
+
+@keyframes slideInLeft {
+  from {
+    transform: translate3d(-100%, 0, 0);
+    visibility: visible;
+  }
+
+  to {
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.slideInLeft {
+  -webkit-animation: slideInLeft 1s;
+  animation: slideInLeft 1s;
+}
+
+/*-- slideInRight -- */
+
+@keyframes slideInRight {
+  from {
+    transform: translate3d(100%, 0, 0);
+    visibility: visible;
+  }
+
+  to {
+    transform: translate3d(0, 0, 0);
+  }
+}
+
+.slideInRight {
+  -webkit-animation: slideInRight 1s;
+  animation: slideInRight 1s;
+}
+
 /* Animated Background (Matrix) */
 @-webkit-keyframes anim {
   0% {
@@ -628,7 +666,6 @@ https://github.com/daneden/animate.css*/
   animation-duration: 5s;
 }
 
-
 /* Transitions */
 
 header,