Воспроизведение CSS-анимации при наведении, пауза при наведении

Я пытаюсь

• ИГРАТЬ анимацию при наведении курсора.
• ПРИОСТАНОВИТЬ анимацию при наведении курсора (т.е. не возвращаться к кадру 0).

Невозможно использовать -webkit-animation-play-state: paused; в родительском div?

См. Пример здесь , когда вы наведете на него курсор. возвращается к кадру 0.

Я не хочу использовать JS.