body {  
        background: #eeeeee; /* grey - this is a retro 90s site */
        background-position: top left; /* fixed site name image */
        background-attachment: fixed;
        background-repeat: no-repeat;
        background-image: url(images/palmtop.gif);
 /*	color: #003333;  sort of black with green tinge */
        color: green; /* have I missed setting a colour somewhere? */
	font-family: Helvetica, Arial, sans-serif; /* H nicer than A */
	font-size: 100%;
        font-weight: normal;
	margin: 0;
	padding: 0;
	width: 100%; /* will this supress a scroll bar in IE? */
	}

/* ToDo: all the headings (except links) look alike for now */
h1,h2,h3,h4,h5,h6 {    
	color:#666666;
        background: #ffffcc;
        }

/* p:first-letter {font-size: 120%;        color: green;        } */

/* ToDo: Most browsers except IE will style abbreviations anyway */
acronym { }
abbr { border-bottom: 1px dotted #000; }
dfn { }

/* Defaults - No underline on most links, nor visited links. 
Reverse the link colours when we activate a link */ 
a:link  { text-decoration: none;
	}
a:visited { text-decoration: none;
	}
a:hover { color: white; background: blue; text-decoration: underline;
        }
a:active { color: white; 
	background: green;
	}

/* dl not used in this file so far */
dl {    font-family: Helvetica, Arial, sans-serif;
        }

dt {    color: red;
        background: transparent; /* colour stuffs up everything in some other file */
        font-family: Helvetica, Arial, sans-serif;
        font-weight: bold;
        font-style: italic;
        }

dd  {	font-family: Helvetica, Arial, sans-serif;
        font-weight: normal;
        font-style: normal;
        }

/* Image no longer inline, centered in div by auto */
img	{
	
	border-style: outset;
	display: block;
	margin-left: auto;
	margin-right: auto;
	}

/* HEADER and FOOTER                                             */
/* header, footer fixed position, fails to bottom in IE6 I hope */
#footer, #header {	
        background: #eeeeee;
	color: red; /* mostly link separators */
	margin: 0;
        padding: 0.2em 1em 0.2em 1em; /* top right bottom left */
	width: 99%;
        }

#footer {
        border-top: 2px solid #993300;
	font-size: 1em; /* larger for arrows plus current page */
	position: fixed; bottom: 0; left: 0;
	}
#footer ol {
	display: inline; /* address on same line Opera Safari NotFirefox */
	list-style-type: none;
	margin: 0; padding: 0;
/*	padding: 0 2em 0 0 ;  top right bottom left - width is wrong */
	}

#footer li {
	display: inline; /* keep list items in one line */
	margin: 0; padding: 0;
	}

#footer a { font-size: 0.9em; } /* only on navigation */
#footer li:before { content: "-> "; } /* arrow symbol between links */ 
#footer li:first-child:before { content: ""; } /* except on first */

/* ADDRESS is in the FOOTER, on right */
address {
	display: inline; /*  Try to get inline in Firefox?  */
	float: right;
        padding-right: 2em; /* I don't understand width problem */
/*  This will fix position in Firefox, but why is it needed?
padding: 0.2em 1em 0.2em 1em;  top right bottom left 
position: fixed; bottom: 0; right: 0;
*/
	}

#header {	
        border-bottom: 2px solid #993300;
	font-size: 0.9em; /* over-ride default 1em */
	position: fixed; top: 0; left: 0;
	text-align: center;        
	width: 97%; } /* However then the border is not the width of page */

#header ol {
list-style-type: none;
margin: 0;
padding: 0 2em 0 0 ; /* top right bottom left - width is wrong somehow  */
	}

#header li {
display: inline;
margin: 0;
padding: 0;
	}

#header li:before { content: "| "; } /* Pipe symbol except on first */
#header li:first-child:before { content: ""; }

/* The current folder is floated right and marked >> in the header */
#folder { display: inline; float: right; }
#header #folder:before { content: ">> "; }

/* MAINTEXT CONTENT                                         */
.maintext {	
/*	border: thin red solid; */
	background: #ffffcc;
	color: #003333;
float: left; /* test only */
	margin-left: 3em;
	margin-right: 7em;
	max-width: 35em; /* Doesn't work in IE, but harmless */
	padding: 1em;
	}

/* No underline on header, footer, nav - only in maintext */
.maintext a:link  { background: #ffffcc; color: #003333; text-decoration: none;
	}
.maintext a:visited  { text-decoration: none;
	}
.maintext a:hover { background: blue; color: white; text-decoration: underline;
	}
.maintext a:active  { background: green; color: white; text-decoration: underline;
	}


/* NAV - Local navigation sidebar within this section     */
/* nav fails totally in IE6 - try float right?            */

.nav {
	border: thin green solid;  /* for testing only */
	float: right; /* try to get IE6 to co-operate */
        font-size: 0.9em; /* nav fonts slightly smaller */
	margin: 0;
        margin-left: auto; margin-right: auto; /* center it? */
	 /* overflow: hidden; else Firefox shows scroll bars */
        padding: 0 0.1em 0 0.2em; /* top right bottom left */
        position: fixed;  
	right: 1em; /* give it some margin */
        top: 3em;
/*	width: 6em;  should I set width here or on nav a ? */
        }
/* style as ordered list for semantic reasons */
.nav ol {
	margin: 0;
	padding: 0;
	}
.nav li	{ 
	list-style-type: none;
	margin: 0 0 0.25em 0; /* space at bottom between items */
	position: relative; }

.nav a  {
	background: #ccc;
	border: outset;  /* fancier appearance */
	display: block;
	text-align: center; 
	text-decoration: none; /* no underline */
	width: 6em;  /* Where do I set width? Here or .nav ? */
	}

.nav a:link { 
	text-decoration: none;
	}
.nav a:visited { 
	text-decoration: none;
	}
.nav a:hover { 
	background: blue;
	color: white;
	text-decoration: underline;
	}
.nav a:active { 
	border: inset;  /* fancier appearance */
	color: white;
	background: green; 
	text-decoration: underline;
	}

/* Experimental */
.nav li ul {  display: none; position: absolute;  /* visibility: hidden; */
    }
/* .nav li:hover ul { position: absolute; left: -9em; top: 0em; visibility: visible;  z-index: 10;
    }  This may work less broken for IE?  Opera can't cope anyhow
*/
.nav li:hover>ul { display: block;  position: absolute; left: -8em; top: 0em; /* visibility: visible; */ z-index: 10;
    }


.best   {color: #999999;
        background: #eeeeee;
        font-weight: bold;
        font-style: italic;
        font-size: 115%;
        clear: left;
        }

.first  {color: red;
        background: #ffffcc;
        font-weight: bold;
        font-size: 115%;
        clear: left;
        }

.site   {color: red;
     /*   background: #ffffff; */
        font-weight: bold;
        font-size: 200%;
        clear: right;
        }

.nocss  {
        display: none;
        }