/* minWidth = 756px				//minimum width of main area (#wrap)
/* maxWidth = 856px				//maximum width of main area
/* pagePaddingWidth = 40px		//minimum space outside of main area (left and right)
/* pagePaddingHeight = 40px		//space outside of main area (top and bottom)
/* sidebarWidth = 215px			//width of entire sidebar
/* sidebarStripeWidth = 20px	//width of stripes inside each side of the sidebar (make sure padding on #sidebar >= this)
/* resizeRate = 55%				//determines the rate at which #sizer (and hence #wrap) is resized relative to the window:
								//   0% = always at min width
								//   50% = stretches at half the rate of the window (e.g., increasing the width of the 
								//   	window by 20 pixels expands #sizer 10 pixels)
								//   100% = same rate as the window
*/

html, body {
	height:100%;
	padding:0;
	margin:0;
}
#bodydiv {
	height:100%;
	padding:0 378px;		/*** = minWidth / 2 ***/
	margin:0 40px;			/*** = pagePaddingWidth ***/
}
#sizer {	/*elastic div in jello mold*/
	width:55%;				/*** = resizeRate ***/
	height:100%;
	margin:0 auto;
	max-width:100px;		/*** = maxWidth - minWidth ***/
}
#wrap {	/*aka jello mold's "expander"*/
	min-height:100%;
	position:relative;
	margin:0 -378px;		/*** = minWidth / 2 ***/
}
#jelloIEFix {	/*IE fix for internal percentage widths in jello mold*/
	width:100%;
}

#header {
	position:relative;
	top:40px;				/*** = pagePaddingHeight ***/
	z-index:2;
	text-align:center;
}

#sidebarBox {
	position:absolute;
	top:40px;				/*** = pagePaddingHeight ***/
	bottom:40px;			/*** = pagePaddingHeight ***/
	width:215px;			/*** = sidebarWidth ***/
	z-index:1;
}
#wrap.sidebarLeft #sidebarBox {
	left:0;
	right:auto;
}
#wrap.sidebarRight #sidebarBox {
	right:0;
	left:auto;
}
#opaqueBox {
	position:absolute;
	top:0;
	right:20px;				/*** = sidebarStripeWidth ***/
	bottom:0;
	left:20px;				/*** = sidebarStripeWidth ***/
}
#sidebarLiner {
	width:215px;			/*** = sidebarWidth ***/
	padding:40px 0 0 0;			/*** = pagePaddingHeight ***/
	position:relative;
	z-index:3;
}
#wrap.sidebarLeft #sidebarLiner { float:left; }
#wrap.sidebarRight #sidebarLiner { float:right; }
#wrap.sidebarLeft #sidebar { clear:left; }
#wrap.sidebarRight #sidebar { clear:right; }

#contentBox {
	position:absolute;
	top:40px;				/*** = pagePaddingHeight ***/
	bottom:40px;			/*** = pagePaddingHeight ***/
	z-index:1;
}
#wrap.sidebarLeft #contentBox {
	left:215px;				/*** = sidebarWidth ***/
	right:0;
}
#wrap.sidebarRight #contentBox {
	left:0;
	right:215px;			/*** = sidebarWidth ***/
}
#contentLiner {
	margin-top:40px;		/*** = pagePaddingHeight ***/
	position:relative;
	z-index:2;
}
#wrap.sidebarLeft #contentLiner {
	padding:0 0 40px 215px;	/*** = pagePaddingHeight, sidebarWidth ***/
}
#wrap.sidebarRight #contentLiner {
	padding:0 215px 40px 0;	/*** = sidebarWidth, pagePaddingHeight ***/
}
#content { width:100%; }
#wrap.sidebarLeft #content { float:left; }
#wrap.sidebarRight #content { float:right; }

#footerLiner {
	position:absolute;
	bottom:40px;			/*** = pagePaddingHeight ***/
	left:0;
	right:0;
	z-index:2;
}
#footerCopyLiner {
	visibility:hidden;
	clear:both;
}

@media audio, aural, braille, embossed, speech, tty {

#footerCopyLiner {
	display:none;
	speak:none;
}

}