/* w3c-blue.css

   Copyright (c) 2005 W3C (MIT, ERCIM, Keio), All Rights Reserved.
   W3C liability, trademark, document use and software licensing
   rules apply, see:

   http://www.w3.org/Consortium/Legal/copyright-documents
   http://www.w3.org/Consortium/Legal/copyright-software
*/
body
{
  margin: 0 0 0 0;
  padding: 0 0 0 0;
  width: 100%;
  height: 100%;
  color: black;
  background-color: white;
  font-family: "Gill Sans MT", "Gill Sans", GillSans, sans-serif;
  font-size: 14pt;
}

div.toolbar {
  position: fixed; z-index: 200;
  top: auto; bottom: 0; left: 0; right: 0;
  height: 1.2em; text-align: right;
  padding-left: 1em;
  padding-right: 1em; 
  font-size: 60%;
  color: red; background: rgb(240,240,240);
}

/* script sets position property to absolute or relative */
div.slide {
  z-index: 20;
  position: relative;
  margin: 0 0 0 0;
  padding: 0;
  border-width: 0;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  line-height: 120%;
  background-color: transparent;
}

/* background div's are not positioned */
div.background {
  display: none;
}

div.handout {
  margin-left: 20px;
  margin-right: 20px;
}

/* should be displayed above slide content */
div.footer {
  position: absolute;
  z-index: 80;
  left: 0;
  right: 0;
  top: auto;
  bottom: 0;
  height: 3.5em;
  margin: 0;
  font-size: 80%;
  font-weight: bold;
  padding-left: 1em;
  padding-right: 0;
  padding-top: 0.3em;
  padding-bottom: 0;
  color: #003366;
  background-color: #95ABD0;
}

/* this is a hack to hide property from IE6 and below */
div[class="footer"] { position: fixed }

/* hide images used for save with content hack */
/* note this means we have to unhide the logo */
div.background img {
  display: none;
  visibility: hidden;
}

/* footer object element with SVG graphic */
#w3c-logo {
  margin: 0;
  margin-top: 0.3em;
  margin-right: 0.3em;
  padding-top: 0;
  padding-bottom: 0;
  padding-left: 0;
  padding-right: 0;
  height: 2em;
  width: 4.1em;
  float: right;
  background: #90A7D0;
}

/* footer img element with GIF content */
#w3c-logo-fallback {
  display: block;
  visibility: visible;
  margin: 0;
  margin-top: -0.4em;
  margin-right: 0.3em;
  padding-top: 0;
  padding-bottom: 0;
  padding-left: 0;
  padding-right: 0;
  height: 3em;
  width: 4.1em;
  float: right;
  background: #90A7D0;
}

/* force page break before all but the first slide */
div.slide + div[class].slide { page-break-before: always;}

div.slide h1 a {color: white; text-decoration: none}
div.slide h1 a:link {color: white}
div.slide h1 a:visited {color: white}
div.slide h1 a:active {color: red; text-decoration: underline}
div.slide h1 a:hover {color: yellow; text-decoration: underline}

div.slide h1 {
  padding-left: 1em;
  padding-right: 0;
  padding-top: 0.2em;
  margin: 0;
  color: white;
  height: 2.2em;
  font-size: 160%;
  line-height: 1.1em;
  background-color: #005A9C;
  border-width: thin;
  border-style: solid;
  border-bottom-width: thick;
  border-bottom-color: #95ABD0;
}

div.cover {
  margin: 0;
  padding: 0;
  background-color: black;
  overflow: hidden;
  width: 100%;
  height: 100%;
}

div.cover div.header
{
  position: absolute;
  z-index: 0;
  left: 0;
  right: 0;
  top: 0;
  bottom: auto;
  height: auto;
  margin: 0;
  width: 100%;
  padding: 0.5em 0.5em 0.5em 0.5em;
  color: #FFFFFF;
  border-width: thin;
  border-style: solid;
  background-color: #005A9C;
  border-bottom-width: thick;
  border-bottom-color: #95ABD0;
}

/* this is a hack to hide property from IE6 and below */
/* width set to below 100% to avoid horizontal scrollbar */
div[class="header"] {position: fixed; width: 98%}

