.ripple {
  position: absolute !important;
  background: rgba(255, 255, 255, 0.3) !important;
  border-radius: 100%;
  transform: scale(0.2);
  -webkit-transform: scale(0.2);
  -moz-transform: scale(0.2);
  opacity: 0;
  pointer-events: none;
  -webkit-animation: ripple 0.75s ease-out;
  -moz-animation: ripple 0.75s ease-out;
  animation: ripple 0.75s ease-out;
}
@-webkit-keyframes ripple {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: scale(1.5);
    -moz-transform: scale(1.5);
    transform: scale(1.5);
    opacity: 0;
  }
}
@-moz-keyframes ripple {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: scale(1.5);
    -moz-transform: scale(1.5);
    transform: scale(1.5);
    opacity: 0;
  }
}
@keyframes ripple {
  from {
    opacity: 1;
  }
  to {
    -webkit-transform: scale(1.5);
    -moz-transform: scale(1.5);
    transform: scale(1.5);
    opacity: 0;
  }
}