.cloud-loader {
  width: 175px;
  height: 80px;
  margin: auto;
  background-image: radial-gradient(circle 25px at 25px 25px, #5e72e4 100%, transparent 0), radial-gradient(circle 50px at 50px 50px, #5e72e4 100%, transparent 0), radial-gradient(circle 25px at 25px 25px, #5e72e4 100%, transparent 0), linear-gradient(#5e72e4 50px, transparent 0);
  background-size: 50px 50px, 100px 76px, 50px 50px, 120px 40px;
  background-position: 0px 30px, 37px 0px, 122px 30px, 25px 40px;
  background-repeat: no-repeat;
  box-sizing: border-box;
}
.cloud-loader::after {
  content: '';  
  left: 0;
  right: 0;
  top: 30px;
  margin: auto;
  bottom: 20px;
  position: absolute;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  border: 5px solid transparent;
  border-color: #ffffff  transparent;
  box-sizing: border-box;
  animation: rotation 1s linear infinite;
}

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