/****************************
/* Color pallette
****************************
#1A314B		Dark blue background
#214379		Medium blue - buttons
#3671CA		Light-medium blue - triangles

****************************/



/****************************
/* Global
****************************/

html, body {
	height: 100%;
	}
body {
	background-color: #1A314B; 
	margin: 0;
	border: 0;
	padding: 0;
	text-align: center;
	background-image: url(../images/background_Fade.jpg);
	background-repeat: no-repeat;
	background-position: center 242px;
	}
img, table {
	border: 0;
	}
#contentFrame {
	position: relative;
	width: 800px;
	z-index: 0;
	margin: 0 auto;
	padding-left: 0;
	padding-right: 0;
	padding-bottom: 0;
	padding-top: 0px;
	clear: left; 
	text-align: left;
	}
#contentLogoPanel {
	text-align: left;
	position: relative;
	width: 257px;
	height: 34px;
	padding: 0;
	border: 0;
	margin-left: 0px;
	margin-top: 0px;
	margin-bottom: 1px;
	background: url("../images/ccpLogo.jpg") 100% no-repeat;
	z-index: 100;
	}
#contentLogoPanelText{
	position: relative;
	font-size: 0px;
	visibility: hidden;
	z-index: -1;
	color: #1A314B;
	}
#bannerImage {
	position: relative;
	display: block;
	width: 800px;
	height: 208px;
	}
#bannerImage img {
	border: 0px;
	margin-bottom: -5px;
	padding: 0px;
	}


/* navigation panel */
/******** THIS CODE IS DEPRECATED - SEE BOTTOM OF CODE *******/

#navBlock, .navBlock{
	position: relative;
	width: 100%;
	display: block;
	}

/* the OFF and ON buttons */
#navBlock ul {
	position: relative;
	margin-left: 0px;
	padding-left: 0px;
	list-style-type: none;
	font-family: Arial, Book Antiqua, Verdana, sans-serif;
	font-size: 13px;
	padding-top: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	margin-bottom: 0px;
	font-weight: bold;
	text-decoration: none;
	text-align: center;
	}
#navBlock A {
	position: relative;
	display: block;
	float: left;
	padding: 3px;
	background-color: #214379;
	color: #ffffff;
	border-bottom: 1px #ffffff solid;
	border-left: 1px #ffffff solid;
	}

/* the OFF button links */
.nav_1_off A:link, .nav_1_off A:active, .nav_1_off A:visited, 
.nav_2_off A:link, .nav_2_off A:active, .nav_2_off A:visited,
.nav_3_off A:link, .nav_3_off A:active, .nav_3_off A:visited,
.nav_4_off A:link, .nav_4_off A:active, .nav_4_off A:visited,
.nav_5_off A:link, .nav_5_off A:active, .nav_5_off A:visited {
	background-color: #214379;
	color: #ffffff;
	border-bottom: 1px #ffffff solid;
	border-left: 1px #ffffff solid;
	}
.nav_1_off A:hover, .nav_2_off A:hover, .nav_3_off A:hover, .nav_4_off A:hover, .nav_5_off A:hover {
	color: #000000;
	background-color: #a0a0a0;  /* probably change */
	border-bottom: 1px #ffffff solid;
	border-left: 1px #ffffff solid;
	}

/* the ON button links */
.nav_1_on A:link, .nav_1_on A:active, .nav_1_on A:visited, 
.nav_2_on A:link, .nav_2_on A:active, .nav_2_on A:visited,
.nav_3_on A:link, .nav_3_on A:active, .nav_3_on A:visited,
.nav_4_on A:link, .nav_4_on A:active, .nav_4_on A:visited,
.nav_5_on A:link, .nav_5_on A:active, .nav_5_on A:visited,
.nav_1_on A:hover, .nav_2_on A:hover, .nav_3_on A:hover, .nav_4_on A:hover, .nav_5_on A:hover {
	background-color: #7798B3;
	color: #000000;
	border-bottom: 1px #7798B3 solid;
	border-left: 1px #ffffff solid;
	background-image: url(../images/highlightedButton.jpg);
	background-repeat: repeat-x;
	background-position: bottom;
	}
.nav_1_on A:hover, .nav_2_on A:hover, .nav_3_on A:hover, .nav_4_on A:hover, .nav_5_on A:hover {
	color: #214379;
}

