/*

This stylesheet sets out the basic layout of the page. If you are happy with the basic layout of the page, and only wish to make stylistic changes (changing colours, background images, etc.) or adding styling to particular page elements, then it is recommended that you leave this stylesheet as is, and affect any changes in the lookandfeel.css file, which is referenced AFTER this sheet, and will therefore override styles in this sheet.

this stylesheet expect the following divs to be present in the HTML, in the order specified:

body
	div#all

		div#header
		div#content
		div#leftbar
			div#mainnav
		div#footer
*/

body
{
	padding: 0px;
	margin: 0px;
	margin-bottom: 30px;
	}


div#all {
background: #fff url(../images/interface/header-bg.jpg) repeat-x 330px 20px;
margin-left: auto;
margin-right: auto;
position: relative;

}

div#header
{
text-align: right;
height: 101px;
margin-bottom: 9px;
background: transparent url(../images/logos/woruldhord.jpg) no-repeat 0px 0px;
color: #222;

}
div#header a#oxcrest img
{
position: absolute;
top: 20px;
left: 20px;

}




/* general style for stuff you want to hide off-screen*/
div#site-info dl dt, .scram
{
position: absolute;
top: -11110px;
left: -11110px;
}


/* give padding to div's that directly contain content*/
div#content, div#leftbar, div#additional, div#footer
{
	padding: 1em;
}



div#content
{
margin-top: 0px;
padding-top: 0px;
margin-left: 40px;
margin-right: 40px;
}



h1
{
margin-bottom: 5px;
margin-top: 10px;
}

/* FOOTER STYLES  */
div#footer
{
clear: both;
/* centre-align the footer text, and make it a little smaller and paler than normal text  */
text-align: center;
font-size: 0.87em;
color: #999;
line-height: 1.5em;
margin:0px;
margin-top: 50px;
clear:both;


}



/* position leftbar div below the header div and to the left of the page
*/
div#leftbar
 {
 position: absolute;
 left: 30px;
 top: 100px;
width: 190px;
 	padding: 0px;
 	margin: 0px;
	text-align: center;

 }
 
 
 
 
 /*  hide the main nav h2 - it makes sense to have it in the mark-up, but we don't want to show it,  as the purpose of the nav bar is obvious visually.

To hide it, we set the position as absolute, and place it way off screen (this is recommended in preference to using display:none because "display:none" may hide it from screenreaders, which we don't want)
  */
  div#mainnav h2
 {
 	position: absolute;
 	left: -3600px;
 }




/* make sure that divs in the main flow leave space for the absolutely positioned mainnav div 
*/
div#content, div#footer
{
margin-left: 223px;
margin-right: 20px;
}




div#footer ul, div#footer ul li 
{
display: inline;
list-style: none;

}


#jisclogo img
{
padding: 20px;
margin-right: 10px;
}


/* homepage-specific styles for the #spotlight links 

body.index div#content, body.index div#footer{

margin-right: 235px;

}



div.rightbar
{
  position: absolute;
  right: 5px;
  top: 100px;
  width: 225px;

}

div.rightbar div
{
margin-bottom: 20px;
}

div#illustration-col img {
background-color: #fff;
padding: 3px;
border: 2px solid #eee;
}

*/





/*  IE 6 only selector to force 'has-layout'  to fix the peekaboo bug   

(only IE 6 will recognise "* html" as a valid selector)

*/

* html div#all
{
	height: 1%;
	position: relative;
}