/* Table of Contents:
 1. Tablet landscape
 2. Tablet portrait
 3. Mobile
*/



/*==========================================================================
1. Tablet landscape
===========================================================================*/

@media (max-width: 1250px) {
	.container-12 {width: 960px;}

	.grid-1,
	.grid-2,
	.grid-3,
	.grid-4,
	.grid-5,
	.grid-6,
	.grid-7,
	.grid-8,
	.grid-9,
	.grid-10,
	.grid-11,
	.grid-12 {
		margin-left: 10px;
		margin-right: 10px;
	}

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


	/* Prefix Styles
	===========================================================================*/

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


	/* Suffix Styles
	===========================================================================*/

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



/*==========================================================================
2. Tablet portrait
===========================================================================*/
/* Note: Design for a width of 768px */

@media (max-width: 995px) {
	.container-12 {width: 768px;}

	.container-12 .grid-1 {width: 44px;}
	.container-12 .grid-2 {width: 108px;}
	.container-12 .grid-3 {width: 172px;}
	.container-12 .grid-4 {width: 236px;}
	.container-12 .grid-5 {width: 300px;}
	.container-12 .grid-6 {width: 364px;}
	.container-12 .grid-7 {width: 428px;}
	.container-12 .grid-8 {width: 492px;}
	.container-12 .grid-9 {width: 556px;}
	.container-12 .grid-10 {width: 620px;}
	.container-12 .grid-11 {width: 684px;}
	.container-12 .grid-12 {width: 748px;}


	/* Prefix Styles
	===========================================================================*/

	.container-12 .prefix-1 {padding-left: 64px;}
	.container-12 .prefix-2 {padding-left: 128px;}
	.container-12 .prefix-3 {padding-left: 192px;}
	.container-12 .prefix-4 {padding-left: 256px;}
	.container-12 .prefix-5 {padding-left: 320px;}
	.container-12 .prefix-6 {padding-left: 384px;}
	.container-12 .prefix-7 {padding-left: 448px;}
	.container-12 .prefix-8 {padding-left: 512px;}
	.container-12 .prefix-9 {padding-left: 576px;}
	.container-12 .prefix-10 {padding-left: 640px;}
	.container-12 .prefix-11 {padding-left: 704px;}


	/* Suffix Styles
	===========================================================================*/

	.container-12 .suffix-1 {padding-right: 64px;}
	.container-12 .suffix-2 {padding-right: 128px;}
	.container-12 .suffix-3 {padding-right: 192px;}
	.container-12 .suffix-4 {padding-right: 256px;}
	.container-12 .suffix-5 {padding-right: 320px;}
	.container-12 .suffix-6 {padding-right: 384px;}
	.container-12 .suffix-7 {padding-right: 448px;}
	.container-12 .suffix-8 {padding-right: 512px;}
	.container-12 .suffix-9 {padding-right: 576px;}
	.container-12 .suffix-10 {padding-right: 640px;}
	.container-12 .suffix-11 {padding-right: 704px;}
}



/*==========================================================================
1. Mobile
===========================================================================*/
/* Note: Design for a width of 480px */

@media (max-width: 767px) {
	.container-12 {
		padding: 0 15px;
		width: auto;
	}

	.container-12 [class*="grid-"] {
		display: block;
		float: none;
		margin: 0 0 30px;
		width: auto;
	}

	.grid-12,
	.omega {
		margin-bottom: 0 !important;
	}


	/* Prefix and suffix styles
	===========================================================================*/

	.container-12 [class*="prefix-"] {padding-left: 0;}
	.container-12 [class*="suffix-"] {padding-right: 0;}
}