*
{
	margin:				0;
	padding:			0;
	box-sizing: 		content-box;
}

/*
colors
*/
foo#bar
{
	background-color:	#000000;		/* black */
	background-color:	#ffffff;		/* white */
	
	background-color:	#21409a;		/* deep blue text */
	background-color:	#f6a41d;		/* orange text */
	
	background-color:	#d7e3e8;		/* light grey buttons,borders */
}

html 
{ 
	font-size: 		100.01%; /* IE hack */ 
	height:			100%;
}

/*	LAYOUT TAGS	*/

body
{
	font:				normal 66.66% Arial, Verdana, Helvetica, sans-serif;
	color:				#000000;		/* black */
	background-color:	#ffffff;		/* white */
	border:				0;	
	min-height:			101%;
}


/*	STANDARD TAGS */

table
{
	/*border-collapse:	collapse;*/
}

a
{
	font-size			100%;
	color:				#f6a41d;		/* orange text */
	text-decoration:	none;
}

a:hover
{
	font-size:	100%;
	color:				#f6a41d;		/* orange text */
	text-decoration:	underline;
}

a:active
{
	font-size:	100%;
}

a:visited
{
	font-size:	100%;
}

/* 
	standard formatting
	
	sizes and margins declared in EM units so that user can
	increase the text size and still preserve the structure
*/
h1
{
	font-weight:		bold;
	font-size:			1.33em;
	margin-bottom:		0.75em;
}


moo#baa
{
	background-color:	#000000;		/* black */
	background-color:	#ffffff;		/* white */
	
	background-color:	#d7e3e8;		/* light grey buttons,borders */
	background-color:	#78288c;		/* big purple - selected menu items */
	background-color:	#1f409a;		/* blue heading text */
	background-color:	#002f64;		/* dark blue text */
	background-color:	#333333;		/* grey text */
	background-color:	#4f9ce9;		/* light bue links */
	background-color:	#9d9fa2;		/* light grey text */
	background-color:	#68829F;		/* dark grey text - menu rollover */
}


h2
{
	font-weight:  		bold;
 	font-size:  		2.0em;
	margin-bottom:		0.4em;
	color:				#1f409a;		/* blue heading text */
}

h3
{
	font-weight:		bold;
	font-size:			1.5em;
	margin-bottom:		0.4em;
	color:				#1f409a;		/* blue heading text */
}

h4
{
	font-weight:		bold;
	font-size:			1.25em;
	margin-bottom:		0em;
	color:				#1f409a;		/* blue heading text */
}

h5
{
	font-weight:		bold;
	font-size:		1.0em;
	margin-bottom:		1.0em;
	margin-right:	20px;
}




p
{
	font-size:		1.0em;
	margin-bottom:		1.0em;

}

b
{
font:				bold;
}

img
{
	border:			none;
}

ul, ol
{
	font-size:		1.0em;
	/*margin-bottom:	1.0em;*/
	padding-left:		2.0em;
}

ul li, ol li
{
}

ul
{
	margin-bottom:		1.0em;
	padding-right:		1.0em;
}

.nocss
{
	display:	none;
}




/*
	table where th's are down the left and input boxes and such are in td's along the right
*/
table.formtable
{
	margin:			0 auto;
}

table.formtable th,
table.formtable td
{
	padding:		5px;
	vertical-align: top;
	text-align:		left;
}








/*

	outer and inner serve only to align background images and preserve the
	scrollbar for mozilla-based browsers. 

*/

div#outer
{
	/* background-color:	#ffffff;		white */
	text-align:		left;
	margin:			0 auto;
	width:			752px;
	min-height:		100.01%;
}

div#inner
{
	color:			#333333;		/* grey text */
}

/*
	appears before/after body main content for google
*/
div#top
{
	font-size:		0.9em;
	/*height:			25px;*/
	line-height:	25px;
	color:			#333333;		/* grey text */
}

div#bottom
{
	margin:			10px 0;
	font-size:		0.9em;
	/*height:			25px;*/
	line-height:	1.5em;
	color:			#333333;		/* grey text */
	clear:	both;
}

div#top a,
div#bottom a
{
	color:			#333333;		/ * grey text * /
}
 

