How to control css3 animation rotation direction

I want to rotate an element with css3 animation and convert a property that is 20 to 20 degrees

@-moz-keyframes oneRotate{
    0%{
        -moz-transform: rotate(20deg);
    }
    100%{
        -moz-transform:rotate(-20deg);
    }
}

.oneRotate
{
    -moz-transform-style: preserve-3d;

   -moz-animation-name:oneRotate;
   -moz-animation-duration:2s;
   -moz-animation-timing-function:ease-in-out;
   -moz-animation-delay:0s;
   -moz-animation-iteration-count:infinite;
   -moz-animation-direction:normal;
}

rotation order is 20 → 0 → -20 ... counterclockwise

but I want the order to be 20 → 90 → 180 → ... clockwise

what can i do for this?