@charset "utf-8";
/* CSS Document */

/*colors
light blue #b7cde2
dark gray #4a494e
or slightly ligther dark gray #666 for the body text
dark blue #8694AE
orange #D87D3F
*/

* { /*wildcard selector for html, dbody, ul, ol, li, etc */
margin: 0;
padding: 0;
border: 0;
}

body {
	font-family:Verdana, Arial, Helvetica, sans-serif;
	color: #333333;
	background-color: #424661 ;	
/*background-color: #F8F8F8 ;*/
	font-size: 75%;
	margin: 0;
	padding: 0;
	text-align:center; /* fix IE5 bug for left/right value */
}

h1, h2, h3, h4, h5, h6  {
	font-family: Arial, Helvetica, sans-serif;
	font-size:130%;
	color:#5c626e;
	margin: 0;
	padding: 0;
}

h2 {
	font-size:140%;
	color:#D87D3F;
	padding:0 0 5px 0;
	margin:0;
}

h3 {
color:#333;
font-size:120%;
font-style:italic;
padding:5px 25px;
}

h5 {
display:block;
background-color:#8694AE;
color:#FFF;
font-size:120%;
padding:0.2em 0 0.2em 0.5em;
margin:0 0 5px 0;
}

hr {
border: solid 1px #666;
}

.clearit {
clear: both;
}

#wrapper {
	width: 1000px;
	background-color: #FFF;
	margin:auto;
	padding:0;
	overflow:hidden;
	border-left: solid 1px #0C1319;
	border-right: solid 1px #0C1319;
	text-align:left /* the only reason this is here is to compensate for the text-align:center IE5 fix in the body selector */
}

#header {
width:1000px;
height:216px;
}

#logo {
float:left;
width:394px;
height:216px;
background-image:url(../img/logo.jpg);
background-repeat:no-repeat;
}

#headerimage {
float:right;
width:606px;
height:216px;
background-image:url(../img/header.jpg);
background-repeat:no-repeat;
}

#headertext {
width:606px;
height:139px;
}

#headertexttop {
	padding:0;
	width:606px;
	height:66px;
}

#headertextbottom {
	padding:0px 0 0 0;
	width:606px;
	height:43px;
}

#headertextbottom p {
	text-align: right;
	padding:0 70px 0 0;
	font-weight:bold;
	font-size:120%;
	color:#FFF;
}


#navbar {
	width:480px;
	height:29px;
	padding:0 0 0 120px;
	margin:0;
}

#pageheadline {
width:606px;
height:48px;
text-align:left;
}

#pageheadline p {
	padding:7px 0 0 2px;
	font-size:175%;
	font-weight:bold;
	color:#FFF;
}

/* the contentcontainer is a global div box for all pages. If this isn't a parent element for page content elements then things will break. */

#contentcontainer {
	width:910px;
	height: auto;
	margin:0;
	padding:50px 0 0 90px;
	color: #333;
}



/*  divs for main page content. contentleft is a main container that can include the leftcolumn div class -which actually is a right hand column that resides inside the contentleft div as a float right element. Important note: if the leftcolumn doesn't contain enough content to make it the same height as the information in the parent contentleft box then the content in contentleft will flow around the text in the leftcolumn box. 

Contentright is the container for the righttextbox "about" and "training" textboxes. The border-left on the contentright box expands as more righttextbox div class elements are added.   */

#contentleft {
	float:left;
	position:relative;
	left:0px;
	width:510px;
	height:auto;
	padding:0 10px;
	margin:0;
}

.contentleftcolumn {
	float:right;
	width:250px;
	height:auto;
	padding:0;
	margin:0 0 0 15px;
}

#contentleft p {
	font-size:90%;
	line-height:140%;
}

#contentleft strong {
	font-weight:bold;
	color:#8694AE;
}

#contentleft a {
color:#8694AE;
}


#contentleft a:hover, #contentleft a:focus {
color:#6699FF;
}

#contentright {
	position:relative;
	left:-80px;
	float:right;
	width:230px;
	height:auto;
	border-left:solid 1px #666;
	padding:0 0 40px 40px;
	margin:0;
}

.righttextbox {
width:auto;
height:auto;
padding:0;
margin:0;
}

.righttextbox p {
font-size:90%;
line-height:140%;
}

.righttextbox h4 {
	font-size:120%;
	color:#D87D3F;
	padding:0 0 15px 0;
	margin:0;
}

.righttextbox strong {
font-weight:bold;
}

.righttextbox a {
color:#8694AE;
}

.righttextbox a:hover, .righttextbox a:focus {
color:#6699FF;
}


/* The following section contains elements for about and services and training sections */

#leftbox {
	position:relative;
	/* left:0px; */
	left:-50px;
	float:left;
	width:170px;
	height:auto;
	margin:0;
	padding:5px;
}

/*the following are values for the orange, left-hand menu items */
.orangemenu {
	width:170px;
	height:auto;
	padding:0;
	margin:0;
}

.orangemenu ul {
list-style:none;
margin:0;
padding:0;
border:none;
}