/*

body >
outer >
inner >

|---------------|
|head           |
|---------------|
|main           |
|---------------|
|foot           |
|---------------|

*/


div#head
{
	
}

div#main
{
	width:	752px;
	margin-top:	2px;
}

div#foot
{
	width:	752px;
	/*padding: 0 1px;*/
	margin-top:	2px;
}

/*
	header image, remove descender
*/
div#head img
{
	display: block;
}

/*
	two horizontal menus across top
*/
div#bar_one,
div#bar_two
{
	width:		732px;	/*752px;*/
	padding:	0 10px;	/*20*/
	
	display:			block;
	height:				25px;
	line-height:		25px;
	margin:				2px 0 0 0;
	font-family:		Verdana, Arial, Helvetica, sans-serif;
	font-size:			10px;
}

div#bar_one
{
	background-image:	url(/img/blue_bar.png);
	color:	#f6a41d;		/* orange text */
}
	
div#bar_one a
{
	color:	#ffffff;		/* white */
	font-weight:		bold;
}

div#bar_two
{
	background-image:	url(/img/orange_bar.png);
	color:	#ffffff;		/* white */
	text-align:			center;
}
	
div#bar_two a
{
	color:	#21409a;		/* deep blue text */
	font-weight:		bold;
}


/*
	Breadcrumbs
*/

div.breadcrumbs
{
	margin:	10px 0;		/* 10 px top and bottom */
}



/*
	table columns
*/

table#four_columns
{
	width:	752px;
}

table#four_columns td.col,
table#four_columns td.one
{
	width:	188px;
	vertical-align:	top;
}

table#four_columns td.two
{
	width:	376px;
	vertical-align:	top;
}


table#four_columns td.three
{
	width:	564px;
	vertical-align:	top;
}

//table#four_columns 
td.three_used
{
	width:	564px;
	vertical-align:	top;
	padding-left: 10px; 
}


table#four_columns td.four
{
	width:	752px;
	vertical-align:	top;
}


/*
	divs for layout
*/

div.four
{
	float:		left;
	width:		752px;
	margin-bottom:	2px;
	/*background-color:	yellow;*/
}

div.three
{
	float:		left;
	width:		564px;
	margin-bottom:	2px;
	margin:		0px;
	/*background-color:	green;*/
}

div.two
{
	float:		left;
	width:		376px;
	margin-bottom:	2px;
	/*background-color:	pink;*/
}



div.one
{
	float:		left;
	width:		188px;
	margin-bottom:	2px;
	/*background-color:	orange;*/
}

div.mid
{
	padding:	0 10px;
}

div.clear
{
	clear:			both;
}

/*
	add padright to a div if there's a box to the right and you
	dont want the text butting right up to it
*/
div.padright h1,
div.padright h2,
div.padright h3,
div.padright h4,
div.padright p
{
	margin-right:	10px;
}

div.padleft h1,
div.padleft h2,
div.padleft h3,
div.padleft h4,
div.padleft p
{
	margin-left:	10px;
}


/*
	boxes - how they work
	
	naming scheme : "col_wh_(solid)"
	
	where col = 
	
	"gry"     - grey
	"org"     - orange
	"red"     - red, etc.
	
	wh = width / height in cols, if a number is zero it is "free" and may need
	     internal "top" and "bottom" divs to align the graphics e.g.
	     
	_11_      - box is one col wide and high (188x188)
	            internal dimensions are 20px less (168 x 168)
	            
	_32_      - three wide, two high
	
	_20_      - two wide, "free" height
	
	
	finally: 
	
	_solid    - solid color (instead of outline)
	
	
	
	you can also add modifiers after:
	
	center    - align contents to center (instead of left)
	clear     - drop below any proceeding boxes
	

	examples:
	
	<div class="org_11"> will yield a 188x188 (168x168 internal) orange outlined box
	<div class="gry_21_solid"> will yield a 376x188 (168x356) solid grey box
    <div class="org_20 center"> will yield a 376xStretchy orange outlined box with text centered

*/

/*
	1 x 1
*/

div.org_11,
div.org_11_left
{
	width:		168px;	/* 188 */
	height:		168px;	/* 188 */
	padding:	10px;
	
	float:		left;
	overflow:	hidden;
	/*margin-bottom:	2px;*/
	
	background-image:	url(/img/org_11.png);
}

