.btn-whatsapp {
    position: fixed;
    right: 15px;
    bottom: 20px;
    border-radius: 50%;
    height: 56px;
    width: 56px;
    cursor: pointer;
    background: #34af23;
    color: #FFF;
    font-size: 2.6rem;
    border: 3px solid #c2dcaa;
    z-index: 99999999999;
    /* animation-name: pulsar;
    animation-duration: 0.8s;
    animation-timing-function: ease-out;
    animation-delay: 1s;
    animation-iteration-count: infinite;
    animation-direction: alternate;
    animation-fill-mode: none;
    animation-play-state: running;  */

    animation: pulsar 1s ease-out 1s infinite alternate none running;
}

.btn-whatsapp:after {
    position: absolute;
    content: '';
    top: 100%;
    left: 5%;
    height: 10px;
    width: 90%;
    opacity: 1;
    z-index: -1;
    background: -webkit-radial-gradient(center, ellipse, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0) 80%);
    background: -webkit-radial-gradient(center ellipse, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0) 80%);
    background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0) 80%);
}

.btn-whatsapp:before {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: transparent;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    -webkit-animation-delay: .9s;
    animation-delay: .9s;
    content: "";
    -webkit-box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.9);
    box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.9);
    -webkit-animation: ripple 3s infinite;
    animation: ripple 3s infinite;
    -webkit-transition: all .4s ease;
    transition: all .4s ease;
}

.btn-whatsapp a {
    color: #fff;
}

@keyframes pulsar {
    0% {
        height: 56px;
        width: 56px;
    }
    100% {
        height: 60px;
        width: 60px;
    }
}