Css - Keyframes and animation issue

Hi,

For my website I have a strange issue on my iPhone.

I added an overlay spinner. This one shows fine on every browser, except on my iPhone (IOS 10.1.1). There the animation is not fired.

In my CSS file I added:

-webkit-animation-name:webkit-rotate-scale;
-webkit-animation-duration:0.75s;
-webkit-animation-direction:normal;
-webkit-animation-delay:0s;
-webkit-animation-iteration-count:infinite;
-webkit-animation-timing-function:linear;
-webkit-animation-play-state:running;

and

@-webkit-keyframes turnaround {
    0% {-webkit-transform: rotate(0deg) scale(1);}
    50% {-webkit-transform: rotate(180deg) scale(.5);}
    100% {-webkit-transform: rotate(360deg) scale(1);}
}

I added the standard (no webkit) alternatives also. In every browser, this shows fine.

Except on the iPhone, the image doen't move at all. Can someone tell me what I'm missing?

The div where I am showing it in has display: inline-block.

Thanks in advance!

Kind regards,

Gery