body {
    margin:0;
    padding:0;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    background-image: url("bgf.jpg"); 
    background-size: cover;
    /* background:#240229;*/
}
.loader {
    position: relative; 
    width: 200px;
    height: 200px;
    border-radius: 50%;
    background: linear-gradient(#14ffe9, #ffeb3b, #ff00e0);
    animation: animate 2.26s linear infinite;
}
.loader span {
    position: absolute; 
    width: 100%;
    height: 100%;
    border-radius: 50%;
    background: linear-gradient(#14ffe9, #ffeb3b, #ff00e0);

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

}
.loader span:nth-child(1) {
 filter: blur(5px);
}
.loader span:nth-child(2) {
 filter: blur(10px);
}
.loader span:nth-child(3) {
 filter: blur(15px);
}
.loader span:nth-child(4) {
 filter: blur(20px);
}
.loader:after {
 content: "";
 position: absolute;
 top: 10px;
 left: 10px;
 right: 10px;
 bottom: 10px;
 background:#000fff;
 border-radius: 100px;
}