/* Basic styling */

body {
 color: black;
 background-color: white;
 font-family: 'Times New Roman', sans-serif;
 margin: 0px 10px 0px 0px;
}

#content {
 background-image: url(/global/g-left.png); background-repeat: repeat-y;
 padding: 5px 0 0 33px; clear: left
}
#content h1 { margin-top: 0 }

#footer {
 padding: 1.4em 0 0 33px; position: relative; top: -0.75em;
 background-image: url(/global/g-bottom.png); background-repeat: no-repeat;
 background-color: white;
}

#navigation {
 background-repeat: repeat-y;
 background-color: white; background-image: url(/global/g-left.png);
 text-align: right;
}
#subnav { padding-top: 3px; }
#subnav:before { content: '\25BA  '; font-size: 9pt; }
#mainnav { padding-top: 6px; }
.titlebasic { background: white; }

ul.menu { margin: 0; padding: 0 }
ul.menu li { display: inline; margin: 0; white-space: nowrap } /* Don't wrap within an item */
ul.menu li + li:before { content: '\2022  '; font-family: 'Times New Roman', serif; font-size: 11pt; }

h1, h2, h3, h4 { font-family: 'Times New Roman', sans-serif }
h1 { font-size: 18pt }
h2 { font-size: 16pt }
h3 { font-size: 13pt }

h1, h2 { margin-bottom: 0.5em }

hr { 
 height: 1px; 
 border-top: 0; 
 border-bottom: 1px solid black; 
 border-left: 0; 
 border-right: 0; 
}

/* Visible anchors */
h1 a[name]:hover:after, h2 a[name]:hover:after, h3 a[name]:hover:after, h4 a[name]:hover:after {
 content: "#" attr(name);
 color: silver;
 padding-left: 0.5em;
 font-family: sans-serif;
 font-size: medium;
 font-weight: bold;
}

/* This approach prevents that the effective line height of the line be increased by the superscript */ 
sup { vertical-align: top; font-size: 65% }
sub { font-size: 65% } /* to match sup */

