/**** ^^^^ HERE IS THE NEW STUFF ^^^^  ****/


.fader101.ng-hide-remove {
  animation: fadeIn 1s;
}

.fader101.ng-hide-add {
  animation: fadeOut 1s;
}

.fader11.ng-hide-remove, 
.fader11.ng-hide-enter, 
.fader11.ng-hide-remove-active {
    -webkit-animation:  fadeIn 1400ms;
    -moz-animation:     fadeIn 1400ms;
    -ms-animation:      fadeIn 1400ms;
    animation:          fadeIn 1400ms;
   /* -webkit-animation: fadeInLeft 1s;
    -moz-animation: fadeInLeft 1s;
    -ms-animation: fadeInLeft 1s;
    animation: fadeInLeft 1s;
*/
    opacity:1;

  }
  
.fader11.ng-leave,
.fader11.ng-move,
.fader11.ng-hide-add  {
    -webkit-animation:  fadeOut 100ms;
    -moz-animation:     fadeOut 100ms;
    -ms-animation:      fadeOut 100ms;
    animation:          fadeOut 100ms;

    opacity:0;    
  }


 




[ng\:cloak], [ng-cloak], [data-ng-cloak], [x-ng-cloak], .ng-cloak, .x-ng-cloak {
  display: none !important;
}

/*

-http://www.yearofmoo.com/2013/08/remastered-animation-in-angularjs-1-2.html#presentation-slides

The .ng-enter and .ng-enter-active CSS classes are generated and appended to the element by AngularJS 
when the ngIf tells it that it's adding a new item into the repeat list. 
Depending on the animation, other CSS classes are added. 
Here's a breakdown of which directives add which CSS classes.

    Event	Staring CSS Class	    Ending CSS class	    Directives that fire it
    enter	.ng-enter	            .ng-enter-active	    ngRepeat, ngInclude, ngIf, ngView
    leave	.ng-leave	            .ng-leave-active	    ngRepeat, ngInclude, ngIf, ngView
    move	.ng-move	            .ng-move-active	        ngRepeat

In addition, ngAnimate also supports CSS-based animations which follow a similar naming convention. Here's a breakdown of that:

    Action	                                Staring CSS Class	        Ending CSS class	            Directives that fire it
    hide an element	                        .ng-hide-add	            .ng-hide-add-active	            ngShow, ngHide
    show an element	                        .ng-hide-remove	            .ng-hide-remove-active	        ngShow, ngHide
    adding a class to an element	        .CLASS-add	                .CLASS-add-active	            ngClass and class="{{expression}}"
    removing a class from an element	    .CLASS-remove	            .CLASS-remove-active	        ngClass and class="{{expression}}"

*/