/* ==================================================================================================================== */
/* ! The 1140px Grid V2 by Andy Taylor \ http://cssgrid.net \ http://www.twitter.com/andytlr \ http://www.andytlr.com   */
/* ==================================================================================================================== */
.fixed-width {max-width: 960px; margin: 0 auto; position: relative; }

.container {padding-left: 20px; padding-right: 20px; position: relative; }

.row {width: 100%; max-width: 1140px; min-width: 755px; margin: 0 auto; overflow: hidden;}

.onecol, .twocol, .threecol, .fourcol, .fivecol, .sixcol, .sevencol, .eightcol, .ninecol, .tencol, .elevencol {margin-right: 3.8%;float: left;min-height: 1px;}

.row .onecol {width: 4.85%;}

.row .twocol {width: 13.45%;}

.row .threecol {width: 22.05%;}

.row .fourcol {width: 30.75%;}

.row .fivecol {width: 39.45%;}

.row .sixcol {width: 48%;}

.row .sevencol {width: 56.75%;}

.row .eightcol {width: 65.4%;}

.row .ninecol {width: 74.05%;}

.row .tencol {width: 82.7%;}

.row .elevencol {width: 91.35%;}

.row .twelvecol {width: 100%; float: left;}

.last {margin-right: 0px;}

img, object, embed, iframe {max-width: 100%;}

img {height: auto;}
	
	
	
/* #Tablet (Portrait)
================================================== */	

	/* Note: Design for a width of 768px */

	@media only screen and (min-width: 768px) and (max-width: 959px) {



		body {
		-webkit-text-size-adjust: none;
		}
		
		.row, body, .container, #fixed-width {
		width: 100%;
		min-width: 0;
		margin-left: 0px;
		margin-right: 0px;
		padding-left: 0px;
		padding-right: 0px;
		}
		
		.row .onecol, .row .twocol, .row .threecol, .row .fourcol, .row .fivecol, .row .sixcol, .row .sevencol, .row .eightcol, .row .ninecol, .row .tencol, .row .elevencol, .row .twelvecol, .row .half.full {
		width: auto;
		float: none;
		margin-left: 0px;
		margin-right: 0px;
		padding-left: 20px;
		padding-right: 20px;
		}
		


		.row .half {
			width: 45.5%;
			float: left;min-height: 1px;
			padding-left: 2%;
			padding-right: 2%;
			margin-left: auto;
			margin-right: auto;
		}
		

	}
	
	
/*	#Mobile (Portrait) 
================================================== */
	
	/* Note: Design for a width of 320px */
	
	@media only screen and (max-width: 767px) {

		
		body {
		font-size: 16px;
		-webkit-text-size-adjust: none;
		color: purple;
		font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
		}
		
		.row, body, .container, #fixed-width {
		width: 100%;
		min-width: 0;
		margin-left: 0px;
		margin-right: 0px;
		padding-left: 0px;
		padding-right: 0px;
		}
		
		.row .onecol, .row .twocol, .row .threecol, .row .fourcol, .row .fivecol, .row .sixcol, .row .sevencol, .row .eightcol, .row .ninecol, .row .tencol, .row .elevencol, .row .twelvecol {
		width: auto;
		float: none;
		margin-left: 0px;
		margin-right: 0px;
		padding-left: 20px;
		padding-right: 20px;
		}
		



	}	 
	
	
/* #Mobile (Landscape)
================================================== */

	/* Note: Design for a width of 480px */
	
	@media only screen and (min-width: 480px) and (max-width: 767px) {


		body {
		font-size: 16px;
		-webkit-text-size-adjust: none;
		color: #888;
		}
		
		
		.row, body, .container {
		width: 100%;
		min-width: 0;
		margin-left: 0px;
		margin-right: 0px;
		padding-left: 0px;
		padding-right: 0px;
		}
		
		.row .onecol, .row .twocol, .row .threecol, .row .fourcol, .row .fivecol, .row .sixcol, .row .sevencol, .row .eightcol, .row .ninecol, .row .tencol, .row .elevencol, .row .twelvecol {
		width: auto;
		float: none;
		margin-left: 0px;
		margin-right: 0px;
		padding-left: 20px;
		padding-right: 20px;
		}
		


		
	}
	 
	
/* #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;
	}