.spiralContainer {
  border-radius: 50%;
  width:500px;
  height:500px;
  overflow:hidden;
  margin:20px;
  margin-top: 15% !important; 
  -webkit-animation: spin 10s linear 0s infinite reverse;
  -moz-animation: spin 10s linear 0s infinite reverse;  
  -ms-animation: spin 10s linear 0s infinite reverse;
  -o-animation: spin 10s linear 0s infinite reverse;
  animation: spin 10s linear 0s infinite reverse;
  
  -webkit-animation-play-state: paused;
  -moz-animation-play-state: paused;
  -ms-animation-play-state: paused;
  -o-animation-play-state: paused;  
  animation-play-state: paused;
}
.spiral {
  width:500px;
  height:500px;
  border-radius: 50%;
  /*background-image: url(../images/Treb_Sof.png);*/
  background-repeat:no-repeat;
  background-position:50% 50%;
  
  
  -webkit-animation: spin 10s linear 0s infinite normal;
  -moz-animation: spin 10s linear 0s infinite normal;
  -ms-animation: spin 10s linear 0s infinite normal;
  -o-animation: spin 10s linear 0s infinite normal;
  animation: spin 10s linear 0s infinite normal;
}
.spiralContainer:hover {
  -webkit-animation-play-state: running;
  -moz-animation-play-state: running;
  -ms-animation-play-state: running;
  -o-animation-play-state: running;
  animation-play-state: running;
}
@keyframes spin {
  0% { transform: rotate(360deg); }
  100% { transform: rotate(0deg); }
}
@-webkit-keyframes spin {
  0% {-webkit-transform: rotate(360deg); }
  100% { -webkit-transform: rotate(0deg); }
}
@-ms-keyframes spin {
  0% {-ms-transform: rotate(360deg); }
  100% { -ms-transform: rotate(0deg); }
}
@-moz-keyframes spin {
  0% { -moz-transform: rotate(360deg); }
  100% { -moz-transform: rotate(0deg); }
}
@-o-keyframes spin {
  0% { -o-transform: rotate(360deg); }
  100% { -o-transform: rotate(0deg); }
}