/* 
/////////////////////////////////////////////
//
//   Define widths for various content types 
//
////////////////////////////////////////////
*/


/* define some default colors for showing errors 
	#leftCol, #centerCol, #rightCol { background-color: blue; }
	div.box { background-color: red; } 
*/

/* this is necessary for boxes to work correctly later */
div.box { position: relative; width: 100%; margin-bottom: 7px; }

div.columns21,
div.columns12,
div.columns121,
div.columns13,
div.columns31,
div.columns11 {	
	float: left;
}

div.grey, div.beige, div.beigeSidebar { color: #333; }

div#rightCol, div#centerCol { margin-left:10px; }

div.center1, div.center2, div.center3 { margin-left: auto; margin-right: auto; } 
div.center1 { width: 225px; }
div.center2 { width: 450px; } 
div.center3 { width: 675px; }

div.center1 div#centerCol,
div.center2 div#centerCol,
div.center3 div#centerCol { margin-left: auto; } 


div.columns12 div#leftCol, 
div.columns21 div#rightCol { 
	width: 300px;
	float: left;
}

div.columns12 div#rightCol,
div.columns21 div#leftCol { 
	width: 600px;
	float: left;
}

div.columns31 div#leftCol,
div.columns13 div#rightCol { 
	width: 675px;
	float: left;	
}

div.columns13 div#leftCol,
div.columns31 div#rightCol { 
	width: 225px;
	float: left;	
}

div.columns121 div#leftCol, 
div.columns121 div#rightCol { 
	width: 225px;
	float: left;	
}	

div.columns121 div#centerCol { 
	width: 450px;
	float: left;
}

div.columns11 div#leftCol,
div.columns11 div#rightCol {
	width: 450px;
	float: left;
}

div.box div.headBorder { 
	width: 100%; 
	position: absolute; 
	left: 0px;
	top: 0px;	
	font-size: 0px;	
}

div.box div.footBorder { 
	width: 100%; 
	position: absolute; 
	left: 0px;
	bottom: 0px;
	font-size: 0px;
	_margin-bottom: -1px;
}

div.center3 div#centerCol { width: 675px; }
div.center2 div#centerCol { width: 450px; }
div.center1 div#centerCol { width: 225px; }



div.content { padding: 20px; } 

div.box div.content { 
	padding: 11px 10px 10px 11px;
	* padding-bottom: 20px; 
}

div.box div.content p, div.box div.content pre { margin: 10px 10px 10px 10px; } 
/* 
/////////////////////////////////////////////
//
//   boxType = grey 
//
////////////////////////////////////////////
*/


/* 450 columns on 1x1  */
div.columns11 div#leftCol div.grey,
div.columns11 div#rightCol div.grey, 
div.center2 div#centerCol div.grey {
	background: url(/images/boxes/grey/grey450.gif) -450px 0px repeat-y; 
}

div.columns11 div#leftCol div.grey div.headBorder,
div.columns11 div#rightCol div.grey div.headBorder, 
div.center2 div#centerCol div.grey div.headBorder {
	background: url(/images/boxes/grey/grey450.gif) 0px -30px no-repeat;
	height: 10px;	 
}

div.columns11 div#leftCol div.grey div.footBorder,
div.columns11 div#rightCol div.grey div.footBorder,
div.center2 div#centerCol div.grey div.footBorder { 	
	background: url(/images/boxes/grey/grey450.gif) 0px -40px no-repeat;
	height: 10px; 
	
}

/* 225 side columns on 1x2x1 */
div.columns121 div#leftCol div.grey,
div.columns121 div#rightCol div.grey,
div.center1 div#centerCol div.grey {
	background: url(/images/boxes/grey/grey225.gif) -225px 0px repeat-y; 
}

div.columns121 div#leftCol div.grey div.headBorder,
div.columns121 div#rightCol div.grey div.headBorder,
div.center1 div#centerCol div.grey div.headBorder {
	background: url(/images/boxes/grey/grey225.gif) 0px -30px no-repeat;
	height: 10px;	 
}

div.columns121 div#leftCol div.grey div.footBorder,
div.columns121 div#rightCol div.grey div.footBorder, 
div.center1 div#centerCol div.grey div.footBorder { 	
	background: url(/images/boxes/grey/grey225.gif) 0px -40px no-repeat;
	height: 10px;	 
}

