/* 

	Copyright 2007 Rob Sutherland and FitzMartin
	http://www.robsutherland.net/ and http://www.fitzmartin.com/
	use is granted without restriction as long as credit is given
	
	.col-n : an equal number of columns
	.col-iixx : 2 columns of ii% and xx%
	.col-fxxx : 2 columns; 1 with a fixed with of xxx and the other the remainder of the space
	
	for percentage based column sets:
	- each column must be marked with class="col" 
	- in column sets of different widths, the narrow column must be marked with class="narrow"
	
	for fixed width colum sets:
	- no column should be marked with class="col"
	- the fixed with column should be marked with class="fixed"
	- 
	
	reversing display order will not work on a browser that doesn't support child selectors (.parent > .child)  - namely IE 6 and lessor.
	
	Note: marking a column (class="col") with an additional class that has padding or margin will cause problems.

*/

/* ===== */
/* This is the set I want to use, but nesting more than 2 levels deep presents a problem until child selectors are accepted across the board */

.col-group {}

.col, .norm .col  {float: left; margin: 0; }
.col.rev {float: right; }
.col-2 .col {width:50%;*width:49.9999%;}
.col-3 .col {width: 33.3%;*width:33.2999%; }
.col-4 .col {width: 25%;*width:24.95999%; }
.col-8020 .col {width: 80%;*width: 79.999%; }
.col-8020 .narrow {width: 20%; }
.col-7525 .col {width: 75%;*width:74.999%; }
.col-7252 .col {width: 25%; }
.col-7030 .col {width: 70%;*width: 69.999%; }
.col-7030 .narrow {width: 30%; }
.col-6040 .col {width: 60%;*width: 59.999%; }
.col-6040 .narrow {width: 40%; }
.col-6535 .col {width: 65%;*width: 64.999%; }
.col-6535 .narrow {width: 35%; }


/* ===== */

.col-f100 {padding-left: 100px; }
.col-f200 {padding-left: 200px; }
.col-f225 {padding-left: 225px; }
.col-f300 {padding-left: 300px; }
.col-f100 .narrow {float: left; width: 100px; position: relative; left: -100px; margin-right: -100px; }
.col-f200 .narrow {float: left; width: 200px; position: relative; left: -200px; margin-right: -200px; }
.col-f225 .narrow {float: left; width: 225px; position: relative; left: -225px; margin-right: -225px; }
.col-f300 .narrow {float: left; width: 300px; position: relative; left: -300px; margin-right: -300px; }

.col-f100r {padding-right: 100px; }
.col-f200r {padding-right: 200px; }
.col-f300r {padding-right: 300px; }
.col-f100r .narrow {float: right; width: 100px; position: relative; right: -100px; margin-left: -100px; }
.col-f200r .narrow {float: right; width: 200px; position: relative; right: -200px; margin-left: -300px;}
.col-f300r .narrow {float: right; width: 300px; position: relative; right: -300px; margin-left: -300px;}

/* ===== */

.col-group:after, .column-group:after {content:"."; display:block; height:0; clear:both; visibility:hidden;}
.col-group, .column-group {zoom:1; }