Tidy up responsive.less

I noticed during MDL-44074 that we define fifteen media queries in our responsive.less.

In the upstream project there are only three.

Some of these are just plain wrong, some are defining the default behaviour, and some are very filepicker specific and I can't help but feel that these are also wrong.

I'm creating this issue to sort out the various responsive sizes after MDL-44074 lands.

I would also suggest that, as part of this, we move things out into different less files just as the bootstrap project does. This will help reduce this kind of mess in the future and help make things easier to understand IMO.