@import url('reset.css');

/*	COLORS:
	100% red: #B51D1D
	75%  red: #C85656
	65%  red: #Cf6C6C   */

/*****************************************************************************
  GLOBAL STYLES  *************************************************************
*****************************************************************************/

/* force showing vertical scrollbar track, even when inactive */
html {
	  overflow: -moz-scrollbars-vertical;
	  overflow-y: scroll;
}

body {
	text-align: center;
	margin: 0;
	padding: 0;
	font: 10px/14px Verdana, Helvetica, Arial, sans-serif;
	color: #999;
}

a { color: #777;
	text-decoration: none;
}
	a:hover {
		color: #B51D1D;
		text-decoration: none;
	}

table, th, td {
	border: none;
	vertical-align: top;
	padding: 0;
	margin: 0;
}
	table {
		border-collapse:collapse;
	}

#wrapper {
	width: 950px;
	position: relative;
	margin: 0 auto 0;
	overflow: visible;
}









/*****************************************************************************
  HEADER & FOOTER  ***********************************************************
*****************************************************************************/

/* #aboveheader contains the search bar */
#aboveheader {
	width: 100%;
	height:50px;
}
	#searchbox {
		position: absolute;
		background: url(../../imgs/general/searchbackground.png) top left no-repeat;
		top: 0;
		right: 0;
		height: 45px;
		width: 145px;
		text-align: left;
	}
		#searchbox #search {
			border:none;
			color:#666666;
			background: url(../../imgs/general/search-text.png) left center no-repeat transparent;
			width: 100px;
			font: 10px/10px Verdana;
			margin-top: 10px;
			margin-left: 7px;
			margin-right: 12px;
			padding:0;
		}
		
		#searchbox #search:focus,
		input.ieFocusHack	{
			background-image: none !important;
		}
		
		#searchbox #submit {
			width: 20px;
			background: url(../../imgs/general/search-button.png) center no-repeat transparent;
			border: none;
			padding: 0;
			margin: 0;
		}
		
		#searchbox #submit:hover {
			background: url(../../imgs/general/search-button-hover.png) center no-repeat transparent;
		}

		