/* 450 column on 1x2x1 */
div.columns121 div#centerCol div.grey {
	background: url(/images/boxes/grey/grey450.gif) -450px -30px repeat-y; 
}

div.columns121 div#centerCol div.grey div.headBorder {
	background: url(/images/boxes/grey/grey450.gif) 0px -30px no-repeat;
	height: 10px;	 
}

div.columns121 div#centerCol div.grey div.footBorder{ 	
	background: url(/images/boxes/grey/grey450.gif) 0px -40px no-repeat;
	height: 10px;	 
}

/* 225 column on 1x3 */
div.columns13 div#leftCol div.grey,
div.columns31 div#rightCol div.grey {
	background: url(/images/boxes/grey/grey225.gif) -225px 0px repeat-y; 
}

div.columns13 div#leftCol div.grey div.headBorder,
div.columns31 div#rightCol div.grey div.headBorder {
	background: url(/images/boxes/grey/grey225.gif) 0px -30px no-repeat;
	height: 10px;	 
}

div.columns13 div#leftCol div.grey div.footBorder,
div.columns31 div#rightCol div.grey div.footBorder { 	
	background: url(/images/boxes/grey/grey225.gif) 0px -40px no-repeat;
	height: 10px;	 
}

/* 675 column on 1x3 */
div.columns31 div#leftCol div.grey,
div.columns13 div#rightCol div.grey, 
div.center3 div#centerCol div.grey {
	background: url(/images/boxes/grey/grey675.gif) -675px 0px repeat-y; 
}

div.columns31 div#leftCol div.grey div.headBorder,
div.columns13 div#rightCol div.grey div.headBorder,
div.center3 div#centerCol div.grey div.headBorder {
	background: url(/images/boxes/grey/grey675.gif) 0px -30px no-repeat;
	height: 10px;	 
}

div.columns31 div#leftCol div.grey div.footBorder,
div.columns13 div#rightCol div.grey div.footBorder,
div.center3 div#centerCol div.grey div.footBorder { 	
	background: url(/images/boxes/grey/grey675.gif) 0px -40px no-repeat;
	height: 10px;	 
}

div.grey div.boxHeader { 
	height: 46px; 
	background: url(/images/boxes/boxHeaderColors.gif) 0px 0px no-repeat;
	margin: 0px 10px 0px 10px;
	position: relative;   
	top: 12px;	
} 

div.grey div.boxHeader div.boxHeaderPadding { 
	padding: 10px;
	font-size: 16px; 
	font-weight: bold;	
}

div.grey div.boxHeader span.endcap { 
	height: 46px;
	width: 10px; 
	position: absolute; 
	right: 0px;
	top: 0px;	
	background: url(/images/boxes/boxHeaderColors.gif) -990px 0px no-repeat;	 
}

/* 
/////////////////////////////////////////////
//
//   boxType = beige 
//
////////////////////////////////////////////
*/


/* 450 columns on 1x1  */
div.columns11 div#leftCol div.beige,
div.columns11 div#rightCol div.beige,
div.center2 div#centerCol div.beige {
	background: url(/images/boxes/beige/beige450.gif) -450px 0px repeat-y; 
}

div.columns11 div#leftCol div.beige div.headBorder,
div.columns11 div#rightCol div.beige div.headBorder, 
div.center2 div#centerCol div.beige div.headBorder {
	background: url(/images/boxes/beige/beige450.gif) 0px -30px no-repeat;
	height: 10px;	 
}

div.columns11 div#leftCol div.beige div.footBorder,
div.columns11 div#rightCol div.beige div.footBorder,
div.center2 div#centerCol div.beige div.footBorder { 	
	background: url(/images/boxes/beige/beige450.gif) 0px -40px no-repeat;
	height: 10px;	 
}

/* 225 side columns on 1x2x1 */
div.columns121 div#leftCol div.beige,
div.columns121 div#rightCol div.beige,
div.center1 div#centerCol div.beige {
	background: url(/images/boxes/beige/beige225.gif) -225px 0px repeat-y; 
}

