/* 
 * Campbell Lutyens and Co Ltd
 * www.campbell-lutyens.com
 * Style Sheet for On-Screen and Print Display
 *
 * Created: 1 January 2010, mcclean@campbell-lutyens.com
 */

/*
 * Colour Palette:
 *
 * Black (e.g. Navigator links): #3a3a39
 * Dark Grey (e.g. dotted lines): #808080
 * Dark Blue (Highlights and Banners): #2a418c
 * Mid Brown (e.g. body text): #594848
 * Mid Grey (e.g. page margin): #C5C3BF
 * Light Grey (e.g. shaded element backgrounds): #e8e6e4
 * Light Grey (e.g. text subheadings): #a89d9d
 */

/* 
 * Standard HTML Elements
 */

a{
	color: #a89d9d;
	text-decoration:none;
	}

body{
	font-family: Arial, sans-serif;
	font-size: 11px;
	background-color: #c5c3bf;
	margin: 36px;
	color: #594848;
	}

div{
	border: none;
	margin: 0px;
	padding: 0px;
	}

h1{
	font-size: 26pt;
	font-weight: 100;
	margin: 0px;
	margin-bottom: 0.5em;
	padding: 0px;
	text-align: left;
	}

h2{
	color: #a89d9d;
	font-size: 14pt;
	font-weight: 100;
	margin: 0px;
	margin-bottom: 0.5em;
	margin-top: 0.5em;
	padding: 0px;
	text-align: left;
	}

img{
	border: none;
	}

li{
	font-size: 10pt;
	list-style-type: square;
	margin: 0px;
	padding: 0px;
	}

p{
	font-size: 11pt;
	margin: 0px;
	margin-bottom: 0.5em;
	margin-top: 0.5em;
	padding: 0px;
	}

table{
	border-bottom: dotted #808080 1px;
	border-collapse: collapse;
	border-top: dotted #808080 1px;
	padding: 0px;
	margin: 0px;
	margin-bottom: 8px;
	vertical-align: top;
	}

td{
	font-size: 11px;
	padding: 4px;
	padding-bottom: 8px;
	padding-top: 8px;
	margin: 0px;
	vertical-align: top;
	width: 100%;
	}

th{
	font-size: 11px;
	font-weight: bold;
	padding: 4px;
	padding-top: 8px;
	margin: 0px;
	vertical-align: top;
	min-width: 0px;
	max-width: none;
	width: auto;
	text-align: left;
	}

ul{
	margin: 0px;
	margin-bottom: 1em;
	margin-left: 4em;
	padding: 0px;
	}

/* 
 *
 * Layout DIVs
 *
 */

/* 
 * Root Content Container
 */

div.body{
	background-color: #ffffff;
	left: 50%;
	margin: 0px;
	margin-left: -486px;
	padding: 16px;
	position: absolute;
	max-width: 972px;
	min-width: 972px;
	width: 972px;
	}

/* 
 * The graphic design of this site uses special mouseover effects for some bullets.
 * To overcome problems of style- and colour-matching which arise when using images to achieve this,
 * we achieve the effect using nested DIVs... a little ugly, perhaps, but effective.
 */

div.bullet{
	float: left;
	margin: 0px;
	padding: 1px;
	}

div.outline{
	background-color: #ffffff;
	border: dotted #808080 1px;
	margin-left: 4px;
	margin-right: 4px;
	margin-top: 0.3em;
	}

div.fill{
	border: none;
	height: 3px;
	width: 3px;
	}

a.current div.fill,
a:hover div.fill{
	background-color: #2A418C;
	}

/* 
 * Top-of-Page Header
 */

div.header{
	clear: both;
	max-width: 972px;
	min-width: 972px;
	width: 972px;
	}

div.header ul{
	display: block;
	margin: 0px;
	padding: 0px;
	}

