#propellers
{
    position: relative;
    top: -320px;
    left: 217px;
    width: 50px;
    height: 50px;
    
     width: 378px;
    height: 20px;

  

    background: url(../image/fly/fly3.png);
    
     
    -webkit-animation-name:    circle , forward ;
    -webkit-animation-duration: 10s, 10s;
    -webkit-animation-timing-function: linear , steps(50);
    -webkit-animation-iteration-count:  infinite,  infinite;
    -webkit-animation-play-state:  paused,  paused;
    
     border: px  ridge black;     


}

@keyframes circle
{
    from
    {
        transform: rotate(90deg);
    }

    to {
        transform: rotate(450deg);
    }
}

@keyframes forward1
{
    from
    {
        transform: translateX(-400px);
    }
    to
    {
        transform: translateX(1500px);

    }
}

@keyframes forward
{
    0%
    {
       transform: translateY(0px);
    }
    25%
    {
        transform: translateY(-250px);
    }
    50%
    {
        transform: translateY(-200px);
    }
    100%
    {
        transform: translateX(1500px);
    }
}

/*

    animation: forward ;
    animation-duration: 20s;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-play-state:   paused;
    
    
    animation-name: circle;
    animation-duration: 10s;
    animation-timing-function: steps(50) ;
   animation-iteration-count: infinite;
    animation-play-state:   paused;
    
     animation:   circle   20s  linear     infinite ,
                  forward  20s  steps(50)  infinite paused;
     
    -webkit-animation-name:    circle , forward ;
    -webkit-animation-duration: 20s, 20s;
    -webkit-animation-timing-function: linear , steps(50);
    -webkit-animation-iteration-count:  infinite,  infinite;
    -webkit-animation-play-state:  paused,  paused;




*/