/*-----------------------
// Button Effect With keyframe
-----------------------*/
@-webkit-keyframes np-btn--1 {
60% {
-webkit-transform: scale3d(0.8, 0.8, 1);
transform: scale3d(0.8, 0.8, 1);
}
85% {
-webkit-transform: scale3d(1.1, 1.1, 1);
transform: scale3d(1.1, 1.1, 1);
}
100% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes np-btn--1 {
60% {
-webkit-transform: scale3d(0.8, 0.8, 1);
transform: scale3d(0.8, 0.8, 1);
}
85% {
-webkit-transform: scale3d(1.1, 1.1, 1);
transform: scale3d(1.1, 1.1, 1);
}
100% {
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@-webkit-keyframes np-btn--2 {
to {
opacity: 0;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
@keyframes np-btn--2 {
to {
opacity: 0;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
}
}
/* Effect Horizontal */
@-webkit-keyframes np-hvr-horizontal {
16.65% {
-webkit-transform: translateX(8px);
transform: translateX(8px);
}
33.3% {
-webkit-transform: translateX(-6px);
transform: translateX(-6px);
}
49.95% {
-webkit-transform: translateX(4px);
transform: translateX(4px);
}
66.6% {
-webkit-transform: translateX(-2px);
transform: translateX(-2px);
}
83.25% {
-webkit-transform: translateX(1px);
transform: translateX(1px);
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
@keyframes np-hvr-horizontal {
16.65% {
-webkit-transform: translateX(8px);
transform: translateX(8px);
}
33.3% {
-webkit-transform: translateX(-6px);
transform: translateX(-6px);
}
49.95% {
-webkit-transform: translateX(4px);
transform: translateX(4px);
}
66.6% {
-webkit-transform: translateX(-2px);
transform: translateX(-2px);
}
83.25% {
-webkit-transform: translateX(1px);
transform: translateX(1px);
}
100% {
-webkit-transform: translateX(0);
transform: translateX(0);
}
}
/* Effect To Bottom Right */
@-webkit-keyframes hvr-to-bottom-right {
16.65% {
-webkit-transform: translate(8px, 8px);
transform: translate(8px, 8px);
}
33.3% {
-webkit-transform: translate(-6px, -6px);
transform: translate(-6px, -6px);
}
49.95% {
-webkit-transform: translate(4px, 4px);
transform: translate(4px, 4px);
}
66.6% {
-webkit-transform: translate(-2px, -2px);
transform: translate(-2px, -2px);
}
83.25% {
-webkit-transform: translate(1px, 1px);
transform: translate(1px, 1px);
}
100% {
-webkit-transform: translate(0, 0);
transform: translate(0, 0);
}
}
@keyframes hvr-to-bottom-right {
16.65% {
-webkit-transform: translate(8px, 8px);
transform: translate(8px, 8px);
}
33.3% {
-webkit-transform: translate(-6px, -6px);
transform: translate(-6px, -6px);
}
49.95% {
-webkit-transform: translate(4px, 4px);
transform: translate(4px, 4px);
}
66.6% {
-webkit-transform: translate(-2px, -2px);
transform: translate(-2px, -2px);
}
83.25% {
-webkit-transform: translate(1px, 1px);
transform: translate(1px, 1px);
}
100% {
-webkit-transform: translate(0, 0);
transform: translate(0, 0);
}
}
/*----------------------------
Team keyframes
----------------------------*/
/*----------------------------
keyframes bounceY
----------------------------*/
@keyframes bounceY {
0% {
transform: translateY(-205px);
}
40% {
transform: translateY(-100px);
}
65% {
transform: translateY(-52px);
}
82% {
transform: translateY(-25px);
}
92% {
transform: translateY(-12px);
}
55%,
75%,
87%,
97%,
100% {
transform: translateY(0px);
}
}
@-moz-keyframes bounceY {
0% {
-moz-transform: translateY(-205px);
}
40% {
-moz-transform: translateY(-100px);
}
65% {
-moz-transform: translateY(-52px);
}
82% {
-moz-transform: translateY(-25px);
}
92% {
-moz-transform: translateY(-12px);
}
55%,
75%,
87%,
97%,
100% {
-moz-transform: translateY(0px);
}
}
@-webkit-keyframes bounceY {
0% {
-webkit-transform: translateY(-205px);
}
40% {
-webkit-transform: translateY(-100px);
}
65% {
-webkit-transform: translateY(-52px);
}
82% {
-webkit-transform: translateY(-25px);
}
92% {
-webkit-transform: translateY(-12px);
}
55%,
75%,
87%,
97%,
100% {
-webkit-transform: translateY(0px);
}
}