/*********************************
* GENERIC STYLES
*********************************/
.noCSS {
	display: none;
}

body {
	margin: 0;
	padding: 12px 0 0;
	background-color: #E3E3E6;
	color: #787A7D;
	font-family: Arial, Helvetica, sans-serif;
}
td {
	vertical-align: top;
}
h1,
h2,
h3,
h4,
h5,
h6,
p,
form {
	margin: 0;
}
input,
select,
textarea {
	font-family: Arial, Helvetica, sans-serif;
}
.hide {
	display: none;
}
.clear {
	clear: both;
	height: 1px;
}
#outer {
	width: 976px;
	margin: 0 auto;
	
}
#mainbar {
	float: left;
	width: 100%;
	background-color:#ffffff;
	padding-top:20px;
}
#navpanel {
	position:relative;
	z-index:7;
	float: left;
	width: 222px;
	margin: 0 0 14px 0;
	min-height:200px;
}
#logo {
	width: 200px;
	height: 200px;
	padding: 0 0 8px 18px;
	border: 0;
	background-color:#ffffff;
}
/*******************************
* CONTACT PANEL STYLES
*******************************/
#contactpanel {
	clear: left;
	float: left;
	width:170px;
	display:block;
	position:relative;
	left:30px;
	/*top:100px;*/
	padding: 20px 0 20px 20px;
	background-color: #ffffff;
	color: #50687A;
	text-align: left;
	font-size:120%;
	line-height:1.3em;
	font-weight:normal;
}

#contactpanel img {
	display: block;
	width: 220px;
	margin: 0 0 0.6em;
}
#contactpanel p {
	margin: 0 0 0.8em;   
	font-size: 75%;
}


#contentpanel {
	float: left;
	width: 740px;
}
#contactpanel a {
	color:#787A7D;
}
#contactpanel a:hover,
#contactpanel a:active,
#contactpanel a:focus {
	color:#000000;
}

#maincontent {
	float: right;
	width: 740px;
	
}
/**********************************
*   TOP IMAGE
**********************************/
#topimg {
	display: block;
	border-bottom: 14px solid #ffffff;
}
#topimg .item {
	display: none;
}
#topimg .caption {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 728px;
	padding: 6px;
	color: #ffffff;
	font-size: 75%;
	line-height: 1.3em;
}
#topimg img {
	display: block;
	width: 710px;
	height: 388px;
}
/*********************************
* Home and sliding image styling
*********************************/
.homeimage {
	display: block;
	width: 740px;
	height: 725px;
	margin: 0 0 14px;
}
/********************************
* SLIDESHOW STYLES
********************************/
#slideshow {
	position: relative;
	z-index:2;
	clear: left;
	float: left;
	width: 740px;
	height: 725px;
}
#slideshow .item {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
}
#slideshow img {
	display: block;
	width: 710px;
	height: 725px;
}
#slideshow .caption {
	position: absolute;
	bottom: 0;
	left: 0;
	padding: 6px;
	background: rgba(16,16,16,0.5) none;
	color: #ffffff;
	font-size: 75%;
	line-height: 1.3em;
}

#videolist {
	padding:20px;
}
/**********************************
* CONTAINER STYLES
**********************************/


#content {
	clear: left;
	float: left;
	width: 710px;
}
#content .contentwrapper h1 {
	margin: 0 0 1.2em;
	font-size: 75%;
}
#content .contentwrapper h5 {
	margin: 0 0 1.2em;
	background-color: #ffffff;
	color: #787A7D;
	font-size: 75%;
	font-weight: normal;
	line-height: 1.3em;
}
#content p {
	margin: 0 0 1.2em;
	font-size: 75%;
	line-height: 1.3em;
}
#content .contentwrapper {
	clear: left;
	float: left;
	width: 690px;
	padding: 5px 10px;
}
#content .container {
	clear: left;
	float: left;
	width: 100%;
}
#content .container ul,
#content .container ol {
	margin-bottom: 1.2em;
	background-color: #50687A;
	color: #ffffff;
	font-size: 75%;
	line-height: 1.3em;
	list-style:none;
	padding:10px 6px 4px 20px; 
}
#content .container li {
	margin: 0 0 0.2em;
}
#content .container ul ul,
#content .container ul ol,
#content .container ol ul,
#content .container ol ol {
	font-size: 100%;
}
#content .container img.right {
	float: right;
	margin: 0 0 1.2em 1.2em;
}
#content .container img.left {
	float: left;
	margin: 0 1.2em 1.2em 0;
}
#content .container img.centre,
#content .container img.block {
	display: block;
}
#content .container img.centre {
	margin: 0 auto 1.2em;
}
#content .container img.block {
	margin: 0 0 1.2em;
}

