.trigger-ani-pompom {
  -webkit-animation-name: pompom;
  animation-name: pompom;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.trigger-ani-pompom-massive {
  -webkit-animation-name: pompom-massive;
  animation-name: pompom-massive;
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}


@-webkit-keyframes pompom-massive {
  0%, 20%, 40%, 50% {
    opacity: 1;
    -webkit-transform: scale(1, 1) translateX(0);
  }

  10%, 30% {
    opacity: 1;
    -webkit-transform: scale(1.40, 1.40) translateX(0);
    text-shadow: 0 0  2px rgba(0,0,0,0.3);
  }

  100% {
    opacity: 1;
    -webkit-transform: scale(1, 1) translateX(0);
  }
}
@keyframes pompom-massive {
  0%, 20%, 40%, 50% {
    opacity: 1;
    transform: scale(1, 1) translateX(0);
  }

  10%, 30% {
    opacity: 1;
    transform: scale(1.40, 1.40) translateX(0);
    text-shadow: 0 0  2px rgba(0,0,0,0.3);
  }

  100% {
    opacity: 1;
    transform: scale(1, 1) translateX(0);
  }
}


@-webkit-keyframes pompom {
  0%, 20%, 40%, 50% {
    opacity: 1;
    -webkit-transform: scale(1, 1) translateX(0);
  }

  10%, 30% {
    opacity: 1;
    -webkit-transform: scale(1.05, 1.05) translateX(0);
    text-shadow: 0 0  2px rgba(0,0,0,0.3);
  }

  100% {
    opacity: 1;
    -webkit-transform: scale(1, 1) translateX(0);
  }
}
@keyframes pompom {
  0%, 20%, 40%, 50% {
    opacity: 1;
    transform: scale(1, 1) translateX(0);
  }

  10%, 30% {
    opacity: 1;
    transform: scale(1.05, 1.05) translateX(0);
    text-shadow: 0 0  2px rgba(0,0,0,0.3);
  }

  100% {
    opacity: 1;
    transform: scale(1, 1) translateX(0);
  }
}

.trigger-ani-unblur:before {
  -webkit-animation-name: unblur;
  -moz-animation-name: unblur;
  animation-name: unblur;
  -webkit-animation-duration: 1s;
  -moz-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  animation-fill-mode: both;
}

@-webkit-keyframes unblur {
  from {
    -webkit-filter: blur(10px);
  }
  to {
    -webkit-filter: blur(0px);
  }
}
@-moz-keyframes unblur {
  from {
    -moz-filter: blur(10px);
  }
  to {
    -moz-filter: blur(0px);
  }
}
@keyframes unblur {
  from {
    -webkit-filter: blur(10px);
    -moz-filter: blur(10px);
    filter: blur(10px);
  }
  to {
    -webkit-filter: blur(0px);
    -moz-filter: blur(0px);
    filter: blur(0px);
  }
}


.trigger-ani-rotateY {
  -webkit-animation-name: rotateY;
  -moz-animation-name: rotateY;
  animation-name: rotateY;
  -webkit-animation-duration: 1000ms;
  -moz-animation-duration: 1000ms;
  animation-duration: 1000ms;
  -webkit-animation-fill-mode: both;
  -moz-animation-fill-mode: both;
  animation-fill-mode: both;
}

@-webkit-keyframes rotateY {
  from {
     -webkit-transform: rotateY(180deg);
  }
  to {
     -webkit-transform: rotateY(0deg);
  }
}
@-moz-keyframes rotateY {
  from {
     -moz-transform: rotateY(180deg);
  }
  to {
     -moz-transform: rotateY(0deg);
  }
}
@keyframes rotateY {
  from {
     transform: rotateY(180deg);
  }
  to {
     transform: rotateY(0deg);
  }
}