/*
// -----------------------------------------------------------------------------
// File: rom-screen.css
//
// Abstract:
//   Style sheet used in Romania Burrow.
//
// Notes:
//   Layout:
//     1. The Header ("header" div) covers the entire width of the
//        browser window (viewport) at the top of the window (with
//        a small margin at the top, left, and right to give some
//        breathing space (gutter) to the web page.
//
//     2. Main division ("maindiv" div) is positioned "relative" so
//        that it immediately follows the Header. It's only function
//        is to act as the main container for the two-column layout
//        of the page.
//
//     3. Content column ("content" div) is positioned "relative" so
//        that it sits in the upper-left corner of the Main container.
//        It has no defined width, so it will expand and contract as
//        the browser window is resized. It has a right margin that's
//        slightly larger than the width of the Side column (to keep
//        text from bumping into the side column).
//
//     4. Side column ("sidecol" div) is positioned "absolute" in the
//        upper-right corner of the Main container, but slightly below
//        the Header. It has a specific width defined (slightly less
//        than the Left column's right margin). It's where the navigation
//        links are displayed.
//
//     5. The Footer ("footer" div), unlike the Header, does not span
//        the entire width of the window. Rather, it is as wide as the
//        Content column. This design decision is driven by the fact
//        that it's difficult to prevent it from moving around depending
//        on wither the Content or Side column is longer than the other.
//
//   Colors used in website:
//
//     Black        = "#000000"   "#000"
//     DarkGreen    = "#006633"   "#063"
//     LightGreen   = "#336600"   "#360"
//     SantaFeBlue  = "#6699FF"   "#69F"
//     Brick        = "#993300"   "#930"
//     Rust         = "#CC6600"   "#C60"
//     OffWhite     = "#EFEFEF"
//     Gold         = "#FFCC00"   "#FC0"
//     Lemon        = "#FFFF99"   "#FF9"
//     White        = "#FFFFFF"   "#FFF"
//     LightGray    = "#CCCCCC"   "#CCC"
// -----------------------------------------------------------------------------
*/

/*
// -----------------------------------------------------------------------------
// Browser viewport (window) settings
*/

* {margin:0; padding:0;}     /* cancel browser's margin/padding */

body {                       /* default body properties */
  font-family: Georgia, "Times New Roman", serif;
  font-size: 100%;                /* set default for 1em */
  margin: 0.25em 0.5em;           /* small left/right margin */
}

.brclear { clear: both; }    /* br clear=all hack */

#maindiv {                   /* container for "content" and "sidecol" */
  position: relative;             /* use relative positioning */
}

/*
// -----------------------------------------------------------------------------
// Main content division appears on the left side of the window
*/

#content {
  position: relative;             /* use absolute positioning */
  top: 0px;                       /* upper part of container */
  left: 0px;                      /* left side of container */
  margin-left: 30px;              /* indent all content body text */
  margin-right: 150px;            /* allow room for sidecol div */
}

/* Styles for individual objects */

#content h1, h2, h3, h4, h5, h6 {      /* default h1...h6 settings */
  color: #cc6600;
  font-family: "Trebuchet MS", Verdana, Arial, sans-serif;
}

#content h1 {
  font-family: Georgia, "Times New Roman", serif;
  font-size: 2.25em;
  font-weight: bold;
  text-align: center;
  margin-top: 0.25em;
  margin-bottom: 0.5em;
}

#content h2 {
  font-size: 2.25em;
  font-weight: bold;
  text-align: left;
  margin-top: 1em;
  margin-left: -30px;
  margin-bottom: 0;
  border-top: 2px dashed #cc6600;  /* rust */
}

#content h3 {
  font-size: 2em;
  font-weight: bold;
  text-align: left;
  margin-top: 1em;
  margin-left: -15px;
  margin-bottom: 0;
  border-top: 2px solid #cc6600;  /* rust */
}