.orangemenu ul li {
	margin:0;
	padding:0 0 6px 0;
}

.orangemenu ul li a {
	font-size:140%;
	display:block;
	padding:0.4em;
	text-decoration:none;
	background-color:#D87D3F;
	color:#FFF;
	font-weight: bold;
	text-align:center;
}

.orangemenu ul li a:hover, .orangemenu ul li a:focus {
color:#FFF;
background:#999;
}

/*the following are values for the white, left-hand menu items */

.whitemenu {
	width:168px;
	height:auto;
	padding:0;
	margin:0 0 6px 0;
	border: solid 1px #4a494e;
}

.whitemenu ul {
list-style:none;
margin:0;
padding:0;
border:none;
}

.whitemenu ul li {
	margin:0;
	padding:0;
}

.whitemenu ul li a {
	font-size:90%;
	display:block;
	padding:0.4em;
	text-decoration:none;
	background-color:#FFF;
	color:#4a494e;
	font-weight: bold;
}

.whitemenu ul li a:hover, .whitemenu ul li a:focus {
color:#FFF;
background:#4a494e;
}

/*This defines how the sub-menus (for example, the month class calendar links) will look */

.whitemenu ul ul {
list-style:none;
margin:0;
padding:4px 0 0 0;
border:none;
}

.whitemenu ul ul li {
	margin:0;
	padding:0 0 0 0px;
}

.whitemenu ul ul li a {
	font-size:80%;
	display:block;
	padding:0.2em 0.2em 0.4em 0.4em;
	text-decoration:none;
	background-color:#FFF;
	color:#4a494e;
	font-weight:normal;
}

.whitemenu ul ul li a:hover, .whitemenu ul ul li a:focus {
color:#FFF;
background:#4a494e;
}

.whitemenu ul ul ul li {
	margin:0;
	padding:0 0 0 14px;

}

.whitemenu ul ul ul li a {
	font-size:80%;
	display:block;
	padding:0.2em 0.2em 0.4em 0.4em;
	text-decoration:none;

	background-color:#FFF;
	color:#4a494e;
	font-weight:normal;
}

.whitemenu ul ul ul li a:hover, .whitemenu ul ul li a:focus {
color:#FFF;
background:#4a494e;
}




#sectioncontent {
	float:right;
	position:relative;
	/* left:-90px; */
	/* width:600px; */
	left:-40px;
	width:700px;
	height:auto;
}

#sectioncontent p {
font-size:90%;
line-height:140%;
}

#sectioncontent a {
color:#8694AE;
}


#sectioncontent a:hover, #sectioncontent a:focus {
color:#6699FF;
}

#sectioncontent ul, ol, li {
font-size:90%;
margin:0;
padding: 2px 0 2px 25px;
}

/*these are the text boxes for the sectionconent and are meant to be used together on a page for two columns with borders (as opposed to the main page two columns that have no borders */
.floatleftbox {
	float:left;
	width:260px;
	height:auto;
	border:solid 1px #8694AE;
	margin: 0;
	padding: 0 0 10px 0;
}

.floatleftbox h6 a, .floatleftbox li a {
text-decoration:none;
list-style:none;
}

.floatleftbox p {
margin:0;
padding:0 10px 0 20px;
}

.floatleftbox ul {
margin:0;
padding:0;
}

.floatleftbox ul li {
font-size:120%;
font-weight:bold;
margin:0 6px 0 6px;;
padding:0 0 6px 0;
color:#8694AE;
}


.floatrightbox {
	float:right;
	width:260px;
	height:auto;
	border:solid 1px #8694AE;
	margin: 0 50px 0 0;
	padding: 0 0 10px 0;
}

.floatrightbox h6 a, .floatrightbox li a {
text-decoration:none;
}

.floatrightbox p {
margin:0;
padding:0 10px 0 20px;
}


.floatrightbox ul {
margin:0;
padding:0;
}

.floatrightbox ul li {
font-size:120%;
font-weight:bold;
margin:0 6px 0 6px;
padding:0 0 6px 0;
color:#8694AE;
}

/* This starts the footer information section.  */

#footer {
width:1000px;
height:70px;
background-image:url(../img/footer.jpg);
background-repeat:no-repeat;
margin:20px 0 0 0;
padding:0;
}

#footertext {
	position:relative;
	left: 280px;
	top: 50px;
}

#footertext p {
font-size:75%;
color:#4a494e;
}

#footertext p a {
	padding:5px;
	color:#4a494e;
	text-decoration:none;
}

#footertext a:hover, #footer a:focus {
	color: #8694ae;
}

.leftimage {
float: left;
margin: 0 10px 10px 0;
border: 1px solid #666;
}

.rightimage {
float: right;
margin: 0 0 10px 10px;
border: 1px solid #666;
}

table {
border: none;
padding:0;
marging:0;
}

td {
border: 1px solid #999;
padding: 4px;
margin:0;
}


/*colors
light blue #b7cde2
dark gray #4a494e
dark blue #8694AE
orange #D87D3F
*/