/*

I. Table Of Contents

	I. Table Of Contents
	II. CSS Variables (TBC)
	III. CSS Image Preload (TBC)
	1. Reset
	2. Headings
	3. Anchors
	4. Form Elements
	5. General Classes
	6. Template and Layout
	7. Print
	8. CSS Diagnostics
	9. Lightbox
	
*/

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

 II. CSS Variables - Spec: http://disruptive-innovations.com/zoo/cssvariables/

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

(TBC)

/*

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

 III. CSS Image Preload - http://www.divitodesign.com/2007/11/create-an-image-pre-loader-with-css-only/

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

/*

(TBC)

/*

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

 1. Reset  -  http://tantek.com/log/2004/undohtml.css  -  http://meyerweb.com/eric/tools/css/reset/

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

html, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, pre,
a, abbr, big, cite, code,
del, dfn, em, font, img, ins, kbd, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	}
	
acronym { 
	font-style:normal;
	cursor: help;
	}

address { 
	font-style:normal;
	padding: 15px 0px 5px 15px;
	}

a img, img {
	border: none;
	}

a {
	text-decoration: none;
	}

blockquote, q {
	quotes: none;
	}

blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
	}

img {
	display: block;
	} /* http://developer.mozilla.org/en/docs/Images,_Tables,_and_Mysterious_Gaps */


/* remember to define focus styles! */
:focus {
	outline: 0;
	}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
	}
del {
	text-decoration: line-through;
	}

ul, ol, p { 
	margin-top: 1em;
	margin-bottom: 1em;
	}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
	}

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

 2. Headings

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

h1 { 
	display: none;
	}
	
h2 { 
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.75em; /* 16x1.75=28 */
	font-weight: bold;
	line-height: 28px;
	color: #660033; /* IAM Corporate colour */
	}

h3 {
	font-size: 1.125em; /* 16x1.125=18 */
	padding: 0;
	}	

h4 {
	font-size: 1em;
	color: #666;
	padding: 10px 0 0 0;
	}
	
/****************************************************************

 3. Anchors - Link - Visited - Hover

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

#header a { padding-bottom: 1px; }

#header a:link { color: #7e935a; border-bottom: 1px solid #cccccc; }

#header a:visited { color: #999999; border-bottom: 1px solid #cccccc; }

#header a:hover { color: #7e935a; border-bottom: 1px solid #b79f87; }

#header a:focus { outline-width: 0px; }

#header a:active { color: #7e935a; border-bottom: 1px solid #555555; }


#navHome a, #navHome a:visited { font-weight: bold; display: block; color: #660033; padding-left: 52px; }

#navHome a:hover { font-weight: bold; color: #fafae4; background-image: url(../image/bullet2.gif); background-repeat: no-repeat; background-position: 0% 50%; text decoration: none; }

#navHome .uberlink { font-weight: bold; color: #fafae4 !important; background-image: url(../image/bullet2.gif) !important; background-repeat: no-repeat; background-position: 0% 50%; text decoration: none; cursor: defaut;}


#nav a, #nav a:visited { font-weight: bold; display: block; color: #999; padding-left: 52px; }

#nav a:hover { font-weight: bold; color: #660033; background-image: url(../image/bullet1.gif); background-repeat: no-repeat; background-position: 0% 50%; text decoration: none; }

#nav .uberlink { font-weight: bold; color: #660033 !important; background-image: url(../image/bullet1.gif); background-repeat: no-repeat; background-position: 0% 50%; text decoration: none; cursor: defaut;}


#contentHome a { padding-bottom: 1px; }

#contentHome a:link { color: #7e935a; border-bottom: 1px solid #cccccc; }

#contentHome a:visited { color: #999999; border-bottom: 1px solid #cccccc; }

#contentHome a:hover { color: #7e935a; border-bottom: 1px solid #b79f87; }


#content a { padding-bottom: 1px; }

#content a:link { color: #7e935a; border-bottom: 1px solid #cccccc; }

#content a:visited { color: #999999; border-bottom: 1px solid #cccccc; }

#content a:hover { color: #7e935a; border-bottom: 1px solid #b79f87; }

	
	#contentSM a { padding-bottom: 1px; }

	#contentSM a:link { color: #7e935a; border-bottom: 1px solid #cccccc; }

	#contentSM a:visited { color: #999999; border-bottom: 1px solid #cccccc; }

	#contentSM a:hover { color: #7e935a; border-bottom: 1px solid #b79f87; }


#footerHome a { padding-bottom: 1px; }

#footerHome a:link { color: #fff; border-bottom: 1px solid #cccccc; }

#footerHome a:visited { color: #999; border-bottom: 1px solid #cccccc; }

#footerHome a:hover { color: #fff; border-bottom: 1px solid #b79f87; }


#footer a { padding-bottom: 1px; }

#footer a:link { color: #7e935a; border-bottom: 1px solid #cccccc; }

#footer a:visited { color: #999; border-bottom: 1px solid #cccccc; }

#footer a:hover { color: #7e935a; border-bottom: 1px solid #b79f87; }


.unstyled { color: #555555; border-width: 0px !important; /* IE needs !important */ }