div.columns121 div#leftCol div.beige div.headBorder,
div.columns121 div#rightCol div.beige div.headBorder,
div.center1 div#centerCol div.beige div.headBorder {
	background: url(/images/boxes/beige/beige225.gif) 0px -30px no-repeat;
	height: 10px;	 
}

div.columns121 div#leftCol div.beige div.footBorder,
div.columns121 div#rightCol div.beige div.footBorder,
div.center1 div#centerCol div.beige div.footBorder { 	
	background: url(/images/boxes/beige/beige225.gif) 0px -40px no-repeat;
	height: 10px;	 
}

/* 450 column on 1x2x1 */
div.columns121 div#centerCol div.beige {
	background: url(/images/boxes/beige/beige450.gif) -450px 0px repeat-y; 
}

div.columns121 div#centerCol div.beige div.headBorder {
	background: url(/images/boxes/beige/beige450.gif) 0px -30px no-repeat;
	height: 10px;	 
}

div.columns121 div#centerCol div.beige div.footBorder{ 	
	background: url(/images/boxes/beige/beige450.gif) 0px -40px no-repeat;
	height: 10px;	 
}

/* 225 column on 1x3 */
div.columns13 div#leftCol div.beige,
div.columns31 div#rightCol div.beige,
div.center1 div#centerCol div.beige {
	background: url(/images/boxes/beige/beige225.gif) -225px 0px repeat-y; 
}

div.columns13 div#leftCol div.beige div.headBorder,
div.columns31 div#rightCol div.beige div.headBorder {
	background: url(/images/boxes/beige/beige225.gif) 0px -30px no-repeat;
	height: 10px;	 
}

div.columns13 div#leftCol div.beige div.footBorder,
div.columns31 div#rightCol div.beige div.footBorder { 	
	background: url(/images/boxes/beige/beige225.gif) 0px -40px no-repeat;
	height: 10px;	 
}

/* 675 column on 1x3 */
div.columns31 div#leftCol div.beige,
div.columns13 div#rightCol div.beige,
div.center3 div#centerCol div.beige  {
	background: url(/images/boxes/beige/beige675.gif) -675px 0px repeat-y; 
}

div.columns31 div#leftCol div.beige div.headBorder,
div.columns13 div#rightCol div.beige div.headBorder,
div.center3 div#centerCol div.beige div.headBorder {
	background: url(/images/boxes/beige/beige675.gif) 0px -30px no-repeat;
	height: 10px;	 
}

div.columns31 div#leftCol div.beige div.footBorder,
div.columns13 div#rightCol div.beige div.footBorder,
div.center3 div#centerCol div.beige div.footBorder { 	
	background: url(/images/boxes/beige/beige675.gif) 0px -40px no-repeat;
	height: 10px;	 
}

div.beige div.boxHeader { 
	height: 31px; 
	background: url(/images/boxes/boxHeaderColors.gif) 0px -46px no-repeat;
	margin: 0px 10px 0px 10px;
	position: relative;   
	top: 12px;	
} 

div.beige div.boxHeader div.boxHeaderPadding { 
	padding: 10px;
	font-size: 16px; 
	font-weight: bold;	
}

div.beige div.boxHeader span.endcap { 
	height: 31px;
	width: 10px; 
	position: absolute; 
	right: 0px;
	top: 0px;	
	background: url(/images/boxes/boxHeaderColors.gif) -990px -46px no-repeat;	 
}


div.beige div.boxHeader { 
	height: 46px; 
	background: url(/images/boxes/boxHeaderColors.gif) 0px -46px no-repeat;
	margin: 0px 10px 0px 10px;
	position: relative;   
	top: 12px;	
} 

div.beige div.boxHeader div.boxHeaderPadding { 
	padding: 10px;
	font-size: 16px; 
	font-weight: bold;	
}

div.beige div.boxHeader span.endcap { 
	height: 46px;
	width: 10px; 
	position: absolute; 
	right: 0px;
	top: 0px;	
	background: url(/images/boxes/boxHeaderColors.gif) -990px -46px no-repeat;	 
}
/* 
/////////////////////////////////////////////
//
//   boxType = beigeSidebarSidebar
//
////////////////////////////////////////////
*/

