/*

Fluid column extension for Blueprint. Hacks for IE6 in u.ie6.css

*/

/* Min-Max fluid width container (if enabling this container type, also uncomment the block in ie.css)
-------------------------------------------------------------- */
#page.minmax .container {
	/* 128 x 10 = 1280 - (8 x 10) = 1200 - 8 (rightmost column needs no margin) = 1192 */
	/* grow an extra 6 columns */
	max-width:1192px;

	/* 128 x 9 = 1152 - (8 x 9) = 1080 - 8 (rightmost column needs no margin) = 1088 */
	/* grow an extra 3.4 columns  */
	/*max-width:1088px;*/

	/* 128 x 8 = 1024 - (8 x 8) = 960 - 8 (rightmost column needs no margin) = 952 */
	min-width:952px; 
	width:auto;
	margin:0 auto;
}

/* Full fluid width containers
-------------------------------------------------------------- */
#page.full .container {
	width:auto;
	margin:0 auto;
}

/* Fluid column extension
-------------------------------------------------------------- */

/*
	use a fixed width span-x classname on a fluid div anyway.  it will help you design for the minimum width.
	for instance, a fluid span-20 is actually 26 columns when fully expanded. however, if you
	design something that spans 26 columns, it will be clipped for viewers using the min page width

	structure:

	(container)
		+-- (span-A)(fixed)
		+-- (span-B)(fixed)
		+-- (fluid)(prepend-A+B)(append-D)
			+-- (span-fluid)
		+-- (span-D)(fixed)
*/

.fixed {
	display:inline;
	position:relative; /* this rule causes major problems in IE7 and probably 6 when it's wrapped by a div set to overflow:auto */
}

.fixed.last {
	float:right; /* not sure this is needed anymore, but it isn't hurting anything */
}

.fluid {
	display:inline;
	float:left;
	overflow:hidden;
	width:100%;

	padding:0; /* override standard appends and prepends grid.css */
}

/*
	the .span-fluid div is essentially just extraneous non-semantical code that browsers
	need to properly place the floating column within fixed columns.
*/
.span-fluid {}

/* prepends added to a .fluid div indicate the width of the preceding fixed column(s) */
.fluid.prepend-1  { margin-left:-40px; }
.fluid.prepend-2  { margin-left:-80px; }
.fluid.prepend-3  { margin-left:-120px; }
.fluid.prepend-4  { margin-left:-160px; }
.fluid.prepend-5  { margin-left:-200px; }
.fluid.prepend-6  { margin-left:-240px; }
.fluid.prepend-7  { margin-left:-280px; }
.fluid.prepend-8  { margin-left:-320px; }
.fluid.prepend-9  { margin-left:-360px; }
.fluid.prepend-10 { margin-left:-400px; }
.fluid.prepend-11 { margin-left:-440px; }
.fluid.prepend-12 { margin-left:-480px; }
.fluid.prepend-13 { margin-left:-520px; }
.fluid.prepend-14 { margin-left:-560px; }
.fluid.prepend-15 { margin-left:-600px; }
.fluid.prepend-16 { margin-left:-640px; }
.fluid.prepend-17 { margin-left:-680px; }
.fluid.prepend-18 { margin-left:-720px; }
.fluid.prepend-19 { margin-left:-760px; }
.fluid.prepend-20 { margin-left:-800px; }
.fluid.prepend-21 { margin-left:-840px; }
.fluid.prepend-22 { margin-left:-880px; }
.fluid.prepend-23 { margin-left:-920px; }