#content .container a {
	background-color:#ffffff;
	color:#787A7D;
}

#content .container a:hover,
#content .container a:active,
#content .container a:focus {
	background-color:#ffffff;
	color:#000000;
}

#content .withformcol {
	float: right;
	width: 292px;
}
	
#imagelinkpadding {
	height: 26px;
}

/**********************************/

#zonewrapper {
	clear: left;
	float: left;
	width: 100%;
}
#content .container table.project {
	width: 100%;
	margin: 0 0 1.2em;
	font-size: 75%;
	line-height: 1.3em;
}
#content .container table.project th,
#content .container table.project td {
	vertical-align: top;
}
#content .container table.project th {
	padding: 3px 6px 3px 0;
	background-color: #ffffff;
	color: #506879;
	font-weight: normal;
	text-align: left;
}
#content .container table.project td {
	padding: 3px 0;
}

#content .contentwrapper #leftzone {
	float:left;
	width:426px;
}

#content .contentwrapper #leftzone .titles {
	background-color:#ffffff;
	color:#0095A1;	
}

#content .contentwrapper #leftzone .pcontent {
	background-color:#ffffff;
	color:#ffffff;
    text-align:left;

}

#content .contentwrapper #rightzone {
	float:right;
	width:254px;
	border-bottom: 10px solid #ffffff;
}

/****************************
* CONTACT US FORM STYLING
****************************/
#content .container #contactusform {
	clear: left;
	float: left;
	width: 300px;
}

#content .container #contactusform input, textarea {
	border:1px solid #999999;
	background-color:#ffffff;
	color:#999999;
}

#content .container #contactusform textarea {
	font-size:95%;
}

#content .container #contactusform input.submit {
	background-color:#50687A;
	cursor:pointer;
	color:#ffffff;
}

#content .container #contactusform label {
	font-size:70%
}

#content #contactusform a {
	color:#0F6;
}

/*************************************************/

#content .list {
	float: left;
	width:690px;
	padding:10px;
}
#content .list .row {
	clear: left;
	float: left;
	width: 100%;
	margin: 0 0 14px;
}
#content .list .item {
	float: left;
	width: 220px;
	padding: 0 5px;
}
#content .list img,
#content .list a.noimg {
	float: left;
	width: 74px;
	margin: 0 14px 0 0;
}
#content .list img {
	height: 74px;
	border: 0;
}
#content .list a.noimg {
	min-height: 26px;
	padding: 24px 0;
	background-color: #f4f4f4;
	color: #445663;
	font-size:60%;
	line-height: 1.2em;
	text-align:center;
	text-decoration:none;	
}
#content .list a.noimg:hover,
#content .list a.noimg:focus,
#content .list a.noimg:active {
	background-color: #eeeeee;
	color: #445663;
}

#content .list .noimg a:hover,
#content .list .noimg a:active,
#content .list .noimg a:focus {
	border-color: #0095A1;
}

#content .list .name {
	float: left;
	width: 118px;
	padding: 8px 0 0;
}
#content .list .description {
	float: left;
	padding: 0.2em 0 0.2em 0.8em;
	background-color: #ffffff;
	color: #BBBBBB;
}
#content .list .name {
	font-size:80%;
}
#content .list .name a {
	display: block;
	padding: 0 0 0 2px;
	margin-right:10px;
}
#content .list a {
	background-color:#ffffff;
	color:#445663;
	text-decoration:none;
}
#content .list a:hover,
#content .list a:focus,
#content .list a:active {
	background-color: #ffffff;
	color: #50687A;
}

#content .listtwocol {
	float: left;
	width: 690px;
	padding: 10px;
}
#content .listtwocol a {
	background-color:#ffffff;
	color:#445663;
	text-decoration:none;
}
#content .listtwocol a:hover,
#content .listtwocol a:focus,
#content .listtwocol a:active {
	background-color: #ffffff;
	color: #50687A;
}
#content .listwocol .row {
	clear: left;
	float: left;
	width: 100%;
}
#content .listtwocol .item {
	float: left;
	width: 335px;
	padding: 2px 5px;
}
#content .listtwocol .item img,
#content .listtwocol a.noimg {
	float: left;
	width: 126px;
}
#content .listtwocol .item img {
	height: 126px;
	border: 0;
}
#content .listtwocol a.noimg {
	min-height: 26px;
	padding: 50px 0;
	background-color: #f4f4f4;
	color: #445663;
	font-size:60%;
	line-height: 1.2em;
	text-align:center;
	text-decoration:none;	
}
#content .listtwocol .item .name {
	float: right;
	width: 194px;
	font-size: 80%;
}