/* #header contains the logo and the top navigation menu */
#header {
	width: 100%;
	height: 70px;
	border-bottom: 1px solid #DEDEDE;
	text-align: right;
}
	#header-logo {
		background: url(../../imgs/general/logo.png) top left no-repeat;
		height: 50px;
		width: 100px;
		float: left;
		cursor: pointer;
	}
	
	#topnav {
	}
		/* top-level navigation items */
		.topnav-button {
			height: 55px;
			float: right;
			display: block;
			margin-left: 24px;
			cursor: pointer;
			background-repeat: no-repeat;
			background-position: top left;
			background-color: transparent;
		}
			/* normal */
			#topnav-projects { background-image: url(../../imgs/general/menu-projects.png); width: 55px !important; }
			#topnav-firm { background-image: url(../../imgs/general/menu-profile.png); width: 43px !important; }
			#topnav-people { background-image: url(../../imgs/general/menu-people.png); width: 48px !important; } 
			#topnav-sustainability { background-image: url(../../imgs/general/menu-sustainability.png); width: 93px !important; }
			#topnav-news { background-image: url(../../imgs/general/menu-news.png); width: 42px !important; }
			#topnav-contact { background-image: url(../../imgs/general/menu-contact.png); width: 55px !important; }
			
			/* hover */
			#topnav-projects:hover, #topnav-projects.current { background-image: url(../../imgs/general/menu-projects-hover.png); }
			#topnav-firm:hover, #topnav-firm.current { background-image: url(../../imgs/general/menu-profile-hover.png); }
			#topnav-people:hover, #topnav-people.current { background-image: url(../../imgs/general/menu-people-hover.png); }
			#topnav-sustainability:hover, #topnav-sustainability.current { background-image: url(../../imgs/general/menu-sustainability-hover.png); }
			#topnav-news:hover, #topnav-news.current { background-image: url(../../imgs/general/menu-news-hover.png); }
			#topnav-contact:hover , #topnav-contact.current { background-image: url(../../imgs/general/menu-contact-hover.png); }
		
		.topnav-subnav {
			height: 55px;
			width: 0px;
			display: block;
			float: right;
			overflow: hidden;
		}
			/* the widths specified for these subnavsare also set in jquery in the page header */
			body.pagetype-projectlist #topnav-projects-subnav.topnav-subnav,
			body.pagetype-typelist #topnav-projects-subnav.topnav-subnav,
			body.pagetype-regionlist #topnav-projects-subnav.topnav-subnav,
			body.pagetype-projectpage #topnav-projects-subnav.topnav-subnav { width: 95px !important; }	
			
			body.pagetype-firm #topnav-firm-subnav.topnav-subnav,
			body.pagetype-people #topnav-firm-subnav.topnav-subnav,
			body.pagetype-awards #topnav-firm-subnav.topnav-subnav,
			body.pagetype-news #topnav-firm-subnav.topnav-subnav	{ width: 365px !important; }
			
		
			.topnav-subnav .subnav-arrow {
				height: 55px;
				width: 16px;
				background: url(../../imgs/general/subnav-arrow.png) top left no-repeat;
				float: left;
				display: block;
			}
			
			.topnav-subnav.current .subnav-arrow {
				background: url(../../imgs/general/subnav-arrow-active.png) top left no-repeat ;
			}
			
			/* subnav buttons */
			.topnav-subnav .subnav-button {
				height: 55px;
				float: left;
				display: block;
				margin: 0;
				padding: 0;
				margin-right: 9px !important;
				cursor: pointer;
				background-repeat: no-repeat;
				background-position: top left;
				background-color: transparent;
			}
				/* normal */
				.topnav-subnav #subnav-type { background-image: url(../../imgs/general/subnav/subnav-type.gif); width: 26px; }
				.topnav-subnav #subnav-region { background-image: url(../../imgs/general/subnav/subnav-region.gif); width: 40px; margin-right: 0 !important; }
				.topnav-subnav #subnav-overview { background-image: url(../../imgs/general/subnav/subnav-overview.gif); width: 56px; }
				.topnav-subnav #subnav-profile { background-image: url(../../imgs/general/subnav/subnav-profile.gif); width: 41px; }
				.topnav-subnav #subnav-process { background-image: url(../../imgs/general/subnav/subnav-process.gif); width: 44px; }
				.topnav-subnav #subnav-sustainability { background-image: url(../../imgs/general/subnav/subnav-sustainability.gif); width: 83px; }
				.topnav-subnav #subnav-people { background-image: url(../../imgs/general/subnav/subnav-people.gif); width: 37px; }
				.topnav-subnav #subnav-news { background-image: url(../../imgs/general/subnav/subnav-news.gif); width: 32px; margin-right: 0 !important; }
				.topnav-subnav #subnav-awards { background-image: url(../../imgs/general/subnav/subnav-awards.gif); width: 47px; }
				.topnav-subnav #subnav-approach { background-image: url(../../imgs/general/subnav/subnav-approach.gif); width: 55px; }
				.topnav-subnav #subnav-casestudy { background-image: url(../../imgs/general/subnav/subnav-casestudy.gif); width: 63px; margin: 0 !important; }
				
				/* hover */
				.topnav-subnav #subnav-type:hover, 
				.topnav-subnav #subnav-type.current { background-image: url(../../imgs/general/subnav/subnav-type-hover.gif) !important; }
				.topnav-subnav #subnav-region:hover, 
				.topnav-subnav #subnav-region.current { background-image: url(../../imgs/general/subnav/subnav-region-hover.gif) !important; }
				.topnav-subnav #subnav-profile:hover, 
				.topnav-subnav #subnav-profile.current { background-image: url(../../imgs/general/subnav/subnav-profile-hover.gif) !important; }
				.topnav-subnav #subnav-overview:hover, 
				.topnav-subnav #subnav-overview.current { background-image: url(../../imgs/general/subnav/subnav-overview-hover.gif) !important; }
				.topnav-subnav #subnav-process:hover, 
				.topnav-subnav #subnav-process.current,
				.topnav-subnav #subnav-sustainabilityprocess:hover,
				.topnav-subnav #subnav-sustainabilityprocess.current { background-image: url(../../imgs/general/subnav/subnav-process-hover.gif) !important; }
				.topnav-subnav #subnav-sustainability:hover, 
				.topnav-subnav #subnav-sustainability.current { background-image: url(../../imgs/general/subnav/subnav-sustainability-hover.gif) !important; }
				.topnav-subnav #subnav-awards:hover, 
				.topnav-subnav #subnav-awards.current { background-image: url(../../imgs/general/subnav/subnav-awards-hover.gif) !important; }
				.topnav-subnav #subnav-people:hover, 
				.topnav-subnav #subnav-people.current { background-image: url(../../imgs/general/subnav/subnav-people-hover.gif) !important; }
				.topnav-subnav #subnav-news:hover, 
				.topnav-subnav #subnav-news.current { background-image: url(../../imgs/general/subnav/subnav-news-hover.gif) !important; }
				.topnav-subnav #subnav-casestudy:hover, 
				.topnav-subnav #subnav-casestudy.current { background-image: url(../../imgs/general/subnav/subnav-casestudy-hover.gif) !important; }
				.topnav-subnav #subnav-approach:hover, 
				.topnav-subnav #subnav-approach.current { background-image: url(../../imgs/general/subnav/subnav-approach-hover.gif) !important; }
				.topnav-subnav #subnav-sustainability:hover, 
				.topnav-subnav #subnav-sustainability.current { background-image: url(../../imgs/general/subnav/subnav-sustainability-hover.gif) !important; }
			
			#header a {
				width: 100%;
				height: 100%;
				display: block;
			}
				
		
