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

/*  COLUMN SETUP  */
.col {
    display: block;
    float:left;
    margin: 1% 0 1% 1.6%;
    padding: 10px /* Added by P.Blake */
}
.col_sml {
    display: block;
    float:left;
    margin: 1% 0 1% .2%;
}
.col:first-child { margin-left: 0; }
.col_sml:first-child { margin-left: 0; }

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

/*  GRID OF TWO  */
.span_2_of_2 { width: 100%; }
.span_1_of_2 { width: 49.2%; }

/*  GRID OF TWO SMALL  */
.span_2_of_2_sml { width: 100%; }
.span_1_of_2_sml { width: 49.9%; }

/*  GRID OF THREE  */
.span_3_of_3 { width: 100%; }
.span_2_of_3 { width: 66.13%; }
.span_1_of_3 { width: 32.26%; }

/*  GRID OF THREE SMALL  */
.span_3_of_3_sml { width: 100%; }
.span_2_of_3_sml { width: 66.6%; }
.span_1_of_3_sml { width: 33.2%; }

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

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

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

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

/*  GRID OF SEVEN SMALL  */
.span_7_of_7_sml { width: 100%; }
.span_6_of_7_sml { width: 85.68%; }
.span_5_of_7_sml { width: 71.37%; }
.span_4_of_7_sml { width: 57.05%; }
.span_3_of_7_sml { width: 42.74%; }
.span_2_of_7_sml { width: 28.42%; }
.span_1_of_7_sml { width: 14.11%; }

/*  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 BELOW 480 PIXELS */
@media only screen and (max-width: 480px) {
    .col, .col_sml {  margin: 1% 0 1% 0%; }
    .span_2_of_2, .span_1_of_2 { width: 100%; }
    .span_2_of_2_sml, .span_1_of_2_sml { width: 100%; }
    .span_3_of_3, .span_2_of_3, .span_1_of_3 { width: 100%; }
    .span_3_of_3_sml, .span_2_of_3_sml, .span_1_of_3_sml { width: 100%; }
    .span_1_of_4, .span_2_of_4, .span_3_of_4, .span_4_of_4 { width: 100%; }
    .span_1_of_5, .span_2_of_5, .span_3_of_5, .span_4_of_5, .span_5_of_5 { width: 100%; }
    .span_1_of_6, .span_2_of_6, .span_3_of_6, .span_4_of_6, .span_5_of_6, .span_6_of_6 { width: 100%; }
    .span_1_of_7, .span_2_of_7, .span_3_of_7, .span_4_of_7, .span_5_of_7, .span_6_of_7, .span_7_of_7 { width: 100%; }
    .span_1_of_7_sml, .span_2_of_7_sml, .span_3_of_7_sml, .span_4_of_7_sml, .span_5_of_7_sml, .span_6_of_7_sml, .span_7_of_7_sml { width: 100%; }
    .span_1_of_8, .span_2_of_8, .span_3_of_8, .span_4_of_8, .span_5_of_8, .span_6_of_8, .span_7_of_8, .span_8_of_8 { width: 100%; }
}