<!--
/* encoding="UTF-8"

<h1>Xrem, croiser les remarques (documenteur)</h1>


[FG] Frédéric Glorieux <frederic.glorieux@diple.net>

10 ans de CSS pour présenter des sources XML.
*/

/* HTML5 */

section,
nav,
article,
aside,
hgroup,
header,
footer,
figure,
figcaption {
  display:block;
}

/* Différentes dispositions */


body.rng {
  padding:0;
  margin:0;
  font-family:"Lucida Sans Unicode", "Lucida Grande", sans-serif;
  font-size:13px;
}
body.rng h1 {
  text-align:center;
}
body.rng h3 {
  /*
  background-ccolor:#DADADA;
  background-image: -webkit-gradient(linear, left top, right top,from(#DADADA),to(#FFFFFF));
  background-image: -webkit-linear-gradient(left, #DADADA, #FFFFFF);
  background-image:    -moz-linear-gradient(left, #DADADA, #FFFFFF);
  background-image:     -ms-linear-gradient(left, #DADADA, #FFFFFF);
  background-image:      -o-linear-gradient(left, #DADADA, #FFFFFF);
  background-image:         linear-gradient(left, #DADADA, #FFFFFF);
  */
  border-bottom:1px solid #336699;
  padding-left: 1em;
  margin-top:2em;
  margin-bottom:1em;
}
.tree ul {
  padding:0;
  margin:0;
  padding-left:1em;
}
body.rng a {
  color:#369;
  text-decoration:none;
}

body.rng a:hover {
  text-decoration:underline;
}


body.rng ul.tree ul {
  padding-left:1ex;
  margin-left:1em;
}
body.rng p {
  text-align:justify;
}

body.rng #nav {
  top:0;
  position:fixed;
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -ms-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  padding:0 3px 2em 11px;
  height:100%;
  overflow:auto;
  width:27%;
  color:black;
  margin:0 0 0 0;
  font-family:Arial, sans-serif;
  font-size:13px;
  border-right:solid 1px #b3b3b3;
}
body.rng #nav header {
  padding:1ex 0;
  font-style:normal;
  font-weight:bold;
}
/* corps du document */
body.rng #article {
  padding:0;
  margin:3ex 5em 5em 30%;
  min-height:500px;
}
.transform a {
  border:none;
}
.match p,
.result p {
  text-indent:1em;
  line-height:110%;
  margin:0 0 0.5ex 0;
}

