/*fade-element-in*/
.fade-element-in.ng-enter {
    transition: 0.8s linear all;
    opacity: 0;
}

.fade-element-in-init .fade-element-in.ng-enter {
    opacity: 1;
}

.fade-element-in.ng-enter.ng-enter-active {
    opacity: 1;
}

.fade-element-in.ng-leave {
    transition: 0.3s linear all;
    opacity: 1;
}
.fade-element-in.ng-leave.ng-leave-active {
    opacity: 0;
}

/*animate-if*/
 .animate-if.ng-enter, .animate-if.ng-leave {
    -webkit-transition: 1s linear all;
    -moz-transition: 1s linear all;
    -ms-transition: 1s linear all;
    -o-transition: 1s linear all;
    transition: 1s linear all;
}
/* du début de l'entrée */
 .animate-if.ng-enter {
    max-height: 0;
    opacity: 0;
}
/* à la fin de l'entrée */
 .animate-if.ng-enter.ng-enter-active {
    max-height: 999px;
    opacity:1;
}
/* du début de la sortie */
 .animate-if.ng-leave {
    max-height: 999px;
    opacity:1;
}
/* à la fin de la sortie */
 .animate-if.ng-leave.ng-leave-active {
    max-height: 0;
    opacity:1;
}

[animate-on-change] {
/* opacity: 1;

    -webkit-transition: opacity 1s ease-in;
       -moz-transition: opacity 1s ease-in;
        -ms-transition: opacity 1s ease-in;
         -o-transition: opacity 1s ease-in;
            transition: opacity 1s ease-in;*/

}
[animate-on-change].changed {

    /*visibility: visible;
  opacity: 1;
  transition: opacity 0.3s linear;*/

 /* background-color: red;
  transition: none;
  -webkit-transition: none;*/

  
  /*-webkit-opacity: 0.25;
  -moz-opacity: 0.25;
  opacity: 0.25;*/

   /*-webkit-transition: height 100ms linear;
    -moz-transition: height 100ms linear;
    -o-transition: height 100ms linear;
    -ms-transition: height 100ms linear;
    transition: height 100ms linear;*/

   /*visibility: hidden;
  opacity: 0;
  transition: visibility 0s 2s, opacity 2s linear;*/
opacity: 1;
    animation: fade 2s linear;
}


@keyframes fade {
  0%,100% { opacity: 0 }
  50% { opacity: 1 }
}