body {
    margin: 0;
    font-family: Comic Sans MS, Arial, sans-serif;
    color: white;
    text-align: center;
    animation: rainbowBG 5s infinite linear;
}


@keyframes rainbowBG {
    0% { background: red; }
    16% { background: orange; }
    33% { background: yellow; color:black;}
    50% { background: green; }
    66% { background: blue; }
    83% { background: purple; }
    100% { background: red; }
}


h1 {
    font-size: 60px;
    margin-top: 40px;
    animation: shake 0.5s infinite;
}


@keyframes shake {
    0% { transform: translate(0px,0px); }
    25% { transform: translate(5px,-5px); }
    50% { transform: translate(-5px,5px); }
    75% { transform: translate(5px,5px); }
    100% { transform: translate(0px,0px); }
}


.box {
    margin: 30px auto;
    padding: 20px;
    max-width: 600px;
    border: 5px dashed white;
    animation: spin 5s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg);}
    100% { transform: rotate(360deg);}
}


button {
    margin-top: 20px;
    padding: 20px 40px;
    font-size: 20px;
    border: none;
    border-radius: 50px;
    cursor: pointer;
    background: linear-gradient(90deg, red, orange, yellow, green, blue, purple);
    color: black;
    font-weight: bold;
    animation: pulse 1s infinite;
}

@keyframes pulse {
    0% { transform: scale(1);}
    50% { transform: scale(1.2);}
    100% { transform: scale(1);}
}


#browser {
    font-size: 12px;
    word-break: break-all;
}


.marquee {
    font-size: 24px;
    margin-top: 20px;
    color: yellow;
}