html, body { 
 	margin: 0; 
 	padding: 0; 
	font-family: verdana, arial, calibri, sans-serif;
	font-size: 12px;	
	line-height: 1; 
	background:  #000;
	background:  fixed #000 url(images/remains-bg2.jpg) top left no-repeat;
	} 

 
* html body {
	font-size: x-small; /* for IE5/Win */
	f\ont-size: small; /* for other IE versions */
}


div#page-container {
	width: 900px;
	margin: 0 auto;	
}

	h1.main-heading {
	  	color: #b00000;
	  	font-size: 18px;
      	margin:0; 
      	padding:0;
     	position:relative;
     	width:920px; 
     	height:150px;
     	overflow:hidden;
      }
      
   	h1.main-heading span {
      	display:block;
      	position:absolute; left:0; top:0; z-index:1;
      	width:920px; height:150px;
      	margin:0; padding:0;
      	background:transparent url("images/remains-banner.gif") top left no-repeat;
      }

div#footer {
	width: 920px;
	background:  #000 url(images/remains-footer-bg.jpg) top right no-repeat;
	margin: 20px auto 10px;	
	color: #808080; 
	border-top: 1px dotted #161414;
	border-bottom: 1px dotted #161414;
	overflow: hidden; /* forces unfloated container, without height set, to stretch around elements*/
}

p#footer-left {
	float: left;
	margin: 0;
	padding: 15px 0;
}

p#footer-right {
	color: #ff0000;
	float: right;
	margin: 0;
	padding: 15px 0;
}

img {
	border: none;
}

h6 {
	font-size: 10px;
	letter-spacing: 0;
	line-height: 1.2;	
	font-weight: normal;
	color: #cfcfcf;
	margin-top: 0;
}


h2 {
	font-family: trebuchet ms, calibri, verdana, arial, sans-serif;
	font-size: 18px;
	font-weight: bold;
	color: #b00000;
	letter-spacing: 1px;
	margin: 0 0 3px 0;
}


/*								LINKS */

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

a:link {
	color:#cfcfcf;
}

a:visited { 
	color:#cfcfcf;
}  

a:hover {
	color: #4AADEF;
} 


/*								COLOUR TEXT */

span.face-colour{
	color: #ff0000;
} 
span.four-colour{
	color: #ff6fc6;
}
span.three-colour{
	color: #b4fc18;
}
span.two-colour{
	color: #4AADEF;
}



#imap {
	display:block; 
	width:425px; 
	height:554px; 
	background:url(images/remains-mapped.jpg) no-repeat; 
	position:relative; 
	margin:10px 0 10px 10px;
	}

/* not req'd - don't want ALL hotspots outlined on hover
#imap a#painting {display:block; width:425px; height:0; padding-top:554px; overflow:hidden; position:absolute; left:0; top:0; background:transparent url(images/small.jpg) no-repeat 425px 554px; cursor:default;}
*/

* html #imap a#painting {
	height:554px; 
	he\ight:0;
	}

#imap a#painting:hover {
	background-position: 0 0; 
	z-index:10;
	}

#imap dd {
	position:absolute; 
	padding:0; 
	margin:0;
	}
	
/* FOR EACH - grid ref of hotspot */	
#imap #hair {
	left:5px; 
	top:5px; 
	z-index:20;
	}
#imap #rock {
	left:125px; 
	top:5px; 
	z-index:20;
	}	
#imap #sky {
	left:240px; 
	top:5px; 
	z-index:20;
	}	
#imap #warning {
	left:23px; 
	top:169px; 
	z-index:20;
	}	
#imap #ironman {
	left:225px; 
	top:169px; 
	z-index:20;
	}
#imap #buildings {
	left:317px; 
	top:173px; 
	z-index:20;
	}
#imap #scissors {
	left:50px; 
	top:272px; 
	z-index:20;
	}
#imap #woman {
	left:3px; 
	top:355px; 
	z-index:20;
	}
#imap #crow {
	left:104px; 
	top:371px; 
	z-index:20;
	}
#imap #colours {
	left:249px; 
	top:377px; 
	z-index:20;
	}

