/* ---------------------------------------------------------------------
 * SwiftJPEG User Guide screen-based style sheet
 * ---------------------------------------------------------------------
 */


/* Set the main body text properties */

BODY
{
  font-family:       "Trinity", "Times New Roman", serif;
  font-size:         12pt;
}

/* ---------------------------------------------------------------------
 * Creative Commons banner
 * ---------------------------------------------------------------------
 */

TABLE.commons
{
  border:            1px solid #000000;
}

/* ---------------------------------------------------------------------
 * Title - set border and background colour for the table, and
 * font properties for the contained text.
 * ---------------------------------------------------------------------
 */

TABLE.title
{
  background:        #e6e6ff;
  border:            1px solid #000000;
}

H1
{
  font-family:       "Homerton", "Arial", sans-serif;

  /* Get 16pt - but use of '<font size="-1">' for legacy browsers means
   * we must counteract the tag based on the W3C CSS 2 recommendation of
   * a factor of 1.2 between adjacent sizes.
   */

  font-size:         19.2pt;
  font-style:        normal;
  font-weight:       bold;
}

/* ---------------------------------------------------------------------
 * General headings
 * ---------------------------------------------------------------------
 */

/* Heading 2 is used for all main headings under the document
 * title; contents, sections and appendices.
 */

H2, H2.appendix
{
  font-family:       "Homerton", "Arial", sans-serif;

  /* Get 14pt (see H1 for details) */

  font-size:         16.8pt;
  font-style:        normal;
  font-weight:       bold;

  margin:            0;
  padding:           0;
}

/* Heading 3 is used for subheadings */

H3, H3.appendix
{
  font-family:       "Homerton", "Arial", sans-serif;

  /* Get 12.5pt (see H1 for details) */

  font-size:         15pt;
  font-style:        normal;
  font-weight:       bold;
}

/* ---------------------------------------------------------------------
 * Sidebars
 * ---------------------------------------------------------------------
 */

/* Sidebar tables have a BGCOLOR setting to make things work
 * better in non-CSS browsers. If we support CSS though this
 * messes up the drop shadow, so override it here.
 */

TABLE.sidebar
{
  background-color:  #ffffff;
}

/* Simple drop shadow */

.shadow
{
  background-color:  #aaaaaa;
  float:             left;
  margin:            5px 0 0 5px !important;
  margin:            0;
}

.shadow DIV
{
  color:             #000000;
  background-color:  #e6e6ff;
  border:            1px solid #888888;
  padding:           5px;
  margin:            -4px 4px 4px -4px !important;
  margin:            0;
}

/* Configure body text for sidebars */

.shadow DIV DIV
{
  font-family:       "Trinity", "Times New Roman", serif;

  /* Prefer 10pt relative to 12pt */

  font-size:         83.3%;
  font-style:        normal;
  font-weight:       normal;
  margin:            0;
  border:            none;
  padding:           0 0 0 46px;
}

/* Minimal indentation for list items */

UL.sidebar
{
  margin-left:       15px;
}

/* ---------------------------------------------------------------------
 * Body text style variations
 * ---------------------------------------------------------------------
 */

/* Hyperlinks containing e-mail addresses */

.email
{
  font-family:       "Corpus", "Courier New", monospace;
  font-size:         90%;
  font-stretch:      narrower;
}

/* Hyperlinks to external resources, held inline with other text,
 * or on their own individual lines. We also indent ADDRESS text
 * by the same amount, to match surrounding information.
 */

.external_inline, .external
{
  font-family:       "Corpus", "Courier New", monospace;

  /* Prefer 10pt relative to 12pt */

  font-size:         83.3%;
  font-stretch:      narrower;
}

.external, ADDRESS
{
  margin-left:       40px;
}

/* Captions used under some images */

.caption
{
  font-family:       "Trinity", "Times New Roman", serif;

  /* Prefer 10pt relative to 12pt */

  font-size:         83.3%;
  font-style:        italic;
  font-weight:       bold;
}

/* Body text for the history section */

DIV.history
{
  font-family:       "Corpus", "Courier New", monospace;

  /* Prefer 8pt relative to 12pt */

  font-size:         66.7%;
  font-stretch:      narrower;
}

/* Copyright footer messages */

DIV.copyright
{
  font-family:       "Trinity", "Times New Roman", serif;

  /* Prefer 8pt relative to 12pt */

  font-size:         66.7%;
  font-style:        italic;
}

/* Used where key presses are indicated */

KBD.key
{
  font-family:       "Corpus", "Courier New", monospace;
  font-size:         100%;
  font-stretch:      narrower;
  font-weight:       bold;
}

/* Used there mouse button presses are indicated */

KBD.mouse
{
  font-family:       "Corpus", "Courier New", monospace;
  font-size:         100%;
  font-stretch:      narrower;
}

/* Code or technical sections */

CODE
{
  font-family:       "Corpus", "Courier New", monospace;
  font-size:         95%;
  font-stretch:      narrower;
}

/* Italicise acronyms */

ACRONYM
{
  font-style:        italic;
}

/* Thin black border on table cells rather than the usual 3D stuff */

TABLE.thin
{
  border-collapse:   collapse;
  border:            2px solid black;
}

TH.thin
{
  border:            1px solid black;
}

TD.thin
{
  border:            1px solid black;
}

/* ---------------------------------------------------------------------
 * Section numbering for the contents page, headings and appendices
 * ---------------------------------------------------------------------
 */

/* Set up the "23. <text>" style of numbering for sections */

H2:before
{
  content:           counter(section) ". ";
  counter-increment: section;
  counter-reset:     subsection;
}

/* Set up the "23.4. <text>" style for subsections */

H3:before
{
  content:           counter(section) "." counter(subsection) ". ";
  counter-increment: subsection;
}

/* Set up the "Appendix B: <text>" style for appendices */

H2.appendix:before
{
  content:           "Appendix " counter(appendix, upper-latin) ": ";
  counter-increment: appendix;
  counter-reset:     subappendix;
}

/* Set up the "B.4. <text>" style for subsections in appendices */

H3.appendix:before
{
  content:           counter(appendix, upper-latin) "." counter(subappendix) ". ";
  counter-increment: subappendix;
}

/* Set up the contents page main counters. Counters are reset within
 * nested elements, so we're really defining an array of counters
 * under the names 'contents_items' and 'appendix_items' here.
 *
 * We use ordered lists so browsers that don't support this part of
 * CSS will still display something reasonably meaningful.
 */

OL.contents
{
  counter-reset:     contents_items;
}

OL.appendices
{
  counter-reset:     appendix_items;
}

/* We need to stop LI items being automatically preceeded by the
 * browser's own numbering. A browser that supports this, but not
 * the generated content numbering, will display no numbers at
 * all; contact the vendor and ask them to finish implementing
 * CSS 2 (not unreasonable, given it was drawn up in 1998!).
 */

LI.contents, LI.appendices
{
  display: block;
}

/* Now set our own display for subsections */

LI.contents:before
{
  content:           counters(contents_items, ".") ". ";
  counter-increment: contents_items;
}

/* Appendices are more complex because we want to mix different
 * display styles and formats.
 */

LI.appendices:before
{
  content:           "Appendix " counters(appendix_items, ".", upper-latin) ": ";
  counter-increment: appendix_items;
}

LI.appendices OL.appendices LI.appendices:before
{
  content:           counter(appendix_items) ". ";
  counter-increment: appendix_items;
}

