Для начала скачаем исходные файлы:

Исходники качать:  https://github.com/agragregra/css-animation

Содержимое папки:

 

 

 

Результат тут:  http://agragregra.github.io/demos/css-animation/

 

 

На Codepen:  https://codepen.io/agragregra/pen/NvNxqQ

 

 

Базовый пример из урока:  https://codepen.io/agragregra/pen/PKNavm

 

Стартовый шаблон из урока:  https://github.com/agragregra/optimizedhtml-start-template

 

 

------------------------------------------------------------------------------

 

Продолжаем:

 

Создание CSS-анимации начинаем с объявления имени анимации в блоке:

 

    @key-frames