/*================================================================
                 Fluid Grid Styles 
================================================================*/

.container {
	position:relative;
	margin:0px auto;
	padding:0px;
	min-width:16em;
	max-width:1200px;
	-webkit-transition: all .1s linear;
	   -moz-transition: all .1s linear;
	    -ms-transition: all .1s linear; 
	     -o-transition: all .1s linear;
	        transition: all .1s linear;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

/* ## Embedded clearfix on container ## */
.container:before, .container:after {content: " "; display: table;}
.container:after {clear: both;}
.container {*zoom: 1;}


/* ## Setup for Padding ## */
.container [class*="grid_"] {
	padding:0 10px; 	
	-webkit-transition: all .2s linear;
	   -moz-transition: all .2s linear;
	    -ms-transition: all .2s linear; 
	     -o-transition: all .2s linear;
	        transition: all .2s linear;
	-webkit-box-sizing: border-box;
	   -moz-box-sizing: border-box;
	        box-sizing: border-box;
}

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


header .container .grid_1  {width:8.333% !important; padding:0 !important;}
header .container .grid_2  {width:16.666% !important; padding:0 !important;}
header .container .grid_3  {width:25% !important; padding:0 !important;}
header .container .grid_4  {width:33.333% !important; padding:0 !important;}
header .container .grid_5  {width:41.666% !important; padding:0 !important;}
header .container .grid_6  {width:50% !important; padding:0 !important;}
header .container .grid_7  {width:58.333% !important; padding:0 !important;}
header .container .grid_8  {width:66.666% !important; padding:0 !important;}
header .container .grid_9  {width:75% !important; padding:0 !important;}
header .container .grid_10 {width:83.333% !important; padding:0 !important;}
header .container .grid_11 {width:91.666% !important; padding:0 !important;}
header .container .grid_12 {width:100% !important; padding:0 !important;}


/* ## 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;
	}
		
	[class*="grid_"] [class*="grid_"] {padding:0;}
	.alpha {padding:0;}
	.omega {padding:0;}
		
	.s_1half > [class*="grid_"] {width:50%; padding:0 10px;}
	.s_1half > .alpha {padding:0 10px 0 0;}
	.s_1half > .omega {padding:0 0 0 10px;}

    /* show & hide base helpers */
    .s_showInline {display:inline !important; visibility:visible !important;}
    .s_showBlock {display:block !important; visibility:visible !important;}
    .s_hide {display:none !important; visibility:hidden !important;}
}


/* ## 16px baseline (480px - 767px) sw = small wide ## */
@media only screen and (min-width:30em){
	[class*="grid_"] [class*="grid_"] {padding:0 10px;}
	
	.alpha {padding:0;}
	.omega {padding:0;}
	
	.container .alpha {padding-left:0;}
	.container .omega {padding-right:0;}
			
	[class*="grid_"] .grid_1  {width:8.333%;}
	[class*="grid_"] .grid_2  {width:16.666%;}
	[class*="grid_"] .grid_3  {width:25%;}
	[class*="grid_"] .grid_4  {width:33.333%;}
	[class*="grid_"] .grid_5  {width:41.666%;}
	[class*="grid_"] .grid_6  {width:50%;}
	[class*="grid_"] .grid_7  {width:58.333%;}
	[class*="grid_"] .grid_8  {width:66.666%;}
	[class*="grid_"] .grid_9  {width:75%;}
	[class*="grid_"] .grid_10 {width:83.333%;}
	[class*="grid_"] .grid_11 {width:91.666%;}
	[class*="grid_"] .grid_12 {width:100%;}
	
	.sw_1half > [class*="grid_"] {width:50%;}
	.sw_1half > [class*="push_"] {left:50%;}
	.sw_1half > [class*="pull_"] {left:-50%;}
	.sw_1half > [class*="grid_"] .alpha {padding:0 10px 0 0;}
	.sw_1half > [class*="grid_"] .omega {padding:0 0 0 10px;}
	
	.sw_1third > [class*="grid_"] {width:33.333%;}
	.sw_1third > [class*="push_"] {left:33.333%;}
	.sw_1third > [class*="pull_"] {left:-33.333%;}
	.sw_1third > [class*="grid_"] .alpha {padding:0 10px 0 0;}
	.sw_1third > [class*="grid_"] .omega {padding:0 0 0 10px;}
	
	.sw_stack > [class*="grid_"] {width:100%;}
	.sw_stack > .alpha, .sw_stack > .omega {padding:0;}

    /* show & hide base helpers */
    .sw_showInline {display:inline !important; visibility:visible !important;}
    .sw_showBlock {display:block !important; visibility:visible !important;}
    .sw_hide {display:none !important; visibility:hidden !important;}
}


