/* ==========================================================================
	960 Grid (12 Columns)
========================================================================== */

.container				{ margin: 0 auto; padding: 0; position: relative; width: 960px; }
.column					{ float: left; display: inline; margin-left: 10px; margin-right: 10px; }

.alpha					{ margin-left: 0; }
.omega					{ margin-right: 0; }

.column-1				{ width: 60px;  }
.column-2				{ width: 140px; }
.column-3				{ width: 220px; }
.column-4				{ width: 300px; }
.column-5				{ width: 380px; }
.column-6				{ width: 460px; }
.column-7				{ width: 540px; }
.column-8				{ width: 620px; }
.column-9				{ width: 700px; }
.column-10				{ width: 780px; }
.column-11				{ width: 860px; }
.column-12				{ width: 940px; }
.column-one-third		{ width: 300px; }
.column-two-thirds		{ width: 620px; }

.offset-1				{ padding-left: 80px;  }
.offset-2				{ padding-left: 160px; }
.offset-3				{ padding-left: 240px; }
.offset-4				{ padding-left: 320px; }
.offset-5				{ padding-left: 400px; }
.offset-6				{ padding-left: 480px; }
.offset-7				{ padding-left: 560px; }
.offset-8				{ padding-left: 640px; }
.offset-9				{ padding-left: 720px; }
.offset-10				{ padding-left: 800px; }
.offset-11				{ padding-left: 880px; }


@media only screen and (min-width: 768px) and (max-width: 959px) {
	.container				{ width: 700px; }
	.column					{ margin-left: 10px; margin-right: 10px; }

	.alpha					{ margin-left: 0; margin-right: 10px; }
	.omega					{ margin-right: 0; margin-left: 10px; }
	.alpha.omega			{ margin-left: 0; margin-right: 0; }

	.column-1				{ width: 38px;  }
	.column-2				{ width: 96px;  }
	.column-3				{ width: 155px; }
	.column-4				{ width: 213px; }
	.column-5				{ width: 271px; }
	.column-6				{ width: 330px; }
	.column-7				{ width: 388px; }
	.column-8				{ width: 446px; }
	.column-9				{ width: 505px; }
	.column-10				{ width: 563px; }
	.column-11				{ width: 621px; }
	.column-12				{ width: 680px; }
	.column-one-third		{ width: 233px; }
	.column-two-thirds		{ width: 466px; }

	.offset-1				{ padding-left: 58px;  }
	.offset-2				{ padding-left: 116px; }
	.offset-3				{ padding-left: 175px; }
	.offset-4				{ padding-left: 233px; }
	.offset-5				{ padding-left: 291px; }
	.offset-6				{ padding-left: 350px; }
	.offset-7				{ padding-left: 408px; }
	.offset-8				{ padding-left: 466px; }
	.offset-9				{ padding-left: 525px; }
	.offset-10				{ padding-left: 583px; }
	.offset-11				{ padding-left: 641px; }
  
}

@media only screen and (max-width: 767px) {
	.container				{ width: 300px; }
	.column					{ margin: 0; }

	.column-1,
	.column-2,
	.column-3,
	.column-4,
	.column-5,
	.column-6,
	.column-7,
	.column-8,
	.column-9,
	.column-10,
	.column-11,
	.column-12,
	.column-one-third,
	.column-two-thirds		{ width: 300px; }

	.offset-1,
	.offset-2,
	.offset-3,
	.offset-4,
	.offset-5,
	.offset-6,
	.offset-7,
	.offset-8,
	.offset-9,
	.offset-10,
	.offset-11				{ padding-left: 0; }
}

@media only screen and (min-width: 480px) and (max-width: 767px) {
	.container				{ width: 420px; }

	.column-1,
	.column-2,
	.column-3,
	.column-4,
	.column-5,
	.column-6,
	.column-7,
	.column-8,
	.column-9,
	.column-10,
	.column-11,
	.column-12,
	.column-one-third,
	.column-two-thirds		{ width: 420px; }
}