body{
    background: black;
}

#up{
    position: absolute;
    height: 800px;
    width: 800px;
    border-radius: 50%;
    background-image: linear-gradient(80deg,#FDAE07,#ff5500);
    filter: blur(80px);
    animation: down 30s infinite;
}
#down{
    position: absolute;
    right:0;
    height: 500px;
    width: 500px;
    border-radius: 50%;
    background-image: linear-gradient(80deg,#ff0000,#fff200);
    filter: blur(80px);
    animation: up 30s infinite;
}

#left{
    position: absolute;
    height: 500px;
    width: 500px;
    border-radius: 50%;
    background-image: linear-gradient(60deg,#db1414,#fff700);
    filter: blur(80px);
    animation: left 20s 1 infinite;
}

#right{
    position: absolute;
    height: 500px;
    width: 500px;
    border-radius: 50%;
    background-image: linear-gradient(80deg,#d6340c,#ff9500);
    filter: blur(80px);
    animation: right 40s .5s infinite;
}

@keyframes up{
    0%,100%{
       bottom:-100px; 
    }
    70%{
        bottom:700px;
    }
}

@keyframes down{
    0%,100%{
       top:-100px; 
    }
    70%{
        top:700px;
    }
}
@keyframes left{
    0%,100%{
       left:-100px; 
    }
    70%{
        left:1300px;
    }
}
@keyframes right{
    0%,100%{
       right:-100px; 
    }
    70%{
        right:1300px;
    }
}

