/*  SECTIONS  ============================================================================= */
.section { clear: both; padding: 0px; margin: 0px; }

/*  GROUPING  ============================================================================= */
.group:before, .group:after { content:""; display:table; }
.group:after { clear:both; }
.group { zoom:1; /* For IE 6/7 (trigger hasLayout) */ }

/*  GRID COLUMN SETUP   ==================================================================== */
.col { display: block; float:left; margin: 1% 0 1% 1.6%; }
.col:first-child { margin-left: 0; } /* all browsers except IE6 and lower */

/*  REMOVE MARGINS AS ALL GO FULL WIDTH AT 480 PIXELS */
@media only screen and (max-width: 480px) {
	.col { margin: 1% 0 1% 0%; }
}


/*  GRID OF TWO   ============================================================================= */
.span_2_of_2 { width: 100%; }
.span_1_of_2 { width: 49.2%; }
/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
@media only screen and (max-width: 480px) {
	.span_2_of_2 { width: 100%; }
	.span_1_of_2 { width: 100%; }
}


/*  GRID OF THREE   ============================================================================= */
.span_3_of_3 { width: 100%; }
.span_2_of_3 { width: 66.13%; }
.span_1_of_3 { width: 32.26%; }
/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
@media only screen and (max-width: 480px) {
	.span_3_of_3 { width: 100%; }
	.span_2_of_3 { width: 100%; }
	.span_1_of_3 { width: 100%; }
}


/*  GRID OF FOUR   ============================================================================= */
.span_4_of_4 { width: 100%; }
.span_3_of_4 { width: 74.6%; }
.span_2_of_4 { width: 49.2%; }
.span_1_of_4 { width: 23.8%; }
/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
@media only screen and (max-width: 480px) {
	.span_4_of_4 { width: 100%; }
	.span_3_of_4 { width: 100%; }
	.span_2_of_4 { width: 100%; }
	.span_1_of_4 { width: 100%; }
}


/*  GRID OF FIVE   ============================================================================= */
.span_5_of_5 { width: 100%; }
.span_4_of_5 { width: 79.68%; }
.span_3_of_5 { width: 59.36%; }
.span_2_of_5 { width: 39.04%; }
.span_1_of_5 { width: 18.72%; }
/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
@media only screen and (max-width: 480px) {
	.span_5_of_5 { width: 100%; }
	.span_4_of_5 { width: 100%; }
	.span_3_of_5 { width: 100%; }
	.span_2_of_5 { width: 100%; }
	.span_1_of_5 { width: 100%; }
}


/*  GRID OF SIX   ============================================================================= */
.span_6_of_6 { width: 100%; }
.span_5_of_6 { width: 83.06%; }
.span_4_of_6 { width: 66.13%; }
.span_3_of_6 { width: 49.2%; }
.span_2_of_6 { width: 32.26%; }
.span_1_of_6 { width: 15.33%; }
/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
@media only screen and (max-width: 480px) {
	.span_6_of_6 { width: 100%; }
	.span_5_of_6 { width: 100%; }
	.span_4_of_6 { width: 100%; }
	.span_3_of_6 { width: 100%; }
	.span_2_of_6 { width: 100%; }
	.span_1_of_6 { width: 100%; }
}


/*  GRID OF SEVEN   ============================================================================= */
.span_7_of_7 { width: 100%; }
.span_6_of_7 { width: 85.48%; }
.span_5_of_7 { width: 70.97%; }
.span_4_of_7 { width: 56.45%; }
.span_3_of_7 { width: 41.94%; }
.span_2_of_7 { width: 27.42%; }
.span_1_of_7 { width: 12.91%; }
/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
@media only screen and (max-width: 480px) {
	.span_7_of_7 { width: 100%; }
	.span_6_of_7 { width: 100%; }
	.span_5_of_7 { width: 100%; }
	.span_4_of_7 { width: 100%; }
	.span_3_of_7 { width: 100%; }
	.span_2_of_7 { width: 100%; }
	.span_1_of_7 { width: 100%; }
}


/*  GRID OF EIGHT   ============================================================================= */
.span_8_of_8 { width: 100%; }
.span_7_of_8 { width: 87.3%; }
.span_6_of_8 { width: 74.6%; }
.span_5_of_8 { width: 61.9%; }
.span_4_of_8 { width: 49.2%; }
.span_3_of_8 { width: 36.5%; }
.span_2_of_8 { width: 23.8%; }
.span_1_of_8 { width: 11.1%; }
/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
@media only screen and (max-width: 480px) {
	.span_8_of_8 { width: 100%; }
	.span_7_of_8 { width: 100%; }
	.span_6_of_8 { width: 100%; }
	.span_5_of_8 { width: 100%; }
	.span_4_of_8 { width: 100%; }
	.span_3_of_8 { width: 100%; }
	.span_2_of_8 { width: 100%; }
	.span_1_of_8 { width: 100%; }
}