/* #main contains all individual page content */
#main {
	text-align: left;
	position: relative;
}	
	/* h1 uses background images */
	#main h1 {
		height: 41px;
		margin: 14px 0 0 0; /* height and margin adds to 55px tall */
		font: 21px/21px Corbel, "Trebuchet MS", Helvetica, Arial, sans-serif;
		display: block;
		color: #C85656;
		letter-spacing: -1px;
		text-align: left;
		background-repeat: no-repeat;
		background-position: top left;
		background-color: transparent;
	}
		#main h1.projecttypes { background-image: url('../../imgs/general/h1/type.png'); }
		#main h1.projectregion { background-image: url('../../imgs/general/h1/regions.png'); }
		#main h1.contact { background-image: url('../../imgs/general/h1/contact.png'); }
		#main h1.news { background-image: url('../../imgs/general/h1/news.png'); }
		#main h1.search { background-image: url('../../imgs/general/h1/search.png'); }
		#main h1.people { background-image: url('../../imgs/general/h1/people.png'); }
		#main h1.firm-profile { background-image: url('../../imgs/general/h1/profile.png'); }
		#main h1.firm-overview { background-image: url('../../imgs/general/h1/overview.png'); }
		#main h1.firm-process { background-image: url('../../imgs/general/h1/process.png'); }
		#main h1.firm-awards { background-image: url('../../imgs/general/h1/awards.png'); }
		#main h1.firm-sustainability { background-image: url('../../imgs/general/h1/sustainability.png'); }
		#main h1.sustainability-approach { background-image: url('../../imgs/general/h1/sustainability-approach.png'); }
		#main h1.sustainability-casestudy { background-image: url('../../imgs/general/h1/sustainability-casestudy.png'); }
		#main h1.searchresults { background-image: url('../../imgs/general/h1/searchresults.png'); }

		#main h1.corporate { background-image: url('../../imgs/general/h1/types-corporate.png'); }
		#main h1.culture { background-image: url('../../imgs/general/h1/types-culture.png'); }
		#main h1.education { background-image: url('../../imgs/general/h1/types-education.png'); }
		#main h1.government { background-image: url('../../imgs/general/h1/types-government.png'); }
		#main h1.health { background-image: url('../../imgs/general/h1/types-health.png'); }
		#main h1.masterplan { background-image: url('../../imgs/general/h1/types-masterplan.png'); }
		#main h1.mixeduse { background-image: url('../../imgs/general/h1/types-mixeduse.png'); }
		#main h1.office { background-image: url('../../imgs/general/h1/types-office.png'); }
		#main h1.repositioning { background-image: url('../../imgs/general/h1/types-repositioning.png'); }
		#main h1.residential { background-image: url('../../imgs/general/h1/types-residential.png'); }
		#main h1.supertall { background-image: url('../../imgs/general/h1/types-supertall.png'); }
		#main h1.transport { background-image: url('../../imgs/general/h1/types-transportation.png'); }
		#main h1.retail { background-image: url('../../imgs/general/h1/types-retail.png'); }
		#main h1.hospitality { background-image: url('../../imgs/general/h1/types-hospitality.png'); }
		
		#main h1.americas { background-image: url('../../imgs/general/h1/regions-americas.png'); }
		#main h1.asia { background-image: url('../../imgs/general/h1/regions-asia.png'); }
		#main h1.europe { background-image: url('../../imgs/general/h1/regions-europe.png'); }
		#main h1.middleeast { background-image: url('../../imgs/general/h1/regions-mideast.png'); }
		
		#main h1.backtopeople { background-image: url(../../imgs/general/h1/peoplereturn-hover2.png); cursor: pointer;}
		#main h1.backtopeople:hover { background-image: url(../../imgs/general/h1/people.png); }

		#main h1.backto-region { background-image: url(../../imgs/general/h1/regionslink.png); cursor: pointer;}
		#main h1.backto-region:hover { background-image: url(../../imgs/general/h1/regions.png); }	
		
		#main h1.backto-type { background-image: url(../../imgs/general/h1/typelink.png); cursor: pointer;}
		#main h1.backto-type:hover { background-image: url(../../imgs/general/h1/type.png); }
 
	
	/* h4 uses background images, e.g.:
	h4.principals { background-image: url(../../imgs/general/h4/principals.png); } */
	#main h4 {
		height: 32px;
		margin:0;
		padding:0;
		display: block;
		background-repeat: no-repeat;
		background-position: top left;
		background-color: transparent;
	}
	
	/* h5 is replaced by cufon */
	#main h5 {
		margin: 0 0 14px 0; 
		font: 20px/21px Corbel, "Trebuchet MS", Helvetica, Arial, sans-serif;
		display: block;
		color: #4D4D4D;
		letter-spacing: -1px;
		text-align: left;
		background-repeat: no-repeat;
		background-position: top left;
		background-color: transparent;
	}
	
/* #footer contains copyright text */
 #footer {
	margin: 40px 0 25px 0;
	color: #ccc;
	border-top: 1px solid #eee;
	padding: 5px 0 0 0;
	text-align: left;
	font-size: 9px;
 }
 
	#footer #languages {
		float:right;
		height:14px;
	}
	
		#footer #languages #english a {
			width: 38px;
			height: 14px;
			float: left;
			background: url(../../imgs/general/lang-english.png) top left no-repeat;
			display: block;
			margin-right: 5px;
		}
		
		#footer #languages #english a:hover,
		#footer #languages #english a.active {
			background-image: url(../../imgs/general/lang-english-hover.png);
		}
		
		#footer #languages #chinese a {
			width: 28px;
			height: 14px;
			float: left;
			background: url(../../imgs/general/lang-chinese.png) top left no-repeat;
			display: block;
		}
		
		#footer #languages #chinese:hover,
		#footer #languages #chinese a.active {
			background-image: url(../../imgs/general/lang-chinese-hover.png);
		}
 
 
 
 
 
/*****************************************************************************
  PROJECT PAGES  *************************************************************
*****************************************************************************/
 
 /* this column contains the project data, description, and project navigation */
.project-topleftcolumn {
	float: left;
	width: 230px;
	margin: 0 10px 0 0; /* width and margin adds to 240px */
	height: 500px;
	overflow: hidden;
	padding: 0;
	display: block;
	position: relative;
}
	.project-topleftcolumn .bottomgradient {
		position: absolute;
		bottom: 0;
		left:0;
		width: 230px;
		height:50px;
		z-index: 99;
		background: url(../../imgs/general/project-textbottom.png) bottom left no-repeat;
	}
	

 /* this column contains the photos and thumbnails; 3 columns wide */
.project-toprightcolumn {
	float: left;
	width: 710px;
	margin: 0;
	padding: 0;
	display: block;
}