/* TOGGLE DIVs - LINK EFFECTS */

a.action-link, a.action-link:visited {
	font-weight:bold;
	text-decoration:none;
	padding-bottom: 1px;	
	color:#666
	}

a.action-link:hover {
	text-decoration:none;
	color:#333
	}

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

 4. Form Elements - http://www.456bereastreet.com/archive/200410/styling_even_more_form_controls/

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

/* Not required (TBC) */

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

 5. General Classes

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

.top { vertical-align: top; }

.bottom { vertical-align: bottom; }

.middle { vertical-align: middle; }

.sub { vertical-align: sub; }

.sup { vertical-align: super; }



.left { text-align: left; }

.right { text-align: right; }

.center { text-align: center; }

.justify { text-align: justify; }

.distribute { text-justify: distribute; }



.smallcaps { font-variant: small-caps; }

.b { font-weight: bold; }

.i { font-style: italic; }

.u { text-decoration: underline; }

.o { text-decoration: overline; }

.s { text-decoration: line-through; }

.su { text-decoration: line-through underline; }



.ucase { text-transform: capitalize; }

.lowercase { text-transform: lowercase; }

.uppercase { text-transform: uppercase; }



.slant { font-style: oblique; } /* http://usabletype.com/css/font/styles/ */

.indent { text-indent: 1em; }

.pre { white-space: pre; }

.clear { clear: both; }


.floatRight { float: right; margin-right: 15px; }

.imgfloatRight { float: right;	border: none;	padding: 0 !important;	margin: 15px 15px 15px 20px; }

img.corner {width: 15px; height: 15px; border: none; display: block !important;}


.block { display: block; }

.inline { display: inline; }

.none { display: none; }

.visible { visibility: visible; }

.hidden { visibility: hidden; }

.collapse { visibility: collapse; }



.nobullet { list-style-type: none; }

.circle { list-style-type: circle; }

.disc { list-style-type: disc;}


.dropcap:first-letter { font-size: 1.3em; font-weight: bold; }


.semitransparent { opacity: 0.75; }

.hideinformation { display: block; font-size: 0.75em; /*16x0.75=12 */ float: right !important; margin: 5px; }

.news { color: #660033; }

p.title { font-weight: bold; margin: 0 0 2px 0; }


/* PRESS PAGE - PDF DOWNLOAD CLASSES */	

a.pdf {
	background: url(../image/icon_download2.gif) no-repeat 0px;
	padding-left: 15px;
	padding-bottom: 2px;
	line-height: 2em;
	}
	

/* TOGGLE CLASSES */	

.toggle-link {
	margin:0 0 1px 0;
	padding: 0;
	}
	
.toggle-link a.action-link {
	color: #660033 !important; /* IAM Corporate colour */
	}
	
.toggle-block {
	width: 580px;
	background:#F5F5F5;
	border: 1px dotted #ccc;
	margin: 0px 0px 0px 15px;
	padding: 2px;
	}
	
.toggle-link .toggle-block h2 {
	margin-top:0.5em;
	color:#01474F
	}
	
.toggle-block table {
	background:#F5F5F5;
	border:0;
	font-size: 0.875em;
	border-collapse: collapse;
	width:550px;
	padding: 0;
	}
	
.toggle-block td {
	border-top:1px solid #fff;
	padding: 5px 0 5px 0;
	}
	
.toggle-block tr {
	border: none;
	}
	
.toggle-block td.col-1 {
	width:200px;
	font-weight:bold;
	padding-right: 15px;
	}
	
/* Enable following CLASS to centre all images in the toggle block div

.toggle-block img {
	margin-left: auto;
	margin-right: auto;
	} 

*/


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

 6. Template & Layout - http://www.tutorialtastic.co.uk/page/create_a_tableless_layout

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


html {
	font-size: 100%; /* http://www.alistapart.com/articles/howtosizetextincss */
	overflow-y: scroll; /* http://webdevel.blogspot.com/2007/05/controlling-browser-scrollbars.html */
	}

body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	color: #fff;
	line-height: 18px;
	background-color: #333;
	font-size: 0.75em; /* 16*0.75=12*/ 
	text-align: center; /* center things in <= IE6 */
	vertical-align: baseline;
	}

