.rainbow-text {
    background-image: repeating-linear-gradient( 45deg, violet, indigo, blue, green, yellow, orange, red, orange, yellow, green, blue, indigo, violet);
    text-align: center;
    background-size: 800% 800%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 24px;
    animation: rainbow 8s linear infinite;
}

@keyframes rainbow {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 25%;
    }
    100% {
        background-position: 0% 50%;
    }
}

.gradient-text {
    background-image: repeating-linear-gradient( 45deg, #4ba838, #4d6cfa, #f34213, #ffc857);
    text-align: center;
    background-size: 800% 800%;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 24px;
    animation: gradient-anim 8s linear infinite;
}

@keyframes gradient-anim {
    0% {
        background-position: 0% 50%;
    }
    50% {
        background-position: 100% 25%;
    }
    100% {
        background-position: 0% 50%;
    }
}