.project-bottomleftcolumn {
	float: left;
	width: 225px;
	border-top: 1px solid #f5f5f5;
	border-bottom: 1px solid #f5f5f5;
	margin: 0 15px 0 0; /* width, side margin, and right border add to 240px */
	height: 110px;
	display: block;
	text-align: left;
	height: 75px;
}
	.project-bottomleftcolumn .inner {
		margin-right: 20px;
		margin-top: 28px;
		color: #ccc;
	}
		.project-bottomleftcolumn a {
			color: #bbb;
		}
		
		.project-bottomleftcolumn a:hover {
			color: #Cf6C6C;
		}
		
		.project-bottomleftcolumn .bottomprojecttype {
			font: 12px/12px Corbel, "Trebuchet MS", Helvetica, Arial, sans-serif;
			color: #666;
			letter-spacing: -0.5px;
			margin-top: 0px;
			margin-bottom: 4px;
		}
		
		.project-bottomleftcolumn .bottomprojecttype a {
			color: #777;
		}
		
		.project-bottomleftcolumn .bottomprojecttype a:hover {
			color: #Cf6C6C;
		}

.project-bottomrightcolumn {
	float: left;
	width: 710px;
	height: 110px;
	margin: 0;
	padding: 0;
	display: block;
}

h3.projectname {
	margin: 9px 0 0 0;
	font: 19px/19px "Trebuchet MS", Helvetica, Arial, sans-serif;
	text-transform: uppercase !important;
	display: block;
	color: #C85656;
	letter-spacing: 2px;
	text-align: left;
}
	/* "the sans" is bigger than trebuchet, so when cufon is active, font size is smaller */
	.cufon-active h3.projectname {
		font: 19px/17px "Trebuchet MS", Helvetica, Arial, sans-serif !important;
		text-transform: lowercase !important;
	}

	h3.projectsubname {
		margin: 4px 0 20px 0;
		font: 14px/14px "Trebuchet MS", Helvetica, Arial, sans-serif;
		text-transform: uppercase !important;
		display: block;
		color: #C85656;
		letter-spacing: 1px;
		text-align: left;
	}
		/* "the sans" is bigger than trebuchet, so when cufon is active, font size is smaller */
		.cufon-active h3.projectsubname {
			font: 14px/14px "Trebuchet MS", Helvetica, Arial, sans-serif !important;
			text-transform: lowercase !important;
		}
	


#projectdata {
	width: 100%;
	color: #666666;
}
	#projectdata a {
		color: #666666;
		border-bottom: 1px solid #ddd;
	}
	
	#projectdata a:hover {
		color: #B51D1D; 
		border:none
	}

	#projectdata .datacell {
		padding: 0 0 0 60px;
		margin:  0 0 6px 0;
		display: block;
		background-repeat: no-repeat;
		background-position: 0 1px;
		background-color: transparent;
		min-height: 14px;
		height: auto !important; /* for min-height to work in all browsers */
		height: 14px;  /* for min-height to work in all browsers */
	}
		/* there are also pngs for these images, although the text is 3px higher for the png versions */
		#projectdata #data-location{ background-image: url(../../imgs/general/projectdata-location.gif) !important; }
		#projectdata #data-client{ background-image: url(../../imgs/general/projectdata-client.gif) !important; }
		#projectdata #data-type { background-image: url(../../imgs/general/projectdata-type.gif) !important; }
		#projectdata #data-size{ background-image: url(../../imgs/general/projectdata-size.gif) !important; }
		#projectdata #data-height{ background-image: url(../../imgs/general/projectdata-height.gif) !important; }
		#projectdata #data-awards{ background-image: url(../../imgs/general/projectdata-awards.gif) !important }
		#projectdata #data-associate{ background-image: url(../../imgs/general/projectdata-associate.gif) !important }
		
		
#above-projecttext {
	border-bottom:1px solid #e9e9e9;
	height: 1px;
	margin-top: 20px;
	margin-right: 5px;
}
				
#projecttext {
	vertical-align: bottom !important;
	color: #666666;
}
	#projecttext p {
		margin-top: 8px;
	}

	#projecttext .scroll-pane {
		width: 210px !important;
	}
		#projecttext .scroll-pane p.projecttextspacer {
			display: block;
			height: 50px;
		}
		 .jScrollPaneContainer {
			position: relative;
			overflow: hidden;
			z-index: 1;
			width: 230px !important;
		}

		.jScrollPaneTrack {
			position: absolute;
			cursor: pointer;
			right: 0;
			top: 0;
			height: 100%;
			background: url(../../imgs/general/project-scrollback.png) center top no-repeat;
			padding-bottom:7px;
		}
		.jScrollPaneDrag {
			position: absolute;
			margin-top: 7px;
			background: #aaa;
			cursor: pointer;
			overflow: hidden;
			-moz-border-radius: 3px;
			-webkit-border-radius: 3px;
			border-radius: 3px;
		}
		.jScrollPaneDragTop {
			position: absolute;
			top: 0;
			left: 0;
			overflow: hidden;
		}
		.jScrollPaneDragBottom {
			position: absolute;
			bottom: 0;
			left: 0;
			overflow: hidden;
		}
		a.jScrollArrowUp {
			display: block;
			position: absolute;
			z-index: 1;
			top: 0;
			right: 0;
			text-indent: -2000px;
			overflow: hidden;
			/*background-color: #666;*/
			height: 9px;
		}
		a.jScrollArrowUp:hover {
			/*background-color: #f60;*/
		}

		a.jScrollArrowDown {
			display: block;
			position: absolute;
			z-index: 1;
			bottom: 0;
			right: 0;
			text-indent: -2000px;
			overflow: hidden;
			/*background-color: #666;*/
			height: 9px;
		}
		a.jScrollArrowDown:hover {
			/*background-color: #f60;*/
		}
		a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {
			/*background-color: #f00;*/
		}

#project-mainimage {
	width: 710px;
	height: 510px; /* height is 10px taller than image */
}

