/* This is heavily based on the W3C Working Draft stylesheet */

html { margin: 0; padding: 0; color: black; background: white; }

body { margin: 0; background: top left fixed no-repeat; }

:link { color: #00C; background: transparent }
:visited { color: #609; background: transparent }
:link:active, :visited:active { color: #C00; background: transparent }
:link:hover, :visited:hover { background: #ffa; }

h1, h2, h3, h4, h5, h6 { text-align: left }
h1, h2, h3 { color: #005A9C; background: transparent; }
h1 { font: 170% sans-serif }
h2 { font: 140% sans-serif }
h3 { font: 120% sans-serif }
h4 { font: bold 100% sans-serif }
h5 { font: italic 100% sans-serif }
h6 { font: small-caps 100% sans-serif }

.hide { display: none }

div.head { margin-bottom: 1em }
div.head h1 { margin-top: 2em; clear: both }
div.head table { margin-left: 2em; margin-top: 2em }
div.head img { color: white; border: none } /* remove border from top image */

p.copyright { font-size: small }
p.copyright small { font-size: small }

ul.toc {
  list-style: disc;		/* Mac NS has problem with 'none' */
  list-style: none;
}

@media aural {  
  h1, h2, h3 { stress: 20; richness: 90 }
  .hide { speak: none }
  p.copyright { volume: x-soft; speech-rate: x-fast }
  dt { pause-before: 20% }
  code, pre { speak-punctuation: code } 
}

body.draft {
  background-image: url(wd.png);
}

body.spec {
  background-image: url(rec.png);
}

body, th, td {
  font-family: sans-serif;
}

pre, code {
  font-family: monospace;
}

.note {
  font-family: sans-serif;
}

p.note:before {
  content: 'Note: ';
}

/* overall semantic structure presentation */
body { padding: 2em 1em 2em 8.5em; line-height: 1.35; }
pre { margin-left: 2em }
h1 + h2 { margin-top: 0; }
h2 { margin: 3em 0 1em 0; }
p { margin: 1em 0; }
dl, dd { margin-top: 0; margin-bottom: 0; }
dt { margin-top: 0.75em; margin-bottom: 0.25em; clear: left; }
dd dt { margin-top: 0.25em; margin-bottom: 0; }
dd p { margin-top: 0; }
p + * > li, dd li { margin: 1em 0; }
dt, dfn { font-weight: bold; font-style: normal; }
pre, code { font-size: inherit; font-family: monospace; }
pre strong { color: black; font: inherit; font-weight: bold; background: yellow; }
pre em { font-weight: bolder; font-style: normal; }
var sub { vertical-align: bottom; font-size: smaller; position: relative; top: 0.1em; }
table { border-collapse: collapse; border-style: hidden hidden none hidden; }
table thead { border-bottom: solid; }
table tbody th:first-child { border-left: solid; }
table td, table th { border-left: solid; border-right: solid; border-bottom: solid thin; vertical-align: top; padding: 0.2em; }
blockquote { margin: 0 0 0 2em; border: 0; padding: 0; font-style: italic; }
ins { background: green; color: white; /* color: green; border: solid thin lime; padding: 0.3em; line-height: 1.6em; */ text-decoration: none; }
del { background: maroon; color: white; /* color: maroon; border: solid thin red; padding: 0.3em; line-height: 1.6em; */ text-decoration: none; }
body ins, body del { display: block; }
body * ins, body * del { display: inline; }
li img { vertical-align: bottom; border: 0px; margin-right: 3px; }

/* classes */

ul.toc dfn, h1 dfn, h2 dfn, h3 dfn, h4 dfn, h5 dfn, h6 dfn { font: inherit; }
img.extra { float: left; }
hr.bookmark { border: dashed 2em black; background: yellow; }
pre.idl { border: solid thin; background: #EEEEEE; color: black; padding: 0.5em; }
pre.idl :link, pre.idl :visited { color: inherit; background: transparent; }
code.property-name { background: #FFFFCC; color: black; }
code.method-name { background: #CCCCFF; color: black; }
code.parameter-name { background: #FFCCFF; color: black; }
code.constant-name { background: #CCFFCC; color: black; }

.issue { color: #E50000; background: white; opacity: 0.9; }
.big-issue { color: #E50000; background: white; border: solid red; padding: 0.5em; margin: 3em 0; }
.big-issue > :first-child { margin-top: 0; }
.note { color: green; background: transparent; }
.note { font-weight: bolder; font-style: italic; padding: 0.5em 2em; }

.big-issue li { margin: 1em; }
.big-issue .open { background: #FFEEEE; color: #FF0000; }
.big-issue .progress { background: #FFEECC; color: #FF9900; }
.big-issue .closed { background: #EEEEEE; color: #666666; font-size: 0.8em; }
.big-issue .open:before { background: white; border: solid #FF0000; color: black; content: "OPEN"; margin: 0 1em 0 0; padding: 0 0.2em; }
.big-issue .progress:before { background: white; border: solid #FF9900; color: black; content: "ALMOST RESOLVED"; margin: 0 1em 0 0; padding: 0 0.2em; }
.big-issue .closed:before { background: white; border: solid thin #666666; color: black; content: "CLOSED"; margin: 0 1em 0 0; padding: 0 0.2em; }

.big-issue li > .status { display: none; }

.issue {
  position: absolute;
  top: auto;
  left: 0;
  margin: -1.5em 0.2em 0.2em 0.2em;
  border: solid thin;
  padding: 0.35em;
  width: 12em;
  text-align: left;
  font-size: 0.6em;
}

.issue:hover {
  z-index: 1;
}

.issue:before {
  content: '\25B6';
  display: block;
  text-align: right;
  position: absolute;
  left: 100%;
  top: 0;
}

.critical { margin: 1em; border: double thick red; padding: 1em; background: #FFFFCC; }
.critical > :first-child { margin-top: 0; }

.example {
  display: block;
  color: #222222;
  background: #FCFCFC;
  border-left: double;
  margin-left: 1em;
  padding-left: 1em;
}