@import url('/css/globals.css');

#content {
	background: transparent url("/images/bg-white.gif") repeat-y 0 0;
}

/********************************************
CONTENT-LEFT
********************************************/
#content-left {
	position: relative;
	width: 719px;
	float: left;
	background-color: #fff;
}

#content-left h3 {
	font-size: 19px;
	color: #c45402;
	padding: 0 20px;
	margin: 0;
}
	
#content-left h5 {
	padding: 0 20px 20px 20px;
}
	
	#content-left p {
		padding: 0 20px 20px 20px;
	}

	#content-left ul {
		margin: 0 20px;
		padding: 0 0 20px 0;
	}
		
		#content-left ul li {
			font-size: 13px;
			line-height: 16px;
			color: #656565;
			list-style: circle;
			margin: 0 0 0 15px;
			padding: 0 0 4px 0;
		}
		
		#content-left p.toggle {
			text-decoration: underline;
			color: #31332B;
			cursor: pointer;
		}
				
		#content-left p.toggle:hover {
			text-decoration: none;
		}
		

/********************************************
SLIDER
********************************************/
#project-image-container { 
	position: relative;
	margin-bottom: 20px;
}

	.scroll {
		position: relative;
		width: 719px;
		height: 352px;
		overflow: hidden;
		overflow-x: auto;
	}
	
		.scrollContainer {
			padding-right: 160px;
		}
	
		.scrollContainer div.project-image {
			position: relative;
			width: 559px;
			height: 352px;
		}
			
			#buttonsPlinth {
				position: absolute;
				top: 0;
				left: 559px;
				width: 160px;
				height: 352px;
				background: transparent url("/images/bg-plinth.png") repeat 0 0;
				z-index: 999;
			}
			
			.scrollButtons.left {
				position: absolute;
				background: transparent url("/images/btn-left.png") no-repeat 0 0;
				top: 0;
				right: 43px;
				width: 27px;
				height: 43px;
				z-index: 999;
				cursor: pointer;
				border: none;
				border-right: 1px solid #bec09e;
			}
			
			.scrollButtons.right {
				position: absolute;
				background: transparent url("/images/btn-right.png") no-repeat 0 0;
				top: 0;
				right: 15px;
				width: 27px;
				height: 43px;
				z-index: 999;
				cursor: pointer;
				border: none;
			}
		
			.scrollButtons.left:hover,
			.scrollButtons.right:hover {
				background-position: 0 -43px;
				cursor: pointer;
			}

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

	#content-left-section-header {
		position: relative;
		background: #c45402 url("/images/bg-h1.jpg") no-repeat 0 0;
		background-position: 5px 0;
		width: 719px;
		height: 65px;
	}
	
	#content-left-section-overview {
		position: relative;
		background-color: #f8f9e9;
		width: 719px;
		margin-top: 1px;
	}
	
		#content-left-section-overview h2 {
			padding: 20px 20px 0 20px;
			margin: 0;
		}
	
		#content-left #content-left-section-overview h3 {
			padding: 20px;
			color: #57594a;
			line-height: 24px;
			margin: 0;
		}
		
		#content-left #content-left-section-overview ul li {
			font-size: 19px;
			color: #57594A;
			line-height: 24px;
		}

	#content-left-main {
		position: relative;
		float: left;
		width: 480px;
	}
	
		#content-left-main ul.sitemap {
			margin: 0;
		}
	
		#content-left-main ul.sitemap li {
			list-style: none;
		}
		
		#content-left-main ul.sitemap li.sitemap-primary {
			border-top: 1px solid #d6d6d5;
			padding: 8px 0;
		}
		
			#content-left-main ul.sitemap li.sitemap-secondary {
				padding: 0 0 4px 0;
				margin: 0 0 0 5px;
			}
			
				#content-left-main ul.sitemap li.sitemap-tertiary {
					padding: 0 0 4px 0;
					margin: 0;
				}
		
		#content-left-main ul.sitemap li a {
			color: #31332b;
			text-decoration: underline;
		}
		
		#content-left-main ul.sitemap li a:hover {
			text-decoration: none;
		}
		
		#content-left-main ul.sitemap li em {
			font-style: normal;
			color: #C45402;
		}
		
		#content-left-main p,
		#content-left-matrix p,
		#award-listing p {
			padding: 0 34px 20px 20px;
		}
		
		#content-left-main p.no-padding,
		#award-listing p.no-padding {
			padding: 0 34px 4px 20px;
		}
		
		#content-left-main p strong,
		#content-left-project-list p strong,
		#award-listing p strong {
			color: #31332b;
			font-size: 14px;
			line-height: 24px;
		}
		
		#award-listing p.orange {
			margin-top: 10px;
		}
	
	#content-left-resources,
	#content-left-projects,
	#content-left-project-list {
		position: relative;
		width: 239px;
		height: auto;
		float: left;
		background-color: #f8f9e9;
	}
	
	#content-left-resources {
		background-color: #fff;
	}
	
	#content-left-resources p {
		padding: 0 20px 20px 20px;
	}
	
	#content-left-resources ul li a {
		color: #c45402;
	}

	#content-left-resources ul li a:hover {
		text-decoration: none;
	}
			
	#content-left-resources ul li.article {
		display: block;
		width: 199px;
		margin: 0;
		padding: 0 0 10px 20px;
		background: transparent url("/images/li-article.jpg") no-repeat 0 0;
		list-style: none;
	}
	
	#content-left-resources ul li.pdf {
		display: block;
		width: 199px;
		margin: 0;
		padding: 0 0 10px 20px;
		background: transparent url("/images/li-pdf.jpg") no-repeat 0 0;
		list-style: none;
	}
	
	#content-left-project-list {
		float: right;
		width: 239px;
		background-color: #fff;
	}
		#content-left-project-list ul {
			margin: 0 10px 0 20px;
		}
	
		#content-left-project-list ul li {
			list-style: none;
			line-height: 15px;
			padding: 0 0 10px 0;
			margin: 0;
		}
	
		#content-left-project-list li a {
			color: #c45402;
			text-decoration: underline;
		}
		
			#content-left-project-list li a:hover {
				text-decoration: none;
			}
		
		#content-left-project-list li a.selected,
		#content-left-project-list li a.selected:hover  {
			color: #31332b;
			text-decoration: none;
		}
	
			#content-left-projects .content-left-project {
				border: none;
			}
		
		
	#content-left-matrix {
		position: relative;
		width: 719px;
		background: #fff url("/images/bg-matrix.jpg") repeat 0 0;
		overflow: hidden;
		margin-bottom: 100px;
	}
	
		#content-left-matrix-overflow {
			position: relative;
			width: 720px;
		}
			.content-left-project,
			.content-left-matrix-project {
				position: relative;
				background-color: #edefc5;
				float: left;
				width: 239px;
				height: 235px;
				border-right: 1px solid #fff;
				border-bottom: 1px solid #fff;
			}
			
			.content-left-project p img,
			.content-left-matrix-project p img {
				position: relative;
				width: 239px;
				height: 172px;
				border: none;
				padding: 0 0 5px 0;
				margin: 0 -15px;
			}
			
			#content-left-projects .content-left-project p,
			#content-left-matrix .content-left-matrix-project p {
				padding: 0;
				margin: 0;
				font-size: 12px;
				line-height: 15px;
			}
			
			.content-left-matrix-project .empty {
				position: absolute;
				left: 0;
				top: 172px;
				width: 239px;
				height: 62px;
				border-top: 1px solid #fff;
				background-color: #f6f7e2;
			}
			
			#content-left-projects .content-left-project p a,
			#content-left-matrix .content-left-matrix-project p a {
				display: block;
				position: relative;
				color: #333;
				text-decoration: none;
				background-color: #f6f7e2;
				width: 209px;
				height: 235px;
				padding: 0 15px;
			}
			
			#content-left-projects .content-left-project p a:hover,
			#content-left-matrix .content-left-matrix-project p a:hover {
				color: #fff;
				background-color: #c45402;
			}
	
	#content-left-img {
		position: relative;
		float: left;
		width: 259px;
		height: 257px;
	}
		#content-left-img img {
			padding: 20px 0 0 20px
		}
		
	#content-left-text {
		padding: 20px 0 0 0;
		position: relative;
		float: left;
		width: 426px;
		height: auto;
	}
	
	#content-left-text p {
		padding: 0 20px 20px 20px;
	}
	
	
	#two-col-article {
		position: relative;
		width: 719px;
	}
	
		#article-left {
			float: left;
			width: 440px;
		}
		
		#article-right {
			float: right;
			width: 267px;
		}
		
			#article-right img {
				float: left;
				border: 4px solid #EDEFC5;
				margin-right: 20px;
			}
		

