/* Container
================================================== */
	
	.container                                  { position: relative; max-width: 940px; margin: 0 auto; padding: 0 20px;}
	.container .column,
	.container .columns                         { position: relative; margin-right: 4%; }
	.row                                        { margin-bottom: 20px}
	.last										{ margin-right:0 !important; clear:right; }
	.left										{ float: left;}
	.right										{ float: right;}
	.textleft 									{ text-align: left; }
	.textright									{ text-align: right; }
	.textcenter									{ text-align: center; }
	.alignleft 									{ margin: 0 15px 10px 0; float: left;}
	.alignright 								{ margin: 0 0 10px 15px; float: right;}

	img											{ max-width: 100%;}

/* Fluid Grid
================================================== */
 	
 	.whole										{ wid th: 100%; margin-right: 0 !important;}
	.one_half									{ width:48%; }
	.one_third									{ width:30.66%; }
	.two_third									{ width:65.33%; }
	.one_quarter								{ width:22%; }
	.three_quarter								{ width:74%; }
	.one_fifth									{ width:16.8%; }
	.two_fifth									{ width:37.6%; }
	.three_fifth								{ width:58.4%; }
	.four_fifth									{ width:79.2%; }
	.one_sixth									{ width:13.33%; }
	.five_sixth									{ width:82.67%; }


/* Media Queries
================================================== */

	@media only screen and (min-widthL 480px) and (max-width: 939px) {
	
		.container .column,	.container .column { margin-right: 0 !important; }
		.three_quarter,.one_quarter,.one_fifth,.two_fifth,.three_fifth,.four_fifth,.one_sixth,.five_sixth { width: 100%; margin-bottom: 20px;} 
		.left, .right {float: none;}
		.alignleft, .alignright {margin: 0;}
	
	}
	
	
	@media only screen and (max-width: 679px) {
		.one_half,.one_third,.two_third,.three_quarter,.one_quarter,.one_fifth,.two_fifth,.three_fifth,.four_fifth,.one_sixth,.five_sixth { width: 100%; margin-bottom: 20px;} 
		.alignleft, .alignright {text-align: left;}
	}



/* Hide on phones
================================================== */
 
	.show-on-phones { display: none !important; }
	.show-on-iphones { display: none !important; }	
	.show-on-tablets { display: none !important; }
	.show-on-desktops { display: block; }
	
	.hide-on-phones { display: block !important; }
	.hide-on-iphones { display: block !important; }	
	.hide-on-tablets { display: block !important; }
	.hide-on-desktops { display: none; }
	
	
	@media only screen and (max-device-width: 800px), only screen and (device-width: 1024px) and (device-height: 600px), only screen and (width: 1280px) and (orientation: landscape), only screen and (device-width: 800px) {
		.hide-on-phones { display: block !important; }
		.hide-on-tablets { display: none !important; }
		.hide-on-desktops { display: block !important; }
		
		.show-on-phones { display: none !important; }
		.show-on-tablets { display: block !important; }
		.show-on-desktops { display: none !important; }
	}
	
		
	@media only screen and (max-width: 479px) {
		.hide-on-phones { display: none !important; }
		.hide-on-tablets { display: block !important; }
		.hide-on-desktops { display: block !important; }
		
		.show-on-phones { display: block !important; }
		.show-on-tablets { display: none !important; }
		.show-on-desktops { display: none !important; }
		
	}
	
	@media only screen and (max-width: 320px) {
		.hide-on-iphones { display: none !important; }
		.show-on-iphones { display: block !important; }
	}




/* Clearing
 ----------------------------------------------------- */
 
	/* Self Clearing Goodness */
	.container:after { content: "\0020"; display: block; height: 0; clear: both; visibility: hidden; }
	
	/* Use clearfix class on parent to clear nested columns,
	or wrap each row of columns in a <div class="row"> */
	.clearfix:before,
	.clearfix:after,
	.row:before,
	.row:after {
	  content: '\0020';
	  display: block;
	  overflow: hidden;
	  visibility: hidden;
	  width: 0;
	  height: 0; }
	.row:after,
	.clearfix:after {
	  clear: both; }
	.row,
	.clearfix {
	  zoom: 1; }
	
	/* You can also use a <br class="clear" /> to clear columns */
	.clear {
	  clear: both;
	  display: block;
	  overflow: hidden;
	  visibility: hidden;
	  width: 0;
	  height: 0;
	}