diff --git a/js/angular/common/common.animations.js b/js/angular/common/common.animations.js
index cfdb47b7..5fe3df75 100644
--- a/js/angular/common/common.animations.js
+++ b/js/angular/common/common.animations.js
@@ -12,10 +12,11 @@ angular.module('foundation.common.animations')
         var scope = element.scope();
         if(scope.vars && scope.vars.animationIn) {
 
-          var animationIn = scope.vars.animationIn;
+          var animationIn  = scope.vars.animationIn;
           var animationOut = scope.vars.animationOut || '';
-          var initial = 'ng-enter';
+          var initial  = 'ng-enter';
           var activate = 'ng-enter-active';
+          var timedOut = true;
 
           //reset possible failed animations and bugs
           element.parent().addClass(parentStyle);
@@ -31,12 +32,23 @@ angular.module('foundation.common.animations')
           element[0].style.transitionDuration = '';
           element.addClass(activate);
 
-          element.one(events.join(' '), function() {
-            //cleanup
+          var finishAnimation = function() {
             element.parent().removeClass(parentStyle);
             element.removeClass(activate + ' ' + initial + ' ' + animationIn + ' ' + animationOut);
+            timedOut = false;
             done();
+          }
+
+          element.one(events.join(' '), function() {
+            finishAnimation();
           });
+
+          setTimeout(function() {
+            if (timedOut) {
+              finishAnimation();
+            }
+          }, 3000);
+
         } else {
           done();
         }
@@ -49,10 +61,11 @@ angular.module('foundation.common.animations')
         var scope = element.scope();
 
         if(scope.vars && scope.vars.animationOut) {
-          var animationIn = scope.vars.animationIn || '';
+          var animationIn  = scope.vars.animationIn || '';
           var animationOut = scope.vars.animationOut;
-          var initial = 'ng-leave';
+          var initial  = 'ng-leave';
           var activate = 'ng-leave-active';
+          var timedOut = true;
 
           element.removeClass(activate + ' ' + initial + ' ' + animationIn + ' ' + animationOut);
           element[0].style.transitionDuration = 0;
@@ -66,13 +79,23 @@ angular.module('foundation.common.animations')
           element[0].style.transitionDuration = '';
           element.addClass(activate);
 
-          element.one(events.join(' '), function() {
-            //cleanup
-            element.removeClass(activate + ' ' + initial + ' ' + animationIn + ' ' + animationOut);
+          var finishAnimation = function() {
             element.parent().removeClass(parentStyle);
+            element.removeClass(activate + ' ' + initial + ' ' + animationIn + ' ' + animationOut);
+            timedOut = false;
             done();
+          }
+
+          element.one(events.join(' '), function() {
+            finishAnimation();
           });
 
+          setTimeout(function() {
+            if (timedOut) {
+              finishAnimation();
+            }
+          }, 3000);
+
         } else {
           done();
         }
diff --git a/js/angular/common/common.services.js b/js/angular/common/common.services.js
index 61e3bd9c..319e3bef 100644
--- a/js/angular/common/common.services.js
+++ b/js/angular/common/common.services.js
@@ -70,6 +70,7 @@ angular.module('foundation.common.services')
         var activeGenericClass = 'is-active';
         var events = ['webkitAnimationEnd', 'mozAnimationEnd', 'MSAnimationEnd', 'oanimationend', 'animationend',
                   'webkitTransitionEnd', 'otransitionend', 'transitionend'];
+        var timedOut = true;
 
         var reflow = function() {
           return element[0].offsetWidth;
@@ -84,6 +85,13 @@ angular.module('foundation.common.services')
           var initClass = activation ? initClasses[0] : initClasses[1];
           var activeClass = activation ? activeClasses[0] : activeClasses[1];
 
+          var finishAnimation = function() {
+            reset(); //reset all classes
+            element.removeClass(!activation ? activeGenericClass : ''); //if not active, remove active class
+            reflow();
+            timedOut = false;
+          };
+
           //stop animation
           reset();
           element.addClass(animationClass);
@@ -98,10 +106,14 @@ angular.module('foundation.common.services')
           element.addClass(activeClass);
 
           element.one(events.join(' '), function() {
-            reset(); //reset all classes
-            element.removeClass(!activation ? activeGenericClass : ''); //if not active, remove active class
-            reflow();
+            finishAnimation();
           });
+
+          setTimeout(function() {
+            if(timedOut) {
+              finishAnimation();
+            }
+          }, 3000);
         };
 
         animate(futureState ? animationIn : animationOut, futureState);