* {
	margin: 0;
	padding: 0;
	}
	
body {
	font: small arial, sans-serif;
	background-color: #c7d6ee;
	}
	
#container{
	background-color: #ffffff;
	width: 780px;
	}
	
div#header { 
	height: 95px;
	text-align: left;
	background-color: #ffffff;
	border-bottom: 5px #9999ff solid;
	float: left;
	width: 780px;
	}
	
div#header a img{
	border: 0px none;
	}
	
#head_logo {
	float:right;
	}
	
#logo {
	margin-top: 22px;
	margin-right: 20px;
	}
	
#head_pic{
	float:right;
	text-align:right;
	margin-right: 25px;
	margin-top: -22px;

	}

div#flashband { 
	width: 780px;
	z-index: -10;
	}
	
div#extra {
	background: #ff9933;
	}
	
div#wrapper {
	background-color: #fff;
	float: left;
	width: 740px;
	text-align: left;
	padding: 15px 20px;
	}
	
div#wrapper a img{
	border: 0px none;
	}
	

div#wrapper h1 { 
	font-weight: normal;
	font-size: 18px;
	line-height: 1.5em;
	color: #0066cc;
	margin-bottom: 6px;
	}
	
div#wrapper h2 { 
	font-weight: normal;
	font-size: 16px;
	line-height: 1.5em;
	color: #0066cc;
	margin-bottom: 6px;
	}
	
div#wrapper h3 { 
	font-weight: bold;
	font-size: 13px;
	margin-top: 0.8em;
	margin-bottom: 0.4em;
	}	
	
div#wrapper p { 
	margin-bottom: 1em;
	text-align: justify;
	}
	
div#wrapper ul { 
	margin-left: 10px;
	margin-bottom: 1em;
	}
	
div#wrapper li { 
	margin-left: 10px;
	margin-bottom: 1em;
	list-style: disc;
	}
	
div#wrapper a { 
	color: #0066cc;
	}
	
div#wrapper a:hover { 
	text-decoration: none;
	}		

.button {
	float: left;
	width: 179px;
	height: 41px;
	margin-bottom: 10px;
	}
	
.images {
	margin-top: 20px;
	}
	
/* the left column starts here */
	
div#leftcol { 
	float: left;
	width: 370px;
	padding-right: 20px;
	padding-left: 10px;
	}
		
ul#links li { 
	margin-left: -10px;
	margin-bottom: 4px;
	list-style: none;
	}

/* the right column starts here */
	
div#rightcol { 
	float: left;
	width: 330px;
	}
	
div#rightcol img { 
	margin-bottom: 20px;
	}
	
.clearzone {
	height: 1px;
	clear: both;
	}

div#footer {
	font-size: 90%;
	border-top: 5px solid #9999ff;
	color: #000;
	padding: 10px 20px 30px 30px;
	clear: both;
	width: 730px;
	text-align: left;
	}
	
#intro_butts {
	font-size: 90%;
	width: 300px;
	text-align: center;
	}
	
#intro_butts a img { 
	margin-bottom: 5px;
	}
	
/* navigation styles */

/* the horizontal menu starts here */

div#navbar {
	float: left;
	width: 740px;
	height: 22px;
	padding: 0 20px;
	background-color: #0066cc;
	}

div#listmenu {
	width: 600px; /* makes the div full width */
	float: left;
	font-size: 11px;
	line-height: 22px; /* specifies the height of the menu */
	text-align:left;
	z-index: 10;
	}
	
div#listmenu li {
	float: left;	/* causes the list to align horizontally instead of stack */
	position: relative; /* positioning context for the absolutely positioned drop-down */
	list-style-type: none;	/* removes the bullet off each list item */
	}

div#listmenu li:hover { 
	background-color: #9999ff; /*sets the rollover background of the menu items */
	}

div#listmenu a {
	display: block;
	padding: 0 10px 0 10px; /*creates space around the main menu items text */
	text-decoration: none;	 /* removes the underlining of the link */
	color: #fff;	/* sets the type coluor */
	}
	
div#listmenu a:hover {
	color: #fff; /* sets the rollover type colour */
	}
	
