/* IE5win Box Model hack */
/* Explanation:
   IE5 takes width to be the full width of the box,
	 rather than just the width of the text inside
	 margin, border and padding.
	 Hence the width (and height) definitions have to be done like this:
	 1. Define the width for IE5, i.e. wrongly.
	 2. Trip IE5 using   font-family: "\"}\""; font-family:inherit;
	    This will prevent it from reading the rest of the definition until the closing '}'
	 3. While IE5 is "out of action" provide the correct measurement for other browsers
	    to overwrite the previous wrong one.
	 4. Unfortunately, Opera is also tripped by this hack so it needs to be provided the
	    correct measurement separately using 'html>body xyz {width: }
	 See http://sidesh0w.com/weblog/2004/02/05/box_model_hack_redux/
div.content { 
  width:400px;
  font-family: "\"}\""; 
  font-family: inherit;
  width:300px;
}
html>body .content {
  width:300px;
}
*/

/* Use overflow: hidden; to ensure that higher text is not increasing the box height. */

/* General page defaults; no padding at all. */
body {
	font: 12px arial, helvetica, verdana, sans-serif;
  text-align: left;
	color: black;
	margin: 0px;
	padding: 0px;
}

/*
 * Colour Scheme
 */
 
#image, #title, #logo, #weelinks, #menu { 
	background-color: #339999;
}
#menu_header, #breadcrumbs, #news_header, #menu .heading, #news .heading {	
	background-color: #b2d8d8;
} 
#news {
	background-color: #D5EFEF;
}
#content, #update, #footer { 
	background: transparent;
}
/* Dark green lines: #236D6C */
 
/*
 * Positioning Section
 */

/* Left-hand column is positioned absolutely. */
  
#image { /* This is the left part of the header, above the menu. */
  z-index: 15;
  margin: 0px;
	border-top:    0px solid #236D6C;
	border-right:  0px solid #236D6C;
	border-bottom: 1px solid #236D6C;
	border-left:   0px solid #236D6C;
	padding: 0px;
	overflow: hidden;
	position: absolute;
	top: 0px; 
	left: 0px;
	width: 121px;
	height: 64px;  /* for IE5win. */
  font-family: "\"}\"";   /* trip IE5win. */
  font-family: inherit;
	height: 63px;  /* correct value. */
}
html>body #image {
	height: 63px;  /* correct value. */
}

#menu_header, #news_header { /* This is the header above the menu in the left-hand column and above the news in the right-hand column. */
  z-index: 20;
  font-size: 12px;
  margin: 0px;
	border-top:    0px solid #236D6C;
	border-right:  0px solid #236D6C;
	border-bottom: 3px double #236D6C;
	border-left:   0px solid #236D6C;
	padding: 2px 0px 4px 0px;
	overflow: hidden;
	position: absolute;
	top: 64px;
	height: 21px;  /* for IE5win. */
  font-family: "\"}\"";   /* trip IE5win. */
  font-family: inherit;
	height: 12px;  /* correct value. */
}
html>body #menu_header {
	height: 12px;  /* correct value. */
}
html>body #news_header {
	height: 12px;  /* correct value. */
}
#menu_header {  /* Additional specifications for the menu header. */
	border-right:  1px solid #236D6C;
	left: 0px; 
  width: 121px;  /* for IE5win. */
  font-family: "\"}\"";   /* trip IE5win. */
  font-family: inherit;
	width: 120px;  /* correct value. */
}
html>body #menu_header {
	width: 120px;  /* correct value. */
}

#menu, #news { /* This is the menu in the left-hand column and the news in the right-hand column. */
  /* Formatting definitions are contained in a separate stylesheet. */
  z-index: 20;
  margin: 0px;
	border-top:    0px solid #236D6C;
	border-right:  0px solid #236D6C;
	border-bottom: 3px double #236D6C;
	border-left:   0px solid #236D6C;
	padding: 0px 0px 10px 0px;
	overflow: hidden;  /* Changed from 'visible' to keep fixed menu width. 2 June 05 by AS */
	position: absolute;
	top: 85px; 
}
#menu { /* Additional specifications for the menu. */
  /* Formatting definitions are contained in a separate stylesheet. */
	border-right:  1px solid #236D6C;
	left: 0px; 
  width: 121px;  /* for IE5win. */
  font-family: "\"}\"";   /* trip IE5win. */
  font-family: inherit;
	width: 120px;  /* correct value. */
}
html>body #menu {  /* for Opera. */
	width: 120px;  /* correct value. */
}

