.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
	}
* html .clearfix             { zoom: 1; } /* IE6 */
*:first-child+html .clearfix { zoom: 1; } /* IE7 */

/* * {text-shadow: rgba(0, 0, 0, .01) 0 0 1px} fugly fonts in chrome */

.screenreader {
	position: absolute;
	left: -9000px;
	top: -9000px;
	}

.imageReplace {text-indent: -9000px;}
	
.transparent {
	-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; /* ie8 ports both; this variant doesn't work if meta tag below used */
	filter:alpha(opacity=33); /* for internet explorer <= 7, and 8 when <meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" /> */
	-moz-opacity:0.33; /* for older gecko browsers */
	-khtml-opacity: 0.33; /* for older webkit browsers */
	opacity: 0.33; /* CSS3 standard */
	}
	
img,
object,
embed 
{
max-width: 100%;
}
	#home img,
	#home object,
	#home embed {max-width: none;}
		#home #featureProject img {max-width: 100%;}


.ie7 img { -ms-interpolation-mode: bicubic; }

/*- optional vanity styles ----------*/
::selection {background: #00264D;color: #FFF;}
::-moz-selection {background: #00264D;color: #FFF;}

img::selection {background: transparent;}
img::-moz-selection {background: transparent;}

@media only screen and (max-device-width: 480px) {

	html {-webkit-text-size-adjust: none}
	a {-webkit-tap-highlight-color: rgba(0,38,77,0.4);}

	}

@font-face{
	font-family:"FrutigerLTW02-45Light";
	src:url("/fonts/99f761bf-9f30-4bdd-b284-ee7038dc52c9.eot?iefix") format("eot");
	}
@font-face{
	font-family:"FrutigerLTW02-45Light";
	src:url("/fonts/99f761bf-9f30-4bdd-b284-ee7038dc52c9.eot?iefix");
	src:url("/fonts/59d9a83f-4045-4d43-af46-655f845461ee.woff") format("woff"),url("/fonts/f901b503-9104-414a-a856-af9bcc802b5c.ttf") format("truetype"),url("/fonts/e4d07d96-8993-47b9-9f1d-1e228bf1c529.svg#e4d07d96-8993-47b9-9f1d-1e228bf1c529") format("svg");
	}

/*---------------------- global structure --------------------------*/

body {
	color: #444;
	font: 62.5%/1em 'FrutigerLTW02-45Light', Arial, Verdana, sans-serif !important; /* importanted to deal with imported font call */
	}
	body#home {
		background: #C3D0D9;
		}

html, body {height: 100%;}
	html.ie7,
	html.ie8 {height: 100%;}
	.ie7 body,
	.ie8 body {height: 99.0%;}

.inner {
	width: 100%;
	margin: 0 auto;
	position: relative;
	}
#contentual.inner {width: 96%;}


/*------------------------- header ---------------------------------*/

header {
	background: #98A4B6;
	margin-bottom: 7px;
	}

/* logo */
#brand {
	padding: 16px 0 6px 2%;
	z-index: 9998;
	width: 80%;
	}
	#brand a img {
		margin-bottom: 9px;
		}
	#brand img {
		float: left;
		clear: left;
		}
	.ie7 #brand {
		width: 265px;
		}



#navForResearchers {
		display:block;
	    padding: 5px 0 4px;
		background: #264065;
		}
		#navForResearchers ul li {
			float: left;
			text-align: center;
			}
			#navForResearchers ul li#nav-home {display: none;}
			#navForResearchers ul li#nav-news {width: 18%;}
			#navForResearchers ul li#nav-publications {width: 33%;}
			#navForResearchers ul li#nav-careers {width: 25%;}
			#navForResearchers ul li#nav-contact {width: 24%;}
				#navForResearchers ul li a {
					color: #96A6B6;
					font-size: 1.3em; /* 13px */
					line-height: 2.0769em; /* 24px */
					letter-spacing: 0.05em;
					text-transform: uppercase;
					}
					#navForResearchers ul li a.cur,
					#navForResearchers ul li a.cur:hover {
						color: #5E7994;
						}
			
#navForBrowsers {
	float: right;
	width: 100%;
	}
#navForBrowsers li {
	width: 25%;
	float: left;
	position: relative;
	text-align: center;
	}
		#navForBrowsers a {
			display: block;
			color: #FFF;
			font-size: 1.6em; /* 16px */
			line-height: 1.125em; /* 18px */
			padding: .5em 0;
			}
			#navForBrowsers .sfHover a,
			#navForBrowsers a:hover {
				color: #00264D;
				}
				#home #navForBrowsers .sfHover a,
				#home #navForBrowsers a:hover {
					color: #C0CEDB;
					}
			#navForBrowsers a.cur {
				color: #00264D;
				}
				
@media only screen and (max-width: 600px) {
	
			#navForBrowsers .sf-menu ul {
				display:none !important;
				}
}/*/mediaquery*/

				
  /*/	/////////////////////////////////// content!
 / /
/*/

section {
	width: 100%;
	padding-bottom: 3em;
	}
	section section {/*for when some content is sectioned within an article*/
		width: auto;
		padding: 0;
		}

article {
	position: relative;
	float: left;
	width: 100%;
	}

article p,
#careers article ul,
#about article ul,
ul#keyprojects,
aside ul p {
	font-size: 1.3em; /* 13px */
	line-height: 1.3846em; /* 18px */
	color: #4C4C4C;
	margin: 0 0 1.3846em;
	clear: left;
	}
aside ul a p {color: #3389B0}/* this is for the relevant projects on about */
aside ul a:hover p {color: #E97213}
	
article ul li { list-style: disc;}
article nav ul li,
.listing article ul li,
#offices.page article ul li,
#publications article ul li,
#home article ul li,
article ul#awardLogos li,
.awards li { list-style: none;}
	
aside a,
article a {
	color: #3389B0;
	}
aside a:hover,
article a:hover,
aside h3 a:hover,
article h3 a:hover {
	color: #E97213;
	}
		
aside {
	float: left;
	width: 100%;
	}

p.pullquote {
	font-size: 2.8em; /* 20px */
	line-height: 1.35em; /* 27px */
	width: 75%;
	float: right;
	color: #DD3D8C;
	margin-bottom: 36px;
	}


h1 {
	color: #00264D;
	font-size: 2.2em; /* 22px */
	line-height: 1.6364em; /* 36px */
	margin-bottom: 0.8182em;
	}
	#home h1 {
		position: absolute;top:-9999px;left: -9999px;
		}
	
h2 {
	color: #6F6F6F;
	font-size: 1.8em; /* 18px */ 
	line-height: 1em; /* 18px */
	padding-bottom: .5em;
	float: left;
	}
	#projectHeader h2 {
		color: #00264D;
		font-size: 2.2em; /* 22px */
		line-height: 1.2273em; /* 27px */
		margin-bottom: .4091em; /* 9px */
		padding: 0;
		width: 100%;
		}
	
h3 {
	display: block;
	clear: left;
	color: #00264D;
	font-size: 1.6em; /* 16px */
	line-height: 1.125em; /* 18px */
	margin: 0 0 .6923em;
	}
	#about h3 {
		display: none;
		}

h4 {
	color: #00264D;
	font-size: 1.2em; /* 12px */
	line-height: 1.5em; /* 18px */
	text-transform: uppercase;
	margin-bottom: 9px;
	}
	

	sup,
	sub {height: 0;
		line-height: 1;
		vertical-align: baseline;
		_vertical-align: bottom;
		position: relative;
		}
		sup {bottom: 1ex;}
		sub {top: .5ex;}
		
		
