div {
  text-align: right;
}


span {
  color: white;
  padding: 1.5rem;
  font-size: 3rem;
  font-weight:800;
  display: inline-block;
  align:right;
  padding-right:50px;

}

span {
    animation-delay: 12s;
}
span.strong-hover-shake:hover {
  animation: tilt-shaking 0.15s infinite;
}

span.gentle-hover-shake:hover {
  animation: tilt-shaking 0.25s infinite;
}

span.gentle-tilt-move-shake:hover {
  animation: tilt-n-move-shaking 0.25s infinite;
}

span.strong-tilt-move-shake:hover {
  animation: tilt-n-move-shaking 0.15s infinite;
}

span.constant-tilt-shake {
  animation: tilt-shaking 0.3s infinite;
}

span.vertical-shake {
  animation: vertical-shaking 0.35s infinite;
}

span.horizontal-shake {
  animation: horizontal-shaking 0.35s infinite;
}

span.rise-shake {
  animation: jump-shaking 0.83s infinite;
}

span.skew-shake-x {
  animation: skew-x-shake 1.3s infinite;
}

span.skew-shake-y {
  animation: skew-y-shake 1.3s infinite;
}

@keyframes tilt-shaking {
  0% { transform: rotate(0deg); }
  25% { transform: rotate(1deg); }
  50% { transform: rotate(0eg); }
  75% { transform: rotate(-1deg); }
  100% { transform: rotate(0deg); }

}

@keyframes tilt-n-move-shaking {
  0% { transform: translate(0, 0) rotate(0deg); }
  25% { transform: translate(1px, 1px) rotate(1deg); }
  50% { transform: translate(0, 0) rotate(0eg); }
  75% { transform: translate(-1px, 1px) rotate(-1deg); }
  100% { transform: translate(0, 0) rotate(0deg); }
}

@keyframes vertical-shaking {
  0% { transform: translateY(0) }
  25% { transform: translateY(1px) }
  50% { transform: translateY(-1px) }
  75% { transform: translateY(1px) }
  100% { transform: translateY(0) }
}

@keyframes horizontal-shaking {
  0% { transform: translateX(0) }
  25% { transform: translateX(1px) }
  50% { transform: translateX(-1px) }
  75% { transform: translateX(1px) }
  100% { transform: translateX(0) }
}

@keyframes jump-shaking {
  0% { transform: translateX(0) }
  25% { transform: translateY(-2px) }
  35% { transform: translateY(-2px) rotate(2deg) }
  55% { transform: translateY(-2px) rotate(-2deg) }
  65% { transform: translateY(-2px) rotate(2deg) }
  75% { transform: translateY(-2px) rotate(-2deg) }
  100% { transform: translateY(0) rotate(0) }
}

@keyframes skew-x-shake {
  0% { transform: skewX(-2deg); }
  5% { transform: skewX(deg); }
  10% { transform: skewX(-2deg); }
  15% { transform: skewX(2deg); }
  20% { transform: skewX(0deg); }
  100% { transform: skewX(0deg); }  
}

@keyframes skew-y-shake {
  0% { transform: skewY(-4deg); }
  5% { transform: skewY(4deg); }
  10% { transform: skewY(-4deg); }
  15% { transform: skewY(4deg); }
  20% { transform: skewY(0deg); }
  100% { transform: skewY(0deg); }  
}






Resources 1× 0.5× 0.25× Rerun