@keyframes rippleExpand{0%{transform:scale3d(.1,.1,1);opacity:.8}20%{opacity:.6}to{transform:scale3d(4,4,1);opacity:0}}@keyframes activeBackgroundFadeIn{0%{opacity:0;transform:scale3d(.8,.8,1)}50%{opacity:.7;transform:scale3d(1.2,1.2,1)}to{opacity:1;transform:scaleZ(1)}}@keyframes activeBackgroundFadeOut{0%{opacity:1;transform:scaleZ(1)}to{opacity:0;transform:scale3d(.8,.8,1)}}.ripple-wave{animation:rippleExpand 1s ease-out forwards;will-change:transform,opacity;-webkit-animation:rippleExpand 1s ease-out forwards;-moz-animation:rippleExpand 1s ease-out forwards;-ms-animation:rippleExpand 1s ease-out forwards;-o-animation:rippleExpand 1s ease-out forwards}.active-background-enter{animation:activeBackgroundFadeIn .3s ease-out forwards;will-change:transform,opacity;-webkit-animation:activeBackgroundFadeIn .3s ease-out forwards;-moz-animation:activeBackgroundFadeIn .3s ease-out forwards;-ms-animation:activeBackgroundFadeIn .3s ease-out forwards;-o-animation:activeBackgroundFadeIn .3s ease-out forwards}.active-background-exit{animation:activeBackgroundFadeOut .2s ease-in forwards;will-change:transform,opacity;-webkit-animation:activeBackgroundFadeOut .2s ease-in forwards;-moz-animation:activeBackgroundFadeOut .2s ease-in forwards;-ms-animation:activeBackgroundFadeOut .2s ease-in forwards;-o-animation:activeBackgroundFadeOut .2s ease-in forwards}@media (max-width: 768px){.ripple-wave{animation-duration:.8s}.active-background-enter{animation-duration:.25s}.active-background-exit{animation-duration:.15s}}@media (prefers-reduced-motion: reduce){.ripple-wave,.active-background-enter,.active-background-exit{animation-duration:.1s;animation-iteration-count:1}}
