@import "common.css";

body {
  color: white;
  background-image: url("/images/bg-green-stripe.gif");
  font-size: 90%;
  font-family: Georgia, "Times New Roman", serif;
  min-width: 40em;
}

h1, h2, h3, h4, h5, h6 {
  /* font-family: "Goudy Old Style", Georgia, "Times New Roman", serif; */
  font-family: Optima, "Trebuchet MS", "Helvetica Neue", Arial, Helvetica, sans-serif;
  padding-bottom: 0;
  margin-bottom: 1ex;
  background: transparent;
}
h1, h2 { 
  margin: .5em 0;
  padding: .1ex 0 0 0;
}
h2 { 
  font-size: 160%;
  border-bottom: 3px solid #ffcc44;
}
h3 { font-size: 130% }
h4 { font-size: 120% }
h5 { font-size: 110% }
h6 { font-size: 100% } 


/*** The "header" of our document that tells users what site they're on.
 *** It contains a logo-ish title and some basic site navigation.  The
 *** header should appear at the top of the page and the beginning
 *** of the source order.
 ***/

#header {
   position: relative;
   margin: 0;
/*
   border-bottom: 1px solid black;
*/
   padding: .1em;
   color: white;
   background: transparent;
   font-family:  "Helvetica Neue", Arial, Helvetica, sans-serif;
   height: 2.4em;
}
#header a:link, 
#header a:visited { 
  color: white;
  text-decoration: none;
}

#header a:link:hover,
#header a:visited:hover {
  color: #aea;
  text-decoration: underline;
} 

#logo {
   margin: 0 0 0 .2em;
   padding: 0;
   font-family: "Helvetica Neue", "Trebuchet MS", Arial, Helvetica, sans-serif;
}
#logo h1 { 
   font-family: "Goudy Old Style", Georgia, "Times New Roman", serif;
   font-size: 220%; 
   line-height: 1em; 
   margin: .1em .6ex 0 0; 
   padding: 0;
   float: left;
   position: relative;
   border: none;
}
#logo strong { color: #77ff77; }
#logo .subtext {
   float: left;
   position: relative;
   font-size: 95%;
   font-style: italic;
   margin: .3ex 0 0 0;
   line-height: 1em;
}
#logo .subtext a.urlink {
   display: block;
   font-family: serif;
   font-variant: small-caps;
   font-style: normal;
}
#header form {
   position: absolute;
   text-align: right;
   top: 0;
   right: 0;
   margin: .3em .6em 0 0;
   padding: 0;
   font-size: 90%;
}
#header form input { font-size: 90% }

/***
 ***  #body
 ***/

#body {
  position: relative;
  width: 100%;
  background: transparent;
/*
  background-position: top left;
  background-repeat: no-repeat;
*/
}

/*
 * A simple list of "breadcrumbs" showing a path of links from the root of
 * the site's hierarchy to our present location.
 */

#breadcrumbs {
  clear: none;
  margin: 1ex .5em 1ex .1em;
  font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
}
#breadcrumbs a {
  white-space: nowrap;
  text-decoration: none;
}
#breadcrumbs a:hover { text-decoration: underline; }
#breadcrumbs a.active { color: black; }

#styleswitcher { margin: .5em 1em 0 0; font-size: 90% }
#styleswitcher .view-screen a { color: inherit }


#content {
  position: relative;
  margin-left: 10em; 
  padding: .1em .5em 1ex 1em;
  background: white;
  color: black;
  border-top: 1px solid black;
  border-left: 1px solid black;
  border-bottom: 1px solid black;
  -moz-border-radius-topleft: 2em;
  -moz-border-radius-bottomleft: 2em;
  min-height: 40em;
}

#primary-content {
  position: relative;
  margin-right: 15em;
  padding: 0;
  background: white;
  border-color: white;
}
#extra-content {
  z-index: 40;
  position: absolute;
  top: 1em;
  right: 1em;
  font-size: 90%;
  width: 14em;
  padding: 0;
  background: transparent;
  border-color: white;
}

