/* 
* Based on Skeleton V1.0.2
* Copyright 2011, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 5/20/2011
*/


/* Table of Contents
==================================================
	#Base 960 Grid    
	#Tablet (Portrait)
	#Mobile (Portrait) 
	#Mobile (Landscape)
	#Clearing */
	
/* #Base 960 Grid 
================================================== */

	.container { position: relative; width: 960px; margin: 0 auto; padding: 0;}
	.column, .columns { float: left; display: inline; margin-left: 10px; margin-right: 10px; }
	.row { margin-bottom: 20px;}

/* =Grid >> Global
--------------------------------------------------------------------------------*/
.onecol,
.twocol,
.threecol,
.fourcol,
.fivecol,
.sixcol,
.sevencol,
.eightcol,
.ninecol,
.tencol,
.elevencol,
.twelvecol {
	display: inline;
	float: left;
	margin-left: 20px;
	margin-right: 20px;  }

.push_onecol, .pull_onecol,
.push_twocol, .pull_twocol,
.push_threecol, .pull_threecol,
.push_fourcol, .pull_fourcol,
.push_fivecol, .pull_fivecol,
.push_sixcol, .pull_sixcol,
.push_sevencol, .pull_sevencol,
.push_eightcol, .pull_eightcol,
.push_ninecol, .pull_ninecol,
.push_tencol, .pull_tencol,
.push_elevencol, .pull_elevencol {
	position: relative;  }

/* =Grid >> Children (Alpha ~ First, Omega ~ Last)
--------------------------------------------------------------------------------*/
.alpha {margin-left: 0;}
.omega {margin-right: 0;}

/* =Grid >> 12 Columns
--------------------------------------------------------------------------------*/
.container .onecol 		{width: 40px;}
.container .twocol 		{width: 120px;}
.container .threecol 	{width: 200px;}
.container .fourcol 	{width: 280px;}
.container .fivecol 	{width: 360px;}
.container .sixcol 		{width: 440px;}
.container .sevencol 	{width: 520px;}
.container .eightcol 	{width: 600px;}
.container .ninecol 	{width: 680px;}
.container .tencol 		{width: 760px;}
.container .elevencol 	{width: 840px;}
.container .twelvecol 	{width: 920px;}

/* =Prefix Extra Space >> 12 Columns
--------------------------------------------------------------------------------*/
.container .prefix_onecol {padding-left: 80px;}
.container .prefix_twocol {padding-left: 160px;}
.container .prefix_threecol {padding-left: 240px;}
.container .prefix_fourcol {padding-left: 320px;}
.container .prefix_fivecol {padding-left: 400px;}
.container .prefix_sixcol {padding-left: 480px;}
.container .prefix_sevencol {padding-left: 560px;}
.container .prefix_eightcol {padding-left: 640px;}
.container .prefix_ninecol {padding-left: 720px;}
.container .prefix_tencol {padding-left: 800px;}
.container .prefix_elevencol {padding-left: 880px;}

/* =Suffix Extra Space >> 12 Columns
--------------------------------------------------------------------------------*/
.container .suffix_onecol {padding-right: 80px;}
.container .suffix_twocol {padding-right: 160px;}
.container .suffix_threecol {padding-right: 240px;}
.container .suffix_fourcol {padding-right: 320px;}
.container .suffix_fivecol {padding-right: 400px;}
.container .suffix_sixcol {padding-right: 480px;}
.container .suffix_sevencol{padding-right: 560px;}
.container .suffix_eightcol {padding-right: 640px;}
.container .suffix_ninecol {padding-right: 720px;}
.container .suffix_tencol {padding-right: 800px;}
.container .suffix_elevencol {padding-right: 880px;}

/* `Push Space >> 12 Columns
--------------------------------------------------------------------------------*/
.container .push_onecol {left: 80px;}
.container .push_twocol {left: 160px;}
.container .push_threecol {left: 240px;}
.container .push_fourcol {left: 320px;}
.container .push_fivecol {left: 400px;}
.container .push_sixcol {left: 480px;}
.container .push_sevencol {left: 560px;}
.container .push_eightcol {left: 640px;}
.container .push_ninecol {left: 720px;}
.container .push_tencol {left: 800px;}
.container .push_elevencol {left: 880px;}

/* `Pull Space >> 12 Columns
--------------------------------------------------------------------------------*/
.container .pull_onecol {left: -80px;}
.container .pull_twocol {left: -160px;}
.container .pull_threecol {left: -240px;}
.container .pull_fourcol {left: -320px;}
.container .pull_fivecol {left: -400px;}
.container .pull_sixcol {left: -480px;}
.container .pull_sevencol {left: -560px;}
.container .pull_eightcol {left: -640px;}
.container .pull_ninecol {left: -720px;}
.container .pull_tencol {left: -800px;}
.container .pull_elevencol {left: -880px;}


	
	
