body {
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: left; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #000000;
	background-color: #FFFFFF;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 100%;
}

.mainbody {
	margin: auto;                      /* We want the banner to be centred on the page - we need both of these to do it */
/*	width: 720px;                     /* the auto margins (in conjunction with a width) center the page */
  padding: 0px 5px 0px 5px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 80%;
}
	
.mainbody img {
  max-width: 99%;
}

.mainbody a {
	text-decoration: none;
	font-weight:bold;
	color:#000000;
}

.redblock {
  height:28px;
  background-color:#FF0000;
  font-weight:bold;
	color:#FFFFFF;	
	padding-top:10px;
}

.greenblock {
  height:28px;
  background-color:#00CC00;
  font-weight:bold;
	padding-top:10px;
}

.amberblock {
  height:28px;
  background-color:#FF9900;
  font-weight:bold;
	padding-top:10px;
}

.mainbody a:hover {
  text-decoration: underline;
}

footer {
  margin: auto;                      /* We want the banner to be centred on the page - we need both of these to do it */
/*  width: 720px;                     /* the auto margins (in conjunction with a width) center the page */
  padding: 4px 4px 4px 4px;         /* Adds the background above and below.  */
  background:#DDDDDD;
  font-size: 60%;
  border-radius: 8px;
  /*clear:both; /*  This gets the footer pushed down to the bottom of the page - not sure how*/
}