@keyframes bgAnimation {
    0% {
        background-position: 0% 0%;
    }

    50% {
        background-position: 100% 100%;
    }

    100% {
        background-position: 0% 0%;
    }
}

.bg-animated {
    /* background: linear-gradient(180deg, #e3f2fd, #bbdefb, #90caf9, #64b5f6, #42a5f5, #2196f3, #1e88e5, #1976d2, #1565c0, #0d47a1); */
    background: linear-gradient(180deg, #e3f2fd);
    background-size: 400% 400%;
    animation: bgAnimation 10s ease infinite;
}

@keyframes buttonAnimation {
    0% {
        background-position: 0% 50%;
    }

    50% {
        background-position: 100% 50%;
    }

    100% {
        background-position: 0% 50%;
    }
}

.btn-animated {
    background: linear-gradient(90deg, #1976d2, #42a5f5, #64b5f6);
    background-size: 200% 200%;
    animation: buttonAnimation 4s ease infinite;
    color: white;
    transition: background 0.3s ease;
}

.btn-animated:hover {
    background: linear-gradient(90deg, #1565c0, #2196f3, #1e88e5);
}