/* Centre column is positioned relatively to make it stretch between left and right column. */

#title { /* This is the first block of the middle column for the title. */
  z-index: 40;
	margin-left:  121px;
	margin-right: 240px;
	border-top:    0px solid #236D6C;
	border-right:  0px solid #236D6C;
	border-bottom: 1px solid #236D6C;
	border-left:   0px solid #236D6C;
	padding: 4px 5px 4px 5px;
	overflow: hidden;
	position: relative;
	top: 0px; 
	left: 0px; 
	height: 64px;  /* for IE5win. */
  font-family: "\"}\"";   /* trip IE5win. */
  font-family: inherit;
	height: 55px;  /* correct value. */
}
html>body #title {  /* for Opera. */
	height: 55px;  /* correct value. */
}

#breadcrumbs { /* This is the second block in the middle column for the "breadcrumbs". */
  z-index: 20;
  font-size: 10px;
	margin-left:  121px;
	border-top:    0px solid #236D6C;
	border-right:  0px solid #236D6C;
	border-bottom: 1px solid #236D6C;
	border-left:   0px solid #236D6C;
	padding: 2px 5px 4px 5px;
	overflow: hidden;
	position: relative;
	top: 0px;
	left: 0px; 
	height: 19px;  /* for IE5win. */
  font-family: "\"}\"";   /* trip IE5win. */
  font-family: inherit;
	height: 12px;  /* correct value. */
}
html>body #breadcrumbs {  /* for Opera. */
	height: 12px;  /* correct value. */
}

#content, #update, #footer { /* This is the 3rd to 5th box of the middle column for: main content, modification date and footer. */
  z-index: 50;
	margin-left:  121px;
	border-top:    0px solid #236D6C;
	border-right:  0px solid #236D6C;
	border-bottom: 0px solid #236D6C;
	border-left:   0px solid #236D6C;
	padding: 5px;
  overflow: hidden;
	position: relative;
	top: 0px; 
	left: 0px;
}

/* Right-hand column is positioned absolutely. */

#logo { /* This is the right part of the header, above weelinks and news. */
  z-index: 30;
	margin: 0px;
	border-top:    0px solid #236D6C;
	border-right:  0px solid #236D6C;
	border-bottom: 0px solid #236D6C;
	border-left:   0px solid #236D6C;
	padding: 3px 5px;
	overflow: hidden;
	position: absolute;
	top: 0px; 
	right: 0px;
	width: 240px;  /* for IE5win. */
	height: 48px;
  font-family: "\"}\"";   /* trip IE5win. */
  font-family: inherit;
	width: 230px;  /* correct value. */
	height: 42px;
}
html>body #logo {  /* for Opera. */
	width: 230px;  /* correct value. */
	height: 42px;
}

#weelinks { /* This is just below the logo, containing the horizontal menu. */
  z-index: 31;
  font-size: 10px;
	margin: 0px;
	border-top:    0px solid #236D6C;
	border-right:  0px solid #236D6C;
	border-bottom: 1px solid #236D6C;
	border-left:   0px solid #236D6C;
	padding: 1px 5px 4px 5px;
	overflow: hidden;
	position: absolute;
	top: 48px; 
	right: 0px; 
	width: 240px;  /* for IE5win. */
	height: 16px;
  font-family: "\"}\"";   /* trip IE5win. */
  font-family: inherit;
	width: 230px;  /* correct value. */
	height: 10px;
}
html>body #weelinks {  /* for Opera. */
	width: 230px;  /* correct value. */
	height: 10px;
}

#news_header {  /* Majority was defined with menu_header. */
	border-left:  1px solid #236D6C;
  right: 0px;
  width: 161px;  /* for IE5win. */
  font-family: "\"}\"";   /* trip IE5win. */
  font-family: inherit;
	width: 160px;  /* correct value. */
}
html>body #news_header {  /* for Opera. */
	width: 160px;  /* correct value. */
}

#news { /* Majority was defined with menu. */
	border-left:  1px solid #236D6C;
	right: 0px; 
  width: 161px;  /* for IE5win. */
  font-family: "\"}\"";   /* trip IE5win. */
  font-family: inherit;
	width: 160px;  /* correct value. */
}
html>body #news {  /* for Opera. */
	width: 160px;  /* correct value. */
}


