.show-hide-animation {
  opacity: 1; }
  .show-hide-animation.ng-hide-add, .show-hide-animation.ng-hide-remove {
    transition: all 0.3s ease-in 0.2s; }
  .show-hide-animation.ng-hide {
    opacity: 0; }

.show-animation {
  opacity: 1; }
  .show-animation.ng-hide-remove {
    transition: all 0.3s ease-in 0.5s; }
  .show-animation.ng-hide {
    opacity: 0; }

.repeated-item.ng-enter,
.repeated-item.ng-move {
  transition: all 0.2s ease-in-out;
  opacity: 0; }

.repeated-item.ng-enter.ng-enter-active,
.repeated-item.ng-move.ng-move-active {
  opacity: 1; }

.repeated-item.ng-leave {
  -webkit-animation: 0.2s my_animation;
          animation: 0.2s my_animation; }

@-webkit-keyframes my_animation {
  from {
    opacity: 1; }
  to {
    opacity: 0; } }

@keyframes my_animation {
  from {
    opacity: 1; }
  to {
    opacity: 0; } }

.animate-repeat {
  /* -webkit-transition: 0.6s ease-in-out all;
    transition: 0.6s ease-in-out all;*/ }

.animate-repeat.ng-enter {
  transition: all ease-in-out 0.5s; }

.animate-repeat.ng-enter {
  opacity: 0; }

.animate-repeat.ng-enter.ng-enter-active {
  opacity: 1; }

/**
 * Stagger Leave (hide) animation
 */
/*.animate-repeat.ng-leave-stagger {
    !* this will have a 100ms delay between each successive leave animation *!
    -webkit-transition-delay: 0.2s;
    transition-delay: 0.2s;

    !* in case the stagger doesn't work then these two values
     must be set to 0 to avoid an accidental CSS inheritance *!
    -webkit-transition-duration: 0s;
    transition-duration: 0s;
}*/
/**
 * Stagger ENTER ANIMATION
 */
.animate-repeat.ng-enter-stagger {
  /* this will have a 100ms delay between each successive enter animation */
  transition-delay: 0.2s;
  /* in case the stagger doesn't work then these two values
     must be set to 0 to avoid an accidental CSS inheritance */
  transition-duration: 0s; }

.fadeInUp-animation-on-show-hide.ng-hide-remove {
  -webkit-animation-name: fadeInUp;
  -webkit-animation-duration: 0.5s;
  -webkit-animation-name: fadeInUp;
          animation-name: fadeInUp;
  -webkit-animation-duration: 0.5s;
          animation-duration: 0.5s; }

.fadeInUp-animation-on-show-hide.ng-hide-add {
  -webkit-animation-name: fadeOutDown;
  -webkit-animation-duration: 0.5s;
  -webkit-animation-name: fadeOutDown;
          animation-name: fadeOutDown;
  -webkit-animation-duration: 0.5s;
          animation-duration: 0.5s; }

@-webkit-keyframes fadeIn {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }

@keyframes fadeIn {
  from {
    opacity: 0; }
  to {
    opacity: 1; } }

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn; }

@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0); }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }

@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0); }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }

@-webkit-keyframes fadeOutDown {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0); } }

@keyframes fadeOutDown {
  from {
    opacity: 1; }
  to {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0); } }

/*-------------- ripple animation -------------------- */
.ripple {
  position: relative;
  overflow: hidden; }

/*.ripple:after {
    content: "";
    background: rgba(255, 255, 255, 0.3);
    display: block;
    position: absolute;
    border-radius: 50%;
    padding-top: 240%;
    padding-left: 240%;
    margin-top: -120%;
    margin-left: -120%;
    opacity: 0;
    transition: all 1s;
}

.ripple:active:after {
    padding-top: 0;
    padding-left: 0;
    margin-top: 0;
    margin-left: 0;
    opacity: 1;
    transition: 0s;
}*/
/*--------- home tab animation ------------------ */
.tabfade.ng-hide-remove {
  -webkit-animation: 0.3s tabanimation;
  animation: 0.3s tabanimation; }

@-webkit-keyframes tabanimation {
  0% {
    opacity: 0;
    -webkit-transform: scale(0);
            transform: scale(0); }
  70% {
    opacity: 0.5;
    -webkit-transform: scale(50%);
            transform: scale(50%); }
  100% {
    opacity: 1;
    -webkit-transform: scale(100%);
            transform: scale(100%); } }

@keyframes tabanimation {
  0% {
    opacity: 0;
    -webkit-transform: scale(0);
            transform: scale(0); }
  70% {
    opacity: 0.5;
    -webkit-transform: scale(50%);
            transform: scale(50%); }
  100% {
    opacity: 1;
    -webkit-transform: scale(100%);
            transform: scale(100%); } }

.fadeInUp.ng-hide-remove {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
  -webkit-animation-duration: 0.4s;
  animation-duration: 0.4s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both; }

@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 100%, 0);
    transform: translate3d(0, 100%, 0); }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }

@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translate3d(0, 50%, 0);
    transform: translate3d(0, 50%, 0); }
  100% {
    opacity: 1;
    -webkit-transform: none;
    transform: none; } }

.pulse {
  -webkit-animation-name: pulse;
  animation-name: pulse;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite; }

@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1); }
  50% {
    -webkit-transform: scale3d(1.4, 1.4, 1.4);
    transform: scale3d(1.4, 1.4, 1.4); }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1); } }

@keyframes pulse {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1); }
  50% {
    -webkit-transform: scale3d(1.4, 1.4, 1.4);
    transform: scale3d(1.4, 1.4, 1.4); }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
    transform: scale3d(1, 1, 1); } }

.flipInY {
  -webkit-backface-visibility: visible !important;
  backface-visibility: visible !important;
  -webkit-animation-name: flipInY;
  animation-name: flipInY;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both; }

@-webkit-keyframes flipInY {
  0% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transition-timing-function: ease-in;
    opacity: 0; }
  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transition-timing-function: ease-in; }
  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1; }
  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg); }
  100% {
    -webkit-transform: perspective(400px);
    transform: perspective(400px); } }

@keyframes flipInY {
  0% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 90deg);
    transition-timing-function: ease-in;
    opacity: 0; }
  40% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -20deg);
    transition-timing-function: ease-in; }
  60% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    transform: perspective(400px) rotate3d(0, 1, 0, 10deg);
    opacity: 1; }
  80% {
    -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -5deg);
    transform: perspective(400px) rotate3d(0, 1, 0, -5deg); }
  100% {
    -webkit-transform: perspective(400px);
    transform: perspective(400px); } }