div.beigeSidebar div.content { padding-bottom: 30px; } 
/* 450 columns on 1x1  */
div.columns11 div#leftCol div.beigeSidebar,
div.columns11 div#rightCol div.beigeSidebar,
div.center2 div#centerCol div.beigeSidebar  {
	background: url(/images/boxes/beigeSidebar/beigeSidebar450.gif) -450px 0px repeat-y; 
}

div.columns11 div#leftCol div.beigeSidebar div.headBorder,
div.columns11 div#rightCol div.beigeSidebar div.headBorder,
div.center2 div#centerCol div.beigeSidebar div.headBorder {
	background: url(/images/boxes/beigeSidebar/beigeSidebar450.gif) 0px 0px no-repeat;
	height: 18px;	 
}

div.columns11 div#leftCol div.beigeSidebar div.footBorder,
div.columns11 div#rightCol div.beigeSidebar div.footBorder { 	
	background: url(/images/boxes/beigeSidebar/beigeSidebar450.gif) 0px -27px no-repeat;
	height: 25px;	 
}

/* 225 side columns on 1x2x1 */
div.columns121 div#leftCol div.beigeSidebar,
div.columns121 div#rightCol div.beigeSidebar {
	background: url(/images/boxes/beigeSidebar/beigeSidebar225.gif) -225px 0px repeat-y; 
}

div.columns121 div#leftCol div.beigeSidebar div.headBorder,
div.columns121 div#rightCol div.beigeSidebar div.headBorder {
	background: url(/images/boxes/beigeSidebar/beigeSidebar225.gif) 0px 0px no-repeat;
	height: 18px;	 
}

div.columns121 div#leftCol div.beigeSidebar div.footBorder,
div.columns121 div#rightCol div.beigeSidebar div.footBorder { 	
	background: url(/images/boxes/beigeSidebar/beigeSidebar225.gif) 0px -27px no-repeat;
	height: 25px;	 
}

/* 450 column on 1x2x1 */
div.columns121 div#centerCol div.beigeSidebar {
	background: url(/images/boxes/beigeSidebar/beigeSidebar450.gif) -450px 0px repeat-y; 
}

div.columns121 div#centerCol div.beigeSidebar div.headBorder {
	background: url(/images/boxes/beigeSidebar/beigeSidebar450.gif) 0px 0px no-repeat;
	height: 18px;	 
}

div.columns121 div#centerCol div.beigeSidebar div.footBorder{ 	
	background: url(/images/boxes/beigeSidebar/beigeSidebar450.gif) 0px -27px no-repeat;
	height: 25px;	 
}

/* 225 column on 1x3 */
div.columns13 div#leftCol div.beigeSidebar,
div.columns31 div#rightCol div.beigeSidebar {
	background: url(/images/boxes/beigeSidebar/beigeSidebar225.gif) -225px 0px repeat-y; 
}

div.columns13 div#leftCol div.beigeSidebar div.headBorder,
div.columns31 div#rightCol div.beigeSidebar div.headBorder {
	background: url(/images/boxes/beigeSidebar/beigeSidebar225.gif) 0px 0px no-repeat;
	height: 18px;	 	 
}

div.columns13 div#leftCol div.beigeSidebar div.footBorder,
div.columns31 div#rightCol div.beigeSidebar div.footBorder { 	
	background: url(/images/boxes/beigeSidebar/beigeSidebar225.gif) 0px -27px no-repeat;
	height: 25px;	 
}

/* 675 column on 1x3 */
div.columns31 div#leftCol div.beigeSidebar,
div.columns13 div#rightCol div.beigeSidebar {
	background: url(/images/boxes/beigeSidebar/beigeSidebar675.gif) -675px 0px repeat-y; 
}

div.columns31 div#leftCol div.beigeSidebar div.headBorder,
div.columns13 div#rightCol div.beigeSidebar div.headBorder {
	background: url(/images/boxes/beigeSidebar/beigeSidebar675.gif) 0px 0px no-repeat;
	height: 18px;	 	 
}

div.columns31 div#leftCol div.beigeSidebar div.footBorder,
div.columns13 div#rightCol div.beigeSidebar div.footBorder { 	
	background: url(/images/boxes/beigeSidebar/beigeSidebar675.gif) 0px -27px no-repeat;
	height: 25px;	 
}