#content h3.year {
  color: #cc6600;                 /* rust */
  background-color: #ffffcc;      /* light lemon */
  font-family: Verdana, Arial, sans-serif;
  font-size: 1.25em;
  font-weight: bold;
  text-align: center;
  margin-top: 1em;
  padding: 3px 0 0 10px;
  border-width: 3px 0 0 0;
  border-color: #cc6600           /* rust */
  border-style: solid;
}

#content h4 {
  font-size: 1.75em;
  font-weight: bold;
  text-align: left;
  margin-top: 0.75em;
  margin-left: -15px;
  margin-bottom: 0;
}

#content h5 {
  font-size: 1.5em;
  font-weight: bold;
  text-align: left;
  margin-top: 0.5em;
  margin-left: 0;
  margin-bottom: 0;
}

#content h6 {
  font-size: 1.25em;
  font-weight: bold;
  font-style: italic;
  text-align: left;
  margin-top: 0.3em;
  margin-left: 0;
  margin-bottom: 0;
}

#content p {
  font-size: 0.9em;
  margin: 0.9em 0;
}

#content p.notehead {
  width: 4em;
  float: left;
  color: #cc6600;                 /* rust */
  background-color: #ffff99;      /* lemon */
  font-family: "Trebuchet MS", Verdana, Arial, sans-serif;
  font-weight: bold;
  margin: 0 1em 0.5em 0;
  padding: 0.25em;
  border: 1px solid #cc6600;      /* rust */
}

#content p.notebody {
  padding: 0.25em 0.5em 0.5em 0.5em;
  border: 1px solid #993300;      /* brick */
}

#content blockquote {
  font-size: 0.9em;
  margin-top: 0.9em;
  margin-left: 15px;
  margin-right: -15px;
}

#content li {
  font-size: 0.9em;
  margin: 0.2em 0;
}

#content ul li {
  list-style-type: disc;
  margin-left: 20px;
}

#content ul li a {
  font-size: inherit;
}

#content ul li ul li {
  list-style-type: square;
  font-size: 1em;
  margin-left: 20px;
}

#content ul li ul li a {
  font-size: inherit;
}

#content ul li ul li ul li {
  list-style-type: circle;
  font-size: 1em;
  margin-left: 20px;
}

#content ul li ul li ul li a {
  font-size: inherit;
}

#content ol li {
  margin-left: 30px;
}

#content .rulerlist li {
  margin: 0 0 0 20px;
  padding: 0;
}

#content .topiclist li {
  margin: 0 0 0 20px;
  padding: 0;
}

#content .elsewhere {
  font-family: Verdana, Arial, sans-serif;
  font-size: 0.9em;
  font-weight: normal;
}

#content .elsewhere li {
  margin: 0 0 0 20px;
}

#content .elsewhere ul li ul li ul li {
  list-style-type: circle;
}

#content .elsewhere ul li ul li ul li a {
  font-size: inherit;
}

#content .elsewhere ul li ul li ul li ul li {
  list-style-type: disc;
}

#content .elsewhere ul li ul li ul li ul li a {
  font-size: inherit;
}

#content .elsewhere ul li ul li ul li ul li ul li {
  list-style-type: square;
}

#content .elsewhere ul li ul li ul li ul li ul li a {
  font-size: inherit;
}

h4 {color: #cc6600; }             /* rust */

/* Page header area */

#header {
  background-color: #993300;      /* brick */
  width: 100%;                    /* span width of whole window */
}

#logo {                      /* logo-img and catchphrase */
  border: 1px solid #993300;      /* looks better with brick border */
  color: white;                   /* white */
  background-color: black;        /* black */
  height: 30px;                   /* same height as logo gif */
}

#logo .logo-img {            /* "The Village Fox" (in chosen font) */
  float: left;                    /* pos on left side of container */
  margin: 0 5px 0 0;              /* gutter */
  padding: 0;
}

