@charset "utf-8";
/* CSS Document */


/* Global reset */

*, html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h5, h5, h6, pre, form, label, fieldset, input, p, blockquote, th, td { margin:0; padding:0 }
table { border-collapse:collapse; border-spacing:0 }
fieldset, img { border:0 }
address, caption, cite, code, dfn, em, strong, th, var { font-style:normal; font-weight:normal }
ol, ul, li { list-style:none }
caption, th { text-align:left }
h1, h2, h3, h5, h5, h6 { font-size:100% }
q:before, q:after { content:''}


/* Global reset-RESET */
/* The below restores some sensible defaults */

strong { font-weight: bold }
em { font-style: italic }
ol, ul, li { list-style:none }
/* * a { position:relative } Gets links displaying over a PNG background */
a { outline:none } /* Gets rid of Firefox's dashed borders */
a img { border:none } /* Gets rid of IE's blue borders */
br { height:1px; margin:-1px 0 0 0 }


blockquote { font: 2.5em Georgia,   serif; font-weight: normal;   margin-bottom: 15px; }
 

li { font: 1em Arial, Helvetica, sans-serif; margin:0; }
a { text-decoration:none; color:#62BB46; }

/* Default */

html,body  {font: 12px/1.4em Georgia,   serif; color: #231F20;  line-height: normal; }

	/* hide from ie on mac \
	html {
		height: 100%;
		overflow: hidden;
	}*/
	
	#flashcontent {
		height: 600px;
	}
	/* end hide */

	body {
		height: 100%;
		margin: 0px 0 0 0;
		padding: 0;
		 background: #fff url(../interface/background.gif)  50% 294px no-repeat  ;
	}
body.theteam { background-image: none;}
body.whatwedo { background-image: none;}
body.whatwedo2 { background-image: none;}
body.caseStudy  { background-image: none;}
body#news  { background-image: none;}
/* ------------------------------------ */

/* Global Layout Styles */

/* ------------------------------------ */
/* ------------------------------------ */

/* Hidden elements */

/* ------------------------------------ */
	.hidden, .screen_reader, hr { display: none; }

/* ------------------------------------ */
	
/* ---- Typography ---- */	

/* ------------------------------------ */

/* Paragraph default styling */
p { margin: 10px 0 15px 0; font-size: 1.2em; line-height: 1.3em; }
.spacer { margin: 0 0 25px 0; }
.imageleft { float: left; }
.white { color:#FFF;}

/* Default link styling */
a {color:#62BB46; text-decoration: none; }
a:hover { color: #62BB46; text-decoration: underline; }

h1 {  font-size: 2.3em; color:#ACA196; margin-bottom: 10px; font-family: Georgia,   serif;  }

#leftcolumn h1 { font-size: 1.3em;  margin-bottom: 10px;}
#leftcolumn h4 { font-size: 1.3em; color:#ACA196; margin-bottom: 10px; margin-top:7px; font-family: Georgia,   serif; font-weight: bold;}
#leftcolumn p { font-size: .9em;}

#leftcolumn li { line-height: 1.6em; padding:  0px 0px 10px 0px; font-family: Georgia,   serif; font-weight: normal; }
#leftcolumn li a { padding:  0px 0px 5px 0px;  display: block; color: #6D6E71;  background: url(../images/left-menu.jpg) bottom left no-repeat;}


#rightSubColumn li { line-height: 1.6em; padding:  0px 0px 10px 10px; font-family: Georgia,   serif; font-weight: normal; background: url(../interface/list-menu-bullet.png) top left no-repeat; }
#rightSubColumn li a { padding:  0px 10px 5px 15px;  display: block; color: #6D6E71;}
#rightSubColumn h4 { font-size: 1.3em; color:#ACA196; margin-bottom: 10px; margin-top:7px; font-family: Georgia,   serif; font-weight: bold;}

/* Float element left with a margin */
.floatLeft { float: left; margin: 0 20px 20px 0; }
	
/* Float element right with a margin */
.floatRight { float: right; margin: 0 0 20px 20px; }


.clear {
	clear:both;
	}
	.clearSpacer { margin-top: 14px; height: 15px;
	clear:both;
	}
		.clearSpacer2 { margin-top: 10px; height: 5px;
	clear:both;
	}
	
/* ------------------------------------ */

/* TEMPLATE LAYOUT  */   

/* ------------------------------------ */
#headerwrap { height: 176px; width: 974px;}
.ourclients #headerwrap { height: 410px;}
.theteam #headerwrap { height: 319px;}
.caseStudy #headerwrap { height: 319px;}
.whatwedo #headerwrap { height: 449px;}
.whatwedo2 #headerwrap { height: 410px;}
.theteam #headerwrap { height: 410px;}
 


#wrapperinner { width: 974px; margin: 0 auto; /* centers content */ position: relative;  }
#wrapperheader { width: 974px; margin: 0 10px; float: left; height: 163px; position: relative; z-index: 100; background: #000; border-bottom: 1px solid #000; 	}
 

#contentwraper { width: 790px;	float: right; position: relative; z-index: 50; text-align: left;	background: transparent; }

#contentwraperLeft { width: 600px; float: left; border-right: 1px dotted grey;  border-left: 1px dotted grey; }
#contentwraperLeft .gutter { margin: 0 15px;}
#contentinerback {width: 974px; float: left; background: url(../interface/background-black-glow.jpg) no-repeat top center; }
#paddingwraper {width: 974px; float: left; margin: 0 0 0 10px; padding: 25px 0; }
#paddingwraper .gutter2 { margin: 0 0 0 20px;}



#leftcolumn { float: left;	width: 165px; clear: both; padding-bottom: 10px;  margin: 0 0 0 0;  	 }
	/* IE6 alternative not so good looking but works! */
	* html #leftcolumn {   }
		

#rightcolumn { float: right; width: 650px;	margin: 0 0 0 0; padding: 0 0 0 0; position: relative; top: 0; 	}



.contentimage { margin: 10px 0; border: 1px solid #999; }
	#footerwrap { border-top: 1px solid #080808;
		 
		width: 974px;
		margin: 10px 0 30px 0   ;
		padding: 10px 0 20px 0;
		float: left;
		position: relative;
		text-align: center;
		color: #666;
	}
	* html #footerwrap { margin:10px 0 30px 0    ; }
	
	#footerwrap a {
	color: #666;
}
	
	/* ----------------------------------- */

/* layouts used on individual pages */
#Maincolumn { float: left; width: 685px;	margin: 0 0 0 0; padding: 0 0 0 0; position: relative; top: 0; background:#fff;  	}
/* IE6 alternative not so good looking but works! */
	* html #Maincolumn { background: #CCC; }
	

#sidepanel { float: right;	width: 260px; padding-bottom: 10px;  margin: 0 0 0 0; background: url(../interface/diag-black-background-subtle.jpg) right bottom repeat-y; 	 }
#sidepanel .gutter { margin: 15px;}

#sidepanel .containerBlock {  margin-top: 15px;  border-top: 10px solid #080808;  padding: 10px 0; }
#sidepanel .containerBlock p { margin: 0; color: #BDBDBD; font-size: .9em;}
#sidepanel h3 { color:#FFF; font-size: 1em; font-weight: normal; margin-bottom: 5px;}

/* ----------------------------------- */

/* TEMPLATE LAYOUT END  *?

/* ------------------------------------ */
/* ------------------------------------ */

/* TOP NAV AND HEADER SECTION STYLES  */

/* ------------------------------------ */
#logo { position: absolute; top: 0; right: 0;	margin:  0;	height: 162px; width: 400px;	overflow: hidden;}

	#topnavbar { position: absolute; top: 0;	left: 0;	margin: 10px 0 0 0;	height: 150px; width: 500px;	overflow: hidden;}
	#topnavbar li { float: left; height: 50px;	overflow: hidden; 	}
	#topnavbar li span { visibility: hidden;}
	#topnavbar li a {	text-indent: 0;	font-size: 1.2em; padding-top: 6px;	height: 50px; display: block;	}
	#topnavbar li a:hover { text-decoration: none; color: #EAE6AC; }
		/* individual button link styles */
	#topnavbar li.who { width: 500px;  }
	#topnavbar li.who a { background: url(../interface/TopMenuAnimationWHO_OFF.gif) no-repeat top left; width: 500px; }
	#topnavbar li.who a:hover, #topnavbar li.who a.selected { background: url(../interface/TopMenuAnimationWHO_ON.gif) no-repeat top  left; }
		#topnavbar li.what { width: 500px;  }
	#topnavbar li.what a { background: url(../interface/TopMenuAnimationWHAT_OFF.gif) no-repeat top left; width: 500px; }
	#topnavbar li.what a:hover, #topnavbar li.what a.selected { background: url(../interface/TopMenuAnimationWHAT_ON2.gif)  no-repeat top  left; }
		#topnavbar li.how { width: 500px;  }
	#topnavbar li.how a { background: url(../interface/TopMenuAnimationHOW_OFF.gif) no-repeat top left; width: 500px; }
	#topnavbar li.how a:hover, #topnavbar li.how a.selected { background: url(../interface/TopMenuAnimationHOW.gif) no-repeat top  left; }
	


	h1#logo {margin: 0; padding: 0;}
	#logo {
	position: absolute;
	top: 1px;
	right: 0px;
	height: 167px;
	width: 376px;
	overflow: hidden;
}
 
	
	
/* ------------------------------------ */

/* TOP NAV AND HEADER SECTION STYLES END  */

/* ------------------------------------ */
/* ------------------------------------ */

/* LEFT NAV SECTION STYLES  */

/* ------------------------------------ */

#sideMenuMain { 
		float: left;
		clear: both;
		margin: 0 0 0 0;
		padding: 0px 0 20px 0px;
		overflow: hidden;
		list-style: none;
		width: 290px;
		font-size: 1.1em; 
		
	}
#sideMenuMain ul {
		float: left;
		margin: 0 ;
		padding: 0;
		list-style: none;
		width: 290px;
	}
#sideMenuMain li {
		float: left;
		width: 260px;
		padding: 10px 10px 10px 12px;
		margin: 0 10px 0 0;
		overflow: hidden;
		border-top: 1px solid #363636;
		border-bottom: 1px solid #121212;
		background: transparent;
	}
#sideMenuMain li a img  { float:left; padding-right: 8px;}
#sideMenuMain li a {
		float: left;
		color: #999;
		
	}
#sideMenuMain li a:hover {
		color: #fff; text-decoration:none;
	}
#sideMenuMain li.canon5d { background:url(../interface/EOS-5D-icon.gif) 10px 10px no-repeat; }

li.canon5d a {padding: 5px 10px 5px 55px;}


/* ------------------------------------ */

/* LEFT NAV SECTION STYLES END  */

/* ------------------------------------ */
/* ------------------------------------ */

/* CONTENT SECTION STYLES */

/* ------------------------------------ */



#flashmain { background:url(../interface/flash-promo-large-box-background.png) right bottom no-repeat; margin-right: -10px; padding-right: 10px; padding-bottom: 10px;}

.dvdlisting { float: left;	width: 300px; height: 780px; overflow: hidden;  padding-bottom: 10px;  margin: 0 10px 0 0; background: url(../interface/Dvd-list-page-background-panel.png) bottom left no-repeat; border-top: #222222 1px solid; 	 }
.dvdlisting img{ float: left; margin-right: 10px; margin-bottom: 15px; }
.dvdlisting h2 { color:#BAD531; font-size: 1.5em; text-transform:uppercase; margin-bottom: 10px; font-weight: normal;}
.dvdlisting h2 strong { font-weight: bold;}
.dvdlisting h2 em { font-size: .7em; font-style:normal; text-transform:none; }
.dvdlisting  .gutter { margin: 10px 10px 15px 10px ;  }
	/* IE6 alternative not so good looking but works! */
	* html .dvdlisting  { background: #000  url(../interface/Dvd-list-page-background-panel.gif) top left no-repeat ; }
	
	.dvdlistingtxt { float: left; width: 280px;}
	.dvdlistingtxt p { color:#FFF; }
	
/* ------------------ 172 wide dvd listing version ---------*/

.dvdlisting2 { float: left;	width: 172px; height: 500px; overflow: hidden;  padding-bottom: 10px;  margin: 0 10px 0 0; background: #000; border-left: #222222 1px solid; border-top: #222222 1px solid; border-right: #161616 1px solid;  border-bottom: #161616 1px solid;  	 }
.dvdlisting2 img{ float: left; margin-right: 0; margin-bottom: 10px; }
.dvdlisting2 h2 { color:#BAD531; font-size: 1.5em; text-transform:uppercase; margin-bottom: 10px; font-weight: normal;}
.dvdlisting2 h2 strong { font-weight: bold;}
.dvdlisting2 h2 em { font-size: .7em; font-style:normal; text-transform:none; }
.dvdlisting2  .gutter { margin: 10px 10px 15px 10px ;  }
	/* IE6 alternative not so good looking but works! */
	* html .dvdlisting2  { background: #000  url(../interface/Dvd-list-page-background-panel.gif) top left no-repeat ; }
	
	.dvdlistingtxt2 { float: left; width: 280px;  }
	.dvdlistingtxt2 p { color:#FFF; }

.dvd-box-text { padding: 10px; color: #fff; font-weight: normal; font-size: 1em;}
.dvd-box-text a {  color:#000;   padding: 2px; font-weight: bold; }
.dvd-box-text a:hover {  color:#fff;  }
 
.dvd-box-text h2 a {  color:#BAD531; font-weight: bold; font-size: .7em; background: none; padding: 0; }
.dvd-box-text h2 a:hover { background: none; color: #BAD531; text-decoration:underline;}
.dvd-box-text h3  {  color:#fff; font-weight: bold; font-size: 1em; line-height: 1.1em; font-weight: normal;  }


 
/* ------------------------------------ */

/* CONTENT SECTION STYLES END */

/* ------------------------------------ */


#outerwrap {}
#innerwrap {}
 
#headerlinks {}

.fullwidthboxwrap {
		float: left;	margin: 0  0 10px 0;	padding: 0 0 0 0;	overflow: hidden;	list-style: none;	width: 643px; font-size: .9em; background: #fff;		}
		.fullwidthboxwrap .gutter { margin: 10px;}

/*****************/
/* half width boxes */
.halfwidthboxwrap {
		float: left;	margin: 0 0px 0 0;	padding: 0 0 30px 0;	overflow: hidden;	list-style: none;	width: 650px; font-size: .9em;	}
	.halfwidthbox  { float: left;	width: 317px;	padding: 0;	height: 245px;	margin: 0 7px 0 0;	overflow: hidden; background: #CCC;	}
	.halfwidthbox .gutter { margin: 10px;}
	.halfwidthbox h2 { color:#FFF; font-size: 1.3em; margin-bottom: 8px;}

/***********************/	
/* Quarter width boxes */

	.quarterwidthbox {
		float: left;	margin: 0 0px 0 0;	padding: 0 0 30px 0;	overflow: hidden;	list-style: none;	width: 650px; font-size: .9em;	}
	.quarterwidthbox li { float: left;	width: 155px;	padding: 0;	height: 225px;	margin: 0 7px 10px 0;	overflow: hidden; background: #CCC;}
	.quarterwidthbox li img { float: left; margin-bottom: 0px; }
	.quarterwidthbox li a {
		float: left;
		width: 148px;
		height: 275px;
		display: block;
		padding: 10px;
		color: #C3CA98;}
	.quarterwidthbox li a strong { float: left; color:#FFFFFF; font-size: 1em; line-height: .5em; font-weight: normal; width: 150px; }
	.quarterwidthbox li a em { float: left; color: #607B78; font-style:normal;  padding-right: 10px;}
	.quarterwidthbox li a:hover { text-decoration: none ; color: #C3CA98; 	}
.quarterwidthbox li a:hover em { text-decoration: underline ; color: #fff; 	}

/***********************/	
/* Quarter width boxes end */

h1.H1Title { color:#FFFFFF; font-size: 23px; font-weight:normal; margin: 15px 0 15px 0;}
h2.H2Title { color:#FFFFFF; font-size: 20px; font-weight:normal; margin: 15px 0 15px 0;}
h3.H3Title { color:#FFFFFF; font-size: 16px; font-weight:normal; margin: 15px 0 15px 0;}
img.Floatleft { float:left; padding:0; border:none; margin: 0 20px 15px 0px;}
a img.Floatleft { float:left; }



.borderimageright { float: right; border: 1px solid #6A6A6A; margin: 10px 0 20px 20px;}
.borderimageleft { float: left; border: 1px solid #6A6A6A; margin: 10px 20px 20px 0px;}


#casestudys {  width: 975px;}
#headings {  width: 975px; height: 60px; margin-top: 15px;}
#headings img { margin: 20px 0 0 0;}
#LowerWrap { margin: 20px 0 0 0; float: left;}

/* work - blog styling -*/
#work h1 { color: #62BB46;  font-size: 34px; font-weight: bold; padding: 0 0 5px 0; margin: 0; }
#work  h2 { color: #62BB46; text-transform:uppercase; font-size: 22px; font-weight: normal;   padding: 0 ; margin:  0px 0 0 0; }
#work p { color: #231F20; font-size: 15px; padding: 10px 0  ; margin: 0;}

#work em { font-style:normal; color: #6D6E71;      }

#news h1 { color: #62BB46;  font-size: 34px; font-weight: bold; padding: 0 0 5px 0; margin: 0; }
#news  h2 { color: #62BB46; text-transform:uppercase; font-size: 22px; font-weight: normal;   padding: 0 ; margin:  0px 0 0 0; }
#news p { color: #231F20; font-size: 15px; padding: 10px 0  ; margin: 0;}

#news em { font-style:normal; color: #6D6E71;      }


.spacer { margin: 20px 0 0 0; border-bottom: 1px solid grey;}
/* the team page */
.teammember {float: left; width: 975px; border-top: 10px solid #ACA095; padding-top: 15px; padding-bottom: 15px;}
.teammemberpic {float: left; width: 975px; padding-bottom: 15px;}
.teammember img { float: left;}
.teamdetails { width: 635px; float: right;}

.theteam h1 { color: #62BB46;  font-size: 34px; font-weight: bold; padding: 0 0 5px 0; margin: 0; }
.theteam h2 { color: #6D6E71; text-transform:uppercase; font-size: 22px; font-weight: normal; border-bottom: 1px solid #ACA095; padding: 0 0 10px 0; margin: 0; }
.theteam p { color: #231F20; font-size: 15px;}
/* what we do page */
#threeEQcolumn { width: 975px; float: left;}
.whatwedo h1 { color: #62BB46;  font-size: 34px; font-weight: bold; padding: 0 0 5px 0; margin: 0; }
.whatwedo h2 { color: #6D6E71; text-transform:uppercase; font-size: 22px; font-weight: normal; border-bottom: 1px solid #ACA095; padding: 0 0 10px 0; margin: 0; }
.whatwedo h3 { color: #6D6E71;   font-size: 22px; font-weight: normal;   padding: 0 15px 10px 0; margin: 0; height: 110px; }

.whatwedo p { color: #231F20; font-size: 15px;}


.whatwedo2 h1 { color: #62BB46;  font-size: 34px; font-weight: bold; padding: 0 0 5px 0; margin: 0; }
.whatwedo2 h2 { color: #6D6E71; text-transform:uppercase; font-size: 22px; font-weight: normal; border-bottom: 1px solid #ACA095; padding: 0 0 10px 0; margin: 0; }
.whatwedo2 h3 { color: #6D6E71;   font-size: 22px; font-weight: normal;   padding: 0 15px 10px 0; margin: 0; height: 110px; }

.whatwedo2 p { color: #231F20; font-size: 15px;}


.threeEQcol { width: 325px; float: left; }
.threeEQcol ul { margin-top: 15px;}
.threeEQcol li { background:url(../interface/Bulletedlist.png) 0 0 no-repeat; padding: 8px 20px 15px 35px; font-family: Georgia,   serif; font-size: 15px;}

/* how we do it */
.howwedoitCopy {float: left; width: 975px; border-top: 10px solid #ACA095; padding-top: 15px; padding-bottom: 15px;}
blockquote.darkgreen { color:#003411;}
blockquote.green { color:#62BB46; background: url(../interface/Keyline-green.png) 0 0 no-repeat; padding-top: 20px;}
blockquote.grey { color:#ACA095;  background: url(../interface/Keyline-grey.png) 0 0 no-repeat;  padding-top: 20px;}


/* case study */
.casestudywrap {float: left; width: 975px; border-top: 10px solid #ACA095; padding-top: 15px; padding-bottom: 15px;}

.casestudywrapLeft { float: left; width: 665px;}
.casestudywrapRight {  float: right; width: 300px;}

.detailsTitles p {  border-bottom: 1px solid #ACA095; width: 100%; margin: 0 0 5px 0; padding: 0 0 5px 0;}
.detailsTitles em { color:#62BB46;}

#rightSubColumn { float: right; width: 180px;}
#rightSubColumn img { padding: 43px 0 20px 0;}
#leftcolumn  img { padding: 43px 0 20px 0;}

#casestudybtn1 { position: absolute; width: 156px; height: 51px; top: 54px; right: 20px; z-index: 555555; display: block;    }
#casestudybtn2 { position: absolute; width: 156px; height: 51px; top: 130px; right: 20px; z-index: 555555; display: block;   }
#casestudybtn3 { position: absolute; width: 156px; height: 51px; top: 210px; right: 20px; z-index: 555555; display: block;   }
#casestudybtn4 { position: absolute; width: 156px; height: 51px; top: 290px; right: 20px; z-index: 555555; display: block;   }


#ourDisciplines { position:relative; width: 423px; float: left;   background:url(../interface/ourDisciplines/left-blank.gif) 0 0 no-repeat;}
#ourDisciplines h2 { border-bottom: 1px solid #fff; border-top: 1px solid #fff; background: #003411; font-family: Georgia,   serif; font-weight: bold; color:#FFF; text-transform:none; font-size: 27px; padding: 18px; margin-bottom:18px; }
#ourDisciplines p {font-family: Georgia,   serif; font-weight: normal; color:#FFF; text-transform:none; font-size: 21px; padding:  0px 18px 10px 18px;}



#textarea { width:100%; float: left;   }
#textarea p {font-size: 21px; color:#AC9F92;}
#textarea p strong span { color:#60B946;}


#ourClients { position:relative; width: 100%; float: left; border-left: 1px solid #ACA395; border-top: 1px solid #ACA395;  }

.invis { visibility: hidden;}
.thumbFloat { float: left; border-right: 1px solid #ACA395;  border-bottom: 1px solid #ACA395;  height: 195px; width: 194px;  }
.thumbFloat img{ width: 193px;}

/* ---------------------------------- */

 

#topnavbar2 { position: relative; top: 0; left: 0; width: 538px; z-index: 999;}

	.topmenu {
		margin-top: 0px;
	list-style-type:none;
	}
.topmenu li {
	margin-right:0px;
	width:588px;
	height:54px;
	float:left;
	position:relative;
	overflow:hidden;
	border: none;
	}
.topmenu img {
	position:absolute;
	}


/* ------- */
#FollowUs { background:url(../images/followus.jpg) top left no-repeat; clear: both; float: left;  margin: 20px 0 0 0; padding: 0;  padding-top: 25px; width: 169px;} 
#FollowUs li {  width: 56px; display:block; float:left;}
#FollowUs li a { margin: 0; padding:0;}
#FollowUs li a img{   margin: 0; padding: 0; border: none none;} 
#leftcolumn #FollowUs  img { float: left;   background: none; margin: 0; padding: 0;} 
#leftcolumn #awards  img { padding: 0; margin: 20px 0 0 0;}

/* ---------------- */

#Previous { float: left; width: 30%; height: 37px; background:url(../images/left-arrow.jpg) top left no-repeat; padding: 12px 20px; }
#Previous  a { color: #ACA095;}
#Next { float: right; width: 30%; text-align: right; height: 37px; background: url(../images/right-arrow.jpg) top right no-repeat; padding: 12px 20px;}
#Next  a { color: #ACA095;}