/*#pageimg {
	clear:right;
	float:right;
}*/

#pageimgnav .shadowbox #closeup shadowbox a {
	float:right;
}

/**************************************
*  PROJECT ITEM TYPE STYLING
**************************************/
#content .list span {
	color:#0195A1;
}

#content .list #leftzone {
	border:1px solid #cccccc;
	float:left;
	width:500px;
}

#content .list #rightzone {
		border:1px solid #cccccc;
		float:right;
		width:100px;
		height:100px;
}

/*******************************
*  PROJECT AREA STYLING
*******************************/
#project {
	clear:right;
	float:right;
	width:718px;
	display:block;
	border:1px solid #666;
	padding:10px;
	font-size:75%;
	line-height:1.5em;
	margin:20px 0 0 0;
}

#project #description {
	padding:10px 0 0 0;
}

#project .label {
	color:#ffffff;
}

#project .label span {
	color:#0095A1;
	font-weight:bold;
}
/****************************************
*  BREADCRUMB STYLES GO HERE
****************************************/
#breadcrumb {
	float: left;
	width: 690px;
	margin: 0 0 10px;
	padding: 10px;
	background-color: #ffffff;
	color: #50687a;
	font-family: 'Times New Roman', Times, serif;
	font-size: 100%;
	font-weight: bold;
	list-style: none;
	line-height: 1.2em;
}
#breadcrumb li {
	float: left;
	padding: 0 0 0 0.4em;
	line-height: 1.2em;
}
#breadcrumb li:before {
	content: "> ";
}
#breadcrumb li.first:before,#breadcrumb li.last:before {
	content: "";
}
#breadcrumb li.first {
	padding: 0;
}
#breadcrumb h1:before {
	content: "> ";
}
#breadcrumb li.first h1:before {
	content: "";
}
#breadcrumb h1 {
	margin: 0;
	font-size: 100%;
	line-height: 1.2em;
}
#breadcrumb a {
	background-color: #ffffff;
	color: #50687a;
	text-decoration: none;
}
#breadcrumb a:hover,
#breadcrumb a:focus,
#breadcrumb a:active {
	background-color: #ffffff;
	color: #000000;
}
/***************************************
* PAGENAV STYLES GO HERE
***************************************/
#pagenav {
	clear: left;
	width: 640px;
	background-color: #ffffff;
	color: #444444;
	font-size: 75%;
}
#pagenav a {
	background-color: #ffffff;
	color: #949494;
}
#pagenav a:hover {
	background-color: #ffffff;
	color: #FF3300;
}
#pagenav a:focus,
#pagenav a:active {
	background-color: #ffffff;
	color: #FF3300;
}
#pagenav td {
	width: 33%;
	padding: 3px;
}
#pagenav td.centre {
	background-color: #ffffff;
	color: #949494;
	font-weight: bold;
	text-align: center;
}
#pagenav td.centre a {
	margin: 0 2px;
	font-weight: normal;
}
#pagenav td.right {
	text-align: right;
}

/******************************************
* PROJECT IMAGE NAV EFFECT
******************************************/
#pageimg .imgcontainer {
	display: none;
}

#pageimg img {
	width: 254px;
	border:0;
}
#pageimgnav {
	clear: left;
	float: left;
	width: 100%;
	font-size: 75%;
	font-weight: bold;
	line-height: 1.2em;
}
#pageimgnav .imglist {
	float: left;
}
#pageimgnav .label {
	background-color: #ffffff;
	color: #787A7D;
}
#content #pageimgnav a {
	background-color: #ffffff;
	color: #787A7D;
}
#content #pageimgnav a:hover,
#content #pageimgnav a:focus,
#content #pageimgnav a:active {
	background-color: #ffffff;
	color: #000000;
}
#content #pageimgnav a.selected {
	background-color: #ffffff;
	color: #50687A;
	text-decoration: none;
	cursor: default;
	outline: 0;
}

#content #bodyheading {
	font-size:120%;
	color:#50687A;
	padding:4px 0 10px 0;
}

/******************************************
*	FOOTER STYLES GO HERE
******************************************/
#footer {
	width: 974px;
	padding: 8px 0;
	background-color: #ffffff;
	color: #868686;
	font-size: 65%;
	text-align:right;
	margin:0 auto;
}
#footer a {
	background-color: #ffffff;
	color: #506879;
	text-decoration:none;
	
}
#footer a:hover {
	background-color: #ffffff;
	color: #000000;
}
#footer a:focus,
#footer a:active {
	background-color: #ffffff;
	color: #303031;
}