
/*   Tonne Software styles
     23 Feb 14 - add .pad and .shadow
     10 Mar 07 - buttons simplification
     17 Nov 06  - removed scrollbar definitions   
     4 June 2004 - first used    */

td {
   padding: 10px;
}

li {
   list-style-type: disc;
   list-style-position: inside;
} 
        
.back {                      /* pale cyan background */
background-color: #f0ffff;
}
	 
.pad {         /* padding around text, inside <td> */
padding: 18px;
}

.shadow {      /* typically around a graphic */
box-shadow: 5px 5px 5px #333377;
}	 
	 
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:140px; 
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:140px; 
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: 140px;}

.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:140px;
}

.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:140px;
}

.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:140px; 
background:#9ff; 
color:#00c;
}

.menu ul li:hover ul li:hover ul li a:hover {
background:#fff;
}  /* level 3 mouseover */ 
     
     
body, html{
font-family: arial, helvetica, sans-serif;
font-size: 100%;
color: #008;
background-color: #ffffff;
/* 
background-image: url('graphics/background2.gif');
background-repeat: repeat-y;
*/
}

li.check{                                        /* checkmark */
list-style-image:url(graphics/checkgreen.png);   /* was check.gif */
}

li.no{                                           /* X */
list-style-image:url(graphics/checkred.png);     /* was no.gif */
}

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

.font1 {                    /* big, white bkgnd */
font-size: 200%;
font-family: serif, monospace;
color: #008;
background: #ffffff;
}

.font2 {                    /* sorta big, white bkgnd */
font-size: 140%;
font-family: serif, sans-serif;
color: #008;
background: #ffffff;
}

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

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

#button a {
display: block;
background-color: #dee;     /* fed idling main background */
color: #00c;                /* 900 idling text */
width: 100px;
height: 40px;
margin: 1px;
text-decoration: none;
}

#button a:hover {
display: block;
background-color: #fed;     /* eff mouseover background */
color: #900;                /* 00c mouseover text */
width: 100px;
height: 40px;
margin: 1px;
text-decoration: none;
}