hgroup { /*the headers on pages where h1 + h2 are together, beside the fillwithSubNav*/
	float: left;
	width: 100%;
	margin-bottom: 12px;
	}
	#projects.listing hgroup {margin:0;}
		hgroup h2 {
			padding-left: 1em; /* 18px */
			line-height: 2em; /* 36px to match the h1 beside it */
			}
		#careers hgroup h2,
		#about hgroup h2 {
			line-height: 2.2em; /* a random amount to match the h1 beside it */
			}
		hgroup h1 {
			float: left;
			margin: 0;
			}
	
.langNav {
	border-top: 1px solid #C4C4C4;
	border-bottom: 1px solid #C4C4C4;
	margin-bottom: 16px; /* line height of 18px minus the borders */
	float: left;
	width: 100%;
	}
	.listing .langNav {
		border:none;
		margin: 0 0 0;
		width: auto;
		}
	#offices.page .langNav {
	
		}
	.langNav ul {
		float: right;
		}
		.langNav li {
			float: left;
			}
			.langNav a {
				margin-right: 10px;
				padding: 6px 12px 6px 0;
				font-size: 1.2em; /* 12px */
				line-height: 1.5em; /* 18px */
				color: #3389B0;
				}
				.langNav a.cur {
					color: #999;
					}	
				.listing .langNav a {
					line-height: 3.6em; /* matches the height of hgroup and pagination */
					}	

		
  /*/
 / /		people pages
/*/
		
#peopleNavs {display:none;}
.landing #peopleNavs {display: block;}
	
	#peopleNavs nav {/*the people sub navs*/
		display: block;
		padding-bottom: 3.6em;
		width: 73%;
		}
		#peopleNavs nav#peopleOffices ul {
			width: 50%;
			float: left;
			}
			#peopleNavs nav#peopleOffices ul#peopleOfficesRight {
				margin-top: 1.8em;
				}
			#peopleNavs nav ul li {
				background: #FFF;
				float: left;
				width: 100%;
				}
				#peopleNavs nav#peopleBoards ul li {
					float: none;
					width: 100%;
					}
					#peopleNavs p#viewAllLink {
						margin: 18px 0;
						clear:both;
						float: left;
						width: 100%;
						}
				p#viewAllLink a,
				#mainContent div#peopleNavs nav ul a {
					display: inline;
					font-size: 1.3em; /* 13px */
					line-height: 1.3846em; /* 18px */
					color: #3389B0;
					}
					#mainContent div#peopleNavs nav ul a:hover {color: #E97213;}
					#mainContent div#peopleNavs nav ul a.cur {color: #98A4B6;}

#mobNav {
	float: left;
	width: 100%;
	border-top: 1px solid #C4C4C4;
	}
	#mobNav li {
		float: left;
		width: 50%;
		}
			#mobNav a {
				font-size: 1.3em; /* 13px */
				line-height: 1.3846em; /* 18px */
				color: #3389B0;
				padding-left: 16px;
				background: transparent url(/graphics/arrows_back.png) no-repeat 0 2px;
				}
			#mobNav a:hover {
				color: #E97213;
				background: transparent url(/graphics/arrows_back.png) no-repeat 0 -13px;
				}



	#people #peopleList h2 {
		padding-bottom: 1em;
		}
	#peopleList ul {
		float: left;
		width: 100%;
		border-top: 1px solid #C4C4C4;
		margin-top: -1px;
		padding: .6em 0;
		}
		#peopleList li {
			float: left;
			width: 32.8333%;
			margin: 0 .5% 9px 0;
			background: #FFF;
			position: relative;
			}
				#peopleList li#item3,#peopleList li#item6,#peopleList li#item9,#peopleList li#item12,#peopleList li#item15,#peopleList li#item18,#peopleList li#item21,#peopleList li#item24,#peopleList li#item27,#peopleList li#item30,#peopleList li#item33,#peopleList li#item36,#peopleList li#item39,#peopleList li#item42,#peopleList li#item45,#peopleList li#item48,#peopleList li#item51,#peopleList li#item54,#peopleList li#item57,#peopleList li#item60 { margin-right: 0; }
			#peopleList #peopleFilter li {
				width: 50%;
				margin: 0 0 9px;
				}
			.consultants #peopleList li {
				float: none;
				width: 50%;
				margin-bottom: 9px;
				}
			.AtoZ #peopleList #peopleFilter li {
				font-size: 1.3em; /* 13px */
				line-height: 1.3846em; /* 18px */
				}

		#peopleList ul li a {
			position: relative;
			display: block;
			overflow: hidden;
			}
			#peopleList ul li a p {
				position: absolute;
				top: 85%;
				left: 0;
				background: rgba(255,255,255,.75);
				margin: 0;
				width: 98%;
				padding: 2% 2% 3em;
				line-height: 1em;
				}
				.ie7 #peopleList ul li a p,
				.ie8 #peopleList ul li a p { background: transparent url(/graphics/white_75.png) repeat 0 0;}
					#peopleList ul li a:hover p,
					.ie7 #peopleList ul li a:hover p,
					.ie8 #peopleList ul li a:hover p { background: #FFF;}

	.listing #mainContent nav#peopleFilter ul li {/* filter on people page A-Z view */
		float: left;
		margin: 0;
		}

/*people single*/
#people.page article img {
	float: right;
	width: 33.3333%;
	margin: 0 0 9px 18px;
	}
.ie7 #people article section {
	height:auto;
	overflow:hidden;
	}
.iehack {display: none;}
.ie7 .iehack {display: block;}
	
	
	
	
#officesList li {margin: 0 0 3.6em 0;}
#officesList li p {margin: 0;}
	
#officeProfile {
	width: 100%;
	float: left;
	margin-bottom: 36px;
	}
		

	
   /*/	office single
  / /
 /*/		

#officeLocation { /* this is the office box on the office single page */
	width: 100%;
	min-height: 14.2em;
	float: right;
	clear: right;
	padding: 1.8em 0 0;
	position: relative;
	}
		#officeLocation div#contactAddress,
		#officeLocation div#contactDetails {
			width: 94%;
			float: left;
			padding: .9em 3% .9em 3%;
			background: #F2F3F5;
			}
			#officeLocation div#contactDetails {
				padding: .9em 3% 2.7em 3%;
				}
		#officeLocation div#officeMap {
			width: 100%;
			float: left;
			margin-bottom: 1.8em;
			}
			#officeLocation div#officeMap .map {
				width: 100%;
				height: 18em;
				}
					
		#contactAddress p,
		#contactDetails p {margin: 0; /* reset */}
		
		
#latestNewsList {width: 100%;}
#offices #latestNewsList {margin-bottom: 18px;}
#latestNewsList ul {
	float: left;
	width: 100%;
	border-top: 1px solid #C4C4C4;
	margin-top: -1px;
	padding: .6em 0 1.2em;
	}
	
#offices #officeLocation h2 {
	border-bottom: 1px solid #C4C4C4;
    margin: 0 0 .4em;
    width: 100%;
    }
    
#latestNewsList a h3 {
	color: #3389B0;
	margin: 0.28125em 0;
	}
article p.date {
	font-size: 1.2em; /* 12px */
	line-height: 1.5em; /* 18px */
	}
	
#offices #projectsList ul {
	border-top: 1px solid #c4c4c4;
	}
	.ie7 #offices #latestNewsList ul li,
	.ie8 #offices #latestNewsList ul li {
		float: left;
		width: 30.3333%;
		margin: 0 4.5% 0 0;
		}
		.ie7 #offices #latestNewsList li#item3,
		.ie8 #offices #latestNewsList li#item3  {margin: 0;}
			.ie7 #offices #latestNewsList ul.total1 li,
			.ie8 #offices #latestNewsList ul.total2 li,
			.ie7 #offices #latestNewsList ul.total1 li,
			.ie8 #offices #latestNewsList ul.total2 li {  /* 1 or 2 items */
				float: left;
				width: 47%;
				margin: 0 4% 0 0;
				}
				.ie7 #offices #latestNewsList ul.total2 li#item2,
				.ie8 #offices #latestNewsList ul.total2 li#item2  {margin: 0;}
		
