
Анимированная рамка с градиентом
Сделайте, чтобы рамке с градиентом добавлялась анимация при наведении на элемент.
Содержание
Что нужно
Нужно написать стили для ссылки таким образом, чтобы рамке с градиентом добавлялась анимация.
При этом, когда убираем курсор, анимация не сбрасывается к начальному состоянию, а замирает в текущем положении. Наведя курсор опять, градиент продолжает меняться с остановившегося состояния.

При наведении на кнопку включается анимация рамки
Точное совпадение не обязательно
Не нужно добиваться точного совпадения в цветах градиента и эффекта анимации. Главное — суть: есть рамка с градиентом, она анимируется при наведении и замирает, когда убираем курсор.
Чего нельзя
Запрещается править HTML. Нельзя использовать Javascript, даже если очень хочется; он тут не нужен.
Решение
Используйте вкладку «CSS» для добавления стилей, а во вкладке «Result» отслеживайте, что получается.
Публиковать в комментариях только CSS не стоит, это не наглядно. Размещайте свой вариант решения на jsfiddle.net и делитесь ссылкой в комментариях.