Добавить задержку анимации в стандартный CSS Divi

Question

Для своего сайта я использую Divi в качестве темы. Приятной деталью функциональности divi является навигация точки divi, для этой конкретной проблемы я попытался перезаписать функциональность навигации точек divi по умолчанию, отложив КОГДА навигационная точка divi должна стать видимой и анимироваться справа. В приведенном ниже коде я добавил -800 пикселей, чтобы убедиться, что этот пользовательский код действительно работает - да, это так!

Я пытался:

ul.et_pb_side_nav.et-visible {
    opacity: 0;
    -webkit-animation: fadeInRight 1.5s 1 cubic-bezier(.77,0,.175,1) !important;
    -moz-animation: fadeInRight 1.5s 1 cubic-bezier(.77,0,.175,1) !important;
    -o-animation: fadeInRight 1.5s 1 cubic-bezier(.77,0,.175,1) !important;
    animation: fadeInRight 1.5s 1 cubic-bezier(.77,0,.175,1) !important;
    -webkit-animation-delay: 20s;
    animation-delay: 20s;
}


/* Chrome, Safari, Opera */
@-webkit-keyframes fadeInRight {
    0% {
        opacity: 0;
        -webkit-transform: translateX(-800px);
    }
    100% {
        opacity: 1;
        -webkit-transform: translateY(0);
    }
}

/* Standard syntax */
@keyframes fadeInRight {
    0% {
        opacity: 0;
        transform: translateX(-800px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

Несмотря на то, что анимация исходит от -800 пикселей, задержка не работает! Мне нужно, чтобы эта анимация подождала 20 секунд перед запуском.

У вас есть предложения, как это исправить?(Не похоже, что профессиональная версия divi dot nav имеет возможность устанавливать задержку анимации)