/* Ripple Effect for use testimonial Button */

@-webkit-keyframes ripple {0%{transform:scale(1)}75%{transform:scale(1.5);opacity:0.3}to{transform:scale(1.75);opacity:0}}
@keyframes ripple {0%{transform:scale(1)}75%{transform:scale(1.5);opacity:0.3}to{transform:scale(1.75);opacity:0}}

@keyframes bounceIn{
    0%, 20%, 40%, 60%, 80%, 100% {
        -webkit-animation-timing-function: cubic-bezier(.215,.61,.355,1);
        animation-timing-function: cubic-bezier(.215,.61,.355,1);
    }
    0% {
        opacity: 0;
        -webkit-transform: scale3d(.3,.3,.3);
        transform: scale3d(.3,.3,.3);
    }
    20% {
        -webkit-transform: scale3d(1.1,1.1,1.1);
        transform: scale3d(1.1,1.1,1.1);
    }
    40% {
        -webkit-transform: scale3d(.9,.9,.9);
        transform: scale3d(.9,.9,.9);
    }
    60% {
        opacity: 1;
        -webkit-transform: scale3d(1.03,1.03,1.03);
        transform: scale3d(1.03,1.03,1.03);
    }
    80% {
        -webkit-transform: scale3d(.97,.97,.97);
        transform: scale3d(.97,.97,.97);
    }
    100% {
        opacity: 1;
        -webkit-transform: scale3d(1,1,1);
        transform: scale3d(1,1,1);
    }
}

@-webkit-keyframes jumpping {
    0%,100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }

    40% {
        -webkit-transform: translate3d(0, var(--jump-y, 20px), var(--jump-x, 0));
        transform: translate3d(0, var(--jump-y, 20px), var(--jump-x, 0))
    }
}

@keyframes jumpping {
    0%,100% {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0)
    }

    40% {
        -webkit-transform: translate3d(0, var(--jump-y, 20px), var(--jump-x, 0));
        transform: translate3d(0, var(--jump-y, 20px), var(--jump-x, 0))
    }
}

@-webkit-keyframes icon-bounce {
  0%, 100%, 20%, 50%, 80% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
}
40% {
    -webkit-transform: translateY(-10px);
    transform: translateY(-10px);
}
60% {
    -webkit-transform: translateY(-5px);
    transform: translateY(-5px);
}
}

@keyframes icon-bounce {
  0%, 100%, 20%, 50%, 80% {
    -webkit-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}
40% {
    -webkit-transform: translate(-50%, -10px);
    transform: translate(-50%, -10px);
}
60% {
    -webkit-transform: translate(-50%, -5px);
    transform: translate(-50%, -5px);
}
}

@-webkit-keyframes back-to-top-ripple {

    0%,
    35% {
        -webkit-transform: scale(0);
        transform: scale(0);
        opacity: 1;
    }

    50% {
        -webkit-transform: scale(1.5);
        transform: scale(1.5);
        opacity: 0.8;
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(2);
        transform: scale(2);
    }
}
@keyframes back-to-top-ripple {

    0%,
    35% {
        -webkit-transform: scale(0);
        transform: scale(0);
        opacity: 1;
    }

    50% {
        -webkit-transform: scale(1.5);
        transform: scale(1.5);
        opacity: 0.8;
    }

    100% {
        opacity: 0;
        -webkit-transform: scale(2);
        transform: scale(2);
    }
}

@-webkit-keyframes spin {
    0% {
        transform:rotate(0deg);
    }
    100% {
        transform:rotate(360deg);
    }
    
}
@keyframes spin {
    0% {
        transform:rotate(0deg);
    }
    100% {
        transform:rotate(360deg);
    }
    
}

