css动画在任何浏览器中都不能第一次运行

Question

动画首次加载http://sbarrogrimsby.com/

时无效

披萨在菜单下从右向左滚动（旁边是手工制作的全新方式）。但是当我们刷新页面时，它正在运行。

html代码：      使用的CSS代码：

.grape_pizza
{
width:915px; 
height:921px; 
position:absolute; 
right:-15%; 
 bottom:-75px;background:url("../images/banner_image.png") no-repeat top center;  
-webkit-animation: webkit-circle 2s linear 1;
-moz-animation: moz-circle 2s linear 1; 
-o-animation: o-circle 2s linear 1;   
-ms-animation: ms-circle 2s linear 1; 
-o-animation: circle 2s linear 1; 
animation:circle 2s linear 6; 
-ms-transform-origin: 50% 50px; 
-o-transform-origin: 50% 50px; 
-webkit-transform-origin: 50% 50px; 
-moz-transform-origin: 50% 50px; 
transform-origin: 50% 50px; 
border-radius:50%;
}

@-webkit-keyframes webkit-circle {
    from{-webkit-transform:rotate(270deg);}
    to {-webkit-transform:rotate(360deg);}
}
@-moz-keyframes moz-circle {
    from{-moz-transform:rotate(270deg);}
    to {-moz-transform:rotate(360deg);}
}
 @-ms-keyframes ms-circle {
    from{-ms-transform:rotate(270deg);}
    to {-ms-transform:rotate(360deg);}
}  

 @-o-keyframes o-circle {
    from{-o-transform:rotate(270deg);}
    to {-o-transform:rotate(360deg);}
}  
 @keyframes circle {
    from{transform:rotate(270deg);}
     to {transform:rotate(360deg);}
}