div.org_11_right
{
	width:		168px;	/* 188 */
	height:		168px;	/* 188 */
	padding:	10px;
	
	float:		right;
	overflow:	hidden;
	/*margin-bottom:	2px;*/
	
	background-image:	url(/img/org_11.png);
}


div.org_11_gallery,
div.org_11_left_gallery
{
	width:		168px;	/* 188 */
	height:		168px;	/* 188 */
	padding:	10px;
	
	float:		left;
	overflow:	hidden;
	/*margin-bottom:	2px;*/
	
	background-image:	url(/img/org_11_gallery.png);
}

div.org_11_right_gallery
{
	width:		168px;	/* 188 */
	height:		168px;	/* 188 */
	padding:	10px;
	
	float:		right;
	overflow:	hidden;
	/*margin-bottom:	2px;*/
	
	background-image:	url(/img/org_11_gallery.png);
}





div.org_11_image,
div.org_11_left_image
{
	width:		168px;	/* 188 */
	height:		168px;	/* 188 */
	padding:	10px;
	
	float:		left;
	overflow:	hidden;
	/*margin-bottom:	2px;*/
	
	background-image:	url(/img/org_11_image.png);
}

div.org_11_right_image
{
	width:		168px;	/* 188 */
	height:		168px;	/* 188 */
	padding:	10px;
	
	float:		right;
	overflow:	hidden;
	/*margin-bottom:	2px;*/
	
	background-image:	url(/img/org_11_image.png);
}




div.gry_11
{
	width:		168px;	/* 188 */
	height:		168px;	/* 188 */
	padding:	10px;
	
	float:		left;
	overflow:	hidden;
	/*margin-bottom:	2px;*/
	
	background-image:	url(/img/gry_11.png);
}

div.gry_11_image
{
	width:		168px;	/* 188 */
	height:		168px;	/* 188 */
	padding:	10px;
	
	float:		left;
	overflow:	hidden;
	/*margin-bottom:	2px;*/
	
	background-image:	url(/img/gry_11_image.png);
}

div.gry_11_gallery
{
	width:		168px;	/* 188 */
	height:		168px;	/* 188 */
	padding:	10px;
	
	float:		left;
	overflow:	hidden;
	/*margin-bottom:	2px;*/
	
	background-image:	url(/img/gry_11_gallery.png);
}


div.gry_11_solid
{
	width:		168px;	/* 188 */
	height:		168px;	/* 188 */
	padding:	10px;
	
	float:		left;
	overflow:	hidden;
	/*margin-bottom:	2px;*/
	
	background-image:	url(/img/gry_11_solid.png);
}


/*
	2 x 1
*/

div.org_21short
{
	width:		356px;	/* 376 */
	height:		48px;	
	padding:	10px;
	
	float:		left;
	overflow:	hidden;
	/*margin-bottom:	2px;*/

	background-image:	url(/img/org_21short.png);
	
	


}

div.org_21blank
{
	width:		356px;	/* 376 */
	padding:	10px;
	float:		right;
	margin-bottom:	2px;
	float:		left;

}


div.org_21
{
	width:		356px;	/* 376 */
	height:		168px;	/* 188 */
	padding:	10px;
	
	float:		left;
	overflow:	hidden;
	/*margin-bottom:	2px;*/

	background-image:	url(/img/org_21.png);

}

div.gry_21
{
	width:		356px;	/* 376 */
	height:		168px;	/* 188 */
	padding:	10px;
	
	float:		left;
	overflow:	hidden;
	/*margin-bottom:	2px;*/

	background-image:	url(/img/gry_21.png);

}

div.gry_21_solid
{
	width:		356px;	/* 376 */
	height:		168px;	/* 188 */
	padding:	10px;
	
	float:		left;
	overflow:	hidden;
	/*margin-bottom:	2px;*/

	background-image:	url(/img/gry_21_solid.png);
}

/*
	2 x ?
*/

div.org_20
{
	width:		376px;
	margin-bottom:	2px;
	float:		left;
	background-image:	url(/img/org_20_mid.png);
}

div.org_20_left
{
	width:		376px;
	margin-bottom:	2px;
	float:		left;
	background-image:	url(/img/org_20_mid.png);
}

