desigining website for mobile/small screens

[unwashed potato!]

i'm trying to make my new site responsive some what to different browser sizes, in particular mobile browsers so that they have a clearer, simpler design.

has anyone any suggestions as to what sort of widths i should look to focus on for instance, my site at max width is 1150px, and i'd like to say change the design slightly for those 1150-900, then 900 - 700, then anything less has the max width set at say 320px, but perhaps is that a bit too small. i've looked online and the viewport for mobile varies from 320 to 480 from what i can see.

any suggestions what the brackets should be?

 

[unwashed potato!]

thanks for the reply. it would be too late yes but i'll consider a framework for next time.

those are the dimensions i've kind of gone with for now so will stick to that. thanks.

edit:

updated the site.

what do people think? there's still loads to do but anything anyone notices that seems out of place?

http://www.mayergroup.co.uk/