body, html	{padding:0; 
                 margin:0; 
                 border:0;}

body  {font-family: verdana, arial, sans-serif;
       font-size: small;
       margin-bottom: 0.5em}

a:link {color: #003366;
         text-decoration: none}
a:visited {color: #003366;
         text-decoration: none}
a:hover {color: #003366;
         text-decoration: underline}
a:active {color: #003366;
         text-decoration: none}

div {background: transparent;
     padding: 0;
     border: 0;
     margin: auto;
     text-align: center;
     clear: both}

span.skip {width: 2em}

a.skip {color: #FFFFFF;
        margin: 0;
        padding: 0;
        float: left}

div.main {border: 0.1em solid #333366;
          width: 90%;
          padding: 0.5em;
          color: #333366;
          text-align: left;
          margin-bottom: 1.5em}

.main a {color: blue;
         text-decoration: underline}
.main a:visited {color: purple;
         text-decoration: underline}


.main a {margin: 0}

div.headfoot {width: 90%;
              padding: 0.5em;
              padding-top: 0.2em;
              padding-bottom: 0.2em;
              color: white;
              background-color: #6699CC;
              margin-bottom: 1em}

div.menu {width: 90%;
          padding-left: 0.5em;
          padding-right: 0.5em;
          font-weight: bold;
          margin-bottom: 1.5em;
          background-color: #99CCFF}

div.banner {margin-bottom: 1.5em}

div.base {color: #999999;
          font-size: x-small}

.left {float: left}
.right {float: right}

img {border: 0;
     margin: 0;
     padding: 0}
                
h1 {font-size: xx-large;
    text-align: center;
    color: #003366;
    border: 0;
    margin: 0}

h2 {font-size: medium;
    font-weight: bold;
    margin: 0;
    color: #6699CC}

q {font-weight: bold;
   text-align: center;
   color: #333366;
   quotes: none}
q:before, q:after {content: " "}

strong {font-weight: bold}

em {font-style: italic}

/* The margin, padding and text-indent bits in the ul are to make the menu centered in Firefox.  It's to do with list indents.  See 'A List Apart' site. */


ul.menu {display: block;
    background-color: #99CCFF; 
    margin: auto;
    margin-left: 0;
    padding-left: 0.1em;
    text-indent: -0.1em;
    padding: 0;          
    padding-top: 0.2em;
    padding-bottom: 0.2em}

li.menu {display: inline;
         position: relative;
         list-style-type: none;
         color: #003366;
         text-align: center}

li.menu:hover ul.sub {display: block}
	
ul.sub {display: none;
        position: absolute;
        left: -2.7em;
        top: 1em;
        width: 12em;
        z-index: 2;
        background: transparent;
        padding-left: 0;
        text-indent: 0}

/* Width on sub menu needed, otherwise menu will only stay up when you hover over the links themselves. */

/* Margins produce white gaps between links.  Use empty li and the menu won't stay up and line breaks don't work.  Padding all I know that works to space out. */

li.sub {padding-top: 1em;
        padding-right: 0;
        width: 12em;
        display: block;
        background-color: #99CCFF}

li.base {padding-bottom: 1em}

@media print {
              body, div, .main a:link, .main a:visited, .main a:hover, .main a:active, h1, h2 {font-family: "times new roman", times, serif;
              font-size: 12pt;
              color: #000000}
              div.headfoot, div.menu, div.setsize, div.base, a.skip {display: none}
              h1 {font-size: 18pt}
              ul.menu, li.menu {display: none}
              div.main {margin-top: -20px;
                        margin-bottom: -20px;
                        border: 0;
                        color: #000000}
             }