body {
	margin:0;
	padding:0% 1% 1% 1% ;
	width:98%;
	background:#003300;
	min-width:800px;		/* Minimum width of layout - remove line if not required */
					/* The min-width property does not work in old versions of Internet Explorer */
	font-size:80%;
	font-family: Verdana, Arial, Helvetica, “Trebuchet MS”, Tahoma, Geneva, “Lucida Sans Unicode”, “Lucida Grande”, “MS Sans Serif”, sans-serif;
	
}

ul {margin-left: 1.5em; padding-left: 0;}

hr {
border: 0; 
height: 1px; 
border-bottom:3px dotted #68B624; 
width:150px; 
text-align:left;
margin-left:8px;
}


#article {
margin-left:8px;
font-size:70%;
border-bottom: 2px solid #dadada; 
  }
 
a:link       { text-decoration: none; color: #red; }
a:visited    { text-decoration: none; color: #red; }
a:hover      { text-decoration: none; color: #00FF00;}



h1 {
	font-size:150%;
	margin:.1em 0 .3em 0;
	padding:0;
}

h2 {
	font-size:140%;
	margin:.1em 0 .1em 0;
	padding:0;
}

h3 {
	font-size:110%;
	margin:.1em 0 .1em 0;
	padding:0;
}


p {
	margin:.4em 0 .8em 0;
	padding:0;
}


.balloonstyle{
position:absolute;
top: -500px;
left: 0;
padding: 5px;
visibility: hidden;
border:1px solid black;
font:normal 11px Verdana;
line-height: 13px;
z-index: 100;
background-color: white;
width: 230px;
/*Remove below line to remove shadow. Below line should always appear last within this CSS*/
filter: progid:DXImageTransform.Microsoft.Shadow(color=gray,direction=135,Strength=5);
}

#arrowhead{
z-index: 99;
position:absolute;
top: -500px;
left: 0;
visibility: hidden;
}

#header {
	float:left;
	width:100%;
	padding:0;
	margin:0;
	}

#header a:link       { text-decoration: none; color: #FFFFFF; }
#header a:visited    { text-decoration: none; color: #FFFFFF; }
#header a:hover      { text-decoration: none; color: #00FF00;}

#header p {
	padding:.5em 15px	.2em 15px;
	margin:0;
}
#header h1  {
	padding:.1em 15px;
	margin:0;
}
#header h2  {
	padding:.1em 15px .7em 15px;
	margin:0;
}


#footer {
	clear:both;
	float:left;
	width:100%;
	padding:0;
	margin:0;
	border-top:1px solid #000;
}

#footer p {
margin:.4em 0 .8em 0;
	padding:0px;
		font-size:80%;
}

#footer a:link       { text-decoration: none; color: #FFFFFF; }
#footer a:visited    { text-decoration: none; color: #FFFFFF; }
#footer a:hover      { text-decoration: none; color: #00FF00;}

#colmask a:link       { text-decoration: none; color: #003300; }
#colmask a:visited    { text-decoration: none; color: #003300; }
#colmask a:hover      { text-decoration: none; color: #00FF00;}


#colmask 
{
  	margin:0;
	padding:0.1% 1% 0.1% 1% ;
	width:98%;
  color: black;
  position:relative;	/* This fixes the IE7 overflow hidden bug and stops the layout jumping out of place */
	clear:both;
	float:left;
	overflow:hidden;		/* This chops off any overhanging divs */
  
  /* Rounded corner stuff starts here */
  background-color:#C9DECB;
  -webkit-border-radius: 10px;    /* for Safari */
  -moz-border-radius: 10px;       /* for Firefox */
 }


<!--[if gte IE 7]>

#colmask 
{
  margin:0;
	padding:0.1% 1% 0.1% 1% ;
	width:98%;
  color: white;
  position:relative;	/* This fixes the IE7 overflow hidden bug and stops the layout jumping out of place */
	clear:both;
	float:left;
	overflow:hidden;	}

#colmask  > .tl, #colmask  > .tr, #colmask  > .bl, #colmask  > .br
{
  width: 10px;
  height: 10px;
  position: absolute;
}

#colmask  > .tl
{
  background: url(images/tlcorn.gif) top left no-repeat;
  top: 0;
  left: 0;
}

#colmask  > .tr
{
  background: url(images/trcorn.gif) top right no-repeat;
  top: 0;
  right: 0;
}

#colmask  > .bl
{
  background: url(images/blcorn.gif) bottom left no-repeat;
  bottom: 0;
  left: 0;
}

#colmask  > .br
{
  background: url(images/brcorn.gif) bottom right no-repeat;
  bottom: 0;
  right: 0;
}


<![endif]-->

#colmask a:link       { text-decoration: none; color: #003300; font-weight: bold;}
#colmask a:visited    { text-decoration: none; color: #003300; font-weight: bold;}
#colmask a:hover      { text-decoration: none; color: #00FF00;}

#colmask .boldlink a:link       { text-decoration: none; color: #003300; font-weight: bold;}
#colmask .boldlink a:visited    { text-decoration: none; color: #003300; font-weight: bold;}
#colmask .boldlink a:hover      { text-decoration: none; color: #00FF00;}


ul#toc {
	height: 2em;
	list-style-type: none;
	margin: 0px;
	padding: 0px 0px 0px 10px;
}

ul#toc a {
	background: url(images/tabs.gif) 100% 0;
	color: #008;
	float: left;
	line-height: 2em;
	outline: none;
	padding-right: 10px;
	text-decoration: none;
}

ul#toc li.current {
	background-color: #48f;
	background-position: 0 -60px;
}

ul#toc li.current a {
	background-position: 100% -60px;
	color: #33CC33;
	font-weight: bold;
}

ul#toc li a:hover{ /*hover state CSS*/
color: #00FF00;
background-color: #F3F3F3;
}

ul#toc li {
	background: #bdf url(images/tabs.gif);
	float: left;
	margin: 0 1px 0 0;
	padding-left: 10px;
	list-style-type: none;
}


.tocmenu{
width: 140px; /*width of menu*/
}

.tocmenu ul{
list-style-type: none;
margin: 0;
padding: 0;
margin-bottom: 2px; /*bottom spacing between each UL and rest of content*/
}

.tocmenu ul li{
padding-bottom: 1px; /*bottom spacing between menu items*/
}

.tocmenu ul li a{
color: #003300;
background: url(images/arrowbullet.png) no-repeat center left; /*custom bullet list image*/
display: block;
padding: 2px 0;
padding-left: 19px; /*link text is indented 19px*/
text-decoration: none;
font-weight: bold;
border-bottom: 1px solid #dadada;
font-size: 90%;
}

.tocmenu ul li a:visited{
color: #00FF00;
}

.tocmenu ul li a:hover{ /*hover state CSS*/
color: #00FF00;
background-color: #F3F3F3;
}

.tocmenu ul ul li a{
list-style-type: none;
color: #003300;
background: url(images/arrowtab.gif) no-repeat center left; /*custom bullet list image*/
display: block;
padding: 2px 0;
padding-left: 30px; /*link text is indented 19px*/
text-decoration: none;
font-weight: normal;
border-bottom: 1px solid #dadada;
font-size: 90%;
}