/* set the width:  include only 1 white line; add 1 for "width" and then have -1 as the margin (hack for both browsers) */
.nav_1_off, .nav_1_off A, .nav_1_off A:link, .nav_1_off A:active, .nav_1_off A:visited, .nav_1_off A:hover {
	width: 192px;
	margin-right: -1px;
	}
.nav_1_on, .nav_1_on A, .nav_1_on A:link, .nav_1_on A:active, .nav_1_on A:visited, .nav_1_on A:hover {
	width: 192px;
	margin-right: -1px;
	border-left: 0;
	}
.nav_2_off, .nav_2_off A, .nav_2_off A:link, .nav_2_off A:active, .nav_2_off A:visited, .nav_2_off A:hover,
.nav_2_on, .nav_2_on A, .nav_2_on A:link, .nav_2_on A:active, .nav_2_on A:visited, .nav_2_on A:hover {
	width: 138px;
	margin-right: -1px;
	}
.nav_3_off, .nav_3_off A, .nav_3_off A:link, .nav_3_off A:active, .nav_3_off A:visited, .nav_3_off A:hover,
.nav_3_on, .nav_3_on A, .nav_3_on A:link, .nav_3_on A:active, .nav_3_on A:visited, .nav_3_on A:hover {
	width: 162px;
	margin-right: -1px;
	}
.nav_4_off, .nav_4_off A, .nav_4_off A:link, .nav_4_off A:active, .nav_4_off A:visited, .nav_4_off A:hover,
.nav_4_on, .nav_4_on A, .nav_4_on A:link, .nav_4_on A:active, .nav_4_on A:visited, .nav_4_on A:hover {
	width: 152px;
	margin-right: -1px;
	}
.nav_5_off, .nav_5_off A, .nav_5_off A:link, .nav_5_off A:active, .nav_5_off A:visited, .nav_5_off A:hover {
	width: 158px;
	border-right: 1px #ffffff solid;
	margin-right: -1px;
	}
.nav_5_on, .nav_5_on A, .nav_5_on A:link, .nav_5_on A:active, .nav_5_on A:visited, .nav_5_on A:hover {
	width: 159px;
	margin-right: -1px;
	}

/* just sets the vertical spacing */
#navLinkText, .navLinkText {
	padding-bottom: 7px;
	padding-top: 7px;
	padding-left: 2px;
	padding-right: 2px;
	}
/*********** END DEPRECATED CODE ***********************************/


/* content */
#contentWrapper {
	position: relative;
	display: block;
	float: left;
	width: 784px;
	background-color: #7798B3;
	padding-top: 10px;
	padding-left: 8px;
	padding-right: 8px;
	padding-bottom: 3px;
	}
#pageContent {
	position: relative;
	display: block;
	background-color: #ffffff;
	padding-top: 2px;
	padding-left: 25px;
	padding-right: 25px;
	padding-bottom: 20px;
	}
#pageContent p, #pageContent ul, #pageContent li, #pageContent ol, #pageContent li, #pageContent table, #whoWeAre {
	font-family: Arial, Verdana, sans-serif;
	font-size: 12px;
	color: #404040;
	line-height: 18px;
	padding-top: 0px;
	}
#pageContent li {
	padding-bottom: 5px;
	}
#pageContent h1 {
	font-family: Book Antiqua, Arial, Verdana, sans-serif;
	font-size: 19px;
	letter-spacing: 2px;
	color: #3269BA;
	background-image: url(../images/headerBkg.jpg);
	background-repeat: no-repeat;
	background-position: bottom left;
	padding-left: 9px;
	padding-bottom: 2px;
	margin-left: -2px;
	padding-top: 20px;
	margin-top: 0px;
	margin-bottom: 0px;
	}
#pageContent h2 {
	font-family: Arial, Verdana, sans-serif;
	font-size: 15px;
	color: #800000;
	font-weight: bold;
	margin-bottom: 0px;
	}
#contactHeader, .contactHeader  {
	font-family: Arial, Verdana, sans-serif;
	color: #000000;
	background-color: #eaeaea;
	border: 1px #c0c0c0 solid;
	padding: 2px;
	margin: 0px;
	font-weight: bold;
	text-align: center;
	}
