Responsive Layout of multi-page website in Adaptive Theme I've read the book 'responsive web design' by Ethan Marcotte over the week &amp; gone through the documentation on Adaptive Theme website, however, I'm confused about how to take responsive theming forward in Adaptive Theme when I have multiple web pages with their own CSS files.

From the documentation on Adaptive Theming, we have to split the CSS for each layout into its individual file (responsive.smartphone.landscape.css; responsive.desktop.css). Does that mean, we would have the full site CSS in one file for responsive.desktop.css? (! surely thats not right).

The way we have done thus far (in its current form, website is not responsive) is that there are small CSS files for each different regions/ areas of the page. In addition to this, we have custom modules with their own CSS files. How would we go about taking this mass of CSS files &amp; distributing the code into responsive files in Adaptive Theme?
The more recent methods concerning responsive design is "mobile first". It's more time consuming to theme a desktop site and then bring it down it pieces to a mobile version, but some of this goes into the initial architecting as well. But, this is another topic.

You should keep your CSS as generic as possible at first, then drill down to specific items when you need to. Something you might want to look into is using a CSS preprocessor like LESS or SASS. On our projects (generally using LESS), we make CSS files for different regions of the site. Header, content, sidebar, footer, mobile, etc. and then compile them all into a few CSS files. In this screenshot, you can see the different sections broken up and they're all compiled into the global.css (the others are direct).