#content-details {
  font-family: Arial, Helvetica, sans-serif;
  background-color: transparent;
  color: #444;
  margin: 2em .5em .1em .5em;
  font-size: 80%;
}


/***
 *** Navigation
 ***/

#navigation {
  position: absolute;
  top: 0;
  left: 0;
  width: 10em;
  margin-top: .5em;
  padding: 0;
  border: none;
  font-family: "Helvetica Neue", Arial, Helvetica, sans-serif;
  background: transparent;
}

#navigation li.selected,
#navigation li.you-are-here {
   font-weight: bold;
}

#navigation ul a {
   text-decoration: none;
   color: white;
}

#navigation ul a:hover,
#navigation ul a.you-are-here {
  background: white;
  -moz-border-radius-topleft: .5em;
  -moz-border-radius-bottomleft: .5em;
  color: black;
  font-weight: bold;
}


#navigation ul {
  width: 100%;
  list-style-type: none;
  margin: 0;
  padding: 0;
  font-size: 125%;
  /*
  border-top: 1px dotted white;
  border-bottom: 1px dotted white;
  */
}
#navigation ul li {
  margin: 1px 0;
  padding: 0 0 0 0;
  height: .90em;               /* Win MSIE 5.0 bug workaround */
  he\ight: auto;
  white-space: nowrap;         /* don't split tabs */
}
#navigation ul li a {
   display: block;
   margin: 0;
   padding: 0 0 0 .5em;
   line-height: 1.5em;
   width: 100%;
}
#navigation ul ul {
   position: static;
   border: none;
   width: auto;
   font-size: 100%; /* don't shrink until 3rd level */
}

/* don't indent 2nd level; keep flush with "home" on 1st level */
#navigation ul ul ul {
   margin-left: .6em;
   font-size: 85%;
   /* border-left: 1px solid gray; */
}

#related {
  border: 1px solid black;
  margin: 3em .3em 1em .3em;
}
#related p {
  margin: .2em .4em;
  font-size: 80%;
}
#related h2 {
  margin: 0;
  padding: .1em;
  border-bottom: 1px solid black;
  width: 100%;
  text-align: center;
}

#footer {
  position: relative;
  padding: .1em .5em 1em 10em;
  text-align: left;
  font-family: Arial, Helvetica, sans-serif;
}
#footer blockquote {
  margin: 0; 
  padding: 0;
  font-size: 80%;
  font-style: normal;
}

/***
 *** Various boxed stuff
 ***/

.toc {
  width: 12em;
}

.sidebar,
.box,
.toc,
.thumb {
  border: 1px solid #5a5;
  margin: 0 0 1em 0;
  padding: 0;
  border-radius: .5ex; -moz-border-radius: .5ex;
}

.sidebar,
.toc,
.thumb {
  font-family: Arial, Helvetica, sans-serif;
  position: relative; /* to fix MSIE "peekaboo" bug */
  clear: right;
  font-size: 95%; 
  margin: 0 0 1.5ex .5em;
}

/* places where a gradient bar is needed */
.sidebar h2,
.box h2,
.toc h2,
#related h2,
th.title {
   font-size: 110%;
   text-align: center;
   border-bottom: none;
   margin: 0;
   padding: .5ex 0;
   background: #118844;
   background-image: url("/images/vgradient-184.gif");
   background-repeat: repeat-x;
   color: white;
}

.toc ul { 
   font-size: 110%; 
   padding-left: 0;
   margin-left: 2em;
}
.toc ul ul { 
   font-size: 90%; 
}
.toc ul li {
   padding-left: 0;
   margin-left: 0;
}

/*** 
 *** misc
 ***/


#related { 
  background-color: #d6ffd6;
  color: black;
}

#related a:link {
   text-decoration: underline;
   color: blue;
}

:target {
  background-color: #ff6;
  border-color: #cc1;
  padding: .5em;
}