bootstrap on website issue

Visit http://www.sehgalmotors.pk
when i zoom in or out, the whole layout is disturbed. how can i rectify it if i want it to wrap according to zoom or resolution option without disturbing the images and layout. 
is there any way to do it? i have heard about bootstrap. but i do not know how to put it in my html. i am not a developer. but help me out how to resolve it.

I think for your mobile web just use col-xs-xx. If you use same view for www. & m. version you can have both in. Example <div class="col-xs-12 col-sm-6">A</div> <div class="col-xs-12 col-sm-6">B</div>
In less than 768px width screen the B will push bottom. While in 768px and above B position is beside A. col-xx-cc, xx option xs,sm,md,lg & cc max value 12.

Keep calm.

Bootstrap is just a framework of media queries and html markup with some additional widgets added in.

You can just use css media queries to adjust your site as you see fit. The problem is your design has so many issues that you are going to be re-working the entire layout anyway.

When you do a website, every page should be designed with different screen sizes in mind. Tacking it on the end makes your job virtually impossible.

Finally, in moments of extreme frustration, you can always use bootstraps hidden-xs or visible-xs to double the HTML content but completely alter the content displayed at different screen sizes. Like your footer image could be hidden for small screen sizes and some text with relevant information displayed.

Your nav design is going to cause you headaches too. Again you can just hide it at smaller resolutions and replace it with a single dropdown shorter version for instance. Or use bootstraps nav bar which does the same thing, but does it very well.

Good luck,

Paul.

PS Bootstrap and other css frameworks are very easy to learn and get to grips with quickly. Their documentation is fantastic too which really helps.