@-webkit-keyframes pan-ripple {
    0% {-webkit-transform:scale(1);opacity:0;}
    30% {-webkit-transform:scale(1.1);opacity:1;}
    100% {-webkit-transform:scale(1.4);opacity:0;}
}
.wrap-ripple{z-index:999;position:fixed;width:50px;height:50px;padding:8px;}
/*.s-ripple{z-index:99999;width:50px;height:50px;padding:8px}*/


.wrap-ripple .s-ripple i {
    position:absolute;
    width:45px;
    height:45px;
    line-height:normal;
    border-radius:50%;
    border:1px solid #0a72d2;
    box-sizing:border-box;
}
.wrap-ripple .ripple {
    background:#0a72d2;
    color:#fff;
    font-size:13px;
    text-align:center;
    font-style:normal;
    padding-top:13%;
    opacity:.8;
}
.wrap-ripple .ripple-a {
    opacity:0;
    -webkit-transform:scale(1);
    transform:scale(1);
    -webkit-animation:pan-ripple 2s linear infinite;
    animation:pan-ripple 2s linear infinite;
}
.wrap-ripple .ripple-b {
    opacity:0;
    -webkit-transform:scale(1);
    transform:scale(1);
    -webkit-animation:pan-ripple 1s linear infinite;
    animation:pan-ripple 1s linear infinite;
}
.wrap-ripple .s-ripple {
    z-index:99999;
    /*position:fixed;*/
    width:50px;
    height:50px;
    display:block;
    transform-origin: 0px 0px 0px;
    transform: scale(1, 1);
    top: 40%;
    right:15px;
}