#project-thumbnails {
	width:710px;
	height:77px;
	overflow: hidden;
	position: relative;
}
	#project-thumbnails div.items { 
		width:10000px; /* this cannot be too large */
		position: absolute; 
	}

	#project-thumbnails img {
		border:1px solid #ccc;
		margin: 0 7px 0 0;
		padding: 0;
	}
	
	#project-thumbnails div.items .active { 
		border:1px solid #777; 
		background-color:#fff; 
	}
	
	#project-thumbnails .prevPage,
	#project-thumbnails .nextPage,
	#project-thumbnails .next,
	#project-thumbnails .prev {
		width: 19px;
		height: 100px;
		position: absolute;
		background-repeat: no-repeat;
		background-position: top center;
		background-color: #fff;
		height: 77px;
		cursor: pointer;
		filter:alpha(opacity=90);
		-moz-opacity:0.9;
		-khtml-opacity: 0.9;
		opacity: 0.9;
	}
	
	#project-thumbnails .prevPage,
	#project-thumbnails .prev {
		background-image: url(../../imgs/general/thumbnavsmall-back.png);
		top: 0;
		left: 0;
	}
	
	#project-thumbnails .nextPage,
	#project-thumbnails .next {
		background-image: url(../../imgs/general/thumbnavsmall-next.png);
		top: 0;
		right: 0;
	}
		#project-thumbnails .prevPage img,
		#project-thumbnails .nextPage img,
		#project-thumbnails .prevPage a img,
		#project-thumbnails .nextPage a img,
		#project-thumbnails .prev img,
		#project-thumbnails .next img,
		#project-thumbnails .prev a img,
		#project-thumbnails .next a img {
			border: none;
			padding: 0;
			margin: 0;
		}
	
	#project-thumbnails .disabled {
		visibility:hidden;		
	} 	
	
.caption .phototext {
	float: left;
	color: #aaa;
}
	.caption .phototext .photocredit {
		color: #ccc;
	}
	
#thumbnailloader {
	display: none;
	height: 1px;
}

.project-backbutton {
	margin-top: 15px;
	display: block;
	text-align: left;
	color: #777;
}
	a.project-backbutton { color: #777 !important} 
	a.project-backbutton:hover { color: #B51D1D !important}
	
	
		
		
		
/*****************************************************************************
  LISTING PAGES  *************************************************************
*****************************************************************************/
 
 /* this column contains the thumbnails; 3 columns wide */
 .listing-rightcolumn {
	float: right;
	width: 720px;
	margin: 0;
	padding: 0;
	display: block;
	position: relative;
	right: -3px;
 } 
 
 /* this column contains the full project list; 1 column wide */
 .listing-leftcolumn {
	float: right;
	width: 210px;
	margin: 0 20px 0 0; /* margin and width add to 230px wide*/
	padding: 0;
	display: block;
 }
	.listing-leftcolumn.region {
		float: left;
		z-index: 0;
		height: 400px;
	}
 
 /* this block contains a single thumbnail and its caption */
 /* regular thumbnails should be 230px wide by 162px, 
    leaving 30px on the bottom */
 .listingthumb {
	float: left;
	width: 236px; /* originally 230px */
	height: 198px; /* originally 192px */
	margin: 0 0 0 3px; /* originally 0 0 0 10px */
	padding: 0;
	vertical-align: top;
	display: block;
 }
	/* supertall thumbs should be 230px wide by 354px tall, 
	   leaving 30px on the bottom */
	.listingthumb.supertall {
		height: 384px !important;
	}
	
	.listingthumb img {
		margin: 0;
		padding: 0px; /* if you change this, change width of .listingthumb accordingly */
		border: 4px solid #fff; /* if you change this, change width of .listingthumb accordingly */
	}
	
	.listingthumb img.highlightonimg  {
		border: 4px solid #C85656; /* if you change this, change width of .listingthumb accordingly */
	}
	
	.listingthumb a {
		color: #919191;
	}
	
	.listingthumb-caption {
		display: block;
		height: 32px;
		font: 10px/11px Verdana, Helvetica, Arial, sans-serif;
		color: #919191;
		margin-left: 3px;
	}
		.listingthumb-caption a:hover,
		.listingthumb:hover .listingthumb-caption a {
			color: #B51D1D;
		}

	
/* styles for full project list */
.listinglist {
	font: 11px/14px Verdana, Helvetica, Arial, sans-serif;
	color: #bbb;
	margin-top: 3px;
	margin-left: 1px;
	
}
	.listinglist li {
		margin-bottom: 6px;
	}
	
	.listinglist a {
		color: #777;
	}
	
	.listinglist a:hover {
		color: #B51D1D;
	}

	
.typelist,
.loclist {
	margin-top: 9px;
}
	.typelist li,
	.loclist li {
	}
		.typelist a,
		.loclist a {
			font: 14px/14px Corbel, "Trebuchet MS", Helvetica, Arial, sans-serif;
			display:block;
			padding: 0;
			margin: 0;
			background: url(../../imgs/general/list-divider.png) top left no-repeat;
			/* cursor: pointer; */
			color: #666666;
			padding: 15px 0;
		}
		
		.typelist a:hover,
		.loclist a:hover,
		.typelist a.active,
		.loclist a.active {
			background: url(../../imgs/general/list-divider-hover.png) top left no-repeat;
			color: #C85656 !important;
			cursor: pointer;
		}
		
		.typelist li.active,
		.loclist li.active {
			color: #C85656 !important;
		}

#themap {
	display: block;
	position: absolute;
	left: 191px;
	top: 15px;
	width: 759px;
	height: 450px; /* illustrator doc is 500px; subtract 50px from overlay positions */
	background: url(../../imgs/general/map-full.png) bottom left no-repeat;
	z-index: 1;
}
	#themap #americas{
		display: block;
		background-color: transparent;
		position: absolute;
		top: -4px;
		left: 0px;
		width: 340px;
		height: 384px;
		z-index: 2;
		cursor: pointer;
	}
		#themap #americas:hover, #themap #americas.active {
			background: url(../../imgs/general/map-americas.png) top left no-repeat;
		}
	
	#themap #europe{
		display: block;
		background-color: transparent;
		position: absolute;
		top: -4px;
		left: 307px;
		width: 160px;
		height: 180px;
		z-index: 2;
		cursor: pointer;
	}
		#themap #europe:hover, #themap #europe.active {
			background: url(../../imgs/general/map-europe.png) top left no-repeat;
		}
	
	#themap #asia{
		display: block;
		background-color: transparent;
		position: absolute;
		top: 4px;
		left: 430px;
		width: 330px;
		height: 350px;
		z-index: 3;
		cursor: pointer;
	}
		#themap #asia:hover, #themap #asia.active {
			background: url(../../imgs/general/map-asia.png) top left no-repeat;
		}
	
	#themap #mideast{
		display: block;
		background-color: transparent;
		position: absolute;
		top: 135px;
		left: 319px;
		width: 175px;
		height: 200px;
		z-index: 4;
		cursor: pointer;
	}
		#themap #mideast:hover, #themap #mideast.active {
			background: url(../../imgs/general/map-mideast.png) top left no-repeat;
		}