/********************************************
CONTENT-RIGHT
********************************************/
#content-right {
	position: relative;
	width: 240px;
	float: right;
	height: auto;
}

	#content-right #navigation-wrapper {
		border-bottom: 1px solid #bdc97f;
	}
	
	#content-right-featured {
		position: relative;
		float: right;
		width: 240px;
		height: 354px;
		background-color: #57594a;
		border-bottom: 1px solid #bdc97f;
	}
	
		#content-right-featured h2 {
			color: #fff;
		}
		
		#content-right-featured img {
			position: relative;
			height: 174px;
			width: 240px;
			margin-bottom: 10px;
		}
		
		#content-right-featured p {
			color: #fff;
		}
		
		#content-right-featured h4 {
			position: absolute;
			left: 0;
			bottom: 0;
		}
		
		#content-right-featured h4 a {
			padding: 10px 20px 0 19px;
			background: transparent url("/images/btn-arrow-gray.png") no-repeat 191px 0;
			width: 201px;
			height: 33px;
			display: block;
			color: #fff;
		}
		
		#content-right-featured h4 a:hover {
			color: #b5b8a5;
		}

	#content-right-team {
		position: relative;
		float: right;
		width: 240px;
		height: 275px;
		background-color: #c45402;
		border-bottom: 1px solid #bdc97f;
	}
	
		#content-right-team h2 {
			color: #fff;
		}
		
		#content-right-team h3 {
			color: #fff;
			font-size: 19px;
			line-height: 21px;
		}
		
		#content-right-team h4 {
			position: absolute;
			left: 0;
			bottom: 0;
		}
		
			#content-right-team h4 a {
				color: #fff;
				padding: 10px 20px 0 19px;
				background: transparent url("/images/btn-arrow-white.png") no-repeat 191px 0;
				width: 201px;
				height: 33px;
				display: block;
			}
			
			#content-right-team h4 a:hover {
				color: #333333;
			}
			
			#content-right-team p {
				color: #fff;
			}
			
			#content-right-team p a {
				color: #fff;
				text-decoration: underline;
			}
			
			#content-right-team p a:hover {
				text-decoration: none;
			}
			

	#content-right-news {
		position: relative;
		float: right;
		width: 240px;
		height: 237px;
		background-color: #edefc5;
		border-bottom: 1px solid #bdc97f;
	}
	
		#content-right-news h4 {
			position: absolute;
			left: 0;
			bottom: 0;
		}
		
		#content-right-news h4 a {
			padding: 10px 20px 0 19px;
			background: transparent url("/images/btn-arrow-orange.png") no-repeat 191px 0;
			width: 201px;
			height: 33px;
			display: block;
		}
		
		#content-right-news h4 a:hover {
			color: #C45402;
		}