div.beigeSidebar div.boxHeader {	
	background:transparent url(/images/boxes/boxHeaderColors.gif) no-repeat scroll 0 -93px;
	height:46px;
	margin:0 7px 0px 6px;
	position:relative;
	top:7px;
}
div.beigeSidebar div.boxHeader div.boxHeaderPadding { 
	padding: 10px;
	font-size: 16px; 
	font-weight: bold;	
}

div.beigeSidebar div.boxHeader span.endcap { 
	height: 46px;
	width: 10px; 
	position: absolute; 
	right: 0px;
	top: 0px;	
	background: url(/images/boxes/boxHeaderColors.gif) -990px -93px no-repeat;	 
}

/* 
/////////////////////////////////////////////
//
//   table formatting
//
////////////////////////////////////////////
*/

table { 
	width: 100%; 
	border: 1px solid #d9d7d0; 
	border-collapse: collapse; 
	border-spacing: 1px;  
}

th, td { 
	text-align: left; 
	font-size: 12px;
	font-weight: bold;
	padding: 4px 8px;
	vertical-align: top;   
}

th, th.sorting { 
	background: url(/images/tableHeader.gif) -1px 0px no-repeat;
	height: auto;
	padding: 8px 4px 4px 8px;
	border-left: 1px solid #c3cbc2; 
}

th.sorting, th.sorting_asc, th.sorting_desc, th.sorting_both { cursor: pointer; }

.browserIE8 th  { height: 10px; } 

tr td { 
	background-color: white; 
	border-top: 1px solid #ccc; 
	border-left: 1px solid #ccc;
} 

tr.alt td { background:  url(/images/tableHeader.gif) -1px -29px no-repeat; }


/* 
/////////////////////////////////////////////
//
//   misc box stuff
//
////////////////////////////////////////////
*/

div.boxHeader span.headerText { 
	float: left;
	left: 3px;
	position: relative;
	top: 2px; 
}  

div.boxHeader a.button { float: right; margin-right: 5px; }

/* header icons */
div.boxHeaderIcon { 
	float: left;
	width: 29px; 
	height: 29px;
	position: relative;
	margin: 8px 5px 0px 8px;
} 

div.icon1 { 
	background: url(/images/blackIcons.gif) 0px 0px no-repeat;
}
div.icon2 { 
	background: url(/images/blackIcons.gif) 0px -29px no-repeat;
}
div.icon3 { 
	background: url(/images/blackIcons.gif) 0px -58px no-repeat;
}
div.icon4 { 
	background: url(/images/blackIcons.gif) 0px -87px no-repeat;
}

/* box header counter spans */

span.headerText span.quantity { 
	background: url(/images/boxHeaderCounterBg.gif) repeat-x; 
	color: white;
	padding: 0px 7px 1px 7px;
	
	position: relative;
	_position: static; 
	left: 5px;	
	font-size: 12px;
	bottom: 1px;
}

span.headerText span.quantity span { 
	width: 7px; 
	height: 16px; 
	position: absolute; 
	right: 0px;
	top: 0px;
	* top: 3px;	
	background: url(/images/boxHeaderCounterBg.gif) -293px 0px repeat-x; 
}

/* 
/////////////////////////////////////////////
//
//   box tabs, currently only grey and beige supported
//
////////////////////////////////////////////
*/

div.columns121 div#centerCol div.boxTabs,
div.columns11 div#leftCol div.boxTabs,
div.columns11 div#rightCol div.boxTabs {
	background: white url(/images/boxes/grey/grey450.gif) 0px 0px no-repeat;
}

div.columns13 div#rightCol div.boxTabs,
div.columns31 div#leftCol div.boxTabs {
	background: white url(/images/boxes/grey/grey675.gif) 0px 0px no-repeat;
}

div.columns31 div#rightCol div.boxTabs,
div.columns13 div#leftCol div.boxTabs, 
div.columns121 div#leftCol div.boxTabs,
div.columns121 div#rightCol div.boxTabs  
 {
	background: white url(/images/boxes/grey/grey225.gif) 0px 0px no-repeat;
}

div.boxTabs { 	
	height: 40px; 
	position: absolute;  
	top: 0px; 
	left: 0px;	
	background: white url(/images/boxes/grey/grey450.gif) 0px 0px no-repeat;
	margin-bottom: -5px;
	width: 100%;
}