.aCurr    { color: #003175; font-weight: bold } /* Active (current page) link in a link list */
a:link, a:link abbr, a:link acronym { color: #0059D4; }
a:visited, a:visited abbr, a:visited acronym { color: #003175; }
a:link:hover, a:link:hover abbr, a:link:hover acronym,
  a:visited:hover, a:visited:hover abbr, a:visited:hover acronym {
    color: #1278B9; } /* No hover for a[name] */
a:link:active  { color: #1278B9 }

a.dead,
a.deadlink { text-decoration: underline; color: #888; }
a.dead:after,
a.deadlink:after { content: url(link-dead.png); width: 16px; height: 16px; padding-left: 0.2em }

/* old colours pre-7 Aug 2006:
 link -> #085B95
 visited -> #0A75BA
 hover -> #0A75BA
*/

/* b, dkblue, bdkblue and i are classic pre-semantic styles that may/do exist on older pages */

.b, .bdkblue { font-weight: bold }
.i { font-style: italic }

h1, .dkblue, .bdkblue { color: #000037 }
.medblue { color: #000070 }

/* Compact and wide-spaced elements */

h2.compact, h3.compact, h4.compact {
 margin-bottom: 0; font-weight: bold; font-size: 100%
}

ul.compact { margin: 0; padding: 0 }
ul.compact li { margin: 0; padding: 0; display: block }

ul.adjacent { margin-top: 0 }

.spaced li { margin-bottom: 0.7em }

p.compact { margin-top: 0 }
.compact { margin-bottom: 0 }

/* A truly revolting hack to achieve what :last-child should be doing ... */
   
p, ul, ol, fieldset, blockquote, #content form { margin-bottom: 0.7em; margin-top: 0.7em }
#content table { margin-bottom: 0.75em }

#skipnav, .access { display: none }

q:before { content: '\201C' }
q:after { content: '\201D' }

q q:before { content: '\2018' }
q q:after { content: '\2019' }

em.dquo { font-style: normal }
em.dquo:before { content: '\201C' }
em.dquo:after { content: '\201D' }

abbr, acronym { color: #3C5546; border: none; cursor: help }
a abbr { cursor: pointer }
abbr:hover, acronym:hover { color: #388362 }
h2 abbr, h3 abbr, h4 abbr, h2 acronym, h3 acronym, h4 acronym { color: black }

/* Page navigation (page 1 | 2 | 3 | ...) bar styles */

#pagenavtop li:first-child:before, #pagenavbottom li:first-child:before { content: "Pages: "; font-weight: bold }
#pagenavtop, #pagenavbottom { margin: 0.7em 0; text-align: center }
#pagenavbottom { border-top: 1px solid black; padding-top: 0.7em }

/* Highlighted blocks */

code.blocklevelcode, blockquote.highlight, blockquote.code {
	margin: 0.7em 1.5em; background-color: #F0FEEB; padding: 1em;
}

blockquote.code {
	white-space: pre; font-family: monospace;
}

/* Blocks of code; the odd class name is to differentiate from existing CSS that this would override due to nonsensical
   inheritance in CSS */

code.blocklevelcode { display: block; white-space: pre }

/*
a[href^="http://"]:after, a[href^="//"]:after { content: url(link-external.png); width: 8px; height: 12px; padding-left: 0.2em }
a[href^="#"]:after { content: url(link-inpage.png); width: 9px; height: 12px; padding-left: 0.2em }
ul.menu a[href^="#"]:after { content: url(link-TOChint.png); width: 9px; height: 12px; padding-left: 0.2em }
li > a[href^="#"]:after { content: ""; padding: 0 }
sup > a[href^="#"]:after { content: ""; padding: 0 } (* Specificity sucks *)
*/

/* Image divs, image grids and captioned images */

.imagegrid img, .img img { margin: 1.3em }
.captionedimg { margin: 1.3em; font-style: italic }
.captionedimg img { display: block; margin-bottom: 0.5em }

.img a img, .imagegrid a img, .captionedimg a img { border-width: 2px; border-style: solid } /* for linked images */

/* The following defines the attractive green layout for tables of data across the site */

.datatable { border-spacing: 0; border-collapse: collapse; border: 1px solid black }

.datatable th { text-align: left; background-color: #CEF8A9; height: auto; vertical-align: bottom }
.datatable td { vertical-align: top; height: auto; border: 1px solid #AAA}
.datatable th, .datatable td:first-child { border: 1px solid black }
.datatable td:first-child { white-space: nowrap; background-color: rgb(228, 244, 213) }
.datatable th, .datatable td { padding: 5px }

/* Headed boxes */

.headedbox {
 border: 1px solid black;
 margin: 0.7em 0 1.5em;
 padding: 0 5px 5px;
}
.headedboxtitle {
 /* So we can use any level of heading */
 margin: 0 -5px;
 padding: 5px;
 background-color: #CEF8A9;
}
.headedbox > *:last-child { margin-bottom: 0 }
.headedboxtitle + * { margin-top: 5px }
h2.headedboxtitle {
	font-size: 120%;
	font-family: Calibri, sans-serif;
}

/* Keys on the keyboard */

.key {
 font-size: 10pt;
 font-style: normal;
 font-weight: normal;

 background-color: #FFFEF6;

 margin: 0 0.2em; padding: 0.1em 0.4em 0.1em 0.25em;

 border-width: 0 0.15em 0.2em;
 border-style: solid;
 border-color: white #D6D5CB #BABAAA;
 
 white-space: nowrap;
}

/* Text to input */

kbd { font-family: Arial, sans-serif; font-size: 10pt }

/* 32x32 icon lists */

.iconlist { padding: 0; margin: 0.7em }
.iconlist li {
  list-style-type: none;
  margin: 0; padding-left: 50px;
  background-repeat: no-repeat;
  min-height: 32px;
}
.iconlist li + li { margin-top: 0.5em }

/* Styles that belong to specific parts of the site */

.proghead {
  font-family: Arial, Geneva, sans-serif;
  font-size: 12pt;
  font-weight: bold }

.padcell { margin-right: 10px; margin-bottom: 10px }

h1.proghead {
 margin: 0; padding: 0;
 display: inline;
 color: black
}

/* You made it to the end. Congratulations. */