Как отключить css animation при загрузке страницы?

Есть анимация, которая срабатывает при наведении курсора - https://jsfiddle.net/fprmjbvd/3/. Но при загрузке страницы или при переходах между страницами (этот блок размещен в header-е) срабатывает произвольно обратная анимация - нажмите "Run" - увидите (при том, что вы еще и курсор не наводили).

Пробовал добавлять к body класс preload, к preload-у в стилях добавлял -webkit-transition: none !important; и -webkit-animation: none !important; и в скрипте прописывал - после загрузки страницы - preload убирать - вот ссылка этого решения - https://css-tricks.com/transitions-only-after-page....

Но оно не работает, анимация просто не срабатывает вообще. Сколько искал в Рунете и в зарубежном - одно это решение. Почему оно не работает у меня - без понятия. Как можно решить этот вопрос?