/* Content tables */

table {
	background:#F5F5F5;
	border:0;
	border-collapse: collapse;
	width:580px;
	padding: 0;
	margin: 0 0 0 15px;
	}
	
td {
	vertical-align: top;
	padding: 0 0 0 5px;
	}

tr {
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
	}	

td ul {
	margin: 0 0 0 20px;
	padding: 0 0 5px 10px;
	}
	
td li {
	list-style-type: square !important;
	}	
	
td.col-1 {
	width: 60px;
	font-weight: bold;
	background-color: #999999;
	border-top: 1px solid #fff;
	color: #fff;
	padding: 5px 10px;
	vertical-align: top;
	text-align: center;
	}
	
td.col-2 {
	background-color: #fafae4;
	border-top: 1px solid #F5F5F5;
	border-bottom: 1px solid #F5F5F5;
	vertical-align: top;
	}
	
td.togcol-1 {
	width: 100px;
	font-weight: bold;
	color: #999;
	padding: 5px 10px;
	vertical-align: top;
	}
	
/* HOME PAGE SPECIFIC DIV IDs */

#containerHome {
	margin: 0 auto;
	padding: 0;
	max-width:	840px;
	background-color: #666;
	text-align: left;
	}

#roundtopHome {
	background: url(../image/tr.gif) no-repeat top right;
	background-color: #fafae4;
	}

#bannerHome {
	/* background-image:   url("../image/banner/rotate.php");  Random banner rotation script - Enable once published to LIVE */
	background-image: url(../image/banner/banner_hm.png);
	background-repeat: no-repeat;
	background-position: center center;
	width: auto;
	height: 165px;
	text-align: center;
	padding: 0;
	}

#strapline {
	width: auto;
	background-color: #666;
	text-align: center;
	vertical-align: center;
	padding: 0px 50px 25px 50px;
	}
	
	#strapline h2 { 
	font-family: Geneva, Arial, Helvetica, sans-serif;
	font-size: 1.75em; /* 16x1.75=28 */
	font-weight: normal;
	line-height: 28px;
	/* color: #c0d0b4; IAM colour palette green*/
	color: #fafae4;
	}

#contentHome {
	float: right;
	background-color: #666666;
	width: 650px;
	text-align: left;
	padding: 0 20px 30px 0;
	}
	
	#contentHome ul{
		padding: 0px 10px 0px 30px;
		margin: 0px;
		}

	#contentHome li{
		padding: 0px 5px 15px 5px;
		list-style-type: square;
		line-height: 20px;
		}
		
	#contentHome h3{
		padding: 0;
		}	

#navHome {
	float: left;
	background-color: #666;
	width: 160px;
	text-align: left;
	padding-top: 5px;
	}
	
	#navHome ul {
		background-color: #666;
		list-style-type: none;
		list-style-position: inside;
		padding: 0;
		margin: 0;
		}
		
	#navHome li{
		line-height: 25px;
		}

#footerHome {
	clear: both;
	background-color: #666;
	color: #ccc;
	padding: 5px 5px 5px 52px;
	width: auto;
	text-align: left;
	}
	
	#footerHome ul {
		margin-left: 0;
		padding-left: 0;
		font-size: 0.75em;
		display: inline;
		}
		
	#footerHome li {
		margin-left: 0;
		padding: 3px 7px;
		border-left: 1px solid #fff;
		list-style: none;
		display: inline;
		}
		
	#footerHome li.first {
		margin-left: 0;
		padding: 3px 7px 3px 0px;
		border-left: none;
		list-style: none;
		display: inline;
		}
		
	#footerHome p {
		font-size: 0.75em;
		padding: 0;
		color: #999;
		}
		
