html, body, #wrap {
	height: 100%; 
	margin: auto; 
	padding: 0;
	background-color: #cccc99;
	background-image: url(../images/bg-background.gif);
	background-repeat: no-repeat;	
	background-position: top;
}

body > #wrap {
	height: auto; 
	min-height: 100%;
}

a img {
	border: 0;
	border-color: #000000;
}

a  {
	color: #653365;
	text-decoration: underline;
	font-weight: bold;
}

a:hover {
text-decoration: underline;
}


#wrap {
	background: url(../images/bg-page.gif);
	width: 916px;
	margin: 0 auto 0 auto;
	position: relative;
}

#header {
	background: url(../images/bg-header.jpg);
	width: 920px;
	height: 170px;
}

#headerSubPage {
	background: url(../images/bg-header-subpage.jpg);
	width: 920px;
	height: 100px;
}


#main {
	padding-bottom: 75px;
}  /* must be same height as the footer */

#footer {
	position: relative;
	height: 75px;
	clear:both;
	background: url(../images/bg-footer.gif);
	width: 920px;
	margin: -75px auto 0 auto;
	text-align: center;
	color: white;
	font: 14px/1.5 arial, helvetica, sans-serif;
	line-height: 74px;
} 

/* CLEAR FIX*/
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.clearfix {
	display: inline-block;
}

/* Hides from IE-mac \*/
* html .clearfix { 
	height: 1%;
}

.clearfix {
	display: block;
}
/* End hide from IE-mac */

#leftWing {
	width: 200px;
	height: 592px;
	background: url(../images/bg-leftwing.jpg);
	position: absolute;
	left: -190px;
}

#rightWing {
	width: 199px;
	height: 655px;
	background: url(../images/bg-rightwing.jpg);
	position: absolute;
	right: -189px;
}







#mainNav {
	height: 34px;
	width: 920px;
	background: url(../images/bg-nav.jpg);
}

#mainNavSubPage {
	height: 35px;
	width: 920px;
	background: url(../images/bg-nav-subpage.jpg);
}

#mainNavLinks {
	font: 12px/1.5 arial, helvetica, sans-serif;
	color: white;
	position: relative;
	left: 150px;
	line-height: 34px;
	width: 700px;
}

#mainNavLinks a {
	color: white;
	text-decoration: none;
	margin: 0 10px 0 10px;
}

#mainNavLinks a:hover {
	text-decoration: underline;
}














#sidebarHome {
	height: 100%;
	width: 237px;
	background: url(../images/sidebar-home.jpg) no-repeat;
	float: right;
	padding-right: 20px;
	padding-top: 180px;
}

#sidebarSubPage {
	height: 536px;
	width: 247px;
	background: url(../images/sidebar-subpage.jpg) no-repeat;
	float: right;
	padding-right: 10px;
	padding-top: 100px;
}


#sidebarSubPage p {
	font-size: 12px;
	line-height: 14px;	
	color: #653365;
	position: relative;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 5px;
}

#sidebarSubPage H1 {
	font-size: 16px;
	font-family: arial, helvetica, sans-serif;
	line-height: 18px;	
	font-weight: bold;
	color: #653365;
	position: relative;
	padding-left: 10px;
	padding-right: 10px;
	padding-bottom: 5px;
}





#pageContent {
	margin-left: 10px;
	width: 610px;
}

#pageCopy {
	float: right;
	width: 540px;
	font: 13px/1.5 arial, helvetica, sans-serif;
	line-height: 16px;	
	color: #666;
}

#pageCopy p {
	margin-top: 0;
	padding-top: 0;
}




#pageCopySubIllustration {
	width: 540px;
	font: 13px/1.5 arial, helvetica, sans-serif;
	line-height: 16px;	
	color: #666;
	position: relative;
	left: 68px;
	background-image: url(../images/illustration.jpg);
	background-repeat: no-repeat;
}

#pageCopySubIllustration ul {
	list-style: circle;
	margin: 10px;
	padding: 7px;	
}

#pageCopySubIllustration li {
	font: 13px/1.5 arial, helvetica, sans-serif;
	line-height: 16px;	
	margin-bottom: 10px;
	padding: 0px;

}

#pageCopySubIllustration a:link, #subnav a:visited {
	padding: 0px;
	color: #653365;
	text-decoration: underline;
}

#pageCopySubIllustration a:hover {
	color: #653365;
	font-style: italic;
}




#pageCopySub {
	width: 540px;
	font: 13px/1.5 arial, helvetica, sans-serif;
	line-height: 16px;	
	color: #666;
	position: relative;
	left: 68px;
}


#pageCopySub h2 {
	color: #653365;
}

#pageCopySub ul {
	list-style: circle;
	margin: 10px;
	padding: 7px;	
}

#pageCopySub li {
	font: 13px/1.5 arial, helvetica, sans-serif;
	line-height: 16px;	
	margin-bottom: 10px;
	padding: 0px;

}

#pageCopySub a:link, #subnav a:visited {
	padding: 0px;
	color: #653365;
	text-decoration: underline;
}

#pageCopySub a:hover {
	color: #653365;
	font-style: italic;
}






#pageTitleHome {
	width: 610px;
	height: 112px;
	background: url(../images/page-title-home.jpg);
}

#pageTitleSubPage {
	width: 610px;
	height: 65px;
	background: url(../images/bg-page-title-subpage.jpg) no-repeat;
}


#pageTitleSubPage h2 {
	margin: 0;
	padding: 10px 0 0 65px;
	font: 32px/1.5 arial, helvetica, sans-serif;
	color: #663366;
}

.pageTitleSubPageDivider {
	background: url(../images/bg-h2.jpg) no-repeat;
	width: 488px;
	height: 4px;
	margin-left: 63px;
}