#pageContent A, #pageContent A:link, #pageContent A:visited, #pageContent A:active {
	font-family: Arial, Verdana, sans-serif;
	font-size: 12px;
	color: #224379;
	text-decoration: underline;
	font-weight: bold;
	}
#pageContent A:hover {
	font-family: Arial, Verdana, sans-serif;
	font-size: 12px;
	color: #800000;
	text-decoration: underline;
	font-weight: bold;
	}
#accent, .accent {
	font-weight: bold;
	}
#accentU, .accentU {
	text-decoration: underline;
	}
.portfolioLogo {
	float: right;
	width: 215px;
	padding-left: 5px;
	margin-left: 10px;
	padding-top: 0px;
	padding-bottom: 10px;
	text-align: center;
	border-left: 1px #a0a0a0 dashed;
	font-family: Arial, sans-serif;
	font-size: 11px;
	font-weight: bold;
}
.bioPhoto {
	padding-top: 4px;
	}
.dropcap {
	float:left;
	color:#7798B3;
	font-size:30px;
	line-height:25px;
	padding-top:0px;
	font-family: Book Antiqua, Arial, serif;
	font-weight: bold;
	padding-right: 1px;
} 
#whoWeAre {
	position: relative;
	float: right;
	width: 300px;
	border: 1px #c0c0c0 solid;
	padding: 4px;
	margin-top: 20px;
	padding-bottom: 8px;
	margin-left: 5px;
}

/* expander/contractor */
.clickOpen {
	position: relative;
	width: 650px;
	margin-left: 40px;
	padding: 2px;
	padding-bottom: 3px;
	background-color: #E4DDBE;
	border: 1px #E4DDBE solid; 
	text-align: center;
	}
.clickClose {
	position: relative;
	float: right;
	border: 1px #918135 solid;
	padding: 0px;
	padding-left: 2px;
	padding-right: 2px;
	}
.clickOpen, .clickOpen A, .clickOpen A:link, .clickOpen A:hover, .clickOpen A:visited, .clickOpen A:active,
.clickClose A, .clickClose A:link, .clickClose A:hover, .clickClose A:visited, .clickClose A:active {
	font-family: Arial, sans-serif;
	font-size: 12px;
	color: #000000;
	text-decoration: none;
	font-weight: bold;
	}
.expander {
	visibility: visible;
	position: relative;
	display: block;
	width: 642px;
	margin-left: 40px;
	padding-left: 6px;
	padding-right: 6px;
/*	background-color: #F6F3E6; */
	border-left: 1px #E4DDBE solid;
	border-right: 1px #E4DDBE solid;
	border-bottom: 1px #E4DDBE solid;
	}
.expander, .expander p, .expander td {
	font-family: Arial, Verdana, sans-serif;
	font-size: 12px;
	color: #404040;
	line-height: 18px;
	padding-top: 0px;
	}
.hideExpander {
	visibility: hidden;
	position: absolute;
	}


/* cartoon viewer */
#cartoonFrame {
	width: 560px;
	padding: 3px;
	text-align: center;
	border: 1px #c0c0c0 solid;
	background-repeat: no-repeat;
	background-position: center center;
	}
#cartoonFrame_1, .cartoonFrame_1 {
	height: 580px;
	background-image: url(../images/cartoon_1.jpg);
	}
#cartoonFrame_2, .cartoonFrame_2 {
	height: 557px;
	background-image: url(../images/cartoon_2.jpg);
	}
#cartoonFrame_3, .cartoonFrame_3 {
	height: 667px;
	background-image: url(../images/cartoon_3.jpg);
	}
#cartoonFrame_4, .cartoonFrame_4 {
	height: 490px;
	background-image: url(../images/cartoon_4.jpg);
	}
#cartoonFrame_5, .cartoonFrame_5 {
	height: 503px;
	background-image: url(../images/cartoon_5.jpg);
	}
#cartoonFrame_6, .cartoonFrame_6 {
	height: 511px;
	background-image: url(../images/cartoon_6.jpg);
	}
#cartoonFrame_7, .cartoonFrame_7 {
	height: 507px;
	background-image: url(../images/cartoon_7.jpg);
	}
#cartoonFrame_8, .cartoonFrame_8 {
	height: 624px;
	background-image: url(../images/cartoon_8.jpg);
	}
