If you want to move an item in a forward direction, use @keyframes and place the beginning top and left position at 0%. You then add your ending position at 100%. Then if you want the animation to hesitate at different spots, add new values to the top and left positions somewhere in-between (like at 25%, 50%, and 75%).
See the example below of an animation keyframe moving a box forward. To start the animation, refresh the page.
Spend at least an hour playing around with keyframe animations. Then go back to the animation main page to learn more things you can do with CSS animations.