#updateButton {
    width: 200px;
    height: 80px;
    border: none;
    outline: none;
    color: grey;
    background: #111;
    cursor: pointer;
    position: relative;
    z-index: 0;
    border-radius: 10px;
    margin-top: 20px;
    margin-bottom: 20px;
}

body {
    font-family: 'Noto Serif';font-size: 22px;
}





#updateButton:before {
    content: "";
    background: linear-gradient(
        45deg,
        red,
        #ff7300,
        #fffb00,
        #48ff00,
        #00ffd5,
        #002bff,
        #7a00ff,
        #ff00c8,
        red
    );
    position: absolute;
    top: -10px;
    left: -10px;
    background-size: 400%;
    z-index: -1;
    filter: blur(5px);
    /* WARNING[1] raised evaluating next rule: ExecuteError INCOMPATIBLE_UNITS: No conversion is possible from % (percentage) to PX (pixels).. stripping unit. */
    width: calc(110%);
    /* WARNING[2] raised evaluating next rule: ExecuteError INCOMPATIBLE_UNITS: No conversion is possible from % (percentage) to PX (pixels).. stripping unit. */
    height: calc(110%);
    animation: glowing 20s linear infinite;
    opacity: 0.25;
    transition: opacity 0.3s ease-in-out;
    border-radius: 10px;
}

#updateButton:active {
    color: #000;
}

#updateButton:active:after {
    background: transparent;
}

#updateButton:hover:before {
    opacity: 1;
}

#updateButton:after {
    z-index: -1;
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: #111;
    left: 0;
    top: 0;
    border-radius: 10px;
}

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

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

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