.cartoonThumb {
	width: 108px;
	display: block;
	text-align: center;
	margin-bottom: 0px;
	margin-top: 0px;
	}
.cartoonThumb A img, .cartoonThumb A:link img, .cartoonThumb A:visited img, .cartoonThumb A:active img {
	border: 1px #c0c0c0 solid;
	padding: 2px;
	}
.cartoonThumb A:hover img {
	border: 1px #3269BA dashed;
	padding: 2px;
	}
.cartoonThumb2  {
	width: 104px;
	display: block;
	margin-top: 0px;
	margin-left: 1px;
	margin-bottom: 3px;
	text-align: center;
	border: 1px #c0c0c0 solid;
	}
#cartoonFrameHidden {
	display: none;
	visibility: hidden;
	position: absolute;
	}


/* page tabs */
#pageTab {
	position: relative;
	display: block;
	padding-bottom: 25px;
	margin-top: 5px;
	}
#pageTab A, #pageTab A:active, #pageTab A:link, #pageTab A:visited, #pageTab A:hover {
	font-family: Book Antiqua, Arial, sans-serif;
	font-size: 14px;
	font-weight: bold;
	text-decoration: none;
	color: #918135;
	}
.pageTab_Left_Off, .pageTab_Left_On, .pageTab_Right_Off, .pageTab_Right_On, .pageTab_Middle_On {
	position: relative;
	float: right;
	padding-top: 3px;
	padding-bottom: 5px;
	padding-left: 15px;
	padding-right: 15px;
	}
.pageTab_Right_Off {
	background-image: url(../images/pageTab.jpg);
	background-repeat: no-repeat;
	background-position: bottom left;
	border-bottom: 1px #918135 solid;
	border-left: 1px #918135 solid;
	}
.pageTab_Right_On {
	border-top: 1px #918135 solid;
	border-right: 1px #918135 solid;
	}
.pageTab_Left_Off {
	background-image: url(../images/pageTab_2.jpg);
	background-repeat: no-repeat;
	background-position: bottom right;
	border-bottom: 1px #918135 solid;
	border-right: 1px #918135 solid;
	}
.pageTab_Left_On {
	border-top: 1px #918135 solid;
	border-left: 1px #918135 solid;
	}
.pageTab_Middle_On {
	border-top: 1px #918135 solid;
	}

/* bottom panel */
#bottomPanel{
	position: relative;
	display: block;
	float: left;
	width: 800px;
	border-top: 1px #000000 solid;
	background-color: #214379;
	border-bottom: 1px #c0c0c0 solid;
	margin-bottom: 3px;
	padding-top: 6px;
	padding-bottom: 6px;
	}
#leftPanel {
	position: relative;
	float: left;
	width: 375px;
	padding-left: 25px;
	}
#leftPanel, #leftPanel A, #leftPanel A:link, #leftPanel A:active, #leftPanel A:visited, #leftPanel A:hover {
	color: #ffffff;
	font-family: Arial, Verdana, sans-serif;
	font-size: 11px;
	text-decoration: none;
	}
#leftPanel A:hover {
	color: #c0c0c0;
	font-family: Arial, Verdana, sans-serif;
	font-size: 11px;
	text-decoration: underline;
	}
#rightPanel {
	position: relative;
	float: left;
	width: 375px;
	text-align: right;
	padding-right: 25px;
	color: #ffffff;
	font-family: Arial, Verdana, sans-serif;
	font-size: 11px;
	}
#bottomLine {
	position: relative;
	float: left;
	width: 100%;
	height: 1px;
	border-top: 1px #c0c0c0 solid;
	}



/* new NAV links */
#navcontainer { 
	position: relative;
	display: block;
	width: 100%;
	}
