diff --git a/docs/content/guide/animations.ngdoc b/docs/content/guide/animations.ngdoc
index 80e7377da633..97e3d93b177a 100644
--- a/docs/content/guide/animations.ngdoc
+++ b/docs/content/guide/animations.ngdoc
@@ -21,19 +21,19 @@ Below is a quick example of animations being enabled for `ngShow` and `ngHide`:
       <label>
         <input type="checkbox" ng-model="checked" style="float:left; margin-right:10px;"> Is Visible...
       </label>
-      <div class="check-element animate-show-hide" ng-show="checked" style="clear:both;">
+      <div class="check-element sample-show-hide" ng-show="checked" style="clear:both;">
         Visible...
       </div>
     </div>
   </file>
   <file name="animations.css">
-    .animate-show-hide {
+    .sample-show-hide {
       padding:10px;
       border:1px solid black;
       background:white;
     }
 
-    .animate-show-hide.ng-hide-add, .animate-show-hide.ng-hide-remove {
+    .sample-show-hide.ng-hide-add, .sample-show-hide.ng-hide-remove {
       -webkit-transition:all linear 0.5s;
       -moz-transition:all linear 0.5s;
       -o-transition:all linear 0.5s;
@@ -41,13 +41,13 @@ Below is a quick example of animations being enabled for `ngShow` and `ngHide`:
       display:block!important;
     }
 
-    .animate-show-hide.ng-hide-add.ng-hide-add-active,
-    .animate-show-hide.ng-hide-remove {
+    .sample-show-hide.ng-hide-add.ng-hide-add-active,
+    .sample-show-hide.ng-hide-remove {
       opacity:0;
     }
 
-    .animate-show-hide.ng-hide-add,
-    .animate-show-hide.ng-hide-remove.ng-hide-remove-active {
+    .sample-show-hide.ng-hide-add,
+    .sample-show-hide.ng-hide-remove.ng-hide-remove-active {
       opacity:1;
     }
   </file>