/*================================================================
					FLUID GRID STYLES
================================================================*/
.container {
	position: relative;
	margin: 0 auto;
	padding: 0;
	min-width: 16em;
	max-width: 60em;
	-webkit-transition: all 0.1s linear;
	   -moz-transition: all 0.1s linear;
		-ms-transition: all 0.1s linear;
		 -o-transition: all 0.1s linear;
			transition: all 0.1s linear;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
			box-sizing: border-box;
}

.container [class*="grid_"] {
	padding: 0 10px;
}

.lt-ie8 .container [class*="grid_"] {
	width: 98%;
	padding: 0 1%;
}

.gutterless {
	padding: 0 10px;
}

.gutterless > [class*="grid_"] {
	padding: 0;
}

.container .alpha {
	padding-left: 0;
}

.container .omega {
	padding-right: 0;
}

.container .padless {
	padding: 0;
}

/* 16px baseline (256px) s = small */
@media only screen and (min-width:16em) {
	.container [class*="grid_"] {
		position: relative;
		float: left;
		width: 100%;
		-webkit-box-sizing: border-box;
		   -moz-box-sizing: border-box;
				box-sizing: border-box;
	}
	.s-1half > [class*="grid_"] {
		width: 50%;
	}
}

/* 16px baseline (420px+) s-w = small wide [Usually ends around 767px] */
@media only screen and (min-width:30em) and (max-width:47.99em) {
	.sw_1half > [class*="grid_"] { width: 50%; }
	.sw_1half > [class*="push_"] { left: 50%; }
	.sw_1half > [class*="pull_"] { left: -50%; }

	.sw_1third > [class*="grid_"] { width: 33.333%; }
	.sw_1third > [class*="push_"] { left: 33.333%; }
	.sw_1third > [class*="pull_"] { left: -33.333%; }

	.sw-3fourths-left  > [class*="grid_"] { width: 50%; }
	.sw-3fourths-left  > [class*="grid_"]:nth-child(2n) { width: 25%; }
	.sw-3fourths-left  > [class*="grid_"]:nth-child(2n+1) { width: 75%; }

	.sw-3fourths-right  > [class*="grid_"] { width: 50%; }
	.sw-3fourths-right  > [class*="grid_"]:nth-child(2n) { width: 75%; }
	.sw-3fourths-right  > [class*="grid_"]:nth-child(2n+1) { width: 25%; }
}

/* 16px baseline (768px+) m = medium [start caring about grid now] */
@media only screen and (min-width:48em) {
	.container .grid_1  { width: 8.333%; }
	.container .grid_2  { width: 16.666%; }
	.container .grid_3  { width: 25%; }
	.container .grid_4  { width: 33.333%; }
	.container .grid_5  { width: 41.666%; }
	.container .grid_6  { width: 50%; }
	.container .grid_7  { width: 58.333%; }
	.container .grid_8  { width: 66.666%; }
	.container .grid_9  { width: 75%; }
	.container .grid_10 { width: 83.333%; }
	.container .grid_11 { width: 91.666%; }
	.container .grid_12 { width: 100%; }

	.container .push_1  { left: 8.333%; }
	.container .push_2  { left: 16.666%; }
	.container .push_3  { left: 25%; }
	.container .push_4  { left: 33.333%; }
	.container .push_5  { left: 41.666%; }
	.container .push_6  { left: 50%; }
	.container .push_7  { left: 58.333%; }
	.container .push_8  { left: 66.666%; }
	.container .push_9  { left: 75%; }
	.container .push_10 { left: 83.333%; }
	.container .push_11 { left: 91.666%; }
	.container .push_12 { left: 100%; }

	.container .pull_1  { left: -8.333%; }
	.container .pull_2  { left: -16.666%; }
	.container .pull_3  { left: -25%; }
	.container .pull_4  { left: -33.333%; }
	.container .pull_5  { left: -41.666%; }
	.container .pull_6  { left: -50%; }
	.container .pull_7  { left: -58.333%; }
	.container .pull_8  { left: -66.666%; }
	.container .pull_9  { left: -75%; }
	.container .pull_10 { left: -83.333%; }
	.container .pull_11 { left: -91.666%; }
	.container .pull_12 { left: -100%; }

	.lt-ie8 .container [class*="grid_"] { padding: 0 1%; }
	.lt-ie8 .container .grid_1  { width: 6%; }
	.lt-ie8 .container .grid_2  { width: 14%; }
	.lt-ie8 .container .grid_3  { width: 23%; }
	.lt-ie8 .container .grid_4  { width: 30%; }
	.lt-ie8 .container .grid_5  { width: 39%; }
	.lt-ie8 .container .grid_6  { width: 48%; }
	.lt-ie8 .container .grid_7  { width: 56%; }
	.lt-ie8 .container .grid_8  { width: 64%; }
	.lt-ie8 .container .grid_9  { width: 73%; }
	.lt-ie8 .container .grid_10 { width: 81%; }
	.lt-ie8 .container .grid_11 { width: 89%; }
	.lt-ie8 .container .grid_12 { width: 98%; }

}

/* 16px baseline (768px - 959px) m = medium */
@media only screen and (min-width:48em) and (max-width:59.99em){
	.m-1half > .grid_col { width: 50%; }
	.m-1third > .grid_col { width: 33.333%; }
	.m-1fourth > .grid_col { width: 25%; }

	.m-2thirds-left > [class*="grid_"] { width: 50%; }
	.m-2thirds-left > [class*="grid_"]:nth-child(2n) { width: 33.33%; }
	.m-2thirds-left > [class*="grid_"]:nth-child(2n+1) { width: 66.66%; }

	.m-2thirds-right > [class*="grid_"] { width: 50%; }
	.m-2thirds-right > [class*="grid_"]:nth-child(2n) { width: 66.66%; }
	.m-2thirds-right > [class*="grid_"]:nth-child(2n+1) { width: 33.33%; }

	.m-3fourths-left > [class*="grid_"] { width:50%; }
	.m-3fourths-left > [class*="grid_"]:nth-child(2n) { width: 25%; }
	.m-3fourths-left > [class*="grid_"]:nth-child(2n+1) { width: 75%; }

	.m-3fourths-right > [class*="grid_"] { width: 50%; }
	.m-3fourths-right > [class*="grid_"]:nth-child(2n) { width: 75%; }
	.m-3fourths-right > [class*="grid_"]:nth-child(2n+1) { width: 25%; }
}

/* 16px baseline (960px - 1139px) m-w = medium wide*/
@media only screen and (min-width:60em) and (max-width:61.49em) {

}

/* 16px baseline (1140px) l = large */
@media only screen and (min-width:61.5em) {
	.container { max-width: 64em; }
}