#navcontainer ul, #navcontainer li {
	margin-left: 0;
	padding-left: 0;
	margin-top: 0px;
	margin-bottom: 0px;
	list-style-type: none;
	font-family: Arial, Book Antiqua, Verdana, sans-serif;
	font-size: 13px;
	font-weight: bold;
	float: left;
	position: relative;
	display: block;
	padding: 0;
	text-align: center;
}
/* sets the overall spacing, padding, etc. */
#navcontainer a {
	position: relative;
	display: block;
	float: left;
	padding-bottom: 7px;
	padding-top: 7px;
	padding-left: 0px;
	padding-right: 0px;
}
/* regular background for the OFF links */
#nav1_off A, #nav1_off A:link, #nav1_off A:visited, #nav1_off A:active,
#nav2_off A, #nav2_off A:link, #nav2_off A:visited, #nav2_off A:active,
#nav3_off A, #nav3_off A:link, #nav3_off A:visited, #nav3_off A:active,
#nav4_off A, #nav4_off A:link, #nav4_off A:visited, #nav4_off A:active,
#nav5_off A, #nav5_off A:link, #nav5_off A:visited, #nav5_off A:active {
	color: #FFFFFF;
	text-decoration: none;
	background-color: #214379;
	border-bottom: 1px #FFFFFF solid;
	}
/* hover background for the OFF links */
#nav1_off A:hover, #nav2_off A:hover, #nav3_off A:hover, #nav4_off A:hover, #nav5_off A:hover {
	color: #000000;
	text-decoration: none;
	background-color: #a0a0a0;
	border-bottom: 1px #ffffff solid;
}

/* regular background for the ON links */
#nav1_on A, #nav1_on A:link, #nav1_on A:visited, #nav1_on A:active,
#nav2_on A, #nav2_on A:link, #nav2_on A:visited, #nav2_on A:active,
#nav3_on A, #nav3_on A:link, #nav3_on A:visited, #nav3_on A:active,
#nav4_on A, #nav4_on A:link, #nav4_on A:visited, #nav4_on A:active,
#nav5_on A, #nav5_on A:link, #nav5_on A:visited, #nav5_on A:active {
	background-color: #7798B3;
	color: #000000;
	background-image: url(../images/highlightedButton.jpg);
	background-repeat: repeat-x;
	background-position: bottom;
	border-bottom: 1px #7798B3 solid;
	text-decoration: none;
	}
/* hover background for the ON links */
#nav1_on A:hover, #nav2_on A:hover, #nav3_on A:hover, #nav4_on A:hover, #nav5_on A:hover {
	color: #214379;
	text-decoration: none;
}
/* left and right borders */
#nav1_off A, #nav2_off A, #nav3_off A, #nav4_off A, #nav5_off A,
#nav2_on A, #nav3_on A, #nav4_on A, #nav5_on A {
	border-left: 1px #ffffff solid;
	}
/* set the width:  include only 1 white line; add 1 for "width" and then have -1 as the margin (hack for both browsers) */
#nav1_off, #nav1_off A, #nav1_off A:link, #nav1_off A:active, #nav1_off A:visited, #nav1_off A:hover {
	width: 192px;
	margin-right: -1px;
	}
#nav1_on, #nav1_on A, #nav1_on A:link, #nav1_on A:active, #nav1_on A:visited, #nav1_on A:hover {
	width: 192px;
	margin-right: -1px;
	border-left: 0;
	}
#nav2_off, #nav2_off A, #nav2_off A:link, #nav2_off A:active, #nav2_off A:visited, #nav2_off A:hover,
#nav2_on, #nav2_on A, #nav2_on A:link, #nav2_on A:active, #nav2_on A:visited, #nav2_on A:hover {
	width: 138px;
	margin-right: -1px;
	}
#nav3_off, #nav3_off A, #nav3_off A:link, #nav3_off A:active, #nav3_off A:visited, #nav3_off A:hover,
#nav3_on, #nav3_on A, #nav3_on A:link, #nav3_on A:active, #nav3_on A:visited, #nav3_on A:hover {
	width: 162px;
	margin-right: -1px;
	}
#nav4_off, #nav4_off A, #nav4_off A:link, #nav4_off A:active, #nav4_off A:visited, #nav4_off A:hover,
#nav4_on, #nav4_on A, #nav4_on A:link, #nav4_on A:active, #nav4_on A:visited, #nav4_on A:hover {
	width: 152px;
	margin-right: -1px;
	}
#nav5_off, #nav5_off A, #nav5_off A:link, #nav5_off A:active, #nav5_off A:visited, #nav5_off A:hover {
	width: 158px;
	border-right: 1px #ffffff solid;
	margin-right: -1px;
	}
#nav5_on, #nav5_on A, #nav5_on A:link, #nav5_on A:active, #nav5_on A:visited, #nav5_on A:hover {
	width: 159px;
	margin-right: -1px;
	}