Edit in JSFiddle

<div id="aiizahhmovingball">
<div class="aiizahhmovingball-line">
</div>
<div id="aiizahhmovingball_1" class="aiizahhmovingball">
</div>
</div>

<style>
#aiizahhmovingball{
position:relative;
width:128px;
height:10px;
}

.aiizahhmovingball-line{
position:absolute;
left:0px;
top:4px;
height:2px;
width:128px;
background-color:#000000;
}

.aiizahhmovingball{
background-color:#DB23D5;
position:absolute;
top:0;
left:0;
width:10px;
height:10px;
-moz-border-radius:5px;
-moz-animation-name:bounce_aiizahhmovingball;
-moz-animation-duration:2.9s;
-moz-animation-iteration-count:infinite;
-moz-animation-direction:linear;
-webkit-border-radius:5px;
-webkit-animation-name:bounce_aiizahhmovingball;
-webkit-animation-duration:2.9s;
-webkit-animation-iteration-count:infinite;
-webkit-animation-direction:linear;
-ms-border-radius:5px;
-ms-animation-name:bounce_aiizahhmovingball;
-ms-animation-duration:2.9s;
-ms-animation-iteration-count:infinite;
-ms-animation-direction:linear;
-o-border-radius:5px;
-o-animation-name:bounce_aiizahhmovingball;
-o-animation-duration:2.9s;
-o-animation-iteration-count:infinite;
-o-animation-direction:linear;
border-radius:5px;
animation-name:bounce_aiizahhmovingball;
animation-duration:2.9s;
animation-iteration-count:infinite;
animation-direction:linear;
}

@-moz-keyframes bounce_aiizahhmovingball{
0%{
left:0px;
}

50%{
left:118px;
}

100%{
left:0px;
}

}

@-webkit-keyframes bounce_aiizahhmovingball{
0%{
left:0px;
}

50%{
left:118px;
}

100%{
left:0px;
}

}

@-ms-keyframes bounce_aiizahhmovingball{
0%{
left:0px;
}

50%{
left:118px;
}

100%{
left:0px;
}

}

@-o-keyframes bounce_aiizahhmovingball{
0%{
left:0px;
}

50%{
left:118px;
}

100%{
left:0px;
}

}

@keyframes bounce_aiizahhmovingball{
0%{
left:0px;
}

50%{
left:118px;
}

100%{
left:0px;
}

}

</style>