body {
    height: 100vh;
    width: 100vw;
    overflow: hidden;

    background-color: aliceblue;

    animation-name: monRGB;
    animation-duration: 5s;
    animation-iteration-count: infinite;
    transition: .1s;
}

/* @keyframes monRGB {
    0% {
        background-color: #ff003c;
    }
    10% {
        background-color: #ff00d4;
    }
    20% {
        background-color: #d000ff;
    }
    30% {
        background-color: #002aff;
    }
    40% {
        background-color: #00aaff;
    }
    50% {
        background-color: #0dff00;
    }
    60% {
        background-color: #c8ff00;
    }
    70% {
        background-color: #ffc400;
    }
    80% {
        background-color: #ff7b00;
    }
    90% {
        background-color: #ff3c00;
    }
    100% {
        background-color: #ff0000;
    }
} */
@keyframes monRGB {
    0% {
        background-color: #0051ff;
    }
    10% {
        background-color: #ff00d4;
    }
    20% {
        background-color: #d000ff;
    }
    30% {
        background-color: #002aff;
    }
    40% {
        background-color: #00aaff;
    }
    50% {
        background-color: #c300ff;
    }
    60% {
        background-color: #0044ff;
    }
    70% {
        background-color: #ea00ff;
    }
    80% {
        background-color: #f94bff;
    }
    90% {
        background-color: #0051ff;
    }
    100% {
        background-color: #c852ff;
    }
}