h3.catname {
	margin: 3px 0 16px 1px;
	font: 17px/20px "Trebuchet MS", Helvetica, Arial, sans-serif;
	display: block;
	color: #C63434;
	text-align: left;
} 
	a.highlightonname {color: #B51D1D !important;}
	a.highlightoncap  {color: #B51D1D !important;}
	
	
	
	
	
	
	
	

/*****************************************************************************
  FIRM PAGES  ****************************************************************
*****************************************************************************/

/* for profile and process pages; 4 columns wide, leftmost 1 column for text */
.firm-wholecolumn {
	width: 950px;
	min-height: 500px;
	height:auto !important; /* for min-height to work in all browsers */
    height:500px;  /* for min-height to work in all browsers */
	position: relative;
}

	.firm-wholecolumn #bgoverlay {
		width: 950px;
		height: 500px;
		background: url(../../imgs/general/gradient-left.png) top left no-repeat;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 100;
	}
	
	.firm-wholecolumn img {
		margin: 0;
		padding: 0;
	}
	
	.firm-wholecolumn .textcolumn {
		padding: 9px 0 0 2px;
		width: 210px;
		color: #808080;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 101;
	}
		.firm-wholecolumn .textcolumn p {
			margin-bottom: 6px;
		}
		
	.firm-wholecolumn #awards {
		position: relative;
		width: 950px;
		min-height: 500px;
		height:auto !important; /* for min-height to work in all browsers */
		height:500px;  /* for min-height to work in all browsers */
		overflow: hidden !important;
		margin-top: 7px;
	}
		.firm-wholecolumn #awards .items {
			position: absolute;
			width: 10000px;
		}

	
		.firm-wholecolumn #awards .awardscolumn {
			width: 215px;
			margin-right: 25px;
			float: left;
		}
		
		.firm-wholecolumn #awards h6 {
			margin: 0 0 10px 0; 
			font: 18px/18px Corbel, "Trebuchet MS", Helvetica, Arial, sans-serif;
			display: block;
			color: #C85656;
			letter-spacing: -1px;
			text-align: left;
		}
		
		.firm-wholecolumn #awards li {
			margin-bottom: 14px;
			font-size: 10px;
			line-height: 14px;
			color: #808080;
		}
			.firm-wholecolumn #awards li span.proj {
				margin-left: 9px;
			}
		
			.firm-wholecolumn #awards li span.proj,
			.firm-wholecolumn #awards li span.proj a {
				color: #aaa;
			}
			
			.firm-wholecolumn #awards li span.proj a:hover {
				color: #Cf6C6C;
			}
			
		.firm-wholecolumn #awards ul {
			margin-bottom: 42px; /* 14 + 14 + 14 */
		}
 
 

 
 
 
/*****************************************************************************
  PEOPLE & PRINCIPAL BIO PAGES  **********************************************
*****************************************************************************/ 

/* this section is 4 columns wide, has the background image, and lists the principals */
.people-principalscolumn {
	width: 950px;
	min-height: 550px;
	height:auto !important; /* for min-height to work in all browsers */
    height:550px;  /* for min-height to work in all browsers */
	margin-bottom: 18px;
	font: 11px/16px Verdana, Helvetica, Arial, sans-serif;
	color: #919191;
	position: relative;
}
	.people-principalscolumn #bgoverlay {
		width: 950px;
		height: 100%;
		background: url(../../imgs/general/gradient-left.png) top left no-repeat;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 100;
	}
	
	.people-principalscolumn img {
		margin: 0;
		padding: 0;
	}

	.people-principalscolumn.lined {
		background: url(../../imgs/general/people-vertdivider.png) 205px 10px no-repeat;
	}
	
	.people-principalscolumn .linkcolumn {
		padding: 5px 0 0 0;
		margin-left: 2px;
		width: 238px; /* margin and width add to 240px wide */
	}
		.people-principalscolumn .linkcolumn.absolute {
			position: absolute;
			top: 0;
			left: 0;
			z-index: 101;
		}
	
		.people-principalscolumn .linkcolumn.floated {
			float: left;
		}
	
		.people-principalscolumn .linkcolumn .title {
			font-size: 10px;
			color: #C4C4C4;
			position: relative;
			top: -3px;
		}
	
	/* these styles (.biophotocolumn and .biotextcolumn) are for the principal bio pages */
	.people-principalscolumn .biophotocolumn {
		margin-top: 10px;
		margin-left: 16px;
		width: 216px;
		float: left;
	}
	
	.people-principalscolumn .biotextcolumn {
		margin-top: 10px;
		width: 465px;
		float: left;
		font: 10px/14px Verdana, Helvetica, Arial, sans-serif;
		color: #727272;
	}
		.people-principalscolumn .biotextcolumn p {
			margin-bottom: 6px;
		}
		
