html {
    background-image: url("toedance.gif");
    background-color: #181a1b;
    color: white;
    font-family: "Arial", "Helvetica", sans-serif;
}

.center {
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
}

.bg {
    background-color: #181a1b;
    height: 100%;
}

/* I have no idea how this works. */
/* I got it from here: https://w3bits.com/labs/animated-rainbow-text/ */
.rainbow-text {
    background-image: repeating-linear-gradient(45deg, violet, indigo, blue, green, yellow, orange, red, violet);
    text-align: center;
    background-size: 800% 800%;
    -webkit-background-clip: text;
    background-clip: text;
    clip: text;
    -webkit-text-fill-color: transparent;
    font-size: 24px;
    animation: rainbow 8s ease infinite;
}

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