#wrapper {
	margin:0px auto;
	/*background:#eee;/*  center column colur*/
	background:  url(../images/bg1.png) repeat-y top right;
	text-align:left;
	position:relative;
	z-index:0;
	min-height:100%;
	min-width:700px;
	max-width:1220px;
	padding-bottom:1em;
	margin-bottom:-1.25em;
	
}
/**html #wrapper {
	margin:0px auto;
	background: none;
	background: #eee;
	text-align: left;
	position:relative;
	z-index:0;
	min-height:100%;
	min-width:700px;
	max-width:1220px;
	padding-bottom:1em;
	margin-bottom:-1.25em;
	
}*/
#inner {
	width:100%;
	overflow:hidden;
	position:relative;
	z-index:3;
	
}
/*if we float the middle column we avoid the ie6 3 pixel jog and also keep columns in normal source order (left,middle right) but we need to use a negative margin offset to make it all fit.*/
#center {
	float:left;
	width:100%;
	margin-right:-26em;/* width of left and right columns */
	
}
#content {
	margin-right:26em;/* width of left and right columns */
	text-align:center;
}
#left {
	width:13em;
	position:relative;
	float:left;
	z-index:2;
	/*padding-top:0.5em;*/
	
}
#right {
	width:13em;
	position:relative;
	float:right;
	z-index:2;
	padding-top:0.5em;
	
	/*border: 2px solid orange;*/
	/*padding: 0 1em;*/
	
}
/*The following  2 absolute columns that just hold the column colours */
/* there is no need to worry about being removed from the flow because these do not hold content but are just stuck to the parent container and set at 100% height. This ensures that they grow with the parent container. Its a shame that this behaviour doesn't apply to static elements and we'd all be a lot happier. */
#l {
	width:12.9em;
	height:100%;
	position:absolute;
	bottom:0;
	left:0;
	/* left column color*/
	/*background:#eee;*/
	z-index:1;
	clear:both;
	border-right:1px solid gray;
}
#r {
	position:absolute;
	height:100%;
	right:0;
	/* right column color*/
	/*background:#eee;*/
	z-index:1;
	width:12.9em;
	bottom:0;
	clear:both;
	border-left:1px solid gray;
}

* html #l, * html #r {
	height:999em;
	bottom:-1px
}

/* clear without structural mark-up */
.clearfix:after {
	content:".";
	display:block;
	height:0;
	clear:both;
	visibility:hidden;
}
.clearfix {display:inline-block;}
/* mac hide - force layout in ie \*/
.clearfix {display: block;}
/* End hide */

/*Opera Fix*/
body:before {/* thanks to Maleika (Kohoutec)*/
	content:"";
	height:100%;
	float:left;
	width:0;
	margin-top:-32767px;/* thank you Erik J - negate effect of float*/
}
