/* 18 Nov 09 - delete scrollbar colors */
/* 23 JUL 09 - switch to flyout buttons */
/* 23 May 04 - first-use */

a:link {
font-size: 100%;
color: #00f;
background-color: transparent;
text-decoration: none;
}

a:active {
font-size: 100%;
color: #00f;
background-color: transparent;
text-decoration: none;
}

a:visited {
font-size: 100%;
color: #00f;
background-color: transparent;
text-decoration: none;
}

a:hover {
font-size: 100%;
font-weight: normal;
color: #00f;
background-color: #8bf; 
text-decoration: none;
}

.menu {font-family: arial, sans-serif; 
       width: 200px;
       position: relative; 
       font-size: 100%;
       margin: 10px 0px;}         /* how far from top, how far from left */

.menu ul {padding:0;
          margin:0;}

.menu ul li {position: relative;}

.menu ul li a {display:block;   /* first level idling without prior to visit: */
      text-decoration:none; 
      color: #00c;
      width:200px; 
      height:25px; 
      text-align: center; 
      background: #9ff; 
      border: 1px solid #00f;      
      line-height:26px; 
      font-size:100%;}

.menu ul li a:visited {display:block; /* first level idling if visited */
      text-decoration:none; 
      color: #00c;
      width:200px; 
      height:25px; 
      text-align: center; 
      background: #9ff; 
      border: 1px solid #00f;         /* 00f border prior to mouseover */      
      line-height:26px;               /* top of button to text */ 
      font-size:100%;}

.menu ul li:hover a {color:#00c;        /* mouseover text color */
                     background: #fff;}  /* level 1 background mouseover */

.menu ul li ul {display: none;}

.menu ul li:hover ul {display:block;      /* this block kick out level 2 */
                      position:absolute; 
                      top: 0px;           /* vertical spacing against level 1 */
                      left: 201px;        /* level 2 left */
                      width: 200px;}

.menu ul li:hover ul li a.hide {background: #9ff; /* level 2 with more idling */
                                color:#00c;}

.menu ul li:hover ul li:hover a.hide {width:160px;}

.menu ul li:hover ul li ul {display: none;}    /* prevent premature appearance */

.menu ul li:hover ul li a {display:block;             /* level 2 flyout idling */ 
                           border: #00c;
                           background: #9ff;
                           color:#00c; 
                           width:200px;}

.menu ul li ul li a:hover {background: #fff;    /* level 2 (only) mouseover*/ 
                                 border: #00f;
                                 color:#00c;} 

.menu ul li:hover ul li:hover ul {display: block;     /* allows level 3 to appear */ 
                                  position: absolute; 
                                  left: 201px; 
                                  top: 0px;           /* top against level 2 */ 
                                  color: #00c;}

.menu ul li:hover ul li:hover ul li a {display:block; /* level 3 flyout */ 
                                       width:200px; 
                                       background:#9ff; 
                                       color:#00c;}

.menu ul li:hover ul li:hover ul li a:hover {background:#fff;}  /* level 3 mouseover */ 

body{color : #006;
     background : #eff;
     font-size : 100%;
     font-family : arial, helvetica, sans-serif;}

.menu {color: #f00;
       background-color : #eff;
       font-size: 100%;
       font-family: arial, helvetica, sans-serif;}

#banner {background-color: #eff;
         background-image: none;
         color: #00f;
         font-size: 100%;
         font-family: Georgia, "Times New Roman", Times, serif;
         height: 70px;
         margin: 5px 150px;
         voice-family: "\"}\"";}

html > body #banner {
height: 70px;
}

#banner h1 {
font-family: "Georgia", "Times New Roman", "Times", serif;
font-size: 200%;
padding: 10px;
margin: 10px;
text-align: center;
color: #00f;
background-color: #eff;
background-image: none;
text-decoration: none;
width: 150px;
voice-family : "\"}\"";
}

html > body #left {
width: 150px;
}

.copyright {
font-size: 60%;
font-family: arial, helvetica, sans-serif;
color: #00c;
background: transparent;
}

.font0 {                       /* small (legal/copyright) */
font-size: 80%;
font-family: arial, helvetica, sans-serif;
color: #008;
background: #fff;
}

.title {
font-size: 100%;
font-family: arial, helvetica, sans-serif;
color: #00f;
text-align: center;
background-color: #9ff;
}

h1 {
font-size: 250%;
color: blue;
font-family: Georgia, "Times New Roman", Times, serif;
text-align: center;
background-color: transparent;
}

h2 {
font-size: 150%;
color: blue;
font-weight: bold;
font-family: Arial, helvetica, sans-serif;
text-align: left;
background-color: transparent;
}

h3 {
color: blue;
font-size: 100%;
text-align: center;
background-color: #00f;
}

h4 {
color: blue;
font-size: 80%;
font-weight: normal;
background-color: transparent;
text-align: center;
}

.ruler1 {                        /* blue ruler */
height:2px;
width:500px;
color:#00f;
background-color:#fff;
}

.ruler2 {                        /* red ruler */
height: 2px;
width: 500px;
color: #f00;
background-color:#fff;
}