.preloader{
  background-color: #F5F5F5;
  position: fixed;
  display: flex;
  justify-content: center;
  align-items: center;
  left: 0;
  top: 0;
  width: 100vw;
  height: 100vh;
  z-index: 1000;
}

.load{
  position: relative;
  width:50px;
  height:50px;
}
.load hr{
  border:0;
  margin:0;
  width:40%;
  height:40%;
  position:absolute;
  border-radius:50%;
  animation:spin 2s ease infinite}

.load :first-child{background:#FF4040;animation-delay:-1.5s}
.load :nth-child(2){background:#FF4040;animation-delay:-1s}
.load :nth-child(3){background:#FF4040;animation-delay:-0.5s}
.load :last-child{background:#FF4040}

@keyframes spin{
  0%,100%{transform:translate(0)}
  25%{transform:translate(160%)}
  50%{transform:translate(160%, 160%)}
  75%{transform:translate(0, 160%)}
}