.animation{
width:100px;
height:100px;
background: url(http://m1.sdimgs.com/sd_static/a/213595/flybaloon.png) no-repeat top center;
position:relative;
animation:mymove 20s infinite;
-webkit-animation:mymove 20s infinite; /*Safari and Chrome*/
z-index:2000;
}

.animation2{
width:100px;
height:100px;
background: url(http://m1.sdimgs.com/sd_static/a/213595/airplane.png) no-repeat top center;
position:relative;
animation:myplane 15s infinite;
-webkit-animation:myplane 15s infinite; /*Safari and Chrome*/
z-index:2000;
} 

.animation3{
width:100px;
height:100px;
background: url(http://m1.sdimgs.com/sd_static/a/213595/airhotballoon.png) no-repeat top center;
position:relative;
animation:myhotair 10s infinite;
-webkit-animation:myhotair 10s infinite; /*Safari and Chrome*/
z-index:2000;
} 

@keyframes mymove
{
from {right:55%; top:21%;}
to {right:90%; top:-15%;}
}

@-webkit-keyframes mymove /*Safari and Chrome*/
{
from {right:55%; top:21%;}
to {right:90%; top:-15%;}
}


@keyframes myplane
{
from {right:10%; top:0%;}
to {right:120%; top:10%;}
}

@-webkit-keyframes myplane /*Safari and Chrome*/
{
from {right:10%; top:0%;}
to {right:120%; top:10%;}
}


@keyframes myhotair
{
from {right:65%; top:5%;}
to {right:65%; top:-15%;}
}

@-webkit-keyframes myhotair /*Safari and Chrome*/
{
from {right:65%; top:5%;}
to {right:65%; top:-15%;}
}