.spinner1 {
    -webkit-animation:spin 4s linear infinite;
    -moz-animation:spin 4s linear infinite;
    animation:spin 4s linear infinite;
}
@-moz-keyframes spin { 100% { -moz-transform: rotate(30deg); } }
@-webkit-keyframes spin { 100% { -webkit-transform: rotate(30deg); } }
@keyframes spin { 100% { -webkit-transform: rotate(30deg); transform:rotate(30deg); } }


.spinner2 {
    -webkit-animation:spin2 6s linear infinite;
    -moz-animation:spin2 6s linear infinite;
    animation:spin2 6s linear infinite;
}
@-moz-keyframes spin2 { 100% { -moz-transform: rotate(-30deg); } }
@-webkit-keyframes spin2 { 100% { -webkit-transform: rotate(-30deg); } }
@keyframes spin2 { 100% { -webkit-transform: rotate(-30deg); transform:rotate(-30deg); } }


.spinner3 {
    -webkit-animation:spin3 6s linear infinite;
    -moz-animation:spin3 6s linear infinite;
    animation:spin3 6s linear infinite;
}
@-moz-keyframes spin3 { 100% { -moz-transform: rotate(90deg); } }
@-webkit-keyframes spin3 { 100% { -webkit-transform: rotate(90deg); } }
@keyframes spin3 { 100% { -webkit-transform: rotate(90deg); transform:rotate(90deg); } }