svg {
  display: block;

  position: relative;

  transform: translate(-50%, -50%);
  position: fixed;
  height: 100px;
  width: 100px;
  top: 50%;
  left: 50%;


}


#loading {
  width: 100%;
  height: 100%;

  position: fixed;
  display: block;

  background-color: #435642;
  z-index: 99999;
  text-align: center;
}






.fix {
  -webkit-transform: translate(50%, 50%);
          transform: translate(50%, 50%);
}

.Needle {
 
          animation: rotateNeedle 2s ;
  -webkit-transform: rotateZ(0) translate(-50%,-50%);
          transform: rotateZ(0) translate(-50%,-50%);
 
          animation-iteration-count:infinite;
       
           animation-play-state:running;
         
}






@-webkit-keyframes rotateNeedle {

  60% {
    -webkit-transform: rotateZ(-360deg) translate(-50%,-50%);
            transform: rotateZ(-360deg) translate(-50%,-50%)
  }
 
}

@keyframes rotateNeedle {

  60% {
    -webkit-transform: rotateZ(-360deg) translate(-50%,-50%);
            transform: rotateZ(-360deg) translate(-50%,-50%)
  }
  
}






.svg {
  animation-delay: 0.6s;
}