/* child selectors eliminate unwanted inheritance */
.fluid.prepend-1 > .span-fluid  { margin-left:40px; }
.fluid.prepend-2 > .span-fluid  { margin-left:80px; }
.fluid.prepend-3 > .span-fluid  { margin-left:120px; }
.fluid.prepend-4 > .span-fluid  { margin-left:160px; }
.fluid.prepend-5 > .span-fluid  { margin-left:200px; }
.fluid.prepend-6 > .span-fluid  { margin-left:240px; }
.fluid.prepend-7 > .span-fluid  { margin-left:280px; }
.fluid.prepend-8 > .span-fluid  { margin-left:320px; }
.fluid.prepend-9 > .span-fluid  { margin-left:360px; }
.fluid.prepend-10 > .span-fluid { margin-left:400px; }
.fluid.prepend-11 > .span-fluid { margin-left:440px; }
.fluid.prepend-12 > .span-fluid { margin-left:480px; }
.fluid.prepend-13 > .span-fluid { margin-left:520px; }
.fluid.prepend-14 > .span-fluid { margin-left:560px; }
.fluid.prepend-15 > .span-fluid { margin-left:600px; }
.fluid.prepend-16 > .span-fluid { margin-left:640px; }
.fluid.prepend-17 > .span-fluid { margin-left:680px; }
.fluid.prepend-18 > .span-fluid { margin-left:720px; }
.fluid.prepend-19 > .span-fluid { margin-left:760px; }
.fluid.prepend-20 > .span-fluid { margin-left:800px; }
.fluid.prepend-21 > .span-fluid { margin-left:840px; }
.fluid.prepend-22 > .span-fluid { margin-left:880px; }
.fluid.prepend-23 > .span-fluid { margin-left:920px; }

/* appends added to a .fluid div indicate the width of the appending fixed column(s) */
.fluid.append-1  { margin-right: -32px; }
.fluid.append-2  { margin-right: -72px; }
.fluid.append-3  { margin-right: -112px; }
.fluid.append-4  { margin-right: -152px; }
.fluid.append-5  { margin-right: -192px; }
.fluid.append-6  { margin-right: -232px; }
.fluid.append-7  { margin-right: -272px; }
.fluid.append-8  { margin-right: -312px; }
.fluid.append-9  { margin-right: -352px; }
.fluid.append-10 { margin-right: -392px; }
.fluid.append-11 { margin-right: -432px; }
.fluid.append-12 { margin-right: -472px; }
.fluid.append-13 { margin-right: -512px; }
.fluid.append-14 { margin-right: -552px; }
.fluid.append-15 { margin-right: -592px; }
.fluid.append-16 { margin-right: -632px; }
.fluid.append-17 { margin-right: -672px; }
.fluid.append-18 { margin-right: -712px; }
.fluid.append-19 { margin-right: -752px; }
.fluid.append-20 { margin-right: -792px; }
.fluid.append-21 { margin-right: -832px; }
.fluid.append-22 { margin-right: -872px; }
.fluid.append-23 { margin-right: -912px; }

/* child selectors eliminate unwanted inheritance */
.fluid.append-1 > .span-fluid  { margin-right: 40px; }
.fluid.append-2 > .span-fluid  { margin-right: 80px; }
.fluid.append-3 > .span-fluid  { margin-right: 120px; }
.fluid.append-4 > .span-fluid  { margin-right: 160px; }
.fluid.append-5 > .span-fluid  { margin-right: 200px; }
.fluid.append-6 > .span-fluid  { margin-right: 240px; }
.fluid.append-7 > .span-fluid  { margin-right: 280px; }
.fluid.append-8 > .span-fluid  { margin-right: 320px; }
.fluid.append-9 > .span-fluid  { margin-right: 360px; }
.fluid.append-10 > .span-fluid { margin-right: 400px; }
.fluid.append-11 > .span-fluid { margin-right: 440px; }
.fluid.append-12 > .span-fluid { margin-right: 480px; }
.fluid.append-13 > .span-fluid { margin-right: 520px; }
.fluid.append-14 > .span-fluid { margin-right: 560px; }
.fluid.append-15 > .span-fluid { margin-right: 580px; }
.fluid.append-16 > .span-fluid { margin-right: 640px; }
.fluid.append-17 > .span-fluid { margin-right: 680px; }
.fluid.append-18 > .span-fluid { margin-right: 720px; }
.fluid.append-19 > .span-fluid { margin-right: 760px; }
.fluid.append-20 > .span-fluid { margin-right: 780px; }
.fluid.append-21 > .span-fluid { margin-right: 840px; }
.fluid.append-22 > .span-fluid { margin-right: 880px; }
.fluid.append-23 > .span-fluid { margin-right: 920px; }

/*

use these inside your fluid columns to make column divisions.
note that these do not create a gutter because they are not columns themselves.
apply a margin or padding to the elements you place within them.

*/

.column2,
.column3,
.column4,
.column5 {
	float:left;
	overflow:hidden;
}

.column2 {
	width:49.99%;
}

.column3 {
	width:33.33%;
}

.column4 {
	width:24.99%;
}

.column5 {
	width:19.99%;
}