/*
copyright: Matt Shearer 2008
All rights reserved.
*/
@import '/css/reset.css';


/* - - - - GENERAL - - - - */

body {
font-family: georgia, times, serif;
font-size: 0.95em;
background-color: #8a8276;
}

a {
color: #0C6191;
}

a:hover {
color: #0C4171;
}

a:visited {
color: #3C91C1;
}

.printonly {
display:none;
}

/* - - - - CONTAINER - - - - */
div#container {
position: relative;
width: 100%;
text-align: center;
background-color: #b2a99a;

}

/* - - - - TOP - - - - */

div#header {
position: relative;
margin: 0 auto;
height: 145px;
width: 950px;
background-image: url('/images/banner_back_01.jpg');
background-position: top left;
background-repeat: no-repeat;
}

div#logo {
position: absolute;
top: 48px;
left: 30px;
}

div#strap {
position: absolute;
top: 55px;
right: 25px;
color: white;
}

div#strap blockquote {
font-size: 165%;
font-style: italic;
}

div#accessibility {
position: absolute;
top: 5px;
right: 20px;
color: white;
font-size: .7em;
}

div#accessibility li {
display: inline;
margin-right: 5px;
}

div#accessibility a {
color: #b2a99a;
}


/* - - - - NAV - - - - */

div#navband {
width: 950px;
height: 1.85em;
background: #b2a99a;
position: relative;
margin: 0 auto;
z-index: 10;
}

div#navigation {
z-index: 11;
}

div#navigation li {
font-size: 100%;
display: inline;
}

div#navigation a {
font-weight: bold;
color: black;
}

/* - - - - CRUMB - - - - */
div#mainarea p.crumbtrail {
font-family: verdana, sans-serif, arial;
font-size: 80%;
margin-top: 0;
margin-bottom: 0;
}

div#mainarea p.crumbtrail,
div#mainarea p.crumbtrail a {
color: #b2a99a;
}

/* - - - - MAIN AREA - - - - */

div#mainarea {
position: relative;
margin: 0 auto;
text-align: left;
width: 950px;
background-color: black;
}

div.pad div.contentBlock1 {
float: left;
width: 450px;
}

div.pad div.contentBlock2 {
float: left;
width: 565px;
}

div#apps1 {
float: left;
margin-left: 10px;
margin-right: 0px;
margin-bottom: 15px;
}

div#apps {
float:right;
margin-left: 30px;
margin-right: 20px;
margin-bottom: 15px;
}

div.mainapps {
width: 430px;
}

div.audioapps {
width: 280px;
}

div#apps p,
div#apps h2,
div#apps embed,
div#apps object {
margin-left:0;
padding:0;
}

div#apps p {
font-size: 75%;
}


/* - - - - PARTNERS PAGE - - - - */


div.pad span.logo {
margin-left: 20px;
width: 270px;
clear: both;
float: left;
}

div.pad span.text {
width: 510px;
float: left;
padding-bottom: 30px;
}

div.pad span.line {
clear: both;
width: 850px;
text-align: center;
padding-bottom: 40px;
float: left;
}

div.pad span.line img {
margin: 5px;
}

div.pad span.text h2,
div.pad span.text h3 {
margin-top:0px !important;
}



/* - - - - CONTENT - - - - */

div#content {
width: 950px;
height: auto;
clear: both;
color: white;
margin-top: 0px;
padding-top: 10px;
background-image: url('/images/thames_background2.jpg');
background-position: top left;
background-repeat: no-repeat;
z-index: 1;
}

div.pad {
clear: both;
height: auto;
min-height: 14em;
width: 900px;
margin-top: 20px;
margin-left: 20px;
margin-right: 20px;
margin-bottom: 15px;
}

div.pad[class] {
background-image: url('/images/back.png');
background-position: left;
background-repeat: repeat;
}

div.partner { /* this is to make the "pad" class tall enough */
min-height: 40em;
}

div.pad p img {

margin-top: 10px;
margin-bottom: 10px;
border: 1px solid white;
}

div.pad p img.left {
float: left;
margin-right: 15px;
}

div.pad p img.right {
float: right;
margin-left: 15px;
}

