Got it. Basically we're moving `['all']` to `['(min-width: 720px)']` in the array structure. When it's loaded back in *all* of the stylesheets are effectively now wrapped into a media query. function hook_preprocess_page(&$vars) { // get style sheet array $css = $vars['css']; // copy over the [all] to a media query key $css['(min-width: 720px)'] = $css['all']; // Remove the all unset($css['all']); $vars['styles'] = drupal_get_css($css); } This leaves us the ability to define other style sheets in `theme.info` for other breakpoints. stylesheets['(max-width: 480px)'][] = phone.css