/*
 <h2>XML par <a href="./xml_html.xsl">xml_html.xsl</a></h2>
*/
.example {
  background-color: #FFFFFF;
  background-image: -webkit-gradient(linear, left top, right top,from(#FFFFFF),to(#DADADA));
  background-image: -webkit-linear-gradient(left, #FFFFFF, #DADADA);
  background-image:    -moz-linear-gradient(left, #FFFFFF, #DADADA);
  background-image:     -ms-linear-gradient(left, #FFFFFF, #DADADA);
  background-image:      -o-linear-gradient(left, #FFFFFF, #DADADA);
  background-image:         linear-gradient(left, #FFFFFF, #DADADA);
  border-left:1px dotted #808080;
  padding:1ex 1em;
  margin:0;
}
.xml {
  font-size:14px;
  line-height:105%;
  text-align:left;
}


  /* element names */
.xml .tag a,
.xml .tag a:visited,
.xml .open a,
.xml .open a:visited,
.xml .close a,
.xml .close a:visited {
  text-decoration:none;
  border-bottom:none;
  border:none;
  padding:0;
}
.xml a.val {
  color:#0000FF;
}
.xml a.val:hover {
  text-decoration:underline;
  border:none;
}

  /* classes are provided for namespace prefix */
a.xsl,
a:visited.xsl {
  font-family: Arial, sans-serif;
  color:#669966;
  font-weight:100;
  text-decoration:none;
  border:none;
}
a:hover.xsl,
a:hover.rdf {
  background:#0000FF;
  color:white;
}

a.html,
a:visited.html,
a.dc,
a:visited.dc {
  color:#FF0000;
  font-weight:bold;
  text-decoration:none;
  border:none;
}
a:hover.html,
a:hover.dc,
a:hover.template,
a:focus.template  {
  background:red;
  color:white;
}

a.template,
a:visited.template {
  font-family: Verdana, arial, sans-serif;
  font-weight:bold;
}
  /* element names */
.xml .el,
.xml  a.el {
  font-weight:bold;
  font-family: "Lucida Console", Courier, "MS Courier New", monospace;
  text-decoration:none;
  color:#961716;
  border:none;
}
.xml a:hover.el,
.xml a:hover.att {
  background:#8080FF;
  color:#FFFFFF;
}

  /* attribute names */
.xml .att {
  font-family:Arial, sans-serif;
  font-weight:100;
}
.xml a .att {
  font-family:Arial, sans-serif;
  color:#444;
}
/* tag is what is between brackets */
.xml .open,
.xml .close,
.xml .tag {
  margin:0;
  font-family:monospace, sans-serif;
  /* font-size:80%; */
  color:#669966;
}
.xml .fold {
  color:#666666;
}

/* processing instructions */
.xml .pi {
  color:#008000;
  font-weight: bold;
}

/* textual contents */
.xml .val,
.xml .cdata {
  font-weight:normal;
  color:#000;
  margin:0;
  padding:0;
}

  /* xml comment */

.xml .comment,
.xml .comment code {
  font-size:12px;
  line-height:125%;
  background:#FFE;
  color:#666;
  /*
  border:solid #CCCCCC 1px;
  padding:1px 1em;
  margin:0;
  color:#000000;
  font-weight: 100;
  width:auto;
  margin-right:3em;
  */
}

.xml  pre.comment {
  margin:0;
  padding:0;
}

  /* button for +/- and margins */

/*
  a.click {
  border:1px dotted #808080;
  color:#000000;
  font-weight:900;
  text-decoration:none;
  border:none;
  }
*/

dd.code {
  /* line-height:105%; */
  margin:0 !important;
  padding:0 !important;
  padding-left:1em !important;
  border-left: 1px dotted #808080;
}

.pre .text {
  background:#EEF;
  font-family:serif;
  color:#000;
}

.xml span.text {
  color:#000;
}

.xml .cdata {
  color:red
}

.xml .ns {
  color:#000080;
  font-weight:100;
}

/* properties  */

dt {
  font-weight:bold;
}
dl.xml {
  margin:0;
  padding:0;
}
dl.xml dt {
  font-weight:normal;
}
details.source {
  margin-left:1em;
  float:right;
  max-width:60%;
  background:#FFFFFF;
}
details.source summary {
  float:right;
  display:inline;
  text-align:right;
}
details > * {
  display:none;
}
details.minus > * {
  display:block;
}

fieldset {
  margin:1em 0 1ex 0;
  padding:0 1ex 0 1ex;
  border:1px dotted #363;
  -moz-border-radius:1ex;
  -webkit-border-radius:1ex;
  white-space:normal;
}
.xsl-var {
  margin-top:1ex;
}
.output {
  color:#961716;
  font-family: "Lucida Console", Courier, "MS Courier New", monospace;
  font-size:13px;
  line-height:110%;
  text-indent:0;
  text-align:left;
}
.template {
  margin: 1em 0 0 0;
  clear:both;
}
.template header {
  border:none;
  padding:0;
  border-bottom:#888 1px solid;
}
/*
.template ul,
.template p {
  margin-top:0;
  margin-bottom:0;
}
*/

/*
 <h2>Relax-NG par <a href="./rng_html.xsl">rng_html.xsl</a></h2>
*/

section.element,
section.define {
  margin-top:2em;
}
section.attribute {
  margin-top:1em;
}


.documentation {
  margin: 1ex 0 1em 0;
}
a.define,
a.ref,
a:link.define,
a:link.ref,
header.define {
  color:#363;
  font-style:italic;
}
span.less span.refin .toggle {
  display:none;
}
span.more .toggle {
  background-image:url('http://subversion.cru.fr/diple/trunk/modules/xrem/more.png');
}
span.less .toggle {
  background-image:url('http://subversion.cru.fr/diple/trunk/modules/xrem/less.png');
}
a.toggle {
  background-position:1px center;
  background-repeat:no-repeat;
  cursor:pointer;
  padding-left:7px;
  padding-right:7px;
  border:1px solid transparent;
  padding-top:1px;
  padding-bottom:1px;
  margin-left:2px;
}
a.toggle:hover {
  border:1px inset #DDDDDD;
  text-decoration:none;
  border:none;
}
/* cacher/montrer l'expansion d'une classe */
span.more span.refin {
  display:none;
}
span.less span.refin {
  display:block;
}

/* indentation de la notation compacte des entités */
span.less span.refin {
  display:block;
  margin-left:0.5ex;
  border-left:1px dotted #888;
  padding-left:3ex;
  /* text-indent:-3ex; */
}

/* indentation des groupes d'usage */
ul.values {
  color:#000;
  margin-top:0;
  margin-bottom:0;
  padding-top:0;
  margin-bottom:0;
}
section.rng {
  margin:2em 0 0 0;
}
header.rng {
  font-weight:bold;
  font-size:110%;
  margin-bottom:1ex;
  padding:0;
  border:none;
}
header.rng a {
  color:#77A;
}
section.rng section.rng header {
  padding-left:2em;
}
section.rng section.rng section.rng header {
  padding-left:4em;
}
section.rng section.rng section.rng section.rng header {
  padding-left:6em;
}
/*
 * Tableau technique Relax-NG
 */
table.grammar {
  background-color:#FFFFFF;
  background-image: -webkit-gradient(linear, left top, right top,from(#FFFFFF),to(#DADADA));
  background-image: -webkit-linear-gradient(left, #FFFFFF, #DADADA);
  background-image:    -moz-linear-gradient(left, #FFFFFF, #DADADA);
  background-image:     -ms-linear-gradient(left, #FFFFFF, #DADADA);
  background-image:      -o-linear-gradient(left, #FFFFFF, #DADADA);
  background-image:         linear-gradient(left, #FFFFFF, #DADADA);
  border-collapse:collapse;
  width:100%;
  line-height:105%;
  border-left:1px dotted #808080;
}
/* ?? */
table.grammar tt {
  color:#000;
}
header.attribute {
  color:#666;
}

table.grammar td {
  color:red;
  padding:0 1ex;
  line-height:1.1em;
}

table.grammar th {
  font-family:Helvetica, Arial, "DejaVu Sans Light ", sans-serif;
  font-size:12px;
  width:10ex;
  vertical-align:top;
  padding:0 1ex;
  background:#DADADA;
  border-bottom:1px solid #FFFFFF;
  font-weight:normal;
}
.grammar a {
  font-family:Helvetica, Arial, "DejaVu Sans Light ", sans-serif;
  color:#315BA7;
  border:none;
}

em.value {
  color:#000;
}

/*
 <h2>PHP</h2>
*/

pre.php {
  white-space: pre-wrap;
  font-size:14px;
  color:red;
}
.pre {
  white-space: pre-wrap;
}
code.function {
  color:#A82C37;
}
span.function {
  font-family:Frutiger,"Deja Vu Sans",Helvetica,sans-serif;
  color:#000;
}
a.function {
  font-family:Frutiger,"Deja Vu Sans",Helvetica,sans-serif;
}
a.function:hover {
  text-decoration:underline;
}

pre.php b.construct {
  font-family:Frutiger,"Deja Vu Sans",Helvetica,sans-serif;
  color:#000;
}

pre.php var {
  font-family:Frutiger,"Deja Vu Sans",Helvetica,sans-serif;
  color:#000000;
  font-style:normal;
}

code.string {
  color:#060;
}
/* comments */
.comment {
  font-family:sans-serif;
  color:#000;
}
/* line comments, choice si make them readable the pore as possible */
span.comment {
  color:#888;
  font-style:normal;
}
/* sample code in a comment */
fieldset.comment pre {
  color:#008;
}
div.comment {
  white-space: normal;
}

code.integer {
  color:#FF0000;
  font-weight:bold;
}
code.php-tag {
  color:#FF0000;
}
code.numeric {
  color:#FF0000;
  font-weight:bold;
}
code.constant {
  color:#000000;
}
tt.op {
  background:none repeat scroll 0 0 #EEEEEE;
  color:#000000;
}
code.defined {
  color:red;
}
code.whitespace {
  white-space:pre;
}
code.curly {
  background:none repeat scroll 0 0 #FFAAAA;
}
code.parenthese {
  background:none repeat scroll 0 0 #AAFFAA;
}
code.square {
  background:none repeat scroll 0 0 #AAAAFF;
}
code.error-control {
  background:none repeat scroll 0 0 #FF0000;
  font-weight:bold;
}
--><o/>