@keyframes flurry-x {
0% {
 transform: translateX(-10%);
}
100% {
 transform: translateX(110%);
}
}
@keyframes flurry-y {
0% {
 opacity: 1;
 transform: translatey(-15%);
}
20% {
 opacity: 1;
}
35% {
 opacity: 0;
}
40% {
 opacity: 0;
 transform: translateY(100%);
}
100% {
 opacity: 0;
 transform: translateY(100%);
}
}
@keyframes flurry-rotate {
0% {
 transform: rotate(0deg);
}
100% {
 transform: rotate(180deg);
}
}

.flurry-container {
overflow: hidden;
position: fixed;
top: 0;
left: 0;
width: 100%;
pointer-events: none;
z-index:9999;
}
.flurry-flake-x {
animation-name: flurry-x;
animation-timing-function: linear;
animation-iteration-count: infinite;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.flurry-flake-y {
animation-name: flurry-y;
animation-timing-function: linear;
animation-iteration-count: infinite;
height: 100%;
}
.flurry-flake-character {
animation-name: flurry-rotate;
animation-timing-function: linear;
animation-iteration-count: infinite;
color: white;
display: inline-block;
}