/* Overall structure and sizing */
/* Overall structure and sizing */
/* Overall structure and sizing */

body
	{
	/* Make a rule affecting the whole body of the document */
	
	/* we're going to use ems for styling again.  (because of IE6 resize issues).  To make it easy, let's make 1em=10px.  So the Default font size has to be 10px.  */
	font-size: 62.5%;
	
	/* For really low res viewers, let's get rid of margins at the top left */
	padding: 0;
	margin: 0;
	
	
	}


#container
	{
	width: 967px;
	height: 100%;
	margin: 0 auto;
	padding: 0;
	
	
	}

#content
	{
	width: 903px;
	background-color: rgb(51,37,34);
	margin: 0; padding: 24px 30px;
	margin-top: -1px;
	
	overflow: hidden;
	
	
	border: 2px #e2d2b9 solid;
	border-top: 0;
	}


/*  The splash image on the first page  */
h1#splash
	{
	width: 967px;
	height: 529px;
	margin: 0; padding: 0;
	}



/* The title at the top of most pages... */
h1
	{
	font-size: 3em;
	font-weight: 200;
	margin: 0; padding: 0;
	}

h1 a#title
	{
	display: block;
	margin: 0; padding: 0;
	overflow: hidden;
	}

h1 a#title img
	{
	display: block;
	width: 967px;
	height: 176px;
	
	margin: 0; padding: 0; border: 0;
	overflow: hidden;
	}
/* Some Styling and Colouring */

body 
	{
	background-color: rgb(22,14,11);
	height: 100%;
	}

p, h1, h2, h3, h4, h5, h6, li, td, img, label /* Set all text to white */
	{
	color: white;
	font-family: Helvetica, Arial, sans-serif;
	}

p, label, li
	{
	font-size: 1.4em;
	}

p a /* regular links inside body text */
	{
	color: #e2d2b9;
	text-decoration: underline;
	}

p a:hover /* regular links inside body text */
	{
	color: #9c6f4e;
	text-decoration: underline;
	}

p a:visited /* regular links inside body text */
	{
	color: #75533a;
	text-decoration: underline;
	}

p.strong
	{
	font-size: 1.6em;
	font-weight: bold;
	}



#footer p a /* links in the footer.  Make them all the same colour, ie don't show which ones have been visited.  Too many colours makes it hard to pick up */
	{
	color: #e2d2b9;
	text-decoration: underline;
	}



h2
	{
	margin-top: 0;
	font-size: 2.4em;
	font-weight: 200;
	}

h3
	{
	font-size: 1.8em;
	font-weight: 200;
	}

img.thumbnail
	{
	width: 231px; 
	height: 154px;
	border: 0px;
	margin: 0 20px 20px 0;
	float: left;
	}

img.fullsize
	{
	width: 760px; 
	height: 505px;
	border: 0px;
	margin: 20px 92px 10px 92px;
	float: left;
	}

p.photo_navigation
	{
	text-align: center;
	}

	p.photo_navigation a, p.photo_navigation a:visited
		{
		color: #e2d2b9;
		text-decoration: none;
		}
	
	p.photo_navigation a:hover, p.photo_navigation a:active
		{
		text-decoration: underline;
		}

.clear
	{
	/* use to create breaks to stop thinks floating too far up, etc.  */
	clear: both;
	}





/* All the CSS to do with the menu */
/* All the CSS to do with the menu */
/* All the CSS to do with the menu */

h2.menu /* If it's a standard screen display, don't show the label.  They can figure out what it is themselves.  This is for when it's text only, or being read aloud.  */
	{
	display: none;
	
	}

ul.menu
	{
	list-style: none;
	height: 34px;
	margin: 0; padding: 0; border: 0;
	
	
	}
	
	ul.otherpage
		{
		/* all pages except the homepage have this menu background */
		background-image: url("img/menu-background.jpg");
		}
	
	ul.homepage
		{
		/* the homepage has a different menu sbackground image  */
		background-image: url("img/homepage-menu-background.jpg");
		}
	
ul.menu li
	{
	display: block; height: 31px; 
/* 	background-color: rgb(117,83,58); */
	
	float: left;
	
	/* no borders or margins */
	margin: 0; padding: 0; border: 0;
	
	border-bottom: 2px #e2d2b9 solid;
	}
	
	
/* Menu items that are current but still linkable.  (eg. photos in the multimedia section) */
ul.menu li.current_still_linkable
	{
 	background-color: rgb(51,37,34); 

	display: block;
	height: 31px;
	font-size: 0px;
	color: black;
	
	/* no borders or margins */
	margin: 0; padding: 0; border: 0;
	
	float: left;
	
	border: 2px #e2d2b9 solid;
	border-bottom: 0;
	}


/* Menu items for the page you're currently on (not clickable) */

