.loader__wrapper {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  z-index: 9999;
  background: #212121;
}
#page_loader {
width: 60px;
height: 60px;
-webkit-transition: all 0.4s ease-out;
-ms-transition: all 0.4s ease-out;
-moz-transition: all 0.4s ease-out;
-o-transition: all 0.4s ease-out;
transition: all 0.4s ease-out;
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 0;
margin: auto;
}
.fol {
width: 60px;
height: 60px;
-webkit-border-radius: 50%;
-ms-border-radius: 50%;
-moz-border-radius: 50%;
border-radius: 50%;
position: relative; 
}
.cir {
width: 8px;
height: 8px;
-webkit-border-radius: 50%;
-moz-border-radius: 50%;
-ms-border-radius: 50%;
border-radius: 50%;
position: absolute;
background: rgba(0, 160, 230, 0.5);
top: 30px;
left: 60px;
}
#c1 {
-webkit-animation: move 0.6s infinite;
-ms-animation: move 0.6s infinite;
-moz-animation: move 0.6s infinite;
-o-animation: move 0.6s infinite;
animation: move 0.6s infinite;
-webkit-animation-timing-function: linear;
-ms-animation-timing-function: linear;
}
#c2 {
-webkit-animation: move 0.8s infinite;
-ms-animation: move 0.8s infinite;
-moz-animation: move 0.8s infinite;
-o-animation: move 0.8s infinite;
animation: move 0.8s infinite;
-webkit-animation-timing-function: linear;
-ms-animation-timing-function: linear;
}
#c3 {
-webkit-animation: move 1.2s infinite;
-ms-animation: move 1.2s infinite;
-moz-animation: move 1.2s infinite;
-o-animation: move 1.2s infinite;
animation: move 1.2s infinite;
-webkit-animation-timing-function: linear;
-ms-animation-timing-function: linear;
}
#c4 {
-webkit-animation: move 2.4s infinite;
-ms-animation: move 2.4s infinite;
-moz-animation: move 2.4s infinite;
-o-animation: move 2.4s infinite;
animation: move 2.4s infinite;
-webkit-animation-timing-function: linear;
-ms-animation-timing-function: linear;
}

@-webkit-keyframes move {
  0% {
    top: 24px;
    left: 48px;
  }
  10% {
    top: 9.89315394px;
    left: 43.41640786px;
  }
  20% {
    top: 1.17464361px;
    left: 31.41640786px;
  }
  30% {
    top: 1.17464361px;
    left: 16.58359214px;
  }
  40% {
    top: 9.89315394px;
    left: 4.58359214px;
  }
  50% {
    top: 24px;
    left: 0px;
  }
  60% {
    top: 38.10684606px;
    left: 4.58359214px;
  }
  70% {
    top: 46.82535639px;
    left: 16.58359214px;
  }
  80% {
    top: 46.82535639px;
    left: 31.41640786px;
  }
  90% {
    top: 38.10684606px;
    left: 43.41640786px;
  }
  100% {
    top: 24px;
    left: 48px;
  }
}

@-ms-keyframes move {
  0% {
    top: 24px;
    left: 48px;
  }
  10% {
    top: 9.89315394px;
    left: 43.41640786px;
  }
  20% {
    top: 1.17464361px;
    left: 31.41640786px;
  }
  30% {
    top: 1.17464361px;
    left: 16.58359214px;
  }
  40% {
    top: 9.89315394px;
    left: 4.58359214px;
  }
  50% {
    top: 24px;
    left: 0px;
  }
  60% {
    top: 38.10684606px;
    left: 4.58359214px;
  }
  70% {
    top: 46.82535639px;
    left: 16.58359214px;
  }
  80% {
    top: 46.82535639px;
    left: 31.41640786px;
  }
  90% {
    top: 38.10684606px;
    left: 43.41640786px;
  }
  100% {
    top: 24px;
    left: 48px;
  }
}

@keyframes move {
  0% {
    top: 24px;
    left: 48px;
  }
  10% {
    top: 9.89315394px;
    left: 43.41640786px;
  }
  20% {
    top: 1.17464361px;
    left: 31.41640786px;
  }
  30% {
    top: 1.17464361px;
    left: 16.58359214px;
  }
  40% {
    top: 9.89315394px;
    left: 4.58359214px;
  }
  50% {
    top: 24px;
    left: 0px;
  }
  60% {
    top: 38.10684606px;
    left: 4.58359214px;
  }
  70% {
    top: 46.82535639px;
    left: 16.58359214px;
  }
  80% {
    top: 46.82535639px;
    left: 31.41640786px;
  }
  90% {
    top: 38.10684606px;
    left: 43.41640786px;
  }
  100% {
    top: 24px;
    left: 48px;
  }
}