/* this section is 1 column wide and sits below the principals */
.people-directorscolumn {
	float: left;
	width: 205px;
	height: 531px;
	background: url(../../imgs/general/people-vertdivider.png) center right no-repeat;
	font: 11px/16px Verdana, Helvetica, Arial, sans-serif;
	color: #919191;
	margin-left: 2px;
	margin-right: 23px; /* left and right margins and width add to 240px wide */
}
	.people-principalscolumn a,
	.people-directorscolumn a	{
		color: #919191;
	}
	
	.people-principalscolumn a:hover,
	.people-directorscolumn a:hover {
		color: #Cf6C6C;
	}
	
	.people-principalscolumn  a.current,
	.people-principalscolumn li:hover a.current {
			color: #C85656;
		}

		.people-principalscolumn li,
		.people-directorscolumn li {
			margin-bottom: 4px;
		}
		
		
		
/* this section is 3 column wide and sits below 
the principals and to the right of directors */
.people-associates {
	float: left;
	width: 720px;
	font: 10px/12px Verdana, Helvetica, Arial, sans-serif;
	color: #919191;
}
	.people-associates .saps-column {
		width: 350px;
		margin-right: 20px;
		padding-bottom: 24px;
		background: url(../../imgs/general/people-vertdivider.png) center right no-repeat;
		margin-bottom: 24px;
		float: left;
	}
	
	.people-associates .aps-column {
		width: 350px;
		padding-bottom: 24px;
		margin-bottom: 24px;
		float: left;
	}
		.people-associates .minicolumn,
		.people-associates .minicolumn {
			width: 165px;
			margin-right: 7px;
			float: left;
		}
		
		.people-associates .minicolumn.last ,
		.people-associates .minicolumn.last {
			width: 155px;
			margin-right: 0px !important;
		}
	
	.people-associates li {
			margin-bottom: 6px;
		}
		
.postnom {
	text-transform: lowercase;
	font-variant: small-caps;
	/* color: #aaa; */
}
	h5 .postnom {
		color: #666;
	}

.twominicolumns {
	width: 350px;
	float: left;
}


/* styles for the headers and subheads on the people pages */
h4.principals { background-image: url(../../imgs/general/h4/principals.png); }
h4.directors { background-image: url(../../imgs/general/h4/directors.png); }
h4.saps { background-image: url(../../imgs/general/h4/saps.png); }
h4.aps { background-image: url(../../imgs/general/h4/aps.png); }


 
 
 
 
 
 
/*****************************************************************************
  NEWS PAGE  *****************************************************************
*****************************************************************************/ 
 
 /* this is 2 columns wide and contains the article thumbnail list */
.news-leftcolumn {
	width: 470px;
	margin-right: 10px;
	float:left;
}
	.news-leftcolumn li {
		height: 90px;
		background: url(../../imgs/general/news-horizdivider.png) top left no-repeat;
		padding-top: 10px;
		margin-bottom: 5px;
	}
		.news-leftcolumn li:hover { background: url(../../imgs/general/news-horizdivider-hover.png) top left no-repeat; }
	
	.news-leftcolumn img {
		float: left;
	}
	
	.news-leftcolumn .articlelink {
		margin-left: 95px; /* the news thumbnail is 85px wide; this leaves 10px margin */
		width: 250px;
		display: block;
		color: #aaa;
	}
		.news-leftcolumn .articlelink a {
			display: block;
			margin-bottom: 6px;
		}
	
		.news-leftcolumn .articlelink a:hover,
		.news-leftcolumn li:hover .articlelink a	{
			color: #C85656;
		}
		
		.news-leftcolumn .articlelink a.current,
		.news-leftcolumn li:hover .articlelink a.current {
			color: #C85656;
		}
		
.news-rightcolumn {
	width: 470px;
	float: left;
	font: 10px/14px Verdana, Helvetica, Arial, sans-serif;
	color: #727272;
	margin-top: 10px;
}
	.news-rightcolumn .articlephoto {
		float: left;
		margin-right: 16px;
		margin-bottom: 12px;
	}
	
	.news-rightcolumn p {
			margin-bottom: 6px;
	}
	
	.news-rightcolumn a {
		color: #333;
	}
		.news-rightcolumn a:hover { color: #C85656; }
	
	.news-rightcolumn ul, 
	.news-rightcolumn ol {
		margin: 12px 60px 12px 30px;
		color: #999;
	}
	
	.news-rightcolumn ul {
		list-style-type: square;
	}
	
	.news-rightcolumn li {
		margin-bottom: 6px;
	}
 

		
 



/*****************************************************************************
  CONTACT PAGES  *************************************************************
*****************************************************************************/ 
/* this section is 1 column wide and aligned left */
#inquiries-column {
	width: 215px;
	margin-top: 7px;
	margin-right: 25px;
	min-height: 400px;
	height:auto !important; /* for min-height to work in all browsers */
    height:400px;  /* for min-height to work in all browsers */
	color: #919191;
	font-size: 11px;
	line-height: 16px;
	background: url(../../imgs/general/contact-vertdivider.png) 200px -100px no-repeat;
	color: #999 !important;
	float: left;
}
	#inquiries-column .inner {
		width: 150px;
		margin-top: 7px;
	}
		#inquiries-column span.label {
			color: #555;
		}
		
		#inquiries-column p,
		#offices-column p,
		#careers-column p {
			margin: 0 0 16px 0;
			padding: 0;
		}
		
		#inquiries-column a {
			color: #999;
		}
		
		#inquiries-column a:hover {
			color: #B51D1D;
		}
		
		#inquiries-column .biglink {
			font-size: 13px;
		}
		
		#inquiries-column .abitlighter {
			color: #999;
		}


