buy-now-button/assets/css/buy-now.css

/* Animations + small loading style. Colors & layout are injected inline via PHP. */

.buy-now-button.is-loading,
.buy-now-button-single.is-loading {
    pointer-events: none;
}

/* Pulse */
@keyframes bnPulse {
    0% {
        transform: scale(1);
    }

    50% {
        transform: scale(1.05);
    }

    100% {
        transform: scale(1);
    }
}

.bn-anim-pulse:hover {
    animation: bnPulse 0.6s ease-in-out infinite;
}

.bn-anim-pulse.bn-anim-normal {
    animation: bnPulse 0.6s ease-in-out infinite;
}

/* Bounce */
@keyframes bnBounce {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-3px);
    }
}

.bn-anim-bounce:hover {
    animation: bnBounce 0.6s ease-in-out infinite;
}

.bn-anim-bounce.bn-anim-normal {
    animation: bnBounce 0.6s ease-in-out infinite;
}

/* Wiggle */
@keyframes bnWiggle {

    0%,
    100% {
        transform: rotate(0deg);
    }

    25% {
        transform: rotate(2deg);
    }

    75% {
        transform: rotate(-2deg);
    }
}

.bn-anim-wiggle:hover {
    animation: bnWiggle 0.5s ease-in-out infinite;
}

.bn-anim-wiggle.bn-anim-normal {
    animation: bnWiggle 0.5s ease-in-out infinite;
}

/* Shake */
@keyframes bnShake {

    0%,
    100% {
        transform: translateX(0);
    }

    25% {
        transform: translateX(-3px);
    }

    75% {
        transform: translateX(3px);
    }
}

.bn-anim-shake:hover {
    animation: bnShake 0.35s ease-in-out infinite;
}

.bn-anim-shake.bn-anim-normal {
    animation: bnShake 0.35s ease-in-out infinite;
}

/* Glow */
@keyframes bnGlow {

    0%,
    100% {
        box-shadow: 0 0 0 rgba(255, 255, 255, 0);
    }

    50% {
        box-shadow: 0 0 12px rgba(255, 255, 255, 0.6);
    }
}

.bn-anim-glow:hover {
    animation: bnGlow 1.2s ease-in-out infinite;
    -webkit-animation: bnGlow 1.2s ease-in-out infinite;
}

.bn-anim-glow.bn-anim-normal {
    animation: bnGlow 1.2s ease-in-out infinite;
}

/* Ripple (on active) */
@keyframes bnRipple {
    0% {
        box-shadow: 0 0 0 0 rgba(255, 255, 255, 0.5);
    }

    100% {
        box-shadow: 0 0 0 10px rgba(255, 255, 255, 0);
    }
}

.bn-anim-ripple.is-active {
    animation: bnRipple 0.4s ease-out;
}
.buy-now-button-single{
    margin-left: 0px !important;
    margin-bottom: 10px !important;
}