#offices #latestNewsList h3 {
	font-size: 1.5em; /* 15px */
	line-height: 1.2em; /* 18px */
	margin: 0;
	}
#offices #latestNewsList img {
	width: 33.3333%;
	float: left;
	margin: 4px 9px 5px 0;
	}
	.ie7 #offices #latestNewsList ul.total1 img,
	.ie8 #offices #latestNewsList ul.total1 img,
	.ie7 #offices #latestNewsList ul.total2 img,
	.ie8 #offices #latestNewsList ul.total2 img {
		width: 25%;
		}
#offices #latestNewsList p {
	clear: none;
	}		

	
	
	
   /*/	projects list then single
  / /
 /*/

#projectsList ul {
	width: 100%;
	padding: .6em 0;
	}
	#projectsList ul li {
		position: relative;
		overflow: visible;
		text-align: center;
		}
		#projectsList ul li div {
			padding: 9px 5% 0;
			width: 91%;
			position: absolute;
			left: 0;
			bottom: 0;
			background: rgba(255,255,255,.6);
			text-align: left;
			}
			.ie7 #projectsList ul li div,
			.ie8 #projectsList ul li div {
				background: transparent url(/graphics/white_75.png) repeat 0 0;
				}
			#projectsList ul li a p {
				margin: 0 0 9px;
				}
			#projectsList ul li a:hover div {
				background: #FFF;
				}
	#projectsList ul li h3 {
		margin: 0;
		}

#projectCategoryIntro {
	float: left;
	width: 100%;
	border-top: 1px solid #C4C4C4;
	padding-top: 9px;
	}
	#projectCategoryIntro p {
		width: 66%;
		margin: 0;
		}

#projects.listing #viewNav,
#projects.listing #filtersNav {
	margin-bottom: 9px;float: left;
	}
	#mainContent .sf-menu ul { /* drop downs on projects listing for example */		
		padding: 9px 0;
		float: left;
		}

#projectInfo .langNav {
	margin: 0;
	}
#projectHeader h3 {
	float: left;
	color: #939393;
	margin: 0 4px 0 0;
	font-size: 1.3em;
    line-height: 1.3846em;
	}
article #projectHeader p {
	clear: none;
	float: left;
	margin: 0;
	}
article #projectHeader p#sectorTags	{
	font-size: 1.1em; /* 11px */ 
	line-height: 1.6364em; /* 18px */
	text-transform: uppercase;
	padding: 0.8182em 0; /* 9px 0px */
	clear: left;
	}
	article #projectHeader p#sectorTags	a {
		background: #D3E4C9;
		color: #32531E;
		display: block;
		margin: 0 2px 2px 0;
		padding: 0 4px;
		float: left;
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
		-khtml-border-radius: 3px;
		border-radius: 3px;
		}
	article #projectHeader p#sectorTags	a:hover {
		background: #32531E;
		color: #fff;
		}
#projectInfoOptions {
	float: left;
	margin: .9em 0;
	}
	#projectInfoOptions h3 {
		font-size: 1.6em; /* 16px */
		line-height: 1.125em; /* 18px */
		padding: 0 0 0.5625em 10%;
		width: 90%;
		border-bottom: 1px solid #D1D1D1;
		}
	#projectInfoOptions li {
		font-size: 1.3em; /* 13px */
		line-height: 1.3846em; /* 18px */
		color: #4C4C4C;
		margin: 0 0 1.3846em;
		clear: left;
		}
		#projectInfoOptions #projectsPageNav li {
			font-size: 1.2em; /* 12px */
			line-height: 1.5em; /* 18px */
			margin: 0 0 0 0;
			}
		
#projectsPageNav {
	float: left;
    width: 100%;
	}
	#projectInfoOptions #projectsPageNav h3 {
		font-size: 1.2em; /* 12px */
		line-height: 1.5em; /* 18px */
		padding: 0;
		margin: 0;
		color: #939393;
		width: 100%;
		border-bottom: 0;
		text-transform: uppercase;
		}
	#projectInfoOptions #projectsPageNav a {
		padding-left: 16px;
		background: transparent url(/graphics/arrows_projectsPageNav.png) no-repeat 0 0;
		}
	#projectInfoOptions #projectsPageNav #nextProjectLink a {
		background-position: 0 -1px;
		}
		#projectInfoOptions #projectsPageNav #nextProjectLink a:hover {
			background-position: 0 -17px;
			}
	#projectInfoOptions #projectsPageNav #previousProjectLink a {
		background-position: 0 -33px;
		}
		#projectInfoOptions #projectsPageNav #previousProjectLink a:hover {
			background-position: 0 -49px;
			}
	#projectInfoOptions #projectsPageNav #allProjectsLink a {
		background-position: 0 -65px;
		}
		#projectInfoOptions #projectsPageNav #allProjectsLink a:hover {
			background-position: 0 -81px;
			}


#pagination {
	float: left;
	padding-top: 8px;
	border-top: 1px solid #c4c4c4;
	width: 100%;
	margin-left: 36px;
	}
	#pagination li {
		float: left;
		margin-right:6px;
		}
		#pagination li:last-child {
			margin-right:0;
			}
	#pagination a {
		font-size: 1.8em; /* 18px */
		line-height: 2em; /* 36px */
		color: #3389B0;
		}
		#pagination:last-child a {/* to make second pagination on project list smaller */
			font-size: 1.2em; /* 12px */
			line-height: 1.5em; /* 18px */
			}
		#pagination a.active,
		#pagination a.active:hover {
			color: #666;
			}
		#pagination .page-previous a,
		#pagination .page-next a {
			display: block;
			width: 16px;
			height: 14px;
		    margin-top: 11px;
			text-indent: -9999em;
			}
			#pagination:last-child .page-previous a,
			#pagination:last-child .page-next a {
			    margin-top: 0;
				}
		#pagination .page-previous a {background: transparent url(/graphics/arrows_pagination.png) no-repeat 0 0;
			}
		#pagination .page-next a {background: transparent url(/graphics/arrows_pagination.png) no-repeat -16px 0;
			}
			#pagination .page-previous a:hover {background: transparent url(/graphics/arrows_pagination.png) no-repeat 0 -24px;
				}
			#pagination .page-next a:hover {background: transparent url(/graphics/arrows_pagination.png) no-repeat -16px -24px;
				}
	#pagination a:hover {color: #E97213;}
	
		#projects #pagination a {}
		#projects #pagination {
			border: 0;
		    float: right;
		    padding: 0;
		    width: auto;
			}



/* ------- plugin styles ------- */

.rg-image-wrapper{
	position:relative;
	min-height:80px;
	}
.rg-image{
	position:relative;
	text-align: left;
	line-height:0px;
	}
.rg-image img{
	max-height:100%;
	max-width:100%;
	}
.rg-image-nav a {
	position:absolute;
	bottom: 0;
	left: 0;
	background:#00264D url(../graphics/elastislide/nav.png) no-repeat 1px center;
	width: 36px;
	height: 54px;
	text-indent: -9000px;
	cursor:pointer;
	opacity: 0.5;
	outline: none;
	z-index: 999;
	}
.rg-image-nav a.rg-image-nav-next{
	right: 0;
	left:auto;
	background-position: -36px center;
	}
.rg-image-nav a:hover{
	opacity:0.95;
	}
.rg-caption {
	text-align:center;
	margin-top:15px;
	position:relative;
	}