@-webkit-keyframes shake{
    0% {
        transform: translate(1px,1px) rotate(0);
    }

    10% {
        transform: translate(-1px,-2px) rotate(-1deg);
    }
    20% {
        transform: translate(-3px) rotate(1deg);
    }
    30% {
        transform: translate(3px,2px) rotate(0);
    }
    40% {
        transform: translate(1px,-1px) rotate(1deg);
    }
    50% {
        transform: translate(-1px,2px) rotate(-1deg);
    }
    60% {
        transform: translate(-3px,1px) rotate(0);
    }
    70% {
        transform: translate(3px,1px) rotate(-1deg);
    }
    80% {
        transform: translate(-1px,-1px) rotate(1deg);
    }
    90% {
        transform: translate(1px,2px) rotate(0);
    }
    100% {
        transform: translate(1px,-2px) rotate(-1deg);
    }
}
@keyframes shake{
    0% {
        transform: translate(1px,1px) rotate(0);
    }

    10% {
        transform: translate(-1px,-2px) rotate(-1deg);
    }
    20% {
        transform: translate(-3px) rotate(1deg);
    }
    30% {
        transform: translate(3px,2px) rotate(0);
    }
    40% {
        transform: translate(1px,-1px) rotate(1deg);
    }
    50% {
        transform: translate(-1px,2px) rotate(-1deg);
    }
    60% {
        transform: translate(-3px,1px) rotate(0);
    }
    70% {
        transform: translate(3px,1px) rotate(-1deg);
    }
    80% {
        transform: translate(-1px,-1px) rotate(1deg);
    }
    90% {
        transform: translate(1px,2px) rotate(0);
    }
    100% {
        transform: translate(1px,-2px) rotate(-1deg);
    }
}


@-webkit-keyframes bounce2{
    30% {
        transform: translateY(0%);
    }

    50% {
        transform: translateY(20%);
    }
    70% {
        transform: translateY(0%);
    }
    80% {
        transform: translateY(10%);
    }
    90% {
        transform: translateY(0%);
    }
    99% {
        transform: translateY(5%);
    }
    100% {
        transform: translateY(0);
    }
}
@keyframes bounce2{
    30% {
        transform: translateY(0%);
    }

    50% {
        transform: translateY(20%);
    }
    70% {
        transform: translateY(0%);
    }
    80% {
        transform: translateY(10%);
    }
    90% {
        transform: translateY(0%);
    }
    99% {
        transform: translateY(5%);
    }
    100% {
        transform: translateY(0);
    }
}


@-webkit-keyframes swing {
    20% {
        transform: rotate(15deg)
    }
    40% {
        transform: rotate(-10deg)
    }
    60% {
        transform: rotate(5deg)
    }
    80% {
        transform: rotate(-5deg)
    }
    to {
        transform: rotate(0deg)
    }
}

@keyframes swing {
    20% {
        transform: rotate(15deg)
    }
    40% {
        transform: rotate(-10deg)
    }
    60% {
        transform: rotate(5deg)
    }
    80% {
        transform: rotate(-5deg)
    }
    to {
        transform: rotate(0deg)
    }
}

@keyframes cat_swing{
    20% {
        -webkit-transform: rotate3d(0, 0, 1, 15deg);
        transform: rotate3d(0, 0, 1, 15deg);
    }
    40% {
        -webkit-transform: rotate3d(0, 0, 1, -10deg);
        transform: rotate3d(0, 0, 1, -10deg);
    }
    60% {
        -webkit-transform: rotate3d(0, 0, 1, 5deg);
        transform: rotate3d(0, 0, 1, 5deg);
    }
    80% {
        -webkit-transform: rotate3d(0, 0, 1, -5deg);
        transform: rotate3d(0, 0, 1, -5deg);
    }
    100% {
        -webkit-transform: rotate3d(0, 0, 1, 0deg);
        transform: rotate3d(0, 0, 1, 0deg);
    }
}

@-webkit-keyframes shine {
  100% {
    left: 125%;
}
}

@keyframes shine {
  100% {
    left: 125%;
}
}

@-webkit-keyframes zoom_in_out 
{0%{transform:scale(1)}50%{transform:scale(1.1);}to{transform:scale(1);}}
@keyframes zoom_in_out 
{0%{transform:scale(1)}50%{transform:scale(1.1);}to{transform:scale(1);}}

@-webkit-keyframes hover-360{
    0% {
    transform: rotateX(0);
}
100% {
    transform: rotateX(360deg);
}
}
@keyframes hover-360{
    0% {
    transform: rotateX(0);
}
100% {
    transform: rotateX(360deg);
}
}


@keyframes scale_one {

    0%,
    35% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }

    50% {
        -webkit-transform: scale(0);
        transform: scale(0);
    }

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

@-webkit-keyframes sp-icon-hover {
    50% {
        -webkit-transform: scale(0.5);
        transform: scale(0.5);
    }
}

@keyframes sp-icon-hover {
    50% {
        -webkit-transform: scale(0.5);
        transform: scale(0.5);
    }
}