div.org_20_right
{
	width:		376px;
	margin-bottom:	2px;
	float:		right;
	background-image:	url(/img/org_20_mid.png);

}

div.org_20 div.top,
div.org_20_left div.top,
div.org_20_right div.top
{
	width:		376px;
	height:		8px;
	background-image:	url(/img/org_20_top.png);
}

div.org_20 div.bot,
div.org_20_left div.bot,
div.org_20_right div.bot
{
	width:		376px;
	height:		6px;
	background-image:	url(/img/org_20_bot.png);
	background-position:	bottom;
}


div.gry_20
{
	width:		376px;
	margin-bottom:	2px;
	
	float:		left;
	background-image:	url(/img/gry_20_mid.png);

}

div.gry_20 div.top
{
	width:		376px;
	height:		10px;
	background-image:	url(/img/gry_20_top.png);
}

div.gry_20 div.bot
{
	width:		376px;
	height:		10px;
	background-image:	url(/img/gry_20_bot.png);
	background-position:	bottom;
}






/*
	when an image is placed next to text allow a 10px gap
*/
div.onetwo div.two
{
	width:		366px;
	margin-left:	10px;
}

div.twoone div.two
{
	width:		366px;
	margin-right:	10px;
}


div.panel
{
	width:	188px;
}




/*
	generic modifiers
*/

.right
{
	float:		right;
}

.rightright
{
	float:		right;
	text-align:	right;
}

.left
{
	float:		left;
}

.leftleft
{
	float:		left;
	text-align:	left;
	padding-left: 40px;
}

.center
{
	text-align:	center;
}

/*
	h4 within orange boxes as bullet points under images
*/
.leftpad
{
	text-align:	left;
	padding-left:	10px;
}


/*
	NEWS
*/

div.hr
{
	clear:	both;
	padding-top:	10px;
	border-bottom:	1px solid #d7e3e8;
	margin-bottom:	10px;
}

div.news_item
{
	margin-bottom:	20px;
	clear:	both;
}

/* title */
div.news_item h3
{
	margin-bottom:	0;	/* so that the date can be bumped up correctly */
}

/* date */
div.news_item h4
{
	text-align: right;
	padding-right: 2px;
	position: relative;
	/*color: #d7e3e8; */
	top: -1.5em;		/* bump up a line - needs to be same height as the h3*/
}

div.news_item div.org_11_left
{
	margin-right: 10px;
}

div.news_item div.org_11_right
{
	margin-left: 10px;
}


/*
	FRONT PAGE 188 NEWS PANEL
*/

div.newspanel
{
	background-image:	url(/img/188_news_back.png);
	width:		188px;
	padding-top:	5px;
}

div.newspanel div.inn
{
	padding: 0 10px;
}

div.newspanel div.bot
{
	background-image:	url(/img/188_news_back_foot.png);
	background-position:	bottom;
	height:	10px;
}

div.newstop
{
	background-image:	url(/img/188_news_back_top.png);
	background-position:	top;
	height:	10px;
	margin-top: 22px;
	
}

div.newspanel h3
{
	font-size:	1.1em;
	font-weight:	bold;
	margin:	0;
}

div.newspanel h2
{

	font-weight:	bold;
	margin:	0;
	color:#f6a41d;
}

div.newspanel div.more
{
	text-align:	right;
}

div.newspanel div.more a
{
	text-align:	right;
	color:#21409a;
	text-decoration: underline;
}

div.newspanel div.more a:hover
{
	color:#f6a41d;
}





/*
	IMAGE VIEWER POPUP
*/


div#image_panel
{	
	width: 500px;
}

body#Image_Viewer
{
	text-align: center;
	/*width:	500px;*/
}

div.org_Image_Viewer
{
	margin:	0 auto;
	margin-top:	5px;
	width:		376px;
	margin-bottom:	2px;
	background-image:	url(/img/org_20_mid.png);
}

div.org_Image_Viewer div.top
{
	width:		376px;
	height:		8px;
	background-image:	url(/img/org_20_top.png);
}

div.org_Image_Viewer div.bot
{
	width:		376px;
	height:		6px;
	background-image:	url(/img/org_20_bot.png);
	background-position:	bottom;
}