.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}