/* ::: RESET ALL MARGINS, PADDING, AND BORDERS ::: */
* { margin: 0; padding: 0; }
IMG { border: 0; }


/* ===============================
		::: PAGE LAYOUT :::
=============================== */

BODY {
	background: #d3e8f6 url(../images/bg_gradient.gif) top left repeat-x;
	text-align: center;
}
#pageContainer {
	width: 760px;
	margin: 0 auto;
	text-align: left;
	background: transparent url(../images/bg_pagecontainer.gif) 0 0 repeat-y;
}


/* ===============================
		::: MASTHEAD :::
=============================== */

#masthead {
	background: #fff url(../images/mst_01.jpg) 0 0 no-repeat;
	width: 100%;
	height: 177px; }

	#masthead H1 {
		text-indent: -5000px;
		background: transparent url(../images/logo.gif) 0 0 no-repeat;
		width: 262px;
		height: 125px;
		margin: 0;
		padding: 0; }

		#masthead H1 A {
			display: block;
			width: 262px;
			height: 125px; }


/* ===============================
		::: MENU :::
=============================== */


#menu {
	float: left;
	clear: left;
	width: 221px;
	padding: 1px 0;
	font: 13px/1.6em Georgia, Times, serif; }
	
	#menu UL {
		background: transparent url(../images/bg_menu.gif) 100% 0 repeat-y;
		margin: 28px 0 0 0;
		padding: 1px 0;
		list-style: none; }
		
		#menu LI {
			margin: 0;
			padding: 0;
			list-style-image: none !important;
			background: transparent url(../images/bg_menuitem.jpg) 18px -30px no-repeat;
			width: 221px;
			height: 30px; }
			
			#menu A {
				display: block;
				height: 25px !important;
				height /**/: 30px;
				padding-top: 5px;
				padding-left: 35px;
				text-decoration: none;
				color: #3a375c;
				background: transparent url(../images/bg_menuitem.jpg) 18px 0 no-repeat; }

			#menu A:hover { background-image: none; }

/* SUBMENU */
.submenu {
	width: 514px;
	height: 63px;
	position: relative;
	margin: 3px -26px 0 -26px;
	background: transparent url(../images/bg_submenu.gif) 0 0 no-repeat; }
	
	.submenu UL {
		padding-top: 12px;
		padding-left: 26px;
		margin: 0;
		float: left;
		display: inline;
		list-style: none; }

		.submenu LI {
			list-style: none;
			height: 51px;
			margin: 0 3em 0 0;
			float: left;
			display: inline; }

		.submenu LI.selected {
			background: transparent url(../images/bg_submenu_selected.gif) 50% 100% no-repeat; }

			.submenu LI A {
				font: 13px/1.6em Georgia, Times, serif;				
				color: #357686 !important;
				text-decoration: none; }

			.submenu LI A:hover { color: #00b08b !important; }


/* ===============================
		::: CONTENT :::
=============================== */

#contentContainer {
	float: left;
	clear: left;
	background: transparent url(../images/bg_contentcontainer.gif) 0 0 no-repeat;
	width: 100%;
	padding-bottom: 2em; }

#content {
	float: right;
	display: inline;
	width: 460px;
	margin-right: 50px; }

	#content H2 {
		text-indent: -5000px;
		width: 100%;
		height: 42px;
		margin: 0 -29px -42px 0;
		position: relative;
		top: -42px;
		left: -29px;
		background: transparent url(../images/ti_purpose.gif) 0 0 no-repeat; }

	#content P.first,
	#content UL.first {
		margin-top: 18px; }
		
/* This is a trick from http://www.mezzoblue.com/archives/2004/09/16/minheight_fi/index.php */
/* to get the menu to a min-height */
/* for Mozilla/Safari/Opera */
*>#content {
 padding-top: 430px;
 min-height: 1px;
}
*>#content H2 {
 margin-top: -430px;
}
/* for IE, with IE5/Mac backslash filter \*/
* html #content {
 height: 430px;
}
/* end filter */


/* ===============================
		::: FOOTER :::
=============================== */

#footer {
	height: 200px;
	clear: both;
	width: 100%;
	background: #d3e8f6 url(../images/bg_footer.gif) 0 0 no-repeat;
	font: 11px/1.6em Georgia, Times, serif; }

	/*#footer UL {
		float: right;
		display: inline;
		padding: 8px 0;
		list-style: none;
		width: 520px;
		border-top: 1px solid #fff;
		border-bottom: 1px solid #fff; }*/

	#footer DIV {
		float: right;
		display: inline;
		margin: 20px 20px 0 0;
		width: 520px;
		padding: 8px 0;
		list-style: none;
		border-top: 1px solid #fff;
		border-bottom: 1px solid #fff;
		text-align: center; }

		#footer A {
			border-left: 1px solid #38bfa8;
			padding: 0 5px;
			margin: 0;
			color: #38bfa8;
			text-decoration: none;  }

			#footer A.first { border-left: none; }