/*  GRID OF NINE   ============================================================================= */
.span_9_of_9 { width: 100%; }
.span_8_of_9 { width: 88.71%; }
.span_7_of_9 { width: 77.42%; }
.span_6_of_9 { width: 66.13%; }
.span_5_of_9 { width: 54.84%; }
.span_4_of_9 { width: 43.55%; }
.span_3_of_9 { width: 32.26%; }
.span_2_of_9 { width: 20.97%; }
.span_1_of_9 { width: 9.68%; }
/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
@media only screen and (max-width: 480px) {
	.span_9_of_9 { width: 100%; }
	.span_8_of_9 { width: 100%; }
	.span_7_of_9 { width: 100%; }
	.span_6_of_9 { width: 100%; }
	.span_5_of_9 { width: 100%; }
	.span_4_of_9 { width: 100%; }
	.span_3_of_9 { width: 100%; }
	.span_2_of_9 { width: 100%; }
	.span_1_of_9 { width: 100%; }
}


/*  GRID OF TEN   ============================================================================= */
.span_10_of_10 { width: 100%; }
.span_9_of_10 { width: 89.84%; }
.span_8_of_10 { width: 79.68%; }
.span_7_of_10 { width: 69.52%; }
.span_6_of_10 { width: 59.36%; }
.span_5_of_10 { width: 49.2%; }
.span_4_of_10 { width: 39.04%; }
.span_3_of_10 { width: 28.88%; }
.span_2_of_10 { width: 18.72%; }
.span_1_of_10 { width: 8.56%; }
/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
@media only screen and (max-width: 480px) {
	.span_10_of_10 { width: 100%; }
	.span_9_of_10 { width: 100%; }
	.span_8_of_10 { width: 100%; }
	.span_7_of_10 { width: 100%; }
	.span_6_of_10 { width: 100%; }
	.span_5_of_10 { width: 100%; }
	.span_4_of_10 { width: 100%; }
	.span_3_of_10 { width: 100%; }
	.span_2_of_10 { width: 100%; }
	.span_1_of_10 { width: 100%; }
}


/*  GRID OF ELEVEN   ============================================================================= */
.span_11_of_11 { width: 100%; }
.span_10_of_11 { width: 90.76%; }
.span_9_of_11 { width: 81.52%; }
.span_8_of_11 { width: 72.29%; }
.span_7_of_11 { width: 63.05%; }
.span_6_of_11 { width: 53.81%; }
.span_5_of_11 { width: 44.58%; }
.span_4_of_11 { width: 35.34%; }
.span_3_of_11 { width: 26.1%; }
.span_2_of_11 { width: 16.87%; }
.span_1_of_11 { width: 7.63%; }
/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
@media only screen and (max-width: 480px) {
	.span_11_of_11 { width: 100%; }
	.span_10_of_11 { width: 100%; }
	.span_9_of_11 { width: 100%; }
	.span_8_of_11 { width: 100%; }
	.span_7_of_11 { width: 100%; }
	.span_6_of_11 { width: 100%; }
	.span_5_of_11 { width: 100%; }
	.span_4_of_11 { width: 100%; }
	.span_3_of_11 { width: 100%; }
	.span_2_of_11 { width: 100%; }
	.span_1_of_11 { width: 100%; }
}


/*  GRID OF TWELVE   ============================================================================= */
.span_12_of_12 { width: 100%; }
.span_11_of_12 { width: 91.53%; }
.span_10_of_12 { width: 83.06%; }
.span_9_of_12 { width: 74.6%; }
.span_8_of_12 { width: 66.13%; }
.span_7_of_12 { width: 57.66%; }
.span_6_of_12 { width: 49.2%; }
.span_5_of_12 { width: 40.73%; }
.span_4_of_12 { width: 32.26%; }
.span_3_of_12 { width: 23.8%; }
.span_2_of_12 { width: 15.33%; }
.span_1_of_12 { width: 6.86%; }
/*  GO FULL WIDTH AT LESS THAN 480 PIXELS */
@media only screen and (max-width: 480px) {
	.span_12_of_12 { width: 100%; }
	.span_11_of_12 { width: 100%; }
	.span_10_of_12 { width: 100%; }
	.span_9_of_12 { width: 100%; }
	.span_8_of_12 { width: 100%; }
	.span_7_of_12 { width: 100%; }
	.span_6_of_12 { width: 100%; }
	.span_5_of_12 { width: 100%; }
	.span_4_of_12 { width: 100%; }
	.span_3_of_12 { width: 100%; }
	.span_2_of_12 { width: 100%; }
	.span_1_of_12 { width: 100%; }
}