/* FOR EACH - dimensions of hotspot */
#imap a#link_hair, #imap a#link_rock {
	display:block; 
	width:100px; 
	height:150px; 
	text-decoration:none; 
	z-index:20;
	}
#imap a#link_sky {
	display:block; 
	width:175px; 
	height:150px; 
	text-decoration:none; 
	z-index:20;
	}
#imap a#link_warning {
	display:block; 
	width:100px; 
	height:50px; 
	text-decoration:none; 
	z-index:20;
	}
#imap a#link_ironman {
	display:block; 
	width:91px; 
	height:191px; 
	text-decoration:none; 
	z-index:20;
	}
#imap a#link_buildings {
	display:block; 
	width:102px; 
	height:143px; 
	text-decoration:none; 
	z-index:20;
	}
#imap a#link_scissors {
	display:block; 
	width:172px; 
	height:77px; 
	text-decoration:none; 
	z-index:20;
	}
#imap a#link_woman {
	display:block; 
	width:100px; 
	height:184px; 
	text-decoration:none; 
	z-index:20;
	}
#imap a#link_crow {
	display:block; 
	width:134px; 
	height:164px; 
	text-decoration:none; 
	z-index:20;
	}
#imap a#link_colours {
	display:block; 
	width:174px; 
	height:151px; 
	text-decoration:none; 
	z-index:20;
	}

#imap a em {
	display:none;
	}

#imap a span, #imap a:visited span {
	display:none;
	}
	
/* FOR EACH - outline hotspot */
/*
#imap a#link_hair:hover, #imap a#link_rock:hover, #imap a#link_sky:hover, #imap a#link_warning:hover, #imap a#link_ironman:hover, #imap a#link_buildings:hover, #imap a#link_scissors:hover, #imap a#link_woman:hover, #imap a#link_crow:hover, #imap a#link_colours:hover {
	border:1px solid #fff;
	}
	*/

/* dimensions etc of popup area */
#imap a:hover span {
	position:absolute; 
	display:block; 
	color:#808080; 
	width:445px; 
	height:545px; 
	line-height:1.3em; 
	font-family: trebuchet ms, verdana, arial, sans-serif;
	font-weight: normal;
	font-size:16px; 
	text-align:justify;
	}

/* FOR EACH - pushes pop-up over to the right & up a bit */
#imap dd#default {
	left:455px; 
	top:0px;
	} 
#imap a#link_hair:hover span {
	left:450px; 
	top:-5px;
	} 	
#imap a#link_rock:hover span {
	left:330px; 
	top:-5px;
	}
#imap a#link_sky:hover span {
	left:215px; 
	top:-5px;
	}
#imap a#link_warning:hover span {
	left:432px; 
	top:-169px;
	}
#imap a#link_ironman:hover span {
	left:230px; 
	top:-169px;
	}
#imap a#link_buildings:hover span {
	left:138px; 
	top:-173px;
	}
#imap a#link_scissors:hover span {
	left:405px; 
	top:-272px;
	}
#imap a#link_woman:hover span {
	left:452px; 
	top:-355px;
	}
#imap a#link_crow:hover span {
	left:351px; 
	top:-371px;
	}
#imap a#link_colours:hover span {
	left:206px; 
	top:-377px;
	}
	
/* not req'd - the line linking hotspot to popup
#imap a#link_hair:hover em {position:absolute; display:block; left:60px; top:35px; width:140px; height:1px; overflow:hidden; font-size:1px; background:#f00;}
*/

/* styling for image etc in popup window */
#imap a:hover span img {
	float:right; 
	margin-bottom:0.5em; 
	padding-left:15px; 
	/*border:1px solid #fff;*/
	}
#imap dd#rock a:hover span img, #imap dd#buildings a:hover span img {
	padding-left:0; 
	}
	
#imap a span:first-line {
	font-weight:bold; 
	font-style:italic;
	}

#content .painting-details {
	line-height: 1.5em;
	font-size: 10px;
	width:425px; 
	margin:0 0 0 10px; 
	color: #808080;
	}

.float-left {
	float: left;
}
