@keyframes spinner {
    0% {
        transform: translate3d(-50%, -50%, 0) rotate(0deg);
    }
    100% {
        transform: translate3d(-50%, -50%, 0) rotate(360deg);
    }
}
.spin {
  width: 100px;
  height: 100px;
  border: 10px solid #cfd0d1; 
  border-top-color:  #00477E;
  border-bottom-color: #00477E; 
  border-radius: 50%;
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%); 
  transform: translate3d(-50%, -50%, 0);
  animation: 1.5s linear infinite spinner;  
  animation-play-state: inherit;
  will-change: transform;
}