/* ## 16px baseline (768px) m = medium ## */
@media only screen and (min-width:48em){
	[class*="grid_"] [class*="grid_"] {padding:0 10px;}
	
	.container .alpha {padding-left:0;}
	.container .omega {padding-right:0;}

	.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%;}
	
	.container .prefix_1  {margin-left:8.333%;}
	.container .prefix_2  {margin-left:16.666%;}
	.container .prefix_3  {margin-left:25%;}
	.container .prefix_4  {margin-left:33.333%;}
	.container .prefix_5  {margin-left:41.666%;}
	.container .prefix_6  {margin-left:50%;}
	.container .prefix_7  {margin-left:58.333%;}
	.container .prefix_8  {margin-left:66.666%;}
	.container .prefix_9  {margin-left:75%;}
	.container .prefix_10 {margin-left:83.333%;}
	.container .prefix_11 {margin-left:91.666%;}
	.container .prefix_12 {margin-left:100%;}

	.container .suffix_1  {margin-right:8.333%;}
	.container .suffix_2  {margin-right:16.666%;}
	.container .suffix_3  {margin-right:25%;}
	.container .suffix_4  {margin-right:33.333%;}
	.container .suffix_5  {margin-right:41.666%;}
	.container .suffix_6  {margin-right:50%;}
	.container .suffix_7  {margin-right:58.333%;}
	.container .suffix_8  {margin-right:66.666%;}
	.container .suffix_9  {margin-right:75%;}
	.container .suffix_10 {margin-right:83.333%;}
	.container .suffix_11 {margin-right:91.666%;}
	.container .suffix_12 {margin-right:100%;}
}


/* ## 16px baseline (768px - 959px) m = medium ## */ 
@media only screen and (min-width:48em) and (max-width:59.938em){
	.m_1half > [class*="grid_"] {width:50%;}
	.m_1half > [class*="push_"] {left:50%;}
	.m_1half > [class*="pull_"] {left:-50%;}
	.m_1half > [class*="prefix_"] {margin-left:0;}
	.m_1half > [class*="suffix_"] {margin-right:0;}
	
	.m_1third > [class*="grid_"] {width:33.333%;}
	.m_1third > [class*="push_"] {left:33.333%;}
	.m_1third > [class*="pull_"] {left:-33.333%;}
	
	.m_1fourth > [class*="grid_"] {width:25%;}
	.m_1fourth > [class*="push_"] {left:25%;}
	.m_1fourth > [class*="pull_"] {left:-25%;}
	
	.m_2thirds_left > [class*="grid_"] {width:50%;}
	.m_2thirds_left > [class*="grid_"]:nth-child(2n)    {width:33.333%;}
	.m_2thirds_left > [class*="grid_"]:nth-child(2n+1) {width:66.666%;}
	.m_2thirds_left > [class*="push_"] {left:0;}
	.m_2thirds_left > [class*="pull_"] {left:0;}
	.m_2thirds_left > [class*="prefix_"] {margin-left:0;}
	.m_2thirds_left > [class*="suffix_"] {margin-right:0;}
	
	.m_2thirds_right > [class*="grid_"] {width:50%;}
	.m_2thirds_right > [class*="grid_"]:nth-child(2n)   {width:66.666%;}
	.m_2thirds_right > [class*="grid_"]:nth-child(2n+1) {width:33.333%;}
	.m_2thirds_right > [class*="push_"] {left:0;}
	.m_2thirds_right > [class*="pull_"] {left:0;}	
	.m_2thirds_right > [class*="prefix_"] {margin-left:0;}
	.m_2thirds_right > [class*="suffix_"] {margin-right:0;}
	
	.m_stack > [class*="grid_"] {width:100%;}
	.m_stack > .alpha, .m_stack > .omega {padding:0;}
	
    /* show & hide base helpers */
    .m_showInline {display:inline !important; visibility:visible !important;}
    .m_showBlock {display:block !important; visibility:visible !important;}
    .m_hide {display:none !important; visibility:hidden !important;}
}


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

    /* show & hide base helpers */
    .mw_showInline {display:inline !important; visibility:visible !important;}
    .mw_showBlock {display:block !important; visibility:visible !important;}
    .mw_hide {display:none !important; visibility:hidden !important;}

}


/* ## 16px baseline (1140px +) l = large ## */
@media only screen and (min-width:72em) {

    /* show & hide base helpers */
    .l_showInline {display:inline !important; visibility:visible !important;}
    .l_showBlock {display:block !important; visibility:visible !important;}
    .l_hide {display:none !important; visibility:hidden !important;}

}
