/* slide stylesheet for 1024x768 projector, 1366x768 laptop:
 * notes on rightmost 342 px 
 */

#navigation {
  /* Comment out this next line to make navigation controls visible: */
  display: none;
  font-size: 12px;
  z-index: 99;
  position: absolute; top: -10px; right: 1em;
}

.greyed { color: #678; }

body {
  background: white url(pix/vfade.jpg) repeat-x;
  margin-top: 0em;
  margin-left: 0em;
  font-size: 40px;
  line-height: 1.6em;
  /*padding-bottom: 0;
  /*margin: 0px 0px 0px 0px;*/

  /* If you get stuck on an 800x600 projector, use these:
   * unfortunately it doesn't work on all browsers.
   * -moz-transform works on firefox but it also needs the postion:absolute.
   * zoom works on webkit and IE.
   * Nothing works on Opera.
  zoom: 78.125%;
  position: absolute; left: 0px; top: 0px;
  -moz-transform: scale(.78125, .78125);
   */
}

#page {
  width: 1024px;
  height: 762px;   /* !768 because of firefox residual top bar */
  position: absolute; left: 0px; top: 0px;
  outline: #ddf solid thin;
  overflow: hidden;
  background: url(pix/bigwilber.png) no-repeat bottom right;
}

/*#page > img { margin: 60px 40px 30px 40px; } */

img.fullpage {
  position: absolute; margin: 0; padding: 0;
  z-index: 1;
}

#notes {
  position: absolute; left: 1035px;
  top: 40px;
  width: 330px; /* Need to set a maximum, and clip if it doesn't fit! */
  font-family: sans-serif;
  font-size: 24px;
  line-height: 1.4em;
}

#content {
  margin-left: 130px;
  margin-top: 75px;
  width: 800px;
  font-family: dejavu sans,arial,sans-serif;
  font-size: 1em;
}

table { font-size: 1em; }
td, th { margin: 0; }

strike { color: #444; }

th { text-align: left; }
td { padding: .5em .3em; }

/* H1 titles of various types: */

h1 {
  font-family: Times New Roman, serif;
  margin: .75em 2px .5em 1em;
  font-size: 1.7em;
  color: #800;
}

.title {
  line-height: 1em;
}

.bigtitle {
  font-size: 2.5em;
  margin-top: .3em;
  margin-left: 1em;
  line-height: 1.3em;
  /*text-align: center;*/
}

.sectiontitle {
  text-align: center;
  font-size: 2.0em;
  margin: 2.2em 2em 1em 2.5em;
  line-height: 1.3em;
}

/* A style to put on #page when it has a background image;
 * this is in addition to style=url(pix/something.jpg).
 */
.bgimage {
  background-repeat: no-repeat;
/*
  background-attachment: fixed;
  background-position: center;
 */
  background-position: 50% 50%;
}

h2 {
  font-size: 1.0em;
}

a { text-decoration: none; font-style: italic; font-weight: bold;
 color: #00b; }

em { font-style: italic; font-weight: bold; }

#content ul { list-style-image: url("pix/purple.png"); }

#content ul.nobullets {
  list-style-type: none;
  list-style-image: none;
}

li { margin-top: .8em; margin-bottom: .4em; line-height: 1.3em; }

ul.tight li { font-size: .8em; margin-top: 1em; line-height: 1.1em; }

dt { margin-top: .8em; }

dt { font-weight: bold; margin-top: .6em; }

#points li {
  visibility: hidden;
}

code { color: white; background: black; font-size: .8em;
       padding-left: 25px; padding-right: 25px; }

pre {
  font-size: .58em;
  line-height: 1.3em;
  color: white;
  background: black;
  padding: .2em;
  border: 3px inset white;
  white-space: pre-wrap;  /* For ff2, use -moz-pre-wrap */
}

pre em { color: #ff3; font-weight: bold; }
pre b { color: #ff3; font-weight: bold; font-size: 1.1em; }

.smallpre {
  margin-top: -30px;
  font-size: .40em;
  line-height: 1.2em;
}

.scrolledpre {
  font-size: .5em;
  overflow: scroll !important;
  white-space: pre;
  height: 555px;
  margin-top: -45px;
  margin-left: -75px;
}

blockquote { font-size: 1.2em; }

strong { font-weight: bold; text-decoration: underline; }

.popup {
  background: #644;
  color: white;
  font-size: .6em;
  border: 2px outset;
  position: absolute;
  -moz-box-shadow: 8px 8px 15px #333;
  -webkit-box-shadow: 8px 8px 15px #333;
  box-shadow: 8px 8px 15px #333;
}

/* Webkit doesn't let th/td inherit text color from parent,
 * so you have to specify it explicitly. Ouch!
 */
.popup td,.popup th { padding: 7px; color: white; }
.popup th { font-weight: normal; text-align: right; }