div.header ul li{
	border-left: dotted #808080 1px;
	color: #808080;
	display: block;
	float: left;
	font-size: 9px;
	line-height: 13px;
	list-style: none;
	margin: 0px;
	padding: 0px;
	padding-left: 14px;
	padding-right: 14px;
	}

div.header ul li#time{
	text-align: center;
	width: 109px;
	}

div.header ul li#date{
	width: 249px;
	}

div.header ul li#contact{
	width: 109px;
	}

div.header ul li#contact a{
	}

/* 
 * Logo Strip
 */

div.logo{
	clear: both;
	max-width: 964px;
	min-width: 964px;
	padding-bottom: 8px;
	padding-left: 4px;
	padding-right: 4px;
	text-align: right;
	width: 964px;
	}

/* 
 * Main Site Navigation Menu
 */

div.navigator{
	margin-top: 8px;
	}

div.navigator ul{
	margin: 0px;
	padding: 0px;
	list-style: none;
	}

div.navigator ul li{
	border-left: dotted #808080 1px;
	border-top: dotted #808080 1px;
	display: block;
	float: left;
	padding: 2px;
	margin: 0px;
	text-transform: uppercase;
	}

div.navigator ul li.first{
	border-left: none;
	}

div.navigator ul li a{
	background: #e8e6e4;
	border-top: 3px solid #e8e6e4;
	color: #3a3a39;
	display: block;
	font-size: 7pt;
	margin: 0px;
	padding: 3px 2px 3px 2px;
	text-align: left;
	text-decoration: none;
	width: 130px;
	}

div.navigator ul li a:hover{
	background: #ffffff;
	border-top: 3px solid #ffffff;
	}

div.navigator ul li a.current{
	background: none;
	border-top: 3px solid #2a418c;
	}

/* 
 * Separator between Navigator and Banner
 */

div.separator{
	background: #ffffff;
	border-bottom: dotted #808080 1px;
	border-top: dotted #808080 1px;
	clear: both;
	max-width: 968px;
	min-width: 968px;
	padding: 2px;
	width: 968px;
	}

div.separator div{
	background: #e8e6e4;
	height: 20px;		 /* Supposed to approximate the height of the navigator, above */
	}

/* 
 * Banner containing content-specific pictures, headings and text
 * TODO: Make height of text and image banners identical, mathematically and visually.
 */

div.banner{
	background: #ffffff;
	border-bottom: dotted #808080 1px;
	clear: both;
	max-width: 968px;
	min-width: 968px;
	padding: 2px;
	text-align: center;
	width: 968px;
	}

div.banner div.text{
	background: #2a418c;
	color: white;
	font-weight: 100;
	margin: 0px;
	padding: 16px;
	text-align: left;
	}

div.banner div.text h1{
	color: #ffffff;
	font-weight: 100;
	margin: 0px;
	margin-bottom: 0.25em;
	padding: 0px;
	}

div.banner div.text p{
	color: #ffffff;
	margin: 0px;
	padding: 0px;
	}

/* 
 * Main Content 
 */

div.content{
	max-width: 972px;
	min-width: 972px;
	padding: 2px;	
	width: 972px;
	}

div.content div.awards{
	clear: none;
	float: left;
	padding-bottom: 16px;
	padding-top: 16px;
	max-width: 316px;
	min-width: 316px;
	width: 316px;
	}

div.content div.awards a{
	font-size: 10pt;
	font-weight: 100;
	text-transform: uppercase;
	}

div.content div.awards div.award{
	clear: none;
	float: left;
	font-size: 8pt;
	padding-right: 4px;
	text-align: center;
	}

div.content div.directions{
	clear: none;
	float: left;
	max-width: 244px;
	min-width: 244px;
	padding-bottom: 16px;
	padding-right: 16px;
	padding-top: 16px;
	width: 244px;
	}

div.content div.list{
	clear: none;
	float: left;
	padding-bottom: 16px;
	}

div.content div.list p{
	border: none;
	font-size: 8pt;
	margin: 0px;
	padding: 4px;
	padding-left: 16px;
	padding-top: 16px;
	text-transform: uppercase;
	}