div.pad p,
div.pad h1,
div.pad h2,
div.pad h3,
div.pad h4,
div.pad h5,
div.pad ul,
div.pad ol,
div.pad embed,
div.pad object,
div.pad table, 
div.pad blockquote,
div.pad div.gallery {
margin-left: 20px;
margin-right: 15px;
}


/* - - GALLERY BITS - - */

div.pad div.gallery ul {
padding-bottom: 20px;
padding-top: 20px;
margin: 0;
}

div.pad div.gallery img {
border: 1px solid white;
}

div.pad div.gallery img:hover {
border: 1px solid #8a8276;
}

div.pad div.gallery ul ul {
margin: 0;
}

div.pad div.gallery ul ul li {
font-size: 85%;
width: 190px;
}

div.pad div.gallery ul li {
float:left;
width: 210px;
}

div.pad div.gallery li ul {
display: block;
float: none;
width: 180px;
}

div.pad div.gallery {
display: block;
float: none;
clear: both;
margin-bottom: 20px;
padding-bottom: 20px;
}

div.pad hr {
border: 1px solid white;
clear: both;
float: left;
width: 800px;
margin-left: 20px;
margin-top: 40px;
}

div#content p {
margin-top: 5px;
margin-bottom: 15px;
}

div#content em {
font-style: italic;
}

div#content strong {
font-weight: bold;
}


div#content a {
color: white;
}

div#content h1 {
margin-top: 20px;
margin-bottom: 25px;
font-size: 190%;
font-style: italic;
font-weight: normal;

}
div#content h1 a {
text-decoration: none;
color: white;
}
div#content h2 {
margin-top: 35px;
margin-bottom: 20px;
font-size: 130%;
font-weight: normal;
}

div#content h3 {
margin-top: 25px;
margin-bottom: 15px;
font-size: 110%;

}

div#content p.credit {
font-size: 80%;
}

div#content p.credit a {
text-decoration: none;
}
div#content p.credit a:hover {
text-decoration: underline;
}

/* - - - - PROMOS - - - - */


div.promo {
float: left;
width: 175px;
height: 17em;
}

div.promo h3 {
font-weight: normal;
}

div.promo h3 a {
text-decoration: none;
}

div.promo h3 a:hover {
text-decoration: underline;
}


div.promo p {
font-size: 75%;
}

div.promo img {
border: none;
}

div.promo a img {
border: 2px solid white;
}

div.promo a:hover img {
border: 2px solid #8a8276;
}


/* - - - - SOCIAL BOOKMARKS - - - - */
div#bookmarks {
margin-left: 40px;
margin-right: 40px;
width: 400px;
padding: 0;
background: white;
text-align: center;
height: 30px;
}



/* - - - - FOOTER - - - - */

div#footer {
clear: both;
width: 950px;
text-align: center;
padding-top: 40px;
padding-bottom: 40px;
}

div#footer a:hover, div#credits a:hover {
text-decoration: none;
}

div#footer p.credits {
font-family: arial, sans-serif;
font-size: 80%;
}

div#footer p.credits a {
text-decoration: none;
}

div#footer p.credits a:hover {
text-decoration: underline;
}


/* - - - - MICROFORMATS - - - - */

div div#vcard, 
div div#vcard,
div div#vcard div, 
div div#vcard div {
margin:0;
padding:0;
height:auto;
}

div#vcard p img {
vertical-align: middle;
display: inline;
}

div#vcard h2, div#vcard div, div#vcard p {
display: inline;
}

div#vcard hr {
clear: both;
border: 1px dotted #eee;
}


/* - - - - LIGHTBOX - - - - */
#lightbox{
	position: absolute;
	top: 40px;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
	}

#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: transparent url(/images/blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block;
	}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(/images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(/images/nextlabel.gif) right 15% no-repeat; }


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

#imageData{
	padding:0 10px;
	}
#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;	}	
		
#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
	filter:alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
	}
	

.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
	}

* html>body .clearfix {
	display: inline-block; 
	width: 100%;
	}

* html .clearfix {
	/* Hides from IE-mac \*/
	height: 1%;
	/* End hide from IE-mac */
	}	
	



/* - - - - MISC - - - - */




/* notes

- - - colours - - -
light gold: #b2a99a
dark gold: #8a8276


- - - z index - - -
n/a

*/