/* 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); } }