/* this section is 3 columns wide */
#offices-column {
	width: 215px; /* 710px is whole width for two column, 455 for three column */
	background: url(../../imgs/general/contact-vertdivider.png) 200px -100px no-repeat;
	margin-top: 7px;
	min-height: 400px;
	height:auto !important; /* for min-height to work in all browsers */
    height:400px;  /* for min-height to work in all browsers */
	color: #999;
	font-size: 11px;
	line-height: 16px;
	float: left;
}
	#offices-column div.address {
		margin-right: 0px; /* used to be 25px */
		width: 700px;
		float: left;
		margin-bottom: 8px;
		min-height: 130px;
		height:auto !important; /* for min-height to work in all browsers */
		height: 155px;  /* for min-height to work in all browsers */
	}
	
		#offices-column div.address.everythird {
			margin-right: 0;
		}
		
		#offices-column div.address p.street{
			margin-bottom: 0px;
		}
		
		#offices-column div.address p.phonenumbers{
			margin-top: 8px;
		}
	
		#offices-column div.address .contact-subhead {
			margin: 0;
			padding: 0;
			display: block;
			height: 25px;
			margin-top: 7px; /* top margin and height add to 32px */
			text-transform: lowercase;
			font-variant: small-caps !important;
			font: 14px/14px Corbel, "Trebuchet MS", Helvetica, Arial, sans-serif;
			letter-spacing: 2px;
			color: #666;
		}
		
		#offices-column div.address span.lighter {
			color: #C4C4C4 !important;
			margin-right: 5px;
		}
		
		/* style overrides for new york and london offices */
		#offices-column div.address.mainoffice {
			color: #666;
		}

			#offices-column div.address.mainoffice .contact-subhead {
				font-size: 14px;
				line-height: 14px;
				color: #333;
			}
	
#careers-column {
	width: 215px;
	margin-top: 7px;
	margin-left: 25px;
	min-height: 525px;
	height:auto !important; /* for min-height to work in all browsers */
    height:525px;  /* for min-height to work in all browsers */
	color: #919191;
	font-size: 11px;
	line-height: 16px;
	color: #808080 !important;
	float: left;
}
	#careers-column .inner {
		width: 150px;
		margin-top: 7px;
	}
	
#inquiries-column h4,
#offices-column h4,
#careers-column h4 {
	height: 32px
}

	h4.inquiries { background-image: url(../../imgs/general/h4/inquiries.png); }
	h4.offices { background-image: url(../../imgs/general/h4/offices.png); }
	h4.careers { background-image: url(../../imgs/general/h4/careers.png); }




	
	
	
	
/*****************************************************************************
  NOSCRIPT STYLES  **************************************************************
*****************************************************************************/	
body.noscript #topnav-projects-subnav{width:95px} 
body.noscript #topnav-firm-subnav{width: 365px} 
body.noscript #above-projecttext {position: absolute; bottom: 205px; left: 0; width: 230px;}
body.noscript #projecttext {height: 200px !important; position: absolute; bottom: 0; left: 0;}
body.noscript #projecttext .scroll-pane {height: 200px !important; width: 225px !important; padding-right: 5px; overflow: auto;}
body.noscript #topnav-projects:hover {background-image: url(../../imgs/general/menu-projects.png); cursor: default}
body.noscript #topnav-firm:hover {background-image: url(../../imgs/general/menu-profile.png); cursor: default}
body.noscript #nextPage, body.noscript #prevPage {display: none;}
	
	
	
	
	

/*****************************************************************************
  OTHER STYLES  **************************************************************
*****************************************************************************/
 /* makes text superscript */
.ss { font-size: 7px; position: relative; top: -4px; }
 
 /* makes text very light grey */
 .lightgrey { color: #ddd; }
 
 /* image caption for home page */
 .caption { display: block; margin-top: 5px; text-align: left; }

/* a small bottom margin */
.marginbottom4px { margin-bottom: 4px; display: block; }

/* scrollable navi */
.navi-container { width: 100%; text-align: center; }
.navi { height:20px; width: 75px; margin: 0 auto 0; } 
 	.navi a { width:8px; height:8px; float: left; margin:3px; background:url(../../imgs/general/navigator.png) 0 0 no-repeat; cursor:pointer !important; display:block; font-size:1px; } 
	.navi a:hover { background-position:0 -8px; } 
	.navi a.active { background-position:0 -16px; } /* active state (current page state) */ 

/* tooltips */
.pagetype-projectlist .tooltip,
.pagetype-firm .tooltip { 
	display:none; 
	background-color: transparent; 
	padding:1px; 
	font-size:9px; 
	z-index: 999;
	color: #D89E9E;
	text-align: center; 
	left: 0 !important; /*fixes on bios page */ 
}

/* avoids flickering between browser font and replaced font when cufon is active */
.cufon-loading  { visibility: hidden !important; }

input.ieBlur { background: url(../../imgs/general/search-text.png) left center no-repeat transparent; }

/* spacer */
.sp {
	color: #ddd;
	margin: 0 5px 0 5px;
}

/* clear floats */
.clear { clear: both; display: block; }