body {
	background-color: #99CC33;
	font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
	color: #055168;
	font-size: 90%;
	margin-bottom: 0%;
	margin-left: 0%;
	margin-right: 0%;
	margin-top: 0%;


}


a, a:visited, a:active, a:link, a:hover {
	color: #CCFF33;
}

a.menu, a.menu:visited, a.menu:active, a.menu:link, a.menu:hover {
	color: #ffffff;
}


h1{
	font-weight: bold;
	font-size: 140%;
}

h2{
	font-weight: bold;
	font-size: 120%;

}

td.menu {
	font-size: 90%;
	color: #ffffff;
	text-align: center;
	padding-top: 5px;
	padding-bottom: 5px;
	width: 124px;
	border-bottom: 1px solid #99CC33;
}

td.menu-on {
	font-size: 90%;
	font-weight: bold;
	background-color: #99CC33;
	color: #055168;
	text-align: center;
	padding-top: 5px;
	padding-bottom: 5px;
	width: 124px;
	border-bottom: 1px solid #99CC33;
	border-left: 1px solid #055168;
	
}



/* Optional Code */

body { margin: 0; padding: 0; color: #055168; background-color: #99CC33; text-align: left; font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif; font-size: 86%; }
p  { font-size: 1em; }
h1 { font-size: 1.3em; font-weight: normal; }

h2 { font-size: 1em; font-weight: bold; }
ul { padding-right: 1em; text-align: left; margin-bottom: 1em; }
.right { font-style: italic; }
.normal { font-style: normal; }

.outbox { padding: 1em; text-align: center; }
.outbox a { display: block;
background: #fff;
width: 50%;
padding: 1em;
margin: 0 auto;
}

.outbox a:hover {  }

.wrapper { min-width: 400px; }
          /* Allways good to have on full width liquid CSS layouts, 
             google "min-width IE" for JS solutions there */

/* Setup (This all looks neater when it isn't put on display!) */

.wrapper {
	width: 768px;               /* total width */
}      

.outer {
	border-left-width: 124px;  /* left column width */
	border-left-color: #055168;   /* left column colour */
	
	border-right-width: 200px; /* right column width */
	border-right-color: #99CC33;  /* right column colour */
	
	background-color: #99CC33; /* center column colour */
}

.left {
	color: #99CC33;
	width: 124px;              /* left column width */
	margin-left: -124px;       /* _negative_ left column width */
}

.right {
	width: 200px;              /* right column width */
	margin-right: -200px;      /* _negative_ right column width */
}

.wide {
	background-color: #055168;
	border: 1px solid #99CC33;
	height: 124px;    /* header and footer colours */
}

.wide2 {
	border: 1px solid #99CC33;
	background-color: #ffffff;
	height: 84px;    /* header and footer colours */
}

/* Main code */

.outer { width: auto; border-left-style: solid; border-right-style: solid; }
.inner { margin: 0; width: 100%; }

.left { float: left; position: relative; z-index: 10; }
.right { float: left; position: relative; z-index: 1; }
.center {
	float: left;
	width: 440px;
	position: relative;
	z-index: 0;
	overflow: auto;
}

.wide { width: 100%; position: relative; z-index: 13; }

.clear { clear: both; }

/* Mozilla code */
.outer > .inner { border-bottom: 1px solid transparent; }
.left { margin-right: 1px; }
.right { margin-left: 1px; }
.right p { padding-left: 10px; }
.center { margin: 0 -8px 0 -2px; }

/*		------	:hover simulator for IE		------		*/
body { behavior:url("csshover.htc"); }

/*		------	Basic style	------		*/
#menu ul {
	margin: 0;
	padding: 0;
	border: 0;
	list-style-type: none;
}

#menu li {
	margin: 0;
	padding: 0;
	border: 0;
	width: 100%;
	display: block;
	float: left;
	position: static;
}
html>body #menu li {
	float: none;
	position: relative;
}

#menu li:hover {
	position: relative;
}

#menu a {
	float: left;/* \*/float: none;/*  */
	display: block;
}

#menu li ul {
	visibility: hidden;
	position: absolute;
	z-index: 10;
}


/* fix the position */
#menu li ul {
	top: 0;
	left: 100%;
}

/* simulate child selector for IE */
div#menu li:hover ul, #menu li:hover li:hover ul, #menu li:hover li:hover li:hover ul {
	visibility: visible;
}
#menu li:hover li ul, #menu li:hover li:hover li ul, #menu li:hover li:hover li:hover li ul {
	visibility: hidden;
}

/* do the normal show, with increased specificity */
#menu ul#menuList li:hover > ul {
	visibility: visible;
}

/*		------   Make-up	--------			*/

#menu {
	font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
	font-size: 14px;
	color: #000;
	display: block;
	width: 124px;
	height: auto;
	text-align: center;
	background-color: #055168;
	font-weight : bold;
}

#menu li ul {
	color: #000;
	background-color: #055168;
	width: 124px;
	line-height: 20px;
}

#menu a {
	font-family: Tahoma, Verdana, Arial, sans-serif;
	font-size: 90%;
	text-decoration: underline;
	color: #ffffff;
	border-bottom: 1px solid #99CC33;
	border-right: 1px solid #99CC33;
	vertical-align: middle;
	padding: 6px;
}

#menu li:hover {
	background-color: #99CC33;
	background-image: url(../arrow.gif);
	background-repeat: no-repeat;
	background-position: 98%;
}

#menu li ul a {
	padding: 4px 16px 5px 5px;

}

#menu li ul a.submenu {
	background-image: url(arrow.gif);
	background-repeat: no-repeat;
	background-position: 90%;
}

/*		------   Fixes		--------			*/






#menu {
	/* simply to avoid margin-collapsing... */
	margin-bottom: 10px;		/* ...and to have some space around the menu in the example */
}


