easy way to create/modify a responsive theme

I’m trying to create a responsive version of a website I created years ago using the ‘basic’ theme – http://wefs.co.nz/. I’ve just been playing around with Zurb Foundation theme (thinking perhaps this is the best responsive theme to get up and running), but am getting a bit lost in the complexity. I don’t know what css files to modify to change something simple like a heading size or colour. If I use Firebug or Inspect Element to view the css for a page component it is using a minified version and modifications I make to the non-minified files don’t seem to have any effect. It’s been a while since I’ve played around with Drupal themes and am just a bit unsure where to start with a theme like this.

Maybe there is an easier way using a different theme? It is a pretty simple website layout. The front page has two columns, the rest of the pages are single column. Essentially all I need is for the front page to fold down to single column layout for smaller displays and the horizontal main menu to fold into a menu suitable for mobile devices.

Suggestions for how to get started modifying Zurb or ideas for a simpler theme to modify to get my site mobile friendly much appreciated.


Drupal version: 

Source: https://www.drupal.org/taxonomy/term/3/feed