moodle: how to change the column size in bootstrap theme 'clean'?

i'm trying to change the column size of the moodle theme 'clean' which is based on bootstrap. My Moodle uses a three column layout. The left and right columns are too wide and i'm want to make them more narrow, so that the column in the middle can be displayed wider. Moodle offers a textarea in the administration interface to add your own CSS code. I added the following code: .row-fluid .span9 { width: 80.0%; } .row-fluid .span8 { width: 80.0%; } .row-fluid .span3 { width: 15.0%; } .row-fluid .span4 { width: 15.0%; } It all looks good on desktop screen, but if i scale the browser window down to simulate a smartphone resolution it doesn't work. The left and right column move to the bottom like they should, but don't use the full width of the screen, but the 15% i defined in the settings. I guess i am using the wrong class and overwrite the size for desktop and mobile design. If anybody knows how to change the column size in the desktop version without overwriting it in the mobile version, that would be great !