/* reset browser styles */
html, body, h1, h2, h3, h4, h5, h6, p, ol, ul, li, pre, code, address, variable, form, fieldset, blockquote
{ padding: 0;
margin: 0;
font-size: 100%;
font-weight: normal;}
ol { margin-left: 1.4em;
list-style: decimal; }
ul { margin-left: 0em;
list-style: square; }
img { border: 0;}
/* end reset browser styles */
body { } /* default is white background & no border around page Set background and border values if required */
.page { width: 960px;
font-family: verdana; /* font values are inherited */
font-size: 10pt; /* font values are inherited */
color: maroon; /* font values are inherited */
text-align:center;
margin-top:10px;
margin-bottom:10px;
margin-left:auto;
margin-right:auto;
background: #ffffcc; }
.logocell { width: 22%;
height: 140px; }
.titlecell { height :140px;
text-align: center;
vertical-align:middle;
background-color: red;
}
.page,
.logocell,
.titlecell,
.sidecol,
.narrative { border: 2px blue solid;
border-collapse:collapse;
table-layout:fixed}
.narrative { line-height: 166%;
text-align: left;
padding: 10px 10px 10px 15px; /*padding values are top, right, bottom, left */
vertical-align:top;
border-top:0;
border-bottom:0 }
.sidecol { font-family: Tahoma;
border-bottom: 0px;
border-top:0px;
font-size:10pt;
background: }
/* h1 for header titles and page heading, h2 for para headings. h3 for nav table (now superceded by ul.nav values)*/
h1, h2 { font-family: "Verdana";
font-weight: bold;
color: white;
background-color: blue; }
h1 { font-size: 12pt;
text-align:center; }
h2 { font-size: 10pt }
h3 { font-size: 10pt;
font-family: "Trebuchet MS";
font-weight: bold;
color: red }
.pagedate { font-family: "Verdana";
font-size: 10pt;
font-weight: normal;
color: maroon;
text-align: center; } /* for page creation date/page update*/
blockquote { margin-top: 1em;
margin-right: 1em;
margin-bottom: 1em;
margin-left: 1em;
line-height:150% }
/* the following is a pre-formatted text boxes used in the side columns to indicate points to note.
Standard background colour is yellow. Can be changed on the HTML page in td tag using class */
.comment { font-family: tahoma;
border: 1px maroon solid;
font-size: 10pt;
background-color: #fef886;
width: 90%;
text-align : center}
.toc { border: 1px maroon solid;
font-size: 10pt;
background-color: #fde2b8;
width: 90%;
text-align : left;
margin-left: 10px}
img { border: 0px maroon solid;
float: none; }
.highlight { background-color: #FFFF00;
font-weight:bold}
/* Do not change the cascade order of the next three tags (ie link, visited, hover) */
a:link { text-decoration :none;
font-weight:normal;
color:blue; }
a:visited { text-decoration :none;
color:blue}
a:hover { font-weight:normal;
text-decoration:underline; }
.center { text-align: center;}
.left { text-align: left }
.right { text-align: right }
.justify { text-align: justify }
.smltxt { font-size: 10pt }
.bold { font-weight: bold }
.red { color: red }
.white { background: white }
.lightcyan { background: lightcyan;}
.aqua { background: aqua }
.lime { background: lime }
.old { font-family: Century;
font-size:11pt}
.obit { color: black;
background-color:silver;
border-top: 1px black solid;
border-bottom: 1px black solid }
.black { color: black }
/* On this website:
'side-table' is a table with headings and cells ready-formatted in CSS on this sheet, used in the left or right colums used, generally, to show related pages
'data table' is a table used in the main (centre) column with cells needing some formatting on the HTML page (eg position, width, colour)
'link buttons' are horizontal navigation links at the top of each page, ready-formatted in CSS on the 'pagetop' style sheet
some formatting is common */
/* SIDE TABLES. st is 1 col table, st2 is 2 cols, c is a cell, h is a heading, hx and cx are for external sites. Position, width and colour are incorporated. */
.st {border: 1px maroon solid; border-collapse:collapse; text-align:left; text-indent:5px; background: #fdebcf }
.st,
.st-c ,
.st-h ,
.st-hx ,
.st-cx,
.st-cp {; font-size:10pt; height:25%; width:90%; line-height:150%; margin-left:5px }
.st-h { text-align:center }
.st-c, .st-cx, .st-cp {text-align:left; text-indent:5px; padding: 0 4px 0 4px}
.st-hx { background:#fbe2b8; text-align:center }
.st-cx { background:#fdebcf }
.st-cp {;font-weight: bold; color: white; background-color: blue}
/* DATA TABLES. the following codes are for data tables (dt) and data cells (dc) within tables. Position, width and background colour are set separately */
.dt,
.dc { font-family:Ebrima, Arial:;
border: 1px maroon solid;
background: #fffbc6;
border-collapse : collapse;
height:25px }
.dc { padding: 0 4px 0 4px}
.dt,
.st { table-layout:fixed} /* instructs browsers to make all columns same width as first row */
.dc { border: 1px maroon dotted }
ul.nav,
.listhead,
ul.heading, /* styles a ul header as a title for nav bars */
ul.nav li:hover ul, /* displays 2nd level when 1st hovered over. */
ul.nav ul.nav li:hover ul, /* displays 3rd level when 2nd hovered over. */
ul.nav ul.nav ul.nav li:hover ul, /* displays 4th level when 3rd hovered over. */
ul.nav ul.nav ul.nav ul.nav li:hover ul /* displays 5th level when 4th hovered over. */
{ font-family:Tahoma;
display: block;
list-style: none;
height: auto;
margin-left:auto;
margin-right:auto;
}
ul.nav,
.listhead,
ul.heading,
ul.nav li, /* styles a ul header as a title for nav bars */
ul.nav li:hover ul, /* displays 2nd level when 1st hovered over. */
ul.nav ul.nav li:hover ul, /* displays 3rd level when 2nd hovered over. */
ul.nav ul.nav ul.nav li:hover ul, /* displays 4th level when 3rd hovered over. */
ul.nav ul.nav ul.nav ul.nav li:hover ul, /* displays 5th level when 4th hovered over. */
ul.nav li:hover ul, /* displays 2nd level when 1st hovered over. */
ul.nav ul.nav li:hover ul, /* displays 3rd level when 2nd hovered over. */
ul.nav ul.nav ul.nav li:hover ul, /* 4th level */
ul.nav ul.nav ul.nav ul.nav li:hover ul /* 4th level */
{ width: 185px;
padding:0px;
}
ul.nav { border: 1px maroon solid; /* border is only on outer box */
border-collapse: collapse;
}
ul.heading,
.listhead { text-align: center;
background-color:#fdebcf ; /* */
border: 1px maroon solid;
border-bottom: none;
}
ul.nav li { display: block;
background: #fdebcf ; /* top level of index */
text-align: left;
text-indent: 4px;
height: 20px; /* do not set to auto, display is awful & jumpy */
}
ul.nav a:link { display: block;
}
ul.nav a:hover,
ul.nav li:hover {
display: block; /* display:block in li & hover should makes link & background colour spread fully across cell rather than just the text; */
background:#ccffff url(images-and-logos/button-light-blue.jpg) repeat-x;
}
}
ul.nav a:hover {
text-decoration:underline;
}
ul.nav ul.nav li,
ul.nav ul.nav li ul,
ul.nav ul.nav ul.nav li ul,
ul.nav ul.nav ul.nav ul.nav li ul,
ul.nav ul.nav ul.nav ul.nav ul.nav li ul
{ background-color:#fdebcf;/* 2nd, 3rd & 4th levels; same as ul.nav li:hover above */
}
ul.nav li ul, /* 2nd level */
ul.nav ul.nav li ul , /* 3rd level*/
ul.nav ul.nav ul.nav li ul, /* 4th level */
ul.nav ul.nav ul.nav ul.nav li ul /* 5th level */
{ display: none; /* hides (until hovered over as below) */
}
ul.nav li:hover ul, /* displays 2nd level when 1st hovered over. */
ul.nav ul.nav li:hover ul, /* displays 3rd level when 2nd hovered over. */
ul.nav ul.nav ul.nav li:hover ul, /* 4th level */
ul.nav ul.nav ul.nav ul.nav li:hover ul /* 4th level */
{ overflow:visible;
position: relative;
left: 175px;
top: -16px;
border: 1px maroon solid; /* puts border around outer box, but not lines; seems to be inherited from ul.nav for 2nd level, but not the 3rd */
}
ul.nav ul.nav li:hover ul, /* displays 3rd level when 2nd hovered over. */
{ width:auto;
}