:root {
--eh-ease-out-3: cubic-bezier(0, 0, .3, 1);
--eh-ease-in-out-3: cubic-bezier(.5, 0, .5, 1);
--eh-ease-out-5: cubic-bezier(0, 0, 0, 1);
--eh-ease-elastic-in-out-2: cubic-bezier(.5, -.3, .1, 1.5);
--eh-ease-squish-2: var(--eh-ease-elastic-in-out-2);
}
@keyframes eh-animation-spin {
to {
rotate: 360deg;
}
}
@keyframes eh-animation-ping {
0% {
scale: 0.2;
opacity: 1;
}
100% {
scale: 1.2;
opacity: 0;
}
}
@keyframes eh-animation-blink {
0% {
opacity: 1;
}
50% {
opacity: 0.2;
}
100% {
opacity: 1;
}
}
@keyframes eh-animation-float {
50% {
translate: 0 calc(-1 * 25% * var(--eh-animation-movement-factor, 1));
}
}
@keyframes eh-animation-pulse {
50% {
scale: 0.9;
}
}
@keyframes eh-animation-bounce {
0% {
translate: 0 0;
animation-timing-function: ease-in;
}
10% {
translate: 0 calc(-20% * var(--eh-animation-movement-factor, 1));
animation-timing-function: ease-in;
}
40% {
translate: 0 calc(-10% * var(--eh-animation-movement-factor, 1));
animation-timing-function: ease-in;
}
65% {
translate: 0 calc(-5% * var(--eh-animation-movement-factor, 1));
animation-timing-function: ease-in;
}
82% {
translate: 0 calc(-2.5% * var(--eh-animation-movement-factor, 1));
animation-timing-function: ease-in;
}
93% {
translate: 0 calc(-1.5% * var(--eh-animation-movement-factor, 1));
animation-timing-function: ease-in;
}
25%,
55%,
75%,
87% {
translate: 0 0;
animation-timing-function: ease-out;
}
100% {
translate: 0 0;
animation-timing-function: ease-out;
}
}
@keyframes eh-animation-move-scale-1 {
0% {
translate: 0% 0%;
scale: 1
}
30% {
translate: calc(30% * var(--eh-animation-movement-factor, 1)) calc(60% * var(--eh-animation-movement-factor, 1));
scale: 1.2
}
60% {
translate: calc(40% * var(--eh-animation-movement-factor, 1)) calc(20% * var(--eh-animation-movement-factor, 1));
scale: 1.4
}
100% {
translate: 0% 0%;
scale: 1
}
}
@keyframes eh-animation-move-scale-2 {
0% {
translate: 0% 0%;
scale: 1
}
30% {
translate: calc(20% * var(--eh-animation-movement-factor, 1)) calc(-30% * var(--eh-animation-movement-factor, 1));
scale: 1.2
}
60% {
translate: calc(-20% * var(--eh-animation-movement-factor, 1)) calc(-60% * var(--eh-animation-movement-factor, 1));
scale: 1.4
}
100% {
translate: 0% 0%;
scale: 1
}
}
@keyframes eh-animation-move-scale-3 {
0% {
translate: 0% 0%;
scale: 1
}
30% {
translate: calc(-30% * var(--eh-animation-movement-factor, 1)) calc(-60%* var(--eh-animation-movement-factor, 1));
scale: 1.2
}
60% {
translate: calc(-40% * var(--eh-animation-movement-factor, 1)) calc(-20%* var(--eh-animation-movement-factor, 1));
scale: 1.4
}
100% {
translate: 0% 0%;
scale: 1
}
}
@keyframes eh-animation-move-x {
0% {
translate: calc(10% * var(--eh-animation-movement-factor, 1)) 0%
}
20% {
translate: calc(15% * var(--eh-animation-movement-factor, 1)) 0%
}
40% {
translate: calc(15% * var(--eh-animation-movement-factor, 1)) 0%
}
60% {
translate: calc(25% * var(--eh-animation-movement-factor, 1)) 0%
}
80% {
translate: calc(35% * var(--eh-animation-movement-factor, 1)) 0%
}
100% {
translate: calc(10% * var(--eh-animation-movement-factor, 1)) 0%
}
}
@keyframes eh-animation-move-y {
0% {
translate: 0% calc(5% * var(--eh-animation-movement-factor, 1))
}
25% {
translate: 0% calc(25% * var(--eh-animation-movement-factor, 1))
}
50% {
translate: 0%calc(25% * var(--eh-animation-movement-factor, 1))
}
75% {
translate: 0% calc(5% * var(--eh-animation-movement-factor, 1))
}
100% {
translate: 0% calc(5% * var(--eh-animation-movement-factor, 1))
}
}
@keyframes eh-animation-drift {
0% {
translate: 0 0
}
25% {
translate: calc(10px * var(--eh-animation-movement-factor, 1)) calc(10px * var(--eh-animation-movement-factor, 1))
}
50% {
translate: calc(-10px * var(--eh-animation-movement-factor, 1)) calc(10px * var(--eh-animation-movement-factor, 1))
}
75% {
translate: calc(-10px * var(--eh-animation-movement-factor, 1)) calc(-10px * var(--eh-animation-movement-factor, 1))
}
100% {
translate: 0 0
}
}