.pageTitleSubPageDivider2 {
	background: url(../images/bg-h2.jpg) no-repeat;
	width: 540px;
	height: 4px;
}

#pageTitleSubPageWhite {
	width: 610px;
	height: 65px;
}



#pageTitleSubPageWhite h2 {
	margin: 0;
	padding: 10px 0 0 65px;
	font: 32px/1.5 arial, helvetica, sans-serif;
	color: #663366;
}

.pageTitleSubPageWhiteDivider {
	background: url(../images/bg-h2.jpg) no-repeat;
	width: 488px;
	height: 4px;
	margin-left: 63px;
}




.hide {
	display: none;
}

#photoHome {
	width: 169px;
	height: 256px;
	background: url(../images/FPO-photo-home.jpg);
	border: 2px solid black;
	margin-left: 65px;
	float: left;
}

.photoSub {
	border: 2px solid black;
	margin: 0 25px 20px 0;
}

.clear {
	clear: both;
	padding-top: 30px;
}

#testimonialTop {
	background: url(../images/bg-testimonial-top.jpg) no-repeat;
	width: 251px;
	height: 55px;
}

#testimonialMiddle {
	background: url(../images/bg-testimonial-middle.jpg);
	padding: 0 30px 0 30px;
	font: 14px times, serif;
	line-height: 18px;
	font-style: italic;
	color: #663366;
	width: 190px;	
}

#testimonialMiddle p {	
	font: 14px times, serif;
	line-height: 18px;
	margin: 0;
	padding: 0 0 10px 0;
}

#testimonialBottom {
	background: url(../images/bg-testimonial-bottom.jpg) no-repeat;
	width: 251px;
	height: 55px;
}

#didyouknowTop {
	background: url(../images/bg-didyouknow-top.jpg) no-repeat;
	width: 251px;
	height: 60px;
}

#didyouknowMiddle {
	background: url(../images/bg-didyouknow-middle.jpg);
	padding: 0 30px 0 30px;
	font: 12px/1.5 times, serif;
	font-style: italic;
	color: #663366;
}

#didyouknowMiddle p {
	margin: 0;
	padding: 0;
}

#didyouknowBottom {
	background: url(../images/bg-didyouknow-bottom.jpg) no-repeat;
	width: 251px;
	height: 29px;
}

.clearTwo {
	clear: both;
}

.closeWindow {
	font-size: 12;
	color: #FFFFFF;
}







/* ================================================================ 
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/final_drop.html
Copyright (c) 2005-2008 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any 
way to fit your requirements.
=================================================================== */





.menu {
	width:920px;
	height:34px;
	position:relative;
	border:0px solid #000;
	font-family:arial, sans-serif;
	background: url(../images/bg-nav.jpg) no-repeat;
	background-image: url(../images/bg-nav.jpg);
}
/* hack to correct IE5.5 faulty box model */
* html .menu {width:920px; w\idth:920px;}
/* remove all the bullets, borders and padding from the default list styling */
.menu ul {padding:0;margin:0px 0px 0px 150px;list-style-type:none;}
.menu ul ul {width:50px;margin:0px 0px 0px -25px;}
/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.menu li {float:left;width:90px;position:relative; padding:0px; text-align:center;}
/* style the links for the top level */
.menu a, .menu a:visited {display:block;font-size:12px;text-decoration:none; color:#fff; width:90px; height:32px; border:0px solid #FFF; border-width:0px 0px 0px 0px; padding:0px; line-height:34px; font-weight:bold;}
/* a hack so that IE5.5 faulty box model is corrected */
* html .menu a, * html .menu a:visited {width:90px; w\idth:90px;}

/* style the second level background */
.menu ul ul a.drop, .menu ul ul a.drop:visited {background:#653365 url(../images/grey-arrow.gif) no-repeat 132px center;}
/* style the second level hover */
.menu ul ul a.drop:hover{background:#653365 url(../images/blue-arrow.gif) no-repeat 132px center;}
.menu ul ul :hover > a.drop {background:#900 url(../images/blue-arrow.gif) no-repeat 132px center;}
/* style the third level background */
.menu ul ul ul a, .menu ul ul ul a:visited {background:#900;}
/* style the third level hover */
.menu ul ul ul a:hover {background:#653365;}


/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu ul ul {visibility:hidden;position:absolute;height:0;top:31px;left:0; width:100px;border-top:0px solid #000;}
/* another hack for IE5.5 */
* html .menu ul ul {top:30px;t\op:31px; background:#653365;}

/* position the third level flyout menu */
.menu ul ul ul{left:149px; top:0px; width:140px;}

/* position the third level flyout menu for a left flyout */
.menu ul ul ul.left {left:-149px;}

/* style the table so that it takes no ppart in the layout - required for IE to work */
.menu table {position:absolute; top:0; left:0; border-collapse:collapse;;}

/* style the second level links */
.menu ul ul a, .menu ul ul a:visited {background:#653365; color:#FFF; height:auto; line-height:1em; padding:5px 10px; width:128px;border-width:0px 1px 1px 1px;}
/* yet another hack for IE5.5 */
* html .menu ul ul a, * html .menu ul ul a:visited {width:150px;w\idth:128px;}

/* style the top level hover */
.menu a:hover, .menu ul ul a:hover{color:#FDD710; background:#653365;}
.menu :hover > a, .menu ul ul :hover > a {color:#FDD710; background:#653365;}

/* make the second level visible when hover on first level list OR link */
.menu ul li:hover ul,
.menu ul a:hover ul{visibility:visible; }
/* keep the third level hidden when you hover on first level list OR link */
.menu ul :hover ul ul{visibility:hidden;}
/* make the third level visible when you hover over second level list OR link */
.menu ul :hover ul :hover ul{ visibility:visible;}