#logo .catchphrase {         /* "Dedicated to..." */
  font-family: Georgia, "Times New Roman", serif;
  font-size: 1.25em;
  font-weight: bold;
  font-style: italic;
  margin: 0 0 0 5px;              /* gutter */
  padding: 0;
}

#motto {                     /* "Romania - Myth..." */
  color: #ffcc00;                 /* gold */
  font-family: Verdana, Arial, sans-serif;
  font-size: 1em;
  font-weight: bold;
  text-align: center;
  padding: 4px 0;                 /* top/bottom padding */
}

#breadcrumb {                /* navigation breadcrumbs */
  border: 1px solid #993300;      /* looks better with brick border */
  color: black;                   /* black */
  background-color: #ffcc00;      /* gold */
  font-family: Verdana, Arial, sans-serif;
  font-size: 0.8em;
  font-weight: normal;
  padding: 4px;                   /* padding all around */
}

#breadcrumb a.crumb {        /* breadcrumb hyperlinks */
  text-decoration: underline;
}

#breadcrumb a.crumb:link     { color: black; }
#breadcrumb a.crumb:visited  { color: black; }
#breadcrumb a.crumb:hover    { color: #993300; }
#breadcrumb a.crumb:active   { color: #993300; }

/* Page footer area */

#footer {
  font-family: Arial, sans-serif;
  margin: 10px;
  padding: 3px;
  text-align: center;
}

#footer .pleasant {
  color: #ffcc00;                 /* gold */
  background-color: #993300;      /* brick */
  font-family: Verdana, Arial, sans-serif;
  font-size: 0.8em;
  font-weight: bold;
  margin: 0;
  padding: 0.25em;
}

#footer .contact {
  font-size: 0.7em;
  font-weight: normal;
  margin: 5px 0 0 0;
  padding: 0;
  text-align: left;
}

#footer .copyright {
  background-color: #ffff99;      /* lemon */
  font-size: 0.7em;
  font-weight: normal;
  margin: 5px 0 0 0;
  padding: 0;
  text-align: left;
}

/*
// -----------------------------------------------------------------------------
// Side column division appears on the right side of the window
*/

#sidecol {                   /* navigation column */
  position: absolute;             /* use absolute positioning */
  top: 10px;                      /* near upper part of container */
  right: 0px;                     /* right side of container */
  width: 140px;                   /* set column's width */
  border-left: 1px solid #cccccc; /* visual divider rule */
  padding: 0 5px;                 /* set top/right, bot/left padding */
  overflow: hidden;               /* prevent elements from breaking out */
}

#sidecol .side-logo {        /* fox photo and "step inside..." */
  font-family: Arial, sans-serif;
  font-size: 0.75em;
  margin: 10px 0 0 10px;
}

#sidecol .side-head {
  color: black;                   /* black */
  background-color: #ffff99;      /* lemon */
  border: 1px solid #993300;      /* brick */
  font-family: Arial, sans-serif;
  font-size: 0.9em;
  font-weight: bold;
  margin: 10px 0 0 0;
  padding: 5px;
}

#sidecol .side-links {
  background-color: #ffcc00;      /* gold */
  border: 1px solid #993300;      /* brick */
  font-family: Verdana, Arial, sans-serif;
  font-size: 0.75em;
  margin: 0;
  padding: 5px 2px 5px 5px;
}

#sidecol ul li {
  list-style-type: none;
  margin: 0;
}

#sidecol ul li a {
  color: black;                   /* black */
  font-size: inherit;
}

#sidecol ul li ul li {
  list-style-type: none;
  margin: 0;
  padding-left: 10px;
}

#sidecol ul li ul li a {
  color: black;                   /* black */
  font-size: inherit;
}

#sidecol li a:link     { color: black; }
#sidecol li a:visited  { color: black; }
#sidecol li a:hover    { color: #993300; }
#sidecol li a:active   { color: #993300; }