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:Calibri;
  font-size: 110%;
}

header {
  text-align:center;                  
  margin: auto;                      /* We want the banner to be centred on the page - we need both of these to do it */
  width: 960px;                      /* the auto margins (in conjunction with a width) center the page */
  padding: 2px 0px 2px 0px;         /* starts with top, right, bottom, left */
  background-color: #7EB16F;         /* sets the background to blue */
  border-radius: 8px;
}

.mainbody {
  margin: auto;                      /* We want the banner to be centred on the page - we need both of these to do it */
  width: 960px;                      /* the auto margins (in conjunction with a width) center the page */
  font-size: 90%;
  background-color: #FFFFFF;         /* sets the background to blue */
  padding: 0px 10px 0px 10px;
}

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

.tablelink a { /* used in tables with hyperlinks as bold is too powerful */
  font-weight:normal;
	color:#00008B;
}

.tablelink a:hover { /* used in tables with hyperlinks as bold is too powerful */
  text-decoration: underline;
}


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

figcaption {
  font-size: 85%;
  font-style:italic;
}

.blackline {  /* provides a horizontal black line - for use as a divider */
  height: 6px;
  padding-left:4px;
  background-color:#000000;
  font-weight:bold;  
}

.mainbody input[type=text] {
  border-color:#CCCCCC;
	border-radius: 6px;
  border-style:solid;
  height:24px;
  padding-left: 6px;
  padding-right: 6px;
}

.mainbody input[type=text]:focus {
  border-color:#0000CC;
}

.mainbody input[type=email] {
  border-color:#CCCCCC;
  border-radius: 6px;
  border-style:solid;
  height:24px;
  padding-left: 6px;
  padding-right: 6px;
}

.mainbody input[type=email]:focus {
  border-color:#0000CC;
}

.mainbody input[type=password] {
  border-color:#CCCCCC;
  border-radius: 6px;
  border-style:solid;
  height:24px;
  padding-left: 6px;
  padding-right: 6px;
}

.mainbody input[type=password]:focus {
  border-color:#0000CC;
}

.mainbody input[type=submit] {
  border-color:#CCCCCC;
  background:#ccc; 
  border:0 none;
  cursor:pointer;
  height:30px;
  -webkit-border-radius: 5px;
  border-radius: 5px; 
  padding-left: 20px;
  padding-right: 20px;
}

.mainbody input[type=file] {
    background:#ccc; 
    border:0 none;
    cursor:pointer;
    -webkit-border-radius: 5px;
}

.mainbody input[type=file] {
  border-color:#0000CC;
}

.mainbody select {
  border-radius: 6px;
  border-style:solid;
}

.mainbody textarea {
  border-color:#CCCCCC;
  border-radius: 6px;
  border-style:solid;
	font-family:Arial, Helvetica, sans-serif;
	font-size:90%;
  padding-left: 6px;
  padding-right: 6px;
	padding-top: 10px;
	padding-bottom: 10px;
}

.mainbody textarea:focus {
  border-color:#0000CC;
}

.mainbody select:focus {
  border-color:#0000CC;
}

.formrightcol {
  font-size: 85%;
  font-style: italic;
  vertical-align:top;
  text-align:left;
}

.formleftcol {
  font-size: 90%;
  vertical-align:top;
  text-align:right;  
}

.formmidcol {
  font-size: 90%;
  vertical-align:top;
  text-align:left;  
}

/* <====== membermenu ========> */

/* Standard banner for members only pages */

.membermenu {
  margin: auto;                      /* We want the banner to be centred on the page - we need both of these to do it */
  width: 100%;                     /* the auto margins (in conjunction with a width) center the page */
} 

.membermenu table {
  margin: 4px 0px 4px 0px;
  background-color: #696969;
  border-radius: 8px;
  width: 100%;                     /* the auto margins (in conjunction with a width) center the page */
}

.membermenu tr {
  height: 42px;
}

.membermenu td {
  vertical-align:middle
  color:#111111;
  text-decoration: none;
}

.membermenu td a {
  color: white;
  text-align: center;
  padding: 2px 2px;
  text-decoration: none;
}

.membermenu td a:hover {
  background-color: #111;
}

/* <====== linkstable ========> */

/* Used for a page with links */

.linkstable {
  width:100%;
  border: 0;
}

.linkstable a {
  text-decoration: none;
  font-weight:bold;
  color: #111111;
}

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

.linkstable tr:hover {background-color: #f5f5f5}

.linkstable td {
  padding: 10px 10px 10px 10px;
  text-align:left;
  vertical-align:top;
}

.LeftLinkCol {
  width: 200px;
  padding-right: 20px;
}

footer {
  margin: auto;                      /* We want the banner to be centred on the page - we need both of these to do it */
  width: 960px;                     /* 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;
}

footer a { /* This is for a link within the footer whicjh sets it to bold*/
  text-decoration:none;
  color:#000000;
  font-weight:bold;
}

footer a:hover { /* This is used when a link is hovered over - the link is underlined */
  text-decoration: underline;
}