Custom Joomla template: How to move ahead?

i am creating my first joomla template. I have written my index.php, templateDetails.xml, and also created the folders for images and css.
But, now i am not getting how to move ahead, i.e. how to apply the css for the divisions in the template, how to create my own positions and like that…

You should probably be starting with an existing template.

Start out with something basic, and then just replace most of the markup, along with the CSS, images, etc. … with your own.

This should give you an idea of how everything works, along with some pre-made code on placing modules.

The idea is that … wherever you want an editable or non-static area, you designate with a module position, and you should see that in the code of your starter template. It’s not an actual module that you’re assigning, but rather a “position.” You then navigate to the Modules area (from the main menu) to assign (or re-assign) actual modules to those positions you just designated in your template code. Types of Modules that can be assigned include menus, plugins (like image galleries), breadcrumbs, or just plain-old HTML that you can create with a wizzywig editor.

You’ll also see where the actual “content” is being placed; i.e. your “articles,” and this is the only non-module content on a page. If you have an actual template to start with, you should start seeing how all of this works as you stare at it. And if you don’t … then I would recommend searching youtube with the terms “Create a Joomla template” or something along those lines, and you will find plenty of tutorials out there that walk through the process.