div.columns121 div#centerCol div.beige div.boxTabs,
div.columns11 div#leftCol div.beige div.boxTabs, 
div.columns11 div#rightCol div.beige div.boxTabs,
div.center2 div#centerCol div.beige div.boxTabs { 
	background: white url(/images/boxes/beige/beige450.gif) 0px 0px no-repeat;
}

div.columns13 div#rightCol div.beige div.boxTabs,
div.columns31 div#leftCol div.beige div.boxTabs,
div.center3 div#centerCol div.beige div.boxTabs { 
	background: white url(/images/boxes/beige/beige675.gif) 0px 0px no-repeat;
}

div.columns121 div#leftCol div.beige div.boxTabs,
div.columns121 div#rightCol div.beige div.boxTabs,
div.columns31 div#rightCol div.beige div.boxTabs,
div.columns13 div#leftCol div.beige div.boxTabs,
div.center1 div#centerCol div.beige div.boxTabs { 
	background: white url(/images/boxes/beige/beige225.gif) 0px 0px no-repeat;
}

div.boxTabs a {
	font-weight: bold;
	padding: 5px 10px 15px 10px;
	position: relative; 
	top: 10px;
	* top: 8px;	
	_top: 8px;
	left: 10px;
	margin-left: 5px;
	background: url(/images/boxTabs.gif) 0px -39px;
	text-decoration: none;
	color: #686556; 
	font-size: 12px;
	text-align: center;
	display:inline-block;
	text-align:center;
	width:auto;	
	cursor: pointer;
}

div.boxTabs a:hover {	
	background: url(/images/boxTabs.gif) 0px -77px;
	cursor: pointer;	
}

div.boxTabs a span { pointer: cursor; } 
div.boxTabs a span.endcap { 
	width: 10px;
	position: absolute;
	right: 0px;
	height: 25px;	
	top: 0px;	
	background: url(/images/boxTabs.gif) -441px -39px;
	_margin-right: -1px;
}

div.boxTabs a:hover span.endcap {	
	background: url(/images/boxTabs.gif) -441px -77px;
}

div.boxTabs a.active, div.boxTabs a.active:hover {
	padding: 5px 10px 0px 10px;
	position: relative;	
	background: url(/images/boxTabs.gif) 0px 0px;	
	color: white; 	
	* top: 10px;
	_top: 10px;
	
}

div.boxTabs a.active span.endcap, div.boxTabs a.active:hover span.endcap { 
	width: 10px;
	position: absolute;
	right: 0px;
	height: 25px;	
	background: url(/images/boxTabs.gif) -441px 0px;
	_margin-right: -1px;
}

div.boxTabs a div.tabPointer { 
	width: 100%;
	height: 14px; 
	background: url(/images/boxTabs.gif) center -195px;
	display: block;
	position: relative;
	bottom: 0px; 
	top: 5px;
	left: 0px;
	* width: 17px;
	font-size: 0px;
}

div.tabbedBox {
	padding-top: 32px;
	margin-top: -5px;	
}

div.boxTabs a span.counter { 
	background: url(/images/boxTabs.gif) 0px -116px;
	position: relative;
 	padding: 5px;
 	color: white;
 	cursor: pointer;
	_padding: 0px 0px; 
	_background: url(/images/boxTabs.gif) 0px -188px;
	_width: 35px;
	_text-align: center;
	_display: inline-block;
	_height: 16px;
}

div.boxTabs a span.counter span.counterEnd  { 
	background: url(/images/boxTabs.gif) -445px -116px;
	width: 5px;
	position: absolute; 
	right: 0px;
	height: 21px;
	top: 0px;
	cursor: pointer;
	_display: none; 
	
}

div.boxTabs a:hover span.counter { 
	background: url(/images/boxTabs.gif) 0px -155px;
	_background: url(/images/boxTabs.gif) -35px -188px;
}

div.boxTabs a:hover span.counter span.counterEnd  { 
	background: url(/images/boxTabs.gif) -445px -155px;
	_display: none;
}

div.boxTabs a.active span.counter, 
div.boxTabs a.active span.counter span.counterEnd  { 
	background: none;
	height: auto;
	width: auto;
	position: static;
	padding: 0px; 
	
	/* or */
	display: none; 
}