This is all part of the Bootstrap, which is implemented in J3 and our new Gantry.
In the Bootstrap documentation they do not recommend creating completely different content for each device size using the classes. The main benefit of responsive designs is that you don't have to do that. The classes are meant to resize the existing content, not load three different versions and show only one. Which class is used comes from the media query based on the screen size.When to use (Responsive Utility Classes):
Use on a limited basis and avoid creating entirely different versions of the same site. Instead, use them to complement each device's presentation.
Use media queries responsibly and only as a start to your mobile audiences. For larger projects, do consider dedicated code bases and not layers of media queries.
twitter.github.com/bootstrap/scaffolding.html