#roundbottomHome {
	background: url(../image/br_home.gif) no-repeat bottom right;
	background-color: #666;
	}

/* UNIVERSAL AND PAGE SPECIFIC DIV IDs (EXCLUDES HOME PAGE) */

#container {
	margin: 0 auto;
	padding: 0;
	background-color: #fafae4;
	max-width:	840px;
	text-align: left;
	}

#roundtop {
	background: url(../image/tr.gif) no-repeat top right;
	background-color: #fafae4;
	}

#header {
	width: auto;
	background-color: #fafae4;
	height: 40px;
	padding: 10px 0px 20px 52px;
	text-align: left;
	}
	
	#header ul {
		margin: 0;
		padding: 0;
		display: inline;
		}
		
	#header li {
		margin-left: 0;
		padding: 0px 7px 0px 10px;
		border-left: 1px solid #999;
		list-style: none;
		display: inline;
		}
		
	#header li.first {
		margin-left: 0;
		padding: 0px 7px 0px 0px;
		border-left: none;
		list-style: none;
		display: inline;
		}

#banner {
	/* background-image: url("../image/banner/rotate.php");  Random banner image rotation script - Enable once published to LIVE */
	background-repeat: no-repeat;
	background-position: center center;
	width: auto;
	height: 165px;
	text-align: center;
	padding: 0;
	}
	
	#banner_a {
		background-image: url(../image/banner/banner_a.png);
		background-repeat: no-repeat;
		background-position: center center;
		width: auto;
		height: 165px;
		text-align: center;
		padding: 0;
		}
		
	#banner_b {
		background-image: url(../image/banner/banner_b.png);
		background-repeat: no-repeat;
		background-position: center center;
		width: auto;
		height: 165px;
		text-align: center;
		padding: 0;
		}
		
	#banner_c {
		background-image: url(../image/banner/banner_c.png);
		background-repeat: no-repeat;
		background-position: center center;
		width: auto;
		height: 165px;
		text-align: center;
		padding: 0;
		}
		
	#banner_d {
		background-image: url(../image/banner/banner_d.png);
		background-repeat: no-repeat;
		background-position: center center;
		width: auto;
		height: 165px;
		text-align: center;
		padding: 0;
		}
		
	#banner_e {
		background-image: url(../image/banner/banner_e.png);
		background-repeat: no-repeat;
		background-position: center center;
		width: auto;
		height: 165px;
		text-align: center;
		padding: 0;
		}
		
	#banner_f {
		background-image: url(../image/banner/banner_f.png);
		background-repeat: no-repeat;
		background-position: center center;
		width: auto;
		height: 165px;
		text-align: center;
		padding: 0;
		}
		
	#banner_g {
		background-image: url(../image/banner/banner_g.png);
		background-repeat: no-repeat;
		background-position: center center;
		width: auto;
		height: 165px;
		text-align: center;
		padding: 0;
		}
	
#nav {
	float: left;
	width: 160px;
	background-color: #fafae4;
	text-align: left;
	padding-top: 5px;
	}
	
	#nav ul {
		list-style-type: none;
		list-style-position: inside;
		padding: 0;
		margin: 0;
		}
		
	#nav li{
		line-height: 25px;
		}
		
#content {
	float: right;
	width: 650px;
	background-color: #fafae4;
	color: #666;
	text-align: left;
	padding-bottom: 5px;
	}
		#contentSM {
			float: right;
			width: 650px;
			background-color: #fafae4;
			color: #666;
			text-align: left;
			padding-bottom: 5px;
			}
	
	#content h2{
		padding: 0px 0px 10px 15px;
		}
		
		#contentSM h2{
			padding: 0px 0px 10px 15px;
			}
		
	#content h3{
		padding-left: 15px;
		}
		
	#content h4{
		padding-left: 15px;
		}	
		
	#content p{
		padding: 5px 50px 5px 15px;
		}
		
	#content li {
		list-style-type: square;
		line-height: 16px;
		padding: 5px 50px 5px 15px;
		}
		
		#contentSM ul li {
			list-style-type: square;
			line-height: 1.6em;
			padding: 0px 50px 0px 0px;
			}
		
	#content img {
		padding: 10px;
		}
	
