@namespace "http://www.w3.org/1999/xhtml";

span.ignore { display: none }

code[class="literal"] strong { color: purple }
p[class="synopsis"] code strong { color: purple }
p[class="synopsis"] code[class="function"] { color: purple }
p[class="synopsis"] code[class="varname"] { color: purple }

p[class="synopsis"][kind="Procedure"] code[class="function"]:before,
  p[class="synopsis"][kind="Predicate"] code[class="function"]:before,
  p[class="synopsis"][kind="Constructor"] code[class="function"]:before,
  p[class="synopsis"][kind="Syntax"] code[class="function"]:before
{ content: "("; font-weight: bold; font-family: monospace; color: purple; }
p[class="synopsis"][kind="Procedure"]:after,
  p[class="synopsis"][kind="Predicate"]:after,
  p[class="synopsis"][kind="Constructor"]:after,
  p[class="synopsis"][kind="Syntax"]:after
{ content: ")"; font-weight: bold; font-family: monospace; color: purple }

p.synopsis span.kind { float: right; padding-left: 2em }
p.synopsis span.kind:before { content: "[" }
p.synopsis span.kind:after { content: "]" }
p.synopsis > code { font-weight: bold; }
blockquote { margin-left: 40px; margin-right: 40px }

strong.userinput { background-color: #FFFFD0 } /* a pale yellow */
span.userinput { background-color: #FFFFD0 } /* a pale yellow */
span.prompt { background-color: #E0FFE0 } /* a pale green */

body.mainbar {
    background: #fffff5;
    padding-left: 25%;
}
div[node][hidden] {
    top: 0pt; bottom: 0pt;
    position: absolute;
    display: none
}

div[node] {
    left: 25%;
    width: 75%; height: auto;
    top: 0pt; bottom: 0pt;
    position: absolute;
    overflow: hidden;
}
/* The initial contents are put into a separate node.  Unlike the other
 *  nodes, it is *not* in an <iframe>, so needs different handling. */
div[node]#index {
    overflow: auto
}
div[node]#index header {
    margin: 8px;
}
iframe.node {
   width: 100%; height: 100%; border: none; margin: 0px;padding: 0px;
}

iframe[name="slider"] {
    position: fixed;
    top: 0em; right: 25%; bottom: 0em; left: 0em;
    height: 100%;
    width: 25%;
    overflow: scroll;
    border: none;
}

body.toc-sidebar div img {
    border: none;
    padding: 4px;
    float: right;
    width: 40%;
    height: auto
}
body.toc-sidebar header {
    font-size: xx-large;
}
div.toc ul[toc-detail] {
    display: none
}
div.toc a[toc-current] {
  font-weight: bold
}
div.toc li {
  display: block;
  text-indent: 0;
  text-align: left;
  border: solid;
  border-width: 1px 0px 0px 1px;
  border-color: #AAA #666 #666 #AAA;
  list-style: none }     /* Remove triangle from H2 */
div.toc ul
{
    margin: 0px;
    padding: 0px;
    list-style-type: none;
}
body.toc-sidebar div { padding: 0.4ex; overflow: auto }
body.toc-sidebar { background-color: #F4FCFF; margin: 0pt }
body.toc-sidebar a { text-decoration: none }
div.toc { background-color: #F4FCFF }
div.toc li { padding: 0px 4px;}
div.toc li { margin: 0 ; }

div.toc nav {padding: 0; margin: 0 }
div.toc ul {padding: 0; margin: 0 }

div.toc ul ul, div.toc ul ul { margin-left: 1em; }
body.toc-sidebar a:hover, body.toc-sidebar a:hover div {
    color: #fff;
    background-color: #69C;
}
