#container {
  width: 100%;
  margin: 0;
  padding: 0;
  background-repeat: no-repeat;
  background-attachment: scroll;
  font-family: "trebuchet ms", tahoma, sans-serif;
}

h1, h2, h3, h4, h5, h6, h7, h8 {margin: 0; font-weight: bold;}
h1 {font-size: 250%; padding: 0.5em 0; text-align: right;}
h2 {font-size: 150%;  padding: 0.5em 0;  text-align: right;}
h3 {font-size: 115%;  padding: 0;}
h4 {padding: 0;  font-size: 110%; text-decoration: underline;}
h5 {padding: 0;  font-size: 110%;}
h6 {font-size: 150%;  padding: 0.5em 0;  text-align: left;}
h7 {font-size: 150%;  padding: 0.5em 0;  text-align: center; text-decoration: underline;}
h8 {font-size: 200%;  padding: 0.5em 0;  text-align: center; text-decoration: underline;}
p  {text-align: justify;}

#top {  padding: 0;  border-bottom: 1px;}

#header {
  margin: 0 0 7px 0; 
  /* bottom margin 7px results in spacing tabs nicely (5px too small, 10px too big)*/
  padding: 5px;
  text-align: right;
  border-bottom-style: solid;
  border: 2px;
  /* the display of ombudsman logo made part of the style of header of each page */
  background: url("./images/logo.gif") no-repeat;
  background-position: center left;
}

#leftnav {
  position: absolute;
  left:10px;
  top:195px; 
  /* columns start under #top area & do not overlap it. Effectively stating that #top will be < 195px in height. If #top is larger, then the columns will overlap it. 
Adjust this value to control relative positions of #top and 3 content columns.
Note that if a column contains a structured entity e.g. a menu box, column width adjustments alone will not necessarily effect changes within any structured entity */
    width: 200px;
    /* determines column width. Adjust this value (in each column definition) to control relative widths of columns */
    margin: 0;
    padding: 0;
    text-align: center;
}

#rightnav {
    position: absolute;
    right:5px;
    top:195px;
    /* columns start under #top area & do not overlap it. Effectively stating that #top will be < 195px in height. If #top is larger, then the columns will overlap it. 
Adjust this value to control relative positions of #top and 3 content columns */
    width:190px;
    /* determines column width. Adjust this value (in each column definition) to control relative widths of columns */
    margin: 0;
    padding: 0;
    text-align: center;
}

#content {
  margin-left: 206px;
  border-left: 1px;
/* left and right margin delineate column and determine width - values from LHS & RHS fixed. Actual width determined by size of user's browser window. Adjust these values (in each column definition) to control relative widths of columns */
  margin-right: 200px;
  border-right: 1px;
  padding: 0;
  voice-family: "\"}\"";
/* fudge so that IE behaves like a web browser! Without this the centre column displays below the other two */  
  voice-family: inherit;
}

#bottom {
clear: both;
margin: 0;
padding: 0;
border-top: 1px;
}

#footer {
font-size: 90%; 
font-weight: normal;
padding: 0.5em;
text-align: center;
border-bottom-style: solid;
border: 2px;
}

#bottom span {
position: relative; 
font-weight: normal;
font-size: 70%;
}

/* Definitions below are for implementing tabs - I amended code from Joshua Kaufman's simple tab implementation */

#tabnav a {
float : left;
display: block;
text-decoration: none;
padding: 1.75px /* right in I.E. not Firefox. BUT, at 5px it looks just right in Mozilla & tabnavs hang below bounding line in IE */
}

#tabnav a:hover, #tabnav a:active {
cursor: pointer;
}

ul#tabnav {
  font: bold 15px "trebuchet ms", tahoma, sans-serif;
  list-style-type: none;
  padding-bottom: 27px;
  border-bottom: 1px solid;
  margin: 12px 12px 25px 12px;
}

ul#tabnav li {
float: left;
height: 25px;
margin: 3px 3px 0 3px;
border: 1px solid;
}


/* Definitions below are for implementing menus */
.menuBox {
margin-top: 10px;
    /* 10px good for IE but 15px gives good spacing for Mozilla Firefox, etc. */
  width: 180px;
  border-style: solid;
  border-width: 3px;
  padding: 0;
}

.menuBox p {margin: 3px; text-align: center; font-size: 90%;}

.menuBox a, .menuBar a:hover, .menuBar a:visited {
    text-align: left; 
    /* text-decoration: underline; */
	font-weight:bold    
    line-height: 1.2em;
    padding: 5px;    
    display: block;
    cursor: pointer;
}