div.slide.cover div.header h1
{
  background-color: #005A9C;
  width: 95%;
  margin: 0;
  padding: 0;
  margin-top: 0.2em;
  margin-left: 0.5em;
  margin-bottom: 0;
  border-width: 0;
  height: auto;
  border-style: none;
}

div.cover div.header p
{
  margin-top: 0.2em;
  margin-left: 0.9em;
  margin-bottom: 0;
}

div.header p.explanation {
  font-style: italic;
}

#centered-photo
{
  margin: 0;
  margin-top: 7%;
  padding: 0;
}

@media print {
  body { color: black }
  div.slide h1 { color: black }
  div.cover div.header {
    background: white; color: black;
    border-width: thin;
    border-style: solid;
    border-bottom-width: thick;
    border-bottom-color: #95ABD0;
  }
  div.cover div.header a { color: black }
  div.cover div.header p {color: black }
  div.cover { background: transparent }
  #cover-photo
  {
    width: 100%;
    height: auto;
    margin: 0;
    margin-top: 20%;
    padding: 0;
  }
  h1, pre { font-size: 60% }
}

div.slide.cover a {
  color: white;
}

div.slide.cover a:hover, div.slide.cover a:active {
    color: yellow; text-decoration: underline;
}

li pre { margin-left: 0; }

blockquote { font-style: italic }

img { background-color: transparent }

p.copyright { font-size: smaller }

.center { text-align: center }
.footnote { font-size: smaller; margin-left: 2em; }

a img { border-width: 0; border-style: none }

a:visited { color: navy }
a:link { color: navy }
a:hover { color: red; text-decoration: underline }
a:active { color: red; text-decoration: underline }

a {text-decoration: none}
.navbar a:link {color: white}
.navbar a:visited {color: yellow}
.navbar a:active {color: red}
.navbar a:hover {color: red}

ul { list-style-type: square; }
ul ul { list-style-type: disc; }
ul ul ul { list-style-type: circle; }
ul ul ul ul { list-style-type: disc; }
li { margin-left: 0.5em; margin-top: 0.5em; }
li li { font-size: 85%; font-style: italic }
li li li { font-size: 85%; font-style: normal }

div dt
{
  margin-left: 0;
  margin-top: 1em;
  margin-bottom: 0.5em;
  font-weight: bold;
}
div dd
{
  margin-left: 2em;
  margin-bottom: 0.5em;
}


p,pre,ul,ol,blockquote,h2,h3,h4,h5,h6,dl,table {
  margin-left: 1em;
  margin-right: 1em;
}

p.subhead { font-weight: bold; margin-top: 2em; }

.smaller { font-size: smaller }
.bigger { font-size: 130% }

td,th { padding: 0.2em }

ul {
  margin: 0.5em 1.5em 0.5em 1.5em;
  padding: 0;
}

ol {
  margin: 0.5em 1.5em 0.5em 1.5em;
  padding: 0;
}

ul { list-style-type: square; }
ul ul { list-style-type: disc; }
ul ul ul { list-style-type: circle; }
ul ul ul ul { list-style-type: disc; }

ul li { 
  list-style: none;
  margin: 0.1em 0em 0.6em 0;
  padding: 0 0 0 40px;
  background: transparent url(bullet.png) no-repeat 5px 8px;
  line-height: 140%;
}

/* workaround IE's failure to support background on li for print media */
@media print { ul li { list-style: disc; padding-left: 0; background: none; } }

ol > li { 
  margin: 0.1em 0em 0.6em 1.5em;
  padding: 0 0 0 0px;
  line-height: 140%;
  list-style-type: decimal;
  background: transparent;
}

li ol li, ol li { 
  margin: 0.1em 0em 0.6em 1.5em;
  padding: 0 0 0 0px;
  line-height: 140%;
  list-style-type: decimal;
  background: transparent;
}

li ul li { 
  font-size: 85%; 
  font-style: italic;
  list-style-type: square;
  background: transparent;
  padding: 0 0 0 0;
}
li li ul li { 
  font-size: 85%; 
  font-style: normal;
  list-style-type: disc;
  background: transparent;
  padding: 0 0 0 0;
}
li li li ul li {
  list-style-type: circle;
  background: transparent;
  padding: 0 0 0 0;
}