/* #Tablet (Portrait)
================================================== */	

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

	@media only screen and (min-width: 768px) and (max-width: 959px) {
	.container  {
	margin-left: auto;
	margin-right: auto;
	width: 768px;  }

/* =Grid >> Global
--------------------------------------------------------------------------------*/
.onecol,
.twocol,
.threecol,
.fourcol,
.fivecol,
.sixcol,
.sevencol,
.eightcol,
.ninecol,
.tencol,
.elevencol,
.twelvecol {
	display: inline;
	float: left;
	margin-left: 14px;
	margin-right: 14px;  }

.push_onecol, .pull_onecol,
.push_twocol, .pull_twocol,
.push_threecol, .pull_threecol,
.push_fourcol, .pull_fourcol,
.push_fivecol, .pull_fivecol,
.push_sixcol, .pull_sixcol,
.push_sevencol, .pull_sevencol,
.push_eightcol, .pull_eightcol,
.push_ninecol, .pull_ninecol,
.push_tencol, .pull_tencol,
.push_elevencol, .pull_elevencol {
	position: relative;  }

/* =Grid >> Children (Alpha ~ First, Omega ~ Last)
--------------------------------------------------------------------------------*/
.alpha {margin-left: 0;}
.omega {margin-right: 0;}

/* =Grid >> 12 Columns
--------------------------------------------------------------------------------*/
.container .onecol {width: 36px;}
.container .twocol {width: 100px;}
.container .threecol {width: 164px;}
.container .fourcol {width: 228px;}
.container .fivecol {width: 292px;}
.container .sixcol {width: 356px;}
.container .sevencol {width: 420px;}
.container .eightcol {width: 484px;}
.container .ninecol {width: 548px;}
.container .tencol {width: 612px;}
.container .elevencol {width: 676px;}
.container .twelvecol {width: 740px;}

/* =Prefix Extra Space >> 12 Columns
--------------------------------------------------------------------------------*/
.container .prefix_onecol {padding-left: 64px;}
.container .prefix_twocol {padding-left: 128px;}
.container .prefix_threecol {padding-left: 192px;}
.container .prefix_fourcol {padding-left: 256px;}
.container .prefix_fivecol {padding-left: 320px;}
.container .prefix_sixcol {padding-left: 384px;}
.container .prefix_sevencol {padding-left: 448px;}
.container .prefix_eightcol {padding-left: 512px;}
.container .prefix_ninecol {padding-left: 576px;}
.container .prefix_tencol {padding-left: 640px;}
.container .prefix_elevencol {padding-left: 704px;}

/* =Suffix Extra Space >> 12 Columns
--------------------------------------------------------------------------------*/
.container .suffix_onecol {padding-right: 64px;}
.container .suffix_twocol {padding-right: 128px;}
.container .suffix_threecol {padding-right: 192px;}
.container .suffix_fourcol {padding-right: 256px;}
.container .suffix_fivecol {padding-right: 320px;}
.container .suffix_sixcol {padding-right: 384px;}
.container .suffix_sevencol {padding-right: 448px;}
.container .suffix_eightcol {padding-right: 512px;}
.container .suffix_ninecol {padding-right: 576px;}
.container .suffix_tencol {padding-right: 640px;}
.container .suffix_elevencol {padding-right: 704px;}

/* `Push Space >> 12 Columns
--------------------------------------------------------------------------------*/
.container .push_onecol {left: 64px;}
.container .push_twocol {left: 128px;}
.container .push_threecol {left: 192px;}
.container .push_fourcol {left: 256px;}
.container .push_fivecol {left: 320px;}
.container .push_sixcol {left: 384px;}
.container .push_sevencol {left: 448px;}
.container .push_eightcol {left: 512px;}
.container .push_ninecol {left: 576px;}
.container .push_tencol {left: 640px;}
.container .push_elevencol {left: 704px;}

/* `Pull Space >> 12 Columns
--------------------------------------------------------------------------------*/
.container .pull_onecol {left: -64px;}
.container .pull_twocol {left: -128px;}
.container .pull_threecol {left: -192px;}
.container .pull_fourcol {left: -256px;}
.container .pull_fivecol {left: -320px;}
.container .pull_sixcol {left: -384px;}
.container .pull_sevencol {left: -448px;}
.container .pull_eightcol {left: -512px;}
.container .pull_ninecol {left: -576px;}
.container .pull_tencol {left: -640px;}
.container .pull_elevencol {left: -704px;}	
}
	
	
/*	#Mobile (Portrait) 
================================================== */
	
	/* Note: Design for a width of 320px */
	/*@media only screen and (max-width: 767px) {   ----ORIGINAL SKELETON CODE------*/	
	@media only screen and (max-width: 479px) {		/*DON'S VERSION*/
		.container { width: 320px; margin:0 auto 0 auto;}
		.columns, .column { margin: 0 auto; }
		
		.container .onecol,
		.container .twocol,
		.container .threecol,
		.container .fourcol,
		.container .fivecol,
		.container .sixcol,
		.container .sevencol,
		.container .eightcol,
		.container .ninecol,
		.container .tencol,
		.container .elevencol,
		.container .twelvecol  { width: 280px; }
		
		/* Offsets */	
		.container .offset-by-one,				
		.container .offset-by-two, 					
		.container .offset-by-three, 				
		.container .offset-by-four, 					
		.container .offset-by-five, 					
		.container .offset-by-six, 					
		.container .offset-by-seven, 				
		.container .offset-by-eight, 				
		.container .offset-by-nine, 					
		.container .offset-by-ten, 					
		.container .offset-by-eleven, 				
		.container .offset-by-twelve { padding-left: 0; } 			

.alpha {margin-left: 0;margin-right: 0;}
.omega {margin-right: 0;margin-left: 0;}
}	 
		
	
/* #Mobile (Landscape)
================================================== */

	/* Note: Design for a width of 480px */
	
	@media only screen and (min-width: 480px) and (max-width: 767px) {
		.container { width: 460px;  margin:0 auto 0 auto;}
		.columns, .column { margin: 0 auto; }
		
		.container .onecol,
		.container .twocol,
		.container .threecol,
		.container .fourcol,
		.container .fivecol,
		.container .sixcol,
		.container .sevencol,
		.container .eightcol,
		.container .ninecol,
		.container .tencol,
		.container .elevencol,
		.container .twelvecol { width: 420px; }

.alpha {margin-left: 0;margin-right: 0;}
.omega {margin-right: 0;margin-left: 0;}
	}
	 
	
	
/* #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;
	}