Angular animate css

animate.css

.slide-reveal.ng-enter {
  -webkit-transition:0.5s linear all;
  -moz-transition:0.5s linear all;
  -o-transition:0.5s linear all;
  transition:0.5s linear all;

  opacity:0.5;
  position:relative;
  opacity:0;
  top:10px;
}
.slide-reveal.ng-enter.ng-enter-active {
  top:0;
  opacity:1;
}
/* REVEAL 
***********************************/
.reveal.ng-enter {
  -webkit-transition:1s linear all;
  -moz-transition:1s linear all;
  -o-transition:1s linear all;
  transition:1s linear all;

  opacity:0;
}
.reveal.ng-enter.ng-enter-active {
  opacity:1;
}
/* Move
******************************/
.move.ng-enter,
.move.ng-leave
{ 
    -webkit-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all;
    -moz-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all;
    -ms-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all;
    -o-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all;
    transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all;
    position: relative;
    display: block;
} 
 
.move.ng-enter.move.ng-enter-active, 
.move.ng-leave 
{
    opacity: 1;
    top: 0;
    height: 30px;
}
 
.move.ng-leave.move.ng-leave-active
,.move.ng-enter 
{
    opacity: 0;
    top: -50px;
    height: 0px;
}
/* 3D Cube
*********************************/
.cube.ng-enter, 
.cube.ng-leave { 
    -webkit-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all;
    -moz-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all;
    -ms-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all;
    -o-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all;
    transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all;
    position: relative;
    display: block;
} 
 
.cube.ng-leave.cube.ng-leave-active,
.cube.ng-enter {
    -webkit-transform: rotateX(-180deg) translatez(30px);
    -moz-transform: rotateX(-180deg) translatez(30px);
    -ms-transform: rotateX(-180deg) translatez(30px);
    -o-transform: rotateX(-180deg) translatez(30px);
    transform: rotateX(-180deg) translatez(30px);
    opacity: 0;
    height: 0px;
}        
 
.cube.ng-enter.cube.ng-enter-active,
.cube.ng-leave {
    -webkit-transform: rotateX(0deg) translatez(30px);
    -moz-transform: rotateX(0deg) translatez(30px);
    -ms-transform: rotateX(0deg) translatez(30px);
    -o-transform: rotateX(0deg) translatez(30px);
    transform: rotateX(0deg) translatez(30px);
    opacity: 1;
    height: 30px;
}
/* Scale
*********************************/
.scale.ng-enter, 
.scale.ng-leave { 
    -webkit-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all;
    -moz-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all;
    -ms-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all;
    -o-transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all;
    transition: 400ms cubic-bezier(0.250, 0.250, 0.750, 0.750) all;
    position: relative;
    display: block;
} 
 
.scale.ng-leave.scale.ng-leave-active,
.scale.ng-enter {
    -webkit-transform: scaleY(0);
    -moz-transform: scaleY(0);
    -ms-transform: scaleY(0);
    -o-transform: scaleY(0);
    transform: scaleY(0);
    height: 0px;
    opacity: 0;
}
 
.scale.ng-enter.scale.ng-enter-active,
.scale.ng-leave {
    -webkit-transform: scaleY(1);
    -moz-transform: scaleY(1);
    -ms-transform: scaleY(1);
    -o-transform: scaleY(1);
    transform: scaleY(1);
    height: 30px;
    opacity: 1;
}