div.content div.list ul{
	margin: 0px;
	padding: 0px;
	}

div.content div.list ul li{
	list-style-type: none;
	margin: 0px;
	padding: 0px;
	}

div.content div.list ul li div.outline{
	margin-top: 2px;
	}

div.content div.list ul li a{
	display: block;
	font-size: 8pt;
	padding: 0px;
	padding-bottom: 2px;
	padding-top: 2px;
	max-width: 170px;
	min-width: 170px;
	width: 170px;
	vertical-align: middle;
	}

div.content div.list a.current,
div.content div.list a:hover{
	background-color: #E8E6E4; 
	}

div.content div.map{
	clear: none;
	float: left;
	max-width: 708px;
	min-width: 708px;
	padding-bottom: 16px;
	padding-top: 16px;
	width: 708px;
	}

div.content div.office{
	clear: none;
	float: left;
	max-width: 468px;
	min-width: 468px;
	padding-bottom: 16px;
	padding-right: 16px;
	padding-top: 16px;
	width: 468px;
	}

div.content div.picture{
	clear: none;
	float: left;
	max-width: 152px;
	min-width: 152px;
	padding-right: 16px;
	padding-top: 16px;
	width: 152px;
	}

div.content div.picture div.placeholder{
	height: 210px;
	max-height: 210px;
	max-width: 152px;
	min-height: 210px;
	min-width: 152px;
	width: 152px;
	}

div.content div.text{
	clear: none;
	float: left;
	max-width: 444px;
	min-width: 444px;
	padding-right: 16px;
	padding-top: 16px;
	width: 444px;
	}

div.content div.team h2{
	color: #594848;
	font-size: 12pt;
	font-weight: bold;
	margin: 0px;
	}

div.content div.team h3{
	margin: 0px;
	margin-top: 4px;
	}

div.content div.team p{
	border-top: dotted #808080 1px;
	font-size: 8pt;
	margin-bottom: 4px;
	margin-top: 4px;
	padding-bottom: 4px;
	padding-top: 4px;
	}

div.content div.text a{
	font-style: italic;
	}

/*
 * Subsidiary classes to alter settings above
 */

div.content div.wide{
	max-width: 639px;
	min-width: 639px;
	width: 640px;
	}

/* 
 * Bottom-of-Page Footer
 */

div.footer{
	border-left: dotted #808080 1px;
	border-top: dotted #808080 1px;
	clear: both;
	font-size: 9pt;
	padding: 8px;
	max-width: 955px;
	min-width: 955px;
	width: 955px;
	}

/* 
 *
 * Modifications to the above for hard-copy printout
 * Note that this site really should be printed landscape; it will fit quite nicely onto an A4 page like that
 *
 */

@media print{
	body{
		background: none;
		}
	div.body{
		margin: 0px;
		padding: 0px;
		position: static;
		width: auto;
		}
	div.header{
		display: none;
		}
	div.logo{	
		border-bottom: dotted #808080 1px;
		position: static;
		width: auto;
		}
	div.navigator{
		display: none;
		}
	div.separator{
		display: none;
		}
	div.banner{
		position: static;
		width: auto;
		}
	div.banner img{
		display: block;
		width: auto;
		}
	div.content{
		position: static;
		width: auto;
		}
	div.content div.awards{
		position: static;
		width: auto;
		}
	div.content div.list{
		position: static;
		width: auto;
		}
	div.content div.map{
		position: static;
		width: auto;
		}
	div.content div.office{
		position: static;
		width: auto;
		}
	div.content div.picture{
		position: static;
		width: auto;
		}
	div.content div.text{
		position: static;
		width: auto;
		}
	div.separator{
		display: none;
		}
	div.footer{
		display: none;
		}
	}









/* EDITOR PROPERTIES - PLEASE DON'T DELETE THIS LINE TO AVOID DUPLICATE PROPERTIES */