#footer {
	clear: both;
	background-color: #fafae4;
	padding: 5px 5px 5px 52px;
	color: #666;
	width: auto;
	text-align: left;
	}
	
	#footer ul {
		margin-left: 0;
		padding-left: 0;
		font-size: 0.75em;
		display: inline;
		}
		
	#footer li {
		margin-left: 0;
		padding: 3px 7px;
		border-left: 1px solid #999;
		list-style: none;
		display: inline;
		}
		
	#footer li.first {
		margin-left: 0;
		padding: 3px 7px 3px 0px;
		border-left: none;
		list-style: none;
		display: inline;
		}
		
	#footer li.last {
		padding: 3px 0px 3px 400px;
		border-left: none;
		list-style: none;
		display: inline;
		color:#666;
		text-decoration:none; 
		}
		
	#footer p {
		font-size: 0.75em;
		padding: 0;
		}

#roundbottom {
	background: url(../image/br.gif) no-repeat bottom right;
	background-color: #fafae4;
	}

/* BIOGRAPHIES PAGE DIV IDs + CLASSES */

#bio {
	float: left;
	width: 250px;
	padding: 0 0 0 15px;
	margin: 0;
	}
	
	#bio h2 {
		position: relative;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 1em;
		width: 250px;
		padding: 2px 0px 2px 0px;
		margin: 0;
		line-height: 18px;
		}
		
	#bio h2 span {
		font-weight: normal;
		font-size: 0.9375em;
		}
		
	#bio a {
		color: #999 !important;
		display: block;
		border: 1px solid #ccc;
		background-color: #F5F5F5;
		padding: 5px 5px 5px 10px;
		text-decoration: none;
		}
		
	#bio a:hover {
		background-color: #5c7a9f;
		color: #fff !important;
		}
		
#bio-detail-container {

	position: relative;
	float: right;
	width: 350px;
	line-height: 20px;
	margin-right: 20px;
	padding-top: 2px;
	}
	
	#bio-detail-container h2, h3 {
		margin: 0;
		padding-bottom: 0;
		}
	
	.bio-detail {
		background:#fff !important;
		position: relative;
		border: 1px solid #ccc;
		padding-top: 15px;
		}
	
	.bio-detail img {
		float: right;
		border: 1px solid #333;
		padding: 0 !important;
		margin: 0px 15px 15px 20px;
		}
		
	.bio-detail h2 {
		font-family: Arial, Helvetica, sans-serif;
		font-size: 1.375em;
		color: #660033 !important; /* IAM corporate colour */
		line-height: 1em;
		}
		
	.bio-detail h3 {
		font-family: Arial, Helvetica, sans-serif;
		font-size: 1em;
		font-weight: bold;
		}


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

7. Print - http://www.alistapart.com/stories/goingtoprint/ 

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

@media print {


#roundtopHome { display: none; }

#bannerHome { display: none; }

#navHome { display: none; }

#footerHome { display: none; }

#roundbottomHome { display: none; }

#roundtop { display: none; }



#banner_a, #banner_b, #banner_c, #banner_d, #banner_e, #banner_f, #banner_g, #banner_h  { display: none; }

#nav { display: none; }

#footer { display: none; }

#roundbottom { display: none; }


#header ul { display: none; }

#container, #content { border: 0; margin: 0 !important; color: #000; width: auto !important; float: none !important; }

#content a { text-decoration: none; color: #520; }

/* #content a:after { content: " [" attr(href) "] "; font-size: 90%; } */

/* #content a[href^="/"]:after { content: " [http://www.iam.uk.com" attr(href) "] "; } */


#headerHome ul { display: none; }

#containerHome, #contentHome { border: 0; margin: 0 5%; color: #000; width: auto; float: none; !important }

#contentHome a { text-decoration: none;  color: #520; }

#contentHome a:after { content: " [ " attr(href) " ] "; font-size: 90%; }

#contentHome a[href^="/"]:after { content: " [ http://www.iam.uk.com" attr(href) " ] "; }

div.toggle-block { display: block !important; }

a.action-link { text-decoration: none !important; }

}

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

8. CSS Diagnostics - http://www.alistapart.com/stories/goingtoprint/ 

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


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

9. Lightbox - http://www.lokeshdhakar.com/projects/lightbox2/ 

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

#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../image/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../image/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }