@keyframes underlineHeadline {
    from {width: 0;}
    to {width: 103%;}
}

.yellow-dash-headline::before {
    animation-name: underlineHeadline;
    animation-duration: 2s;
}

@keyframes underline {
    from {width: 0;}
    to {width: 103%;}
}

.yellow-dash::before {
    width: 103%;
    animation-name: underline;
    animation-duration: 3s;
    animation-fill-mode: forwards;
}

@keyframes underlinePotencializar {
    from {width: 0;}
    to {width: 450%;}
}

#yellow-dash-potencializar::before {
    animation-name: underlinePotencializar;
}

[data-animation] {
    animation-duration: 1s;
    animation-fill-mode: both;
    animation-play-state: paused;
}

.animate[data-animation] {
    animation-play-state: running;
}

[data-animation-delay='0.1'] { animation-delay: 0.1s; }
[data-animation-delay='0.2'] { animation-delay: 0.2s; }
[data-animation-delay='0.3'] { animation-delay: 0.3s; }
[data-animation-delay='0.4'] { animation-delay: 0.4s; }
[data-animation-delay='0.5'] { animation-delay: 0.5s; }
[data-animation-delay='0.6'] { animation-delay: 0.6s; }
[data-animation-delay='0.7'] { animation-delay: 0.7s; }
[data-animation-delay='0.8'] { animation-delay: 0.8s; }
[data-animation-delay='0.9'] { animation-delay: 0.9s; }
[data-animation-delay='1'] { animation-delay: 1s; }
[data-animation-delay='1.1'] { animation-delay: 1.1s; }
[data-animation-delay='1.2'] { animation-delay: 1.2s; }
[data-animation-delay='1.3'] { animation-delay: 1.3s; }
[data-animation-delay='1.4'] { animation-delay: 1.4s; }
[data-animation-delay='1.5'] { animation-delay: 1.5s; }
[data-animation-delay='2'] { animation-delay: 2s; }
[data-animation-delay='2.5'] { animation-delay: 2.5s; }
[data-animation-delay='3'] { animation-delay: 3s; }

@media (max-width: 768px) {
    [data-animation-delay-mobile='0.1'] { animation-delay: 0.1s; }
    [data-animation-delay-mobile='0.2'] { animation-delay: 0.2s; }
    [data-animation-delay-mobile='0.3'] { animation-delay: 0.3s; }
    [data-animation-delay-mobile='0.4'] { animation-delay: 0.4s; }
    [data-animation-delay-mobile='0.5'] { animation-delay: 0.5s; }
    [data-animation-delay-mobile='0.6'] { animation-delay: 0.6s; }
    [data-animation-delay-mobile='0.7'] { animation-delay: 0.7s; }
    [data-animation-delay-mobile='0.8'] { animation-delay: 0.8s; }
    [data-animation-delay-mobile='0.9'] { animation-delay: 0.9s; }
    [data-animation-delay-mobile='1'] { animation-delay: 1s; }
    [data-animation-delay-mobile='1.1'] { animation-delay: 1.1s; }
    [data-animation-delay-mobile='1.2'] { animation-delay: 1.2s; }
    [data-animation-delay-mobile='1.3'] { animation-delay: 1.3s; }
    [data-animation-delay-mobile='1.4'] { animation-delay: 1.4s; }
    [data-animation-delay-mobile='1.5'] { animation-delay: 1.5s; }
    [data-animation-delay-mobile='2'] { animation-delay: 2s; }
    [data-animation-delay-mobile='2.5'] { animation-delay: 2.5s; }
    [data-animation-delay-mobile='3'] { animation-delay: 3s; }
}

@keyframes fade {
    from { opacity: 0; }
    to { opacity: 1; }
}
[data-animation='fade'] {
    animation-name: fade;
}

@keyframes fade-from-left {
    from { opacity: 0; transform: translateX(-10%); }
    to { opacity: 1; transform: translateX(0%); }
}
[data-animation='fade-from-left'] {
    animation-name: fade-from-left;
}

@keyframes fade-from-right {
    from { opacity: 0; transform: translateX(10%); }
    to { opacity: 1; transform: translateX(0%); }
}
[data-animation='fade-from-right'] {
    animation-name: fade-from-right;
}

@keyframes fade-from-up {
    from { opacity: 0; transform: translateY(-25%); }
    to { opacity: 1; transform: translatey(0%); }
}
[data-animation='fade-from-up'] {
    animation-name: fade-from-up;
}

@keyframes fade-from-down {
    from { opacity: 0; transform: translateY(25%); }
    to { opacity: 1; transform: translatey(0%); }
}
[data-animation='fade-from-down'] {
    animation-name: fade-from-down;
}

@media (max-width: 768px) {
[data-animation-mobile='fade-from-down'] {
    animation-name: fade-from-down;
}}

@keyframes grow-width {
    from { transform: scaleX(0%); }
    to { transform: scaleX(100%); }
}
[data-animation='grow-width'] {
    animation-name: grow-width;
}

@keyframes grow-from-left {
    from { transform: scaleX(0%); }
    to { transform: scaleX(100%); }
}
[data-animation='grow-from-left'] {
    animation-name: grow-from-left;
    transform-origin: left;
}