div#sec_link {
	float: right;
	font-size: 11px;
	line-height: 22px; /* specifies the height of the menu */
	text-align:right;
	z-index: 10;
	}
	
div#sec_link a{
	display: block;
	padding: 0 10px 0 10px; /*creates space around the main menu items text */
	text-decoration: none;	 /* removes the underlining of the link */
	color: #fff;	/* sets the type coluor */
	}
	
div#sec_link a:hover {
	color: #9999ff; /* sets the rollover type colour */
	text-decoration: underline; /* removes the underlining of the link */
	}		
	
/* the menu ends here */

/* the drop-down starts here */

div#listmenu ul li ul {
	margin: 0; 
	z-index: 100; /* puts drop-down on top of div - safari needs this as menu is 1px higher */
	position: absolute; /* positions the drop-down ul in relation to its relatively positioned li parent */
	width: 100%; /*sets the width of the menu - in combo with the lis 100% width, makes the menu stack note changed this from 10em */
	border-right: 0px none; /* stops scbs drops having two right borders - they inherit the border, ie doesnt */
	left: -1px
	}

div#listmenu ul li ul li {
	padding: 0;
	width: 100%; /* makes the list items fill the list container (ul) */
	background-color: #0066cc;
	border-left: 1px solid #fff; /* three sides of each drop-down item */
	border-bottom: 1px solid #fff;
	border-right: 1px solid #fff;
	}

div#listmenu ul li ul li a {
	padding: 3px 10px; /*creates space around the drop-down menu items text */
	line-height: 1.4em;
	}

div#listmenu ul li ul li:first-child {
	border-top: 1px solid #fff; /* the top edge of the dropdown */
	border-left: 1px solid #fff; /* stops inherit of parent uls first-child left border! */
	}
	

/* make the drop-down display as the menu is rolled over */

div#listmenu ul li ul {
	display: none; /* conceals the drop-down when menu not hovered */
	}

div#listmenu ul li:hover ul {
	display: block; /* shows the drop-down when the menu is hovered */
	}

/* pop-out starts here */

body div#listmenu ul li ul li ul  {
	position: absolute; 
	visibility: hidden; /* same effect as display:none in this situation */
	top: -1px;
	left: 10em;
	}

div#listmenu ul li ul li ul a {
	background: none;
	}

div#listmenu ul li ul li:hover ul {
	visibility: visible; /* same effect as display:block in this situation */
	}

/* second level popouts start here*/

div#listmenu ul li ul li:hover ul li ul {
	visibility: hidden;
	}

div#listmenu ul li ul li ul li:hover ul {
	visibility: visible; /* same effect as display:block in this situation */
	}

/* THE HACK ZONE - */

/* hack for ie (all flavors) so the menu has a vertical line on the left */

/* html div#listmenu ul {
	float: left; /* makes the ul wrap the lis 
	border-left: 1px solid #fff; /* adds the leftmost menu vertical line to the ul
	} */

/* add a top line to drops and pops in ie browsers - cant read :first-child */

* html div#listmenu ul li ul {
	border-top: 1px solid #fff;
	border-left: 0px; /* stops the drop inheriting the ul border */
	}

/* the tantek hack to feed ie win 5.5-5.0 a lower value to get the pop-out to touch the drop-down */

* html div#listmenu ul li ul li ul { 
  left: 9.85em; 
  voice-family: "\"}\""; 
  voice-family: inherit;
  left: 10em;
  }

/* and the be nice to opera rule */

html>body div#listmenu ul li ul li ul {
  left: 10em;
} 

/* an opera-only hack to fix a redraw problem by invisibly extending the ul */
/* the first-level drop stays open for 100px below the bottom but at least it works */
/* this can be reduced to as little as 22px if you dont have pop-outs */
/* the pop-out menu stays open for 22px below the bottom but at least it works */

@media all and (min-width: 0px){
   body div#listmenu ul li ul {padding-bottom:100px;}
   body div#listmenu ul li ul li ul {padding-bottom:22px;}
   ul li ul li ul li ul li:hover {visibility:visible;} /* same effect as display:block in this situation */
   }

/*end opera hack */

/* end of hack zone */

/* the drop-down ends here */

/* end of list-based menu */