ul.menu li.current
	{
 	background-color: rgb(51,37,34); 

	display: block;
	height: 0px;
	font-size: 0px;
	color: black;
	
	padding: 31px 0 0 0;
	overflow: hidden;
	
	border: 2px #e2d2b9 solid;
	border-bottom: 0;
	}
	
	#current_menu_hm
		{
		width: 80px;
		background-image: url(img/menu/hm_v.gif);
		}

	#current_menu_ab
		{
		width: 105px;
		background-image: url(img/menu/ab_v.gif);
		}
	
	#current_menu_mm
		{
		width: 170px;
		background-image: url(img/menu/mm_v.gif);
		}

	#current_menu_gi
		{
		width: 184px;
		background-image: url(img/menu/gi_v.gif);
		}

	#current_menu_sc
		{
		width: 151px;
		background-image: url(img/menu/sc_v.gif);
		}
		
	#current_menu_cm
		{
		width: 151px;
		background-image: url(img/menu/cm_v.gif);
		}
		
	#current_menu_cn
		{
		width: 122px;
		background-image: url(img/menu/cn_v.gif);
		}





/* Menu Items that are clickable */

ul.menu li a
	{
	display: block;
	height: 0px;
	font-size: 0px;
	color: black;
	
	padding: 31px 0 0 0;
	overflow: hidden;
	
	background-repeat: no-repeat;
	}
	

	
	/* specifics for the home button */
	#menu_hm
		{
		width: 80px;
		background-image: url(img/menu/hm_f.gif);
		}
	
	#menu_hm:hover, #menu_hm:active
		{
		background-image: url(img/menu/hm_h.gif);
		}
	
	#menu_hm:visited
		{
		background-image: url(img/menu/hm_v.gif);
		}


	/* specifics for the about button */
	#menu_ab
		{
		width: 105px;
		background-image: url(img/menu/ab_f.gif);
		}
	
	#menu_ab:hover, #menu_ab:active
		{
		background-image: url(img/menu/ab_h.gif);
		}
	
	#menu_ab:visited
		{
		background-image: url(img/menu/ab_v.gif);
		}


	/* specifics for the multimedia button */
	#menu_mm
		{
		width: 170px;
		background-image: url(img/menu/mm_f.gif);
		}
	
	#menu_mm:hover, #menu_mm:active
		{
		background-image: url(img/menu/mm_h.gif);
		}
	
	#menu_mm:visited
		{
		background-image: url(img/menu/mm_v.gif);
		}


	/* specifics for the get involved button */
	#menu_gi
		{
		width: 184px;
		background-image: url(img/menu/gi_f.gif);
		}
	
	#menu_gi:hover, #menu_gi:active
		{
		background-image: url(img/menu/gi_h.gif);
		}
	
	#menu_gi:visited
		{
		background-image: url(img/menu/gi_v.gif);
		}


	/* specifics for the screening button */
	#menu_sc
		{
		width: 151px;
		background-image: url(img/menu/sc_f.gif);
		}
	
	#menu_sc:hover, #menu_sc:active
		{
		background-image: url(img/menu/sc_h.gif);
		}
	
	#menu_sc:visited
		{
		background-image: url(img/menu/sc_v.gif);
		}


	/* specifics for the comments button */
	#menu_cm
		{
		width: 151px;
		background-image: url(img/menu/cm_f.gif);
		}
	
	#menu_cm:hover, #menu_cm:active
		{
		background-image: url(img/menu/cm_h.gif);
		}
	
	#menu_cm:visited
		{
		background-image: url(img/menu/cm_v.gif);
		}


	/* specifics for the contact button */
	#menu_cn
		{
		width: 122px;
		background-repeat: no-repeat;  /* for some reason opera did not inherit this value */
		background-image: url(img/menu/cn_f.gif);
		}
	
	#menu_cn:hover, #menu_cn:active
		{
		background-image: url(img/menu/cn_h.gif);
		}
	
	#menu_cn:visited
		{
		background-image: url(img/menu/cn_v.gif);
		}



/* The Comments Form... */
/* The Comments Form... */
/* The Comments Form... */

#comments_container
	{
	float: left;
	width: 45%;
	}

#commentform
	{
	float: left;
	width: 33.6em;
	padding: 0 1em;
	
	background-color: rgb(117,83,58);
	}


#commentform p.form_input
	{
	margin: 1em 0 1em 0;
	display: block;
	clear: both;
	width: 100%;
	font-size: 1em;
	height: 1.5em;
	}

#commentform p.instruction
	{
	margin: 1em 0 1em 6em;
	padding-top: 1em;
	display: block;
	clear: both;
	width: 100%;
	width: 17.8em;
	}




	
#commentform p.form_input label
	{
	display: block;
	width: 6em;
	float: left;
	}

#commentform p.form_input input, #commentform p.form_input textarea
	{
	display: block;
	width: 17.8em;
	float: left;
	
	margin: 0; padding: 0 0.1em; border: 0;
	font-family: Helvetica, Arial, sans-serif;
	font-size: 1.4em;
	}



#commentform p.submit input
	{
	margin: 0.5em 0 1em 0;
	display: block;
	clear: both;
	float: right;
	font-size: 1em;
	height: 1.5em;
	}











.skiptocontent
	{
	display: none;
	}
#footer
	{
	text-align: center;
	width: 100%;
	}

#menucache, .hidden
	{
	display: none;
	}