/*
 setting class="outline on ol or ul makes it behave as an
 ouline list where blocklevel content in li elements is
 hidden by default and can be expanded or collapsed with
 mouse click. Set class="expand" on li to override default
*/

ol.outline li:hover { cursor: pointer }
ol.outline li.nofold:hover { cursor: default }

ul.outline li:hover { cursor: pointer }
ul.outline li.nofold:hover { cursor: default }

ol.outline { list-style:decimal; }
ol.outline ol { list-style-type:lower-alpha }

ol.outline li.nofold {
  padding: 0 0 0 20px;
  background: transparent url(nofold-dim.gif) no-repeat 0px 0.5em;
}
ol.outline li.unfolded {
  padding: 0 0 0 20px;
  background: transparent url(fold-dim.gif) no-repeat 0px 0.5em;
}
ol.outline li.folded {
  padding: 0 0 0 20px;
  background: transparent url(unfold-dim.gif) no-repeat 0px 0.5em;
}
ol.outline li.unfolded:hover {
  padding: 0 0 0 20px;
  background: transparent url(fold.gif) no-repeat 0px 0.5em;
}
ol.outline li.folded:hover {
  padding: 0 0 0 20px;
  background: transparent url(unfold.gif) no-repeat 0px 0.5em;
}

ul.outline li.nofold {
  padding: 0 0 0 52px;
  background: transparent url(bullet-nofold-dim.gif) no-repeat 5px 8px;
}
ul.outline li.unfolded {
  padding: 0 0 0 52px;
  background: transparent url(bullet-fold-dim.gif) no-repeat 5px 8px;
}
ul.outline li.folded {
  padding: 0 0 0 52px;
  background: transparent url(bullet-unfold-dim.gif) no-repeat 5px 8px;
}
ul.outline li.unfolded:hover {
  padding: 0 0 0 52px;
  background: transparent url(bullet-fold.gif) no-repeat 5px 8px;
}
ul.outline li.folded:hover {
  padding: 0 0 0 52px;
  background: transparent url(bullet-unfold.gif) no-repeat 5px 8px;
}

li ul.outline li.nofold {
  padding: 0 0 0 21px;
  background: transparent url(nofold-dim.gif) no-repeat 5px 8px;
}
li ul.outline li.unfolded {
  padding: 0 0 0 21px;
  background: transparent url(fold-dim.gif) no-repeat 5px 8px;
}
li ul.outline li.folded {
  padding: 0 0 0 21px;
  background: transparent url(unfold-dim.gif) no-repeat 5px 8px;
}
li ul.outline li.unfolded:hover {
  padding: 0 0 0 21px;
  background: transparent url(fold.gif) no-repeat 5px 8px;
}
li ul.outline li.folded:hover {
  padding: 0 0 0 21px;
  background: transparent url(unfold.gif) no-repeat 5px 8px;
}


img.withBorder {
  border: 2px solid #c60;
  padding: 4px;
}

pre {
 color: rgb(0,128,0); font-size: 80%;
 font-weight: bold; line-height: 120%;
 padding-top: 0.2em;
 padding-bottom: 0.2em;
 padding-left: 1em;
 padding-right: 1em;
 border-style: solid;
 border-left-width: 1em;
 border-top-width: thin;
 border-right-width: thin;
 border-bottom-width: thin;
 border-color: #95ABD0;
 color: #00428C;
}

li pre { margin-left: 0; }

/* for Bert as an ardent user of the old W3C slidemaker tool */

div.comment { display: none; visibility: hidden }

@media print { div.comment { display: block; visibility: visible } }


/* Ian insisted on preserving the cover photo's aspect ratio */
div.cover div.header {
  text-align: left;
}
div.cover {
  text-align: center;
}
#cover-photo {
  margin-top: 3em;
  height: 95%;
  width: 100%;
}

.cover-photo {
  height: 95%;
  width: 100%;
}

div.slide.clip {
  overflow: hidden;
}

/* for slides with class "title" in table of contents */
a.titleslide { font-weight: bold; font-style: italic }