.rg-caption p {
	padding:0 15px;
	}
	
.rg-view{
	height:30px;
	display:none;
	}
		
.rg-loading {
	width:46px;
	height:46px;
	position:absolute;
	top:50%;
	left:50%;
	background:#00264D url(../graphics/elastislide/ajax-loader.gif) no-repeat center center;
	margin:-23px 0px 0px -23px;
	z-index:1000;
	opacity:0.7;
	}


/* Elastislide Style */
.es-carousel-wrapper{
	padding: 1px 15px 8px;
	position:relative;
	margin: 9px 0 8px;/* -1px for the border */
	border-top: 1px solid #C4C4C4;
	}
.es-carousel{
	overflow:hidden;
	}
	.es-carousel ul{
		display:none;
		}
		.es-carousel ul li{
			height:100%;
			float:left;
			display:block;
			}
			.es-carousel ul li a {
				display:block;
				/*border-style:solid;
				border-color:#222;*/
				opacity:0.66;
				-webkit-touch-callout:none;
				/* option */
				-webkit-transition: all 0.2s ease-in-out;
				-moz-transition: all 0.2s ease-in-out;
				-o-transition: all 0.2s ease-in-out;
				-ms-transition: all 0.2s ease-in-out;
				transition: all 0.2s ease-in-out;
				}
				.es-carousel ul li.selected a,
				.es-carousel ul li a:hover {
					/*border-color:#fff;*/
					opacity:1.0;
					}			
		.es-carousel ul li a img {
			display:block;
			border:none;
			max-height:100%;
			max-width:100%;
			}
		.es-nav span {
			position: absolute;
			top: 0;
			left: 0;
			background: #00264D url(../graphics/elastislide/nav_thumbs.png) no-repeat center left;
			width:14px;
			height:53px;
			text-indent:-9000px;
			cursor:pointer;
			opacity:0.7;
			}
			.es-nav span.es-nav-next{
				right:0;
				left:auto;
				background-position: center right;
				}
			.es-nav span:hover{
				opacity:1.0;
				}
			
			
			
			
					
  /*/ 
 / /	subnav
/*/	

#subNav {
	float: left;
	}
	#careers #subNav,
	#about #subNav {
		border-bottom: 1px solid #C4C4C4;
		margin-bottom: 17px;
		width: 100%;
		position: absolute;
		}
	#careers hgroup, /* this is the h1 + h2 next to the subnav */
	#about hgroup {
		margin-top: 45px;
		}
	#projects.listing #subNav {
		padding: .45em 0 .45em;
		border-bottom: 1px solid #C4C4C4;
		border-top: 1px solid #C4C4C4;
		width: 100%;
		float: left;
		margin-bottom: 9px;
		}
#subNav li {
	float: left;
	margin-right: 16px;
	}
	#subNav li#awards {
		margin-right: 0;
		}
#subNav ul a {
	font-size: 1.3em; /* 13px */
	line-height: 1.3846em; /* 18px */
	display: block;
	color: #666;
	}
	#careers #subNav ul a,
	#about #subNav ul a {
		line-height: 2.5714em; /* 18px */
		}
	#subNav ul a.cur {color: #00264D;
		}
	
#subNav div#searchbox {
	float: left;
	width: 100%;
	}

#subNav ul#filtersNav {clear: left;}

	

	#searchbox label {
		float: left;
		font-size: 1.4em;
		line-height: 1.2857em;
		}
	input#keywords { /* search input */
		border: 1px solid #C4C4C4;
		background: #CDD4DE;
		padding: 1px 0 2px;
		color: #00264D;
		margin: 0 2px;
		float: left;
		}
	input.submit {
		display: block;
		width: 18px;
		height: 18px;
		background: transparent url(/graphics/submit.png) no-repeat 0 0;
		border: none;
		text-indent: -9999px;
		float: left;
		}
		.ie7 input.submit {
			font-size: 0;
			line-height: 0;
			}
		input.submit:hover {
			background: transparent url(/graphics/submit.png) no-repeat 0 -18px;
			cursor: pointer;
			}
			
p#searchresult {
	margin: 0;
	padding: 0.6923em 0;
	border-top: 1px solid #C4C4C4;
	}



#relatedProjects {/* on the about us & news single pages*/
	width: 50%;
	float: left;
	}
	.ie7 #relatedProjects {/* on the about us & news single pages*/
		width: 49%;
		}
	#relatedProjects ul {
		margin-bottom: 3.6em;
		}
	#about #relatedProjects li {
		width: 80%;
		}
		#news #relatedProjects li {
			font-size: 1.3em; /* 13px */
			line-height: 1.3846em; /* 18px */
			}

    	


		
 /*/  ------------------- careers page ------------------------
/*/

#careers h3 {
    float: left;
	border-bottom: 1px solid #CCCCCC;
    margin-top: 1.125em;
    padding: 0 0 8px;
    width: 100%;
	}


 /*/  ------------------- publications page ------------------------
/*/

#publications article {
	float: left;
	width: 25%;
	}
	
#publications h2 {
	width: 100%;
	}
#publications article ul {
	width: 100%;
	}
#publications article p {
	margin-bottom: 0;
	}
	



 /*/  --------------------- about ----------------------
/*/

aside figure {
	margin-bottom: 1.8em;
	float: left;
	width: 100%;
	}
.ie7 aside figure,
.ie8 aside figure {
	width: 85%;
	float: right;
	}
	.ie7 .who-we-are aside figure,
	.ie8 .who-we-are aside figure {
		width: 100%;
		}
	.ie7 aside figure img,
	.ie8 aside figure img {
		border-bottom: 1px solid #FFF;/* a happy hack - let it live */
		}

#sustainLogos {
	float: left;
	width: 50%;
	}
#sustainLogos li {
	margin: 0 18px 18px 0;
	}

.awards h4 {
	margin-bottom: 0;
	}
.awards li {
	margin-bottom: .9em;
	}
	.awards #subNav li {
		margin-bottom: 0;
		}
	
	
.flex-container {
    position: relative;
	}
.flexslider {
    background: none repeat scroll 0 0 #FFFFFF;
    float: left;
    position: relative;
    width: 100%;
	}
.flexslider .slides li {
    position: relative;
	}
.flexslider .slides > li {
    display: none;
    overflow: hidden;
	}
.flexslider .slides li li {
    display: block;
    overflow: visible;
	}
	
.flex-direction-nav {
	/*position: absolute;
	top: 0;
	right: 0;*/
	display: none;
	}

.custom-controls {
	float: left;
	width: 100%;
	border-bottom: 1px solid #D1D1D1;
	}
	.custom-controls li {
		float: left;
		margin-right: 20px;
		font-size: 1.6em;
    	line-height: 1.125em;
		}
	.custom-controls li a.active{
		color: #00264D;
		}


 /*/  --------------------- news ----------------------
/*/

#newsList {
	float: left;
	width: 100%;
	}
#newsList h3 {
	font-size: 1.5em; /* 15px */
	line-height: 1.2em; /* 18px */
	margin: 0;
	}
#newsList li {
	float: left;
	width: 100%;
	border-top: 1px solid #C4C4C4;
	padding-top: 8px; /* -1px for the border */
	}

article #newsList p {
	clear:none;
	}	
article p.newsDate {
	font-size: 1.2em; /* 12px */
	line-height: 1.5em; /* 18px */
	}	
#newsList img {
	width: 33.3333%;
	float: left;
	margin: 4px 9px 5px 0;
	}
	
#awardLogos li {
	float:left;
	width: 100px;
	margin: 0 10px 10px 0;
	}
	






/* 1 second for the transitions */
.accordion .pointer, 
.accordion article, 
.accordion section hgroup {
	-webkit-transition: all 1s ease-in-out;
	-moz-transition: all 1s ease-in-out;
	-o-transition: all 1s ease-in-out;
	-ms-transition: all 1s ease-in-out;
	transition: all 1s ease-in-out;
	}
.accordion {}
.accordion section {overflow:hidden;}
.accordion section:first-child hgroup {}
.accordion section:last-child:not(.accordion_current) hgroup {}

/* Change the color below for the unselected section */
.accordion section hgroup {
	margin:0 !important;
	cursor: pointer;
	position: relative;
	}

.accordion section hgroup h3, 
.accordion section hgroup h4 {}

/* Change the color below for currently selected section */
.accordion section.accordion_current hgroup {}

.accordion .pointer {
	display: block;
	position: absolute;
	width: 14px;
	height: 13px;
	background: transparent url(../graphics/arrow_accordion.gif) 0 0 no-repeat;
	margin-top: 3px;
	}

.accordion section.accordion_current hgroup .pointer {
	-webkit-transform:rotate(90deg);
	-moz-transform:rotate(90deg);
	-o-transform:rotate(90deg);
	-ms-transform:rotate(90deg);
	transform:rotate(90deg);
	}

.accordion article {
	display: block;
	height: 0;
	margin: auto;
	padding: 0;
	overflow:hidden;
	opacity: 0;
	}

.accordion section.accordion_current article {
	/*height: 495px;*/
	height: 100%;  /* There is a bug in mozilla/webkit which stops the transition when using a relative height */
	opacity: 1;
	padding-bottom: 36px;
	}

.viewall1 {
	font-size: 1.3em; /* 13px */
	line-height: 1.3846em; /* 18px */
	display: block;
	width: 33%;
	text-align: right;
	float: right;
	}
	.viewall1:hover {
		color: #E97213;
		cursor: pointer;
		}


  /*/ /////////////////////// homepage
 / /
/*/

#home header {background: transparent url(/graphics/blue_42.png) repeat 0 0;}
#home #navForResearchers {background: transparent url(/graphics/blue_42.png) repeat 0 0;}
	#home #navForResearchers ul li a {color: #FFF;}
		#home #navForResearchers ul li a:hover {color: #5E7994;}
#home footer {background: transparent url(/graphics/blue_70.png) repeat 0 0;}
#home #contentual.inner {
	position: static;
	}

#home #latestNewsList {
	margin-top: 36px;
	width: 100%;
	}
	.ie7 #home #latestNewsList,
	.ie8 #home #latestNewsList {
		position: absolute;
		bottom: 90px;
		width: 25%;
		}
	#home #latestNewsList h2 {
		width: 100%;
		}
	#home #latestNewsList ul {
		border: 0;
		margin: 0;
		padding: 0;
		}
		#home #latestNewsList ul li a {
			background: rgba(255,255,255,.6);
			padding: 9px;
			margin: 0 0 1px;
			display: block;
			}
			.ie7 #home #latestNewsList ul li a,
			.ie8 #home #latestNewsList ul li a {
				background: transparent url(/graphics/white_60.png) repeat 0 0;
				float: left;
				width: 100%;
				}
			#home #latestNewsList ul li a:hover {
				background: #FFF;
				}
				#latestNewsList a h3 {
					color: #00264D;
					}
				#home article p.date {
					margin-bottom: 0;
					}
		ul#slide-list {
			margin: 0 !important;
			float: left;
			}

#featureProject {/* this is the featured project on the mobile version of the homepage */
	width: 100%;
	margin-bottom: 36px;
	}
	#featureProject h2 {
		width: 100%;
		}
	#featureProject a {
		display: block;
		position: relative;
		float: left;
		}
		#featureProject img {
			
			}
		#featureProject h3 {
			width: 90%;
			background: rgba(255,255,255,.5);
			position: absolute;
			bottom: 0;
			padding: 9px 5% 18px;
			margin: 0;
			}


  /*/ //////////////////////////////////// footer
 / /
/*/

footer {
	float: left;
	bottom: 0;
	width: 100%;
	background-color: #00264D;
	position: relative;
	}
	.ie7 footer,
	.ie8 footer {
		height: 45px;
		margin-top: -45px;
		}
		footer .inner {width: 96%;}
footer img { /* strap */
	margin: 12px 0 0;
	float: left;
	width: 80%;
	}
	.ie7 footer img,
	.ie8 footer img {
		width: auto;
		}
footer p#smallprint {
	float: left;
	clear: left;
	color: #96A6B6;
	padding: 12px 0;
	}
#socialicons {
	float: right;
	margin: 6px 0 0 0;
	}
	#socialicons li {
		float: left;
		margin-left: 4px;
		}
	#socialicons li a {
		display: block;
		width: 21px;
		height: 21px;
		text-indent: -9999px;
		background: transparent url(/graphics/social_icons.png) no-repeat 0 0;
		}
		#socialicons li#twitter a {
			background-position: -21px 0;
			}
			#socialicons li#twitter a:hover {
				background-position: -21px -21px;
				}
		#socialicons li#facebook a {
			background-position: 0 0;
			}
			#socialicons li#facebook a:hover {
				background-position: 0 -21px;
				}
	.ie7 footer p#smallprint,
	.ie8 footer p#smallprint {
		float: right;
		clear: none;
		}



		
@media only screen and (max-width: 760px) {
	#controls-wrapper {
		display: none !important;
		}
}

	
		
@media screen and (min-width: 600px) {
	body#home {background: none;}
	
	header nav ul {width: 80%;float:right;}
	
	#projectsList ul li {
		float: left;
		width: 49%;
		margin-right: 1px;
		text-align: left;
		}
		#projectsList ul li#item1 {clear: left;}
			
	#about h3 {
		display: block;
		}
		
	.custom-controls {
		}
		.custom-controls li {
			font-size: 1.3em;
	    	line-height: 1.3846em;
			}
}

		
@media screen and (min-width: 768px) {

	#featureProject {display:none;}/* homepage feature for mobile */

	body {overflow-x: hidden;}
	
	body > #prefooter {min-height: 100%;height: 100%;}
	
	.ie7 body#home #prefooter {
		min-height: 100%;
		height: auto !important;
		height: 100%;
		margin-bottom: -39px;
		}
		.ie7 .push {height: 45px;clear: both;}
	
	.ie8 body > #prefooter {height: auto !important;height: 100%;}

	.inner {
		width: 96%;
		max-width: 1140px;
		margin: 0 auto;
		position: relative;
		}

	section {
		float: left;
		padding-bottom: 9em;
		}
		#projects section#mainContent {
			padding-bottom: 5.4em;/* reduced from 9em due to the regrettable resurgence of the fold */
			}
		#offices.page section#mainContent { /* office single which has two sections*/
			padding-bottom: 1.8em;
			}
			.ie7 section,
			.ie8 section {
				padding-bottom: 4.5em;
				}
				.ie7 section section,
				.ie8 section section {
					padding-bottom: 0;
					}
				.ie7 #offices.page section#mainContent,
				.ie8 #offices.page section#mainContent { /* office single which has two sections*/
					padding-bottom: .9em;
					}
		section#mainContent {
			padding-top: 1.8em;
			}
	aside {
		float: left;
		width: 60%;
		}
	
	#brand {
		float: left;
		padding: 16px 0 6px 0;
		width: auto;
		}	

	
		#navForResearchers ul {
			float: right;
			width: 75%;
			}
			#navForResearchers ul li {
				text-align: right;
				}
				#navForResearchers ul li#nav-home {display:block;width: 15%;text-align: left;}
				#navForResearchers ul li#nav-news {width: 15%;text-align: center;}
				#navForResearchers ul li#nav-publications {width: 26%;}
				#navForResearchers ul li#nav-careers {width: 22%;}
				#navForResearchers ul li#nav-contact {width: 22%;}
					.ie7 #navForResearchers ul li#nav-contact {width: 21%;float:left;}
					#navForResearchers ul li a:hover {color: #FFF;}


	#navForBrowsers {
		width: 62%;
		z-index: 9999;
		}
		#navForBrowsers li {
			text-align: right;
			}
			#navForBrowsers a {
				float: right;
				position: relative;
				margin: 1em 0 0;
				padding: .5em 0 .5em 18px;
				font-size: 1.8em; /* 18px */
				line-height: 1em; /* 18px */
				}
				#navForBrowsers a.cur {
					background: transparent url(../graphics/arrow_cur_mainNav.gif) left center no-repeat;
					}


				#navForBrowsers .sf-menu ul {
					width: 400%;
					margin-left: -100%;
					border-top: 1px solid #c4c4c4;
					}
					#navForBrowsers li li {
						width: 28%;
						margin: 0 0 0 3%;
						text-align: left;
						}
						#home #navForBrowsers li li a:hover,
						#navForBrowsers li li a:hover {
							color: #FFF;
							}


/*__________________ Offices drop __________________*/

				#navForBrowsers li li {
					width: 100%;
					margin: 0;
					}
					#navForBrowsers li li a {
						font-size: 1.5em; /* 15px */
						line-height: 1.6em; /* 24px */
						padding: 0 1.2em; /* 18px */
						margin: 0;
						border: 0;
						float: none;
						}
						#home #navForBrowsers li.sfHover li a,
						#navForBrowsers li.sfHover li a {
							color: #FFF;
							}
						#home #navForBrowsers li li a:hover,
						#navForBrowsers li li a:hover {
							color: #00264D;
							}						
						#navForBrowsers li li a.cur { /* this is a reset don't touch it if you can't quote W3C standards by heart. just kidding (but only on the last bit. */	background: none;
							}
					
				.sf-menu ul { /* restores drops on larger displays*/
					display: block;
					}
				
				#navForBrowsers .sf-menu ul {
					position: absolute;
					top: -999em;
					left: -999em;
					width: 100%;
					padding: 9px 0;
					background: transparent url(../graphics/drop_bg.png) 0 0 repeat;
					width: auto;
					margin-left: 0;
					border-top: 0;
					}
					#navForBrowsers .sf-menu li:hover {visibility: inherit; /* fixes IE7 'sticky bug' */}
					
					#navForBrowsers .sf-menu li:hover ul,
					#navForBrowsers .sf-menu li.sfHover ul {
						left: 50%;
						top: 5em; /* match top ul list item height */
						z-index: 9999;
						}
					
					#navForBrowsers li li a:hover,
					#navForBrowsers li li a.sfHover {
						/*background: #FFF;*/
						border: 0;
						}
						
					.sf-menu li {position: relative;}
					
	/*__________________ subnav drops __________________*/
					
				#mainContent .sf-menu ul {
					position: absolute;
					top: -999em;/**/
					background: transparent url(../graphics/drop_bg.png) 0 0 repeat;
					float: none;
					}
					#mainContent .sf-menu ul.listCol2 {
						background: none;
						}
				#mainContent .sf-menu li:hover {visibility: inherit; /* fixes IE7 'sticky bug' */}
				
				#subNav ul ul a {color: #FFF;}
				#subNav ul ul a:hover {color: #00264D;}
					
				#mainContent .sf-menu li:hover ul,
				#mainContent .sf-menu li.sfHover ul {
					left: 50%;
					top: 1.8em; /* match top ul list item height */
					z-index: 997;
					padding-top: 9px;
					}
					#mainContent .sf-menu li:hover ul.listCol1,
					#mainContent .sf-menu li.sfHover ul.listCol1 {
						left: 0;
						}
					#mainContent .sf-menu li.lastSubNavItem:hover ul,
					#mainContent .sf-menu li.lastSubNavItem.sfHover ul {
						left: auto;
						right: 0;
						}
					.listing #mainContent .sf-menu ul li {
						display: block;
						float: none;
						width: 100%;
						}
						

	/* next two lines are a hack for ie7, to keep the main nav drops from going behind content*/		
	.ie7 header,header * {z-index: 100000;}
	.ie7 #contentual * {z-index: 30;}					

	
			article figure {
				width: 62%;
				float: right;
				margin: 0 2% 18px;
				}
				article figure img {
					margin: 0 0 9px;
					width: 100%;
					}

	#careers article,
	#about article {
		float: left;
		clear: left;
		width: 37%;
		margin-right: 3%;
		}





  /*/	///////////////////////////////// offices single
 / /
/*/

#offices #latestNewsList ul li { /* 3 items */
	float: left;
	width: 30.3333%;
	margin: 0 4.5% 0 0;
	}
	#offices #latestNewsList li#item3  {margin: 0;}
	
#offices #latestNewsList ul.total1 li,
#offices #latestNewsList ul.total2 li {  /* 1 or 2 items */
	float: left;
	width: 48%;
	margin: 0 3% 0 0;
	}
	#offices #latestNewsList ul.total2 li#item2  {margin: 0;}
	#offices #latestNewsList ul.total1 img,
	#offices #latestNewsList ul.total2 img {
		width: 25%;
		}





  /*/	///////////////////////////////// projects pages
 / /
/*/
	
	#projectsList {width: 100%;}
		#projectsList ul {
			clear:left;
			float: left;
			}
			#projectsList ul li {
				width: 24.9%;
				/* bottom margin created by weird spacing issue but it works.*/
				}
				#projectsList ul li#item4,
				#projectsList ul li#item8,
				#projectsList ul li#item12,
				#projectsList ul li#item16,
				#projectsList ul li#item20 {
					margin-right: 0;
					}
					#projectsList form {
						float: right;
						}
						
		#projectInfo {
			float: right;
			width: 23.61%;
			}
		#projectImages {
			width: 73%;
			}



  /*/	/////////////////////////////// people pages
 / /
/*/

	#peopleNavs {
		display:block;
		float: left;
		clear: left;
		width: 37.45%;;
		}
	#mobNav {display:none;}
		#people.page #mobNav {
			display:block;
			margin: 9px 0 27px;
			}
			#people.page #mobNav li {
				width: 21%;
				}
	#peopleList {
		width: 62.55%;
		float: right;
		margin-top: -72px;
		}
		.AtoZ #peopleList,
		.board #peopleList { /* offices single */
			margin-top: -45px;
			}
		#people #peopleList li {
			width: 19.5%;
			margin: 0 .6% 9px 0;
			}
				
		/*cancel out the every 3rd*/#peopleList li#item3,#peopleList li#item6,#peopleList li#item9,#peopleList li#item12,#peopleList li#item15,#peopleList li#item18,#peopleList li#item21,#peopleList li#item24,#peopleList li#item27,#peopleList li#item30,#peopleList li#item33,#peopleList li#item36,#peopleList li#item39,#peopleList li#item42,#peopleList li#item45,#peopleList li#item48,#peopleList li#item51,#peopleList li#item54,#peopleList li#item57,#peopleList li#item60 { margin-right: .5%; }
		
		#peopleList li#item5,
		#peopleList li#item10,
		#peopleList li#item15,
		#peopleList li#item20,
		#peopleList li#item25,
		#peopleList li#item30,
		#peopleList li#item35,
		#peopleList li#item40,
		#peopleList li#item45,
		#peopleList li#item50,
		#peopleList li#item55,
		#peopleList li#item60,
		#peopleList li#item65,
		#peopleList li#item70,
		#peopleList li#item75,
		#peopleList li#item80,
		#peopleList li#item85,
		#peopleList li#item90,
		#peopleList li#item95,
		#peopleList li#item100 { margin-right: 0; }
			#offices.page #peopleList li#item5,
			#offices.page #peopleList li#item10,
			#offices.page #peopleList li#item15,
			#offices.page #peopleList li#item20,
			#offices.page #peopleList li#item25,
			#offices.page #peopleList li#item30,
			#offices.page #peopleList li#item35,
			#offices.page #peopleList li#item40,
			#offices.page #peopleList li#item45,
			#offices.page #peopleList li#item50,
			#offices.page #peopleList li#item55,
			#offices.page #peopleList li#item60,
			#offices.page #peopleList li#item65,
			#offices.page #peopleList li#item70,
			#offices.page #peopleList li#item75,
			#offices.page #peopleList li#item80,
			#offices.page #peopleList li#item85,
			#offices.page #peopleList li#item90,
			#offices.page #peopleList li#item95,
			#offices.page #peopleList li#item100 { margin-right: .5%; }
			#offices.page #peopleList li#item3,
			#offices.page #peopleList li#item6,
			#offices.page #peopleList li#item9,
			#offices.page #peopleList li#item12,
			#offices.page #peopleList li#item15,
			#offices.page #peopleList li#item18,
			#offices.page #peopleList li#item21,
			#offices.page #peopleList li#item24,
			#offices.page #peopleList li#item27,
			#offices.page #peopleList li#item30,
			#offices.page #peopleList li#item33,
			#offices.page #peopleList li#item36,
			#offices.page #peopleList li#item39,
			#offices.page #peopleList li#item42,
			#offices.page #peopleList li#item45,
			#offices.page #peopleList li#item48,
			#offices.page #peopleList li#item51,
			#offices.page #peopleList li#item54,
			#offices.page #peopleList li#item57,
			#offices.page #peopleList li#item60 { margin-right: 0; }
		
		#peopleList ul li a {
			line-height: 0;
			}
		#peopleList #peopleFilter ul li a {
			line-height: 1.3846em;
			}
		
		

/*people single*/
#people.page article img {
	width: 23.6166%;
	margin-left: 10px;
	}
#people article section {
	width: 33.3333%;
	}
#people article section.firstchild {
	width: 30.3333%;
	margin-right: 3%;
	}
	
	


	#offices.page .langNav {
		margin-right: 10%;
		width: 90%;
		}
		
		
	#officesList li {
		float: left;
		width: 32.3333%;
		margin: 0 1% 3.6em 0;
		}
	.ie7 #officesList li,
	.ie8 #officesList li {
		margin: 0 1% 1.8em 0;/* because ie7/8 add padding here, as they are only pretend browsers */
		}
		#officesList li#item2 { /* bloody london *//* because, quite frankly, it's pretty bloody, though i <3 it anyway */
								/* as an example of how bloody, it's made me adjust the wrapping call for all subsequent items. grr. */
			clear:left;
			}
		#officesList li#item4,
		#officesList li#item7,
		#officesList li#item10,
		#officesList li#item13,
		#officesList li#item16,
		#officesList li#item19 {
			width: 33.3333%;
			margin-right: 0;
			}
		#officesList li#item5,
		#officesList li#item8,
		#officesList li#item11,
		#officesList li#item14,
		#officesList li#item17,
		#officesList li#item20 {clear: left;}


#officeProfile {
	width: 23%;
	margin-right: 2%;
	}
	#officeProfile p {
		width: 90%;
		}

#officeLocation { /* this is the office box on the office single page */
	width: 35.5%;
	margin-right: 2%;
	float: left;
	padding: 0;
	}

#offices.page #peopleList { /* offices single */
	margin-top: 0;
	width: 37%;
	}
	#offices.page #peopleList li {
		width: 32.8%;
		margin: 0 .5% 9px 0;
		}
		#offices.page #peopleList .viewall1 { /* on offices single */
			width: 58%;
			}


	hgroup { /*the headers on pages where h1 + h2 are together, beside the fillwithSubNav*/
		width: 50%;
		margin-bottom: 36px;
		}
		#careers hgroup,
		#about hgroup {
			width: 40%;
			}
		.ie7 hgroup { width: 48%;}
		#projects.single hgroup {width: 100%;}
		#news.listing hgroup {margin-bottom: 12px;}


	.listing .langNav {
		float: right;
		}
			.langNav a {
				margin: 0 0 0 10px;
				padding: 6px 0 6px 6px;
				}

		
	#subNav {
		float: right;
		width: 50%;
		}
		#careers #subNav,
		#about #subNav {
			border-bottom: 0;
			margin-bottom: 0;
			width: 60%;
			float: right;
			position: static;
			}
	#careers hgroup, /* this is the h1 + h2 next to the subnav, reset from the mob version */
	#about hgroup {margin-top: 0;}
	
			.ie7 #careers #subNav,
			.ie7 #about #subNav {
				margin-bottom: 45px;
				}
		#projects.listing #subNav {
			margin-bottom: 0;
			float: right;/* reset don' touch */
			}
	.ie7 #subNav, 
	.ie7 #subNav * {z-index: 800000;}
	.ie7 #mainContent article {z-index: 8;}
		
		#subNav ul {
			float: left;
			margin: 0;/* reset */
			width: 100%;
			}			
			#subNav li {margin-right: 0;
				}
			#subNav ul a {
				font-size: 1.4em; /* 14px */
				line-height: 1.2857em; /* 18px */
				padding-left: 18px;
				}
			#news #subNav ul a  {
				line-height: 2.5714em;
				}
				#news #subNav ul ul a  {
					line-height: 1.2857em;
					}
				#subNav ul a.cur {background: transparent url(../graphics/arrow_cur_subNav.png) no-repeat left center;
					}
				#subNav ul li a:hover {color: #4c4c4c;
					}
				
				#about #subNav li#who-we-are {width: 25%;}
				#about #subNav li#what-we-do {width: 27%;}
				#about #subNav li#sustainability {width: 28%;}
				#about #subNav li#awards {width: 20%;}
					
				#news #subNav li {width: 33.3333%;
					}
					#news #subNav li li  {width: 100%;}
				#careers #subNav li {width: 50%;
					}
					.ie7 #careers #subNav li {width: 49%;}
				#subNav ul li a {
					float: right;
					}
					#subNav ul li li {float: none;
						}
					#subNav ul li li a {
						float: none;
						padding: 3px 14px;
						margin: 0 4px;
						color: #FFF;
						}
						#subNav ul li li.sfHover a,
						#subNav ul li li a:hover {
							color: #00264D;
							}
				
		#subNav div#searchbox {
			float: right;
			width: 37%;
			margin-left: 3%;
			}
			.ie7 #subNav div#searchbox {
				margin-left: 0;
				}
			#searchbox p {
				float: right;
				}
			
		
		
	#projects.listing #viewNav,
	#projects.listing #filtersNav {
		margin-bottom: 0;
		}
		
		#subNav ul#viewNav {
			width: 30%;
			}
			#subNav ul#viewNav a {
				padding-left: 0;
				margin-right: 36px;
				}
			#subNav ul#viewNav a.cur {
				padding-left: 18px;
				}
		#subNav ul#viewNav li a {
			float: left;
			}
		#subNav ul#filtersNav {
			clear: none;
			width: 30%;
			}
			#subNav ul#filtersNav li {
				width: 33.3333%;
				text-align: right;
				}
				.ie7 #subNav ul#filtersNav li {
					width: 33	%;
					text-align: right;
					}
				#subNav ul#filtersNav li div {
					width: 300%;
					position: relative;
					}
					#subNav ul#filtersNav li div ul.listCol1,
					#subNav ul#filtersNav li div ul.listCol2 {width: 100%;float: left;}
					
					#subNav ul#filtersNav li li {
						text-align: left;
						width: 100%;
						float:left;
						}
						.ie7 #subNav ul#filtersNav li li,
						.ie8 #subNav ul#filtersNav li li {
							text-align: left;
							width: 99%;
							float:left;
							}



  /*/	//////////////////////////////////// homepage
 / /
/*/
	
#supersized-loader {
	position:absolute;
	top:50%;
	left:50%;
	z-index:0;
	width:60px;
	height:60px;
	margin:-30px 0 0 -30px;
	text-indent:-999em;
	background: url(/graphics/supersized/progress.gif) no-repeat center center;
	}

#supersized {
	display:block;
	position:fixed;
	left:0;
	top:0;
	overflow:hidden;
	z-index:-999;
	height:100%;
	width:100%;
	}
	#supersized img {
		width:auto;
		height:auto;
		position:relative;
		display:none;
		outline:none;
		border:none;
		}
			#supersized.speed img {
				-ms-interpolation-mode:nearest-neighbor;
				image-rendering: -moz-crisp-edges;
				}	/*Speed*/
			#supersized.quality img {
				-ms-interpolation-mode:bicubic;
				image-rendering: optimizeQuality;
				}			/*Quality*/
		
		#supersized li {
			display:block;
			list-style:none;
			z-index:-30;
			position:fixed;
			overflow:hidden;
			top:0;
			left:0;
			width:100%;
			height:100%;
			background:#111;
			}
		#supersized a {
			width:100%;
			height:100%;
			display:block;
			}
			#supersized li.prevslide { z-index:-20;}
			#supersized li.activeslide { z-index:-10;}
			#supersized li.image-loading {
				background:#111 url(/graphics/supersized/progress.gif) no-repeat center center;
				width:100%;
				height:100%;
				}
			#supersized li.image-loading img{ visibility:hidden;}
			#supersized li.prevslide img, 
			#supersized li.activeslide img{ display:inline;}




	#controls-wrapper {
		width: 100%;
		z-index:4;
		background: rgba(255,255,255,.5);
		position: absolute;
		right: 0;
		bottom: 45px;
		}
		.ie7 #controls-wrapper,
		.ie8 #controls-wrapper {
			background: transparent url(/graphics/white_60.png) repeat 0 0;
			}
		#controls {
			position:relative;
			text-align:left;
			z-index:5;
			width: 100%;
			left: 0;
			}
			#slidecounter {
				display: none;
				}
			h2#slidecaption {
				font-size: 2.1em; /* 21px */
				line-height: 1.7143em; /* 36px */
				padding-bottom: 0;
				}
				h2#slidecaption a {
					color:#00264D;
					padding-right: 18px;
					background: transparent url(/graphics/arrow_home_readmore.png) no-repeat right -34px;
					}
					h2#slidecaption a:hover {
						color: #FFF;
						background: transparent url(/graphics/arrow_home_readmore.png) no-repeat right 6px;
						}
			
			#controls nav {
				float: right;
				margin-top: 9px;
				}
				#prevslide, 
				#nextslide{
					float: left;
					display: block;
					height: 18px;
					width: 28px;
					opacity: 1 !important;
					}
					#prevslide{ 
						background: #00264D url('/graphics/arrows_home_nav.png') no-repeat -5px 0;
						margin-right: 2px;
						}
					#nextslide{
						background: #00264D url('/graphics/arrows_home_nav.png') no-repeat -41px 0;
						}
						#prevslide:hover,
						#nextslide:hover { cursor:pointer;}
						#prevslide:hover { background-position: -5px -18px; background-color: #FFF;}
						#nextslide:hover { background-position: -41px -18px; background-color: #FFF;}
				
				ul#slide-list {
					margin: 0 !important;
					float: left;
					}
					ul#slide-list li {
						float:left;
						margin:0 2px 0 0;
						}
						
							


#home #latestNewsList {
	position: absolute;
	bottom: 126px;
	width: 33%;
	margin-top: 0;
	}
	#home #latestNewsList h2 {
		color: #FFF;
		padding: .5em;
		background: transparent url(/graphics/blue_70.png) repeat 0 0;
		width: auto;
		}




 /*/  --------------------- about ----------------------
/*/

aside figure {
	float: right;
	width: 85%;
	}
.who-we-are aside figure {
	width: 100%;
	}



 /*/  --------------------- news ----------------------
/*/		

	#newsList li {
		width: 30.3333%;
		margin: 0 4.5% 0 0;
		}
		.ie7 #newsList li {
			width: 30%;
			}
	#newsList li#item3,
	#newsList li#item6,
	#newsList li#item9,
	#newsList li#item12,
	#newsList li#item15,
	#newsList li#item18 {margin: 0;}
	#newsList li#item4,
	#newsList li#item7,
	#newsList li#item10,
	#newsList li#item13,
	#newsList li#item16,
	#newsList li#item19 {clear: left;}
			
	#news.single article {
		width: 37.45%;
		}
	#news.single aside {
		float: right;
		}
		#news.single aside img {
			width: 55%;
			float: left;
			}
		#news.single aside #relatedProjects {
			margin-left: 5%;
			float: right;
			margin-right: 0; /* reset */
			width: 40%;
			}


  /*/	///////////////////////////// footer 
 / /
/*/

	footer {
		height: 45px;
		margin-top: -45px;
		}
		.ie7 footer {
			margin-top: 0;
			}
	footer img { /* strap */
		width: auto;
		}
		.ie7 footer img { /* strap */
			width: 386px !important;
			max-width: 386px;
			
			}
	footer p#smallprint {
		float: right;
		clear: none;
		}
	#socialicons {
		margin: 6px 0 0 36px;
		}

	}/*/mediaquery*/
	
	
	

		
@media screen and (min-width: 900px) {
	#navForResearchers ul {
		float: right;
		width: 45%;
		}
	}/*/mediaquery*/

		
@media screen and (max-width: 500px) {

	#filtersNav li div ul,
	#mainContent #filtersNav.sf-menu ul {
		padding: 0;
		}
	#news #subNav ul.sf-menu ul,
	#filtersNav li div {
		display: none;
		float: left;
		padding: .9em 0;
		border-top: 1px solid #c4c4c4;
		border-bottom: 1px solid #c4c4c4;
		}
		#news.listing #mainContent .sf-menu ul li {float: left;}
		#news #subNav ul.sf-menu li li {float: left;}
	#filtersNav li:hover div {
		display: block;
		}
	#peopleList ul li a p {
		top: 75%;
		}
	}/*/mediaquery*/
	

.ui-autocomplete {
		cursor: default;
	    position: absolute;
		max-height: 200px;
		overflow-y: auto;
		/* prevent horizontal scrollbar */
		overflow-x: hidden;
		/* add padding to account for vertical scrollbar */
		padding-right: 20px;
		}
		/* IE 6 doesn't support max-height
		 * we use height instead, but this forces the menu to always be this tall
		 */
		* html .ui-autocomplete {
			height: 200px;
			width: 1px;
			}
		.ui-menu {
		    display: block;
		    float: left;
		    list-style: none outside none;
		    margin: 0;
		    padding: 2px;
			}
		.ui-menu .ui-menu {
		    margin-top: -3px;
			}
		.ui-menu .ui-menu-item {
		    clear: left;
		    float: left;
		    margin: 0;
		    padding: 0;
		    width: 100%;
			}
		.ui-menu .ui-menu-item a {
		    display: block;
		    line-height: 1.5;
		    padding: 0.2em 0.4em;
		    text-decoration: none;  
			background-color: #fff;
			}
		.ui-menu .ui-menu-item a.ui-state-hover, 
		.ui-menu .ui-menu-item a.ui-state-active {
		    font-weight: bold;
			}