shaking text

<style>
.shk {
text-shadow: -1px 0 #000, 0 1px #000, 1px 0 #000, 0 -1px #000, 0 0;
color:white;
font-size:20px;
font-family:mali;
font-weight:bold;
animation: shake2 1s;
animation-iteration-count: infinite;
-webkit-transition: .4s ease-in;
-moz-transition: .4s ease-in;
transition: .4s ease-in;
}

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

10% {
transform: translate(-1px, -2px) rotate(-1deg);
}

20% {
transform: translate(-2px, 0px) rotate(1deg);
}

30% {
transform: translate(1px, 1px) rotate(0deg);
}

40% {
transform: translate(1px, -1px) rotate(1deg);
}

50% {
transform: translate(-1px, 2px) rotate(-1deg);
}

60% {
transform: translate(-2px, 1px) rotate(0deg);
}

70% {
transform: translate(2px, 1px) rotate(-1deg);
}

80% {
transform: translate(-1px, -1px) rotate(1deg);
}

90% {
transform: translate(1px, 1px) rotate(0deg);
}

100% {
transform: translate(1px, -2px) rotate(-1deg);
}
}

@keyframes shake2 {
0% {
transform: translate(1px, 1px) rotate(0deg);
}

10% {
transform: translate(-1px, -2px) rotate(0deg);
}

20% {
transform: translate(-1px, 0px) rotate(1deg);
}

30% {
transform: translate(1px, 1px) rotate(0deg);
}

40% {
transform: translate(1px, -1px) rotate(1deg);
}

50% {
transform: translate(-1px, 2px) rotate(0deg);
}

60% {
transform: translate(-1px, 1px) rotate(0deg);
}

70% {
transform: translate(1px, 1px) rotate(-1deg);
}

80% {
transform: translate(-1px, -1px) rotate(0deg);
}

90% {
transform: translate(1px, 1px) rotate(0deg);
}

100% {
transform: translate(1px, -2px) rotate(-1deg);
}
}
</style>

<div class="shk">text</div>