.container { margin: 20px; width: auto;}

/* For modern browsers (already included in Bootstrap.css)
.container:before, .container:after { content:""; display:table; }
.container:after { clear:both; }
.container { zoom:1; } /* For IE 6/7 (trigger hasLayout) */


.superflous { display: none; }

/* iPhone landscape & large mobile devices (480px+) */
@media only screen and (min-width: 480px)
{
	.first, .full { clear: left; }
	.forth { width: 46%; display: inline; float: left; margin: 2%; }
}

/* Tablets/netbooks (768px+) */
@media only screen and (min-width: 700px)
{
	.superflous { display: block; }
	.container { margin: 0 auto; width: 720px; }
	.third, .twothirds, .forth, .half, .threeforths, .full { display: inline; float: left; margin: 0 0 0 24px; }
	.first, .full { margin: 0;}

	.forth		{ width: 162px; }
	.third		{ width: 224px; }
	.half		{ width: 348px; }
	.twothirds	{ width: 472px; }
	.threeforths{ width: 534px; }
	.full		{ width: 720px; }
}

/* Desktops (1024px+) */
@media only screen and (min-width: 1024px)
{
	.container { width: 960px; }

	.forth		{ width: 222px; }
	.third		{ width: 304px; }
	.half		{ width: 468px; }
	.twothirds	{ width: 632px; }
	.threeforths{ width: 714px; }
	.full		{ width: 960px; }
}