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

Media Type: screen

Description: Screen stylesheet.

Author:

Document Sections:
Imports
Global
Skip Links
Header & Footer
Page Structure
Hub page
List page
Home page
Our work
Contact page
Showreel
Case study
Clear Fixes

Notes: 

grey copy #211812

Change Log:

xx/xx/xx - Description - Name

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

/* Imports
----------------------------------------------- */
@import url("site/reset.css");
@import url("site/content.css");
@import url("site/forms.css");
/* modules */
@import url("modules/paging.css");
@import url("modules/navsignposts.css");
@import url("modules/relatedsignposts.css");
@import url("modules/multimediablock.css");

/* Global
----------------------------------------------- */
body 
{
  font-family:Arial, Helvetica;
	background:#f8e3c7;
	text-align:center; /* for IE */
	color:#211812;
}

img
{
	border:0;
}

.last
{
	margin-right:0 !important;
}
/* Skip Links
----------------------------------------------- */
.sl 
{
	left:-999em;
	position:absolute;
}

a.sl:active
,a.sl:focus 
{
	padding:0.2em;
	left:200;
	top:30;
	z-index:100;
	border:0.1em solid #fff;
	color:#ff6600;
	text-decoration:none;
}

a.sl:hover
{
	color:#fff;
	background:#ff6600;
}
/* Header & Footer
----------------------------------------------- */
#header
{
	background:#F8981D;
}

#header-wrapper
{
	padding-bottom:1em;
}

#header-wrapper
,.breadcrumb
{
	width:98em;
	text-align:left; /* for IE */
  margin:0 auto;
}

.logo
{
	float:left;
	margin:1em 0 0 .8em;
}

#nav
{
	float:right;
	margin:2.65em 1.6em 0 0;
	list-style-position: inside;
	font-size:1.4em;
	font-weight:bold;
	list-style-type:none;
}

	#nav a
	{
		color:#000;
		text-decoration:none;
	}
	
	#nav a:hover
	{
		color:#f8e3c7;
		/*background:#dd4526;*/
	}
	
	#nav li.selected a
	{
		/*color:#fff;
		background:#ff6600;*/
		color:#fff;
	}

	#nav li 
	{
		display:inline;
		margin-left:15px;
		text-transform:uppercase;
	}
	
	#breadcrumb-wrapper
	{
		border-top:solid 1px #f8e3c7;
		background:#423732;
		margin-top: 5px;
	}
	
	.breadcrumb
	{
		list-style-position: inside;
	}
	
	.breadcrumb a
	{
		color:#fff;
		text-decoration:none;
	}
	
	.breadcrumb a:hover
	{
		color:#fff;
	}

	.breadcrumb li
	{
		display:inline;
		color:#f8981d;
	}

	
	#header .breadcrumb
	{
		clear:both;
		padding:.9em 0 1em 1em;
		/*border-top:solid .1em #fff;*/
		width:97em;
	}
	
	#header .breadcrumb a:link
	,#header .breadcrumb a:visited
  ,#header .breadcrumb a:active
	{
		color:#fff;
	}
	
	#header .breadcrumb a:hover
	{
		color:#f8981d;
	}
	
	#header .breadcrumb li
	{
		margin:0 0 0 0;
		font-size:1.7em;
		text-transform:uppercase;
		font-weight:bold;
		color:#f8981d;
	}

		
#footer
{
	clear:both;

}

	#footer div /* psuedo element for footer to space itself off columns */
	{
		padding:2em 0 0 0;
	}
			
	#footer ul
	{
		display:block;
	}

	#footer .breadcrumb
	{
		width:auto;
		font-size:1.2em;
		font-weight:bold;
		border-bottom:solid 1px #fff;
	  background:#423732;
	  padding:.9em .9em;
	}



	#footer ul.permalinks
	{
		display:block;
		font-size:1.1em;
		text-align:right;
	  background:#635954;
	  padding:1em 1em;
	}

		#footer ul.permalinks li
		{
			display:inline;
			padding:0 0 0 1em;
		}
		
		#footer ul.permalinks a
		{
			color:#fff;
			text-decoration:none;
		}

		#footer ul.permalinks a:hover
		{
			color:#fff;
		}
  
		#footer p
		{
			float:left;
			padding-top:1em;
			margin-left:1em;
			display:inline;
			font-size:1.1em;
			color:#fff;
		}
		
/* Page Structure 
----------------------------------------------- */
#container-wrapper
{
  background:url(site/images/backgrounds/bg.jpg) repeat-x top left;
  padding-top:1em;
}

#container
{
    background:url(site/images/backgrounds/contentbg.gif) repeat-y top left;
    width:98em;
    text-align:left; /* for IE */
    margin:0 auto;
    display:block;
}

#content
{
	width:63em;
	float:left;
	margin:0 4em 0 4em;
	border-bottom:solid 5px #f8981d;
}

.leftcol
{
	width:26em;
	margin:0 1em 0 0;
	float:left;
	padding:1em 0 2em 2em;
}

.midcol
{
	width:63em;
	margin:0 0 0 0;
	float:left;
	padding:0 0 2em 0;
}


/* related signposts */
.rightcol
{
	/*width:23em;
	float:left;
	margin:.5em 0 0 2em;	*/
	width: 24em;
	float: left;
	margin: 0.5em 0 0 1.5em;
}


/* rows */

.main
,.mainnobg
{
	float:left;
	margin:10 0 0 10;
	padding:10;
	/*max-width:410;*/
	overflow:hidden;
}

/*
.main img
{
	display:block;
}
*/

.content .mainimg
,#content .mainimg
,.contentblock  .mainimg
{
	clear:both;
	margin:0 -10 0 -10;
	overflow:hidden;
	padding:0;
}

	.content .mainimg img
	,#content .mainimg img
	,.contentblock .mainimg img
	{
		float:none;
		margin:0 0 0 0;
	}
	
.row
{
	clear:both;
	padding-bottom:1em;
}

.automotive .row
{
    clear: both;
    margin-left: 20px;
    padding-bottom: 1em;
}


p.separator
{
	clear:both;
	margin-top:10;
	padding-top:10;
	border-top:dashed 1px #666;
}

/* Hub page
----------------------------------------------- */
.hubpage #content
{
  background:none;
}

.hubpage #content .midcol
{
  background:#fff;
  padding-right:2em;
  padding-left:2em;
  width:43em;
}

.hubpage #content .leftcol
{
  padding:0;
}

.hubpage #content .subnavitem
{
  margin:0 0 1em 0;
}

.hubpage #hub-multimedia
{
  margin-top:1em;
}

/* List page
----------------------------------------------- */
.listpage #container
{
  background:#fff;
}

.listpage #content
{
  width:90em;
}

.listpage .subnavitem
{
  float:left;
  width:21em;
  margin-right:2em;
}
/*
.secondary-list .subnavitem h2
,.secondary-list .subnavitem h3
{
	background:none;
	text-transform:none;
	line-height:1.2em;
	padding:.5em .9em .5em .9em;
}

.secondary-list .subnavitem a
{
	color:#dd4525;
	display:inline;
	padding:0;
}

.secondary-list .subnavitem a:hover
{
	background:#DD4526 none repeat scroll 0 0;
	color:#FFFFFF;
}
*/

/* Home page
----------------------------------------------- */

.home #content
{
  padding:1em 0 0 0;
  border:0;
  margin-left:0;
  margin-right:1em;
  width:70em;
}

.home .midcol
{
	width:70em;
	padding-bottom:0;
}

#home-promo
{
	width:69em;
	overflow:hidden;
	float:left;
	margin:0 0 1em 1em;
}

#home-promo object
{
	overflow:hidden;
	width:100%;	
	height:261px;
}

.home .row .subnavitem
{
  float:left;
  width: 210px;
  margin-left:20px;
}

.subnavitem
{
    width: 210px;
}


/* Automotive Home
----------------------------------------------- */
.automotive #container
{
  background:#fff;
  background-image: none;
}

.automotive #content
{
  width:97em;
  margin-right:0;
  padding:1em 0 0 0;
  border:0;
  margin-left:0;
}


#auto-multimedia
{
	width:96em;
	overflow:hidden;
	float:left;
	margin:0 0 1em 1em;
}

.automotive .row .subnavitem
{
  float:left;
  width: 210px;
  margin-left:20px;
}



/* Our work
----------------------------------------------- */
.our-work #content
{
  width:100%;
  background:none;
}

.our-work #content .column
{
  width:31.6em;
  float:left;
  margin-left:1em;
}

.our-work #content .column h2
{
  float:left;
  width:13em;
  margin:0 0 2em 0;
  padding:.5em 1.5em 1em 0;
  clear:both;
  border-right:solid 1px #87261d;
  font-size:1em;
}

.our-work #content .column ul
{
  float:left;
  border-left:solid 1px #87261d;
  margin:0 0 2em -.1em;
  min-height:6em;
  padding:1em 0 1em 1.5em;
	width:15em;
}

.our-work #content .column ul li
{
  font-size:1.3em;
  line-height:1.3em;
}

.our-work #content .column a
{
  color:#dd4525;
  font-weight:bold;
}

.our-work #content .column a:hover
{
  background:#DD4526 none repeat scroll 0 0;
	color:#FFFFFF;
}
/* Contact page
----------------------------------------------- */
#mm
{
	position:absolute;
	top:30;
	right:30;
}

#gm
{
	position:absolute;
	bottom:20;
	left:20;
}

#map
{
	width:100%;
	height:292px;
	margin:0 0 0 0;
	margin-bottom: 20px;
}

#map img
{
	float:none;
}

/* Showreel
----------------------------------------------- */

.showreel #content 
{
	margin:2em auto auto auto;
	padding:1em;
	width:64em;
	float:none;
}

.showreel #content p
{
  font-size:1.2em;
  line-height:1.2em;
}



/* Case study
----------------------------------------------- */
.midcol .column
{
  width:29.5em;
  float:left;
  margin-left:4em;
}

.midcol .firstcol
{
  margin-left:0em;
}




/* Site Map 
----------------------------------------------- */

ul.sitemap
{
	margin-left: 10px;
	font-size: 1.5em;
	
	list-style-type: none;
}

ul.sitemap li
{	
	list-style-type: circle;
	line-height: 1em;
}

ul.sitemap ul
{
	list-style-position: inside;
	margin-left: 10px;
	list-style-type: none;
}


li.sitemapitem
{	
	list-style-type: disc !important;
	margin-left: 30px !important;	
}

li.sitemapitem a
{
	font-size: .7em;	
}



/* Clear Fixes
----------------------------------------------- */
#header:after
,#header-wrapper:after
,#content:after
,#footer:after
,.leftcol:after
,.midcol:after
,.rightcol:after
,.our-work #content .column:after
,.our-work #content .column h2:after
,.our-work #content .column ul:after
,.listpage #content .row:after
,.row:after
{
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearer
{
	clear:both;
	height:1px;
	margin-top:-1px;
}