local.css

      .highlight1 { 
      margin-left: -5px; 
      margin-right: -5px;   
      margin-top: -5px;
      margin-bottom: -5px;
      border-left: 5px solid rgba(176, 176, 0, .5); 
      border-right: 5px solid rgba(176, 176, 0, .5); 
      border-top: 5px solid rgba(176, 176, 0, .5);                            
      border-bottom: 5px solid rgba(176, 176, 0, .5);                                
      }     
    

      .lowlight1 { 
      margin-left: -5px; 
      margin-right: -5px;   
      margin-top: -5px; 
      margin-bottom: -5px; 
      border-left: 5px solid transparent; 
      border-right: 5px solid transparent; 
      border-top: 5px solid transparent;        
      border-bottom: 5px solid transparent;                                  
      }

      .highlight2 { 
      margin-left: -5px; 
      margin-right: -5px;   
      margin-top: -5px;
      margin-bottom: -5px;
      border-left: 5px solid rgba(176, 0, 176, .5); 
      border-right: 5px solid rgba(176, 0, 176, .5); 
      border-top: 5px solid rgba(176, 0, 176, .5);                            
      border-bottom: 5px solid rgba(176, 0, 176, .5);                                
      }     
      
      .lowlight2 { 
      margin-left: -5px; 
      margin-right: -5px;   
      margin-top: -5px; 
      margin-bottom: -5px; 
      border-left: 5px solid transparent; 
      border-right: 5px solid transparent; 
      border-top: 5px solid transparent;        
      border-bottom: 5px solid transparent;         
      }

      .highlight3 { 
      margin-left: -5px; 
      margin-right: -5px;   
      margin-top: -5px;
      margin-bottom: -5px;
      border-left: 5px solid rgba(0, 176, 176, .5); 
      border-right: 5px solid rgba(0, 176, 176, .5); 
      border-top: 5px solid rgba(0, 176, 176, .5);                            
      border-bottom: 5px solid rgba(0, 176, 176, .5);                                
      }     
      
      .lowlight3 { 
      margin-left: -5px; 
      margin-right: -5px;   
      margin-top: -5px; 
      margin-bottom: -5px; 
      border-left: 5px solid transparent; 
      border-right: 5px solid transparent; 
      border-top: 5px solid transparent;        
      border-bottom: 5px solid transparent;         
      }

      .highlight4 { 
      margin-left: -5px; 
      margin-right: -5px;   
      margin-top: -5px;
      margin-bottom: -5px;
      border-left: 5px solid rgba(176, 176, 176, .5); 
      border-right: 5px solid rgba(176, 176, 176, .5); 
      border-top: 5px solid rgba(176, 176, 176, .5);                            
      border-bottom: 5px solid rgba(176, 176, 176, .5);                                
      }     
      
      .lowlight4 { 
      margin-left: -5px; 
      margin-right: -5px;   
      margin-top: -5px; 
      margin-bottom: -5px; 
      border-left: 5px solid transparent; 
      border-right: 5px solid transparent; 
      border-top: 5px solid transparent;        
      border-bottom: 5px solid transparent;         
      }

      .example{
      margin-left: 0;
      margin-right: 2ex;
      margin-top: 0.1ex;
      margin-bottom: 0.1ex;
      border: thin solid #888888;
      padding: 1ex 2ex 0.5ex 2ex;
      page-break-inside: avoid;
      background-color: #f9f9f9
      }

      .pre{
      font-family: monospace;
      }

      .shex{
      font-family: monospace;
      tab-size: 4;
      line-height: 1.2;
      display: inline-block;
      border: thin dotted #888888;
      }

      .graph{
      font-family: monospace;
      tab-size: 4;
      line-height: 1.2;
      display: inline-block;
      border: thin dotted #888888;
      }

      .legend{
      display: inline-block;
      border: thin dotted #888888;
      }
      
      .shexj, .grammarTable tr.obj {
      margin-left: 0;
      margin-right: 0.1ex;
      margin-top: 0.1ex;
      margin-bottom: 0.1ex;
      border: thin solid #888888;
      padding: 1ex 2ex 0.5ex 2ex;
      page-break-inside: avoid;
      background-color: #F8F8F0;
      line-height: 1.5;
      font-family: monospace;
      }
      .shexj th { vertical-align: top; }

      p .json, li > .json {
      border: thin solid #E0F7E0;
      page-break-inside: avoid;
      background-color: #F0FFF0;
      line-height: 1.5;
      color: black;
      }

      div.json, div.shexc, div.repchoice {
        margin-left: 0;
        margin-right: 2ex;
        margin-top: 0.1ex;
        margin-bottom: 0.1ex;
        border: medium solid #E0F7E0;
        /* padding: .5ex 2ex .5ex 2ex; */ /* @@ disabled to align with line-lables */
        page-break-inside: avoid;
        background-color: #F0FFF0;
        line-height: 1.5;
	display: inline-block;
      }
      div.repchoice {
          position: relative;
      }
      div.repchoice button {
          position:absolute;
          top:0px;
          right:0px;
          font-size: 70%;
          background-color: transparent;
      }
      button.show-repchoice {
          font-size: 70%;
          background-color: transparent;
      }
      div.json pre, div.shexc pre {
	  margin: 0
      }
      pre.nohighlight { background: #fafafa; font-size: .9em; color: black; }

      .subst {  }

      .inline.json,.inline.shexc {
	  padding: 0; /* .5ex 0ex .5ex 0ex; */
	  margin: 0;
      }

      li p, li div.example {
	  margin: 0;
      }

      .grammarTable tr.obj {
      background-color: #F8F8F0;
      }

      .grammarTable tr:not(.obj) .param, .grammarTable tr .obj, .jobjref {
      background-color: #F8F8F0;
      border: thin solid #E8E8E0;
      }

      .abstrsynt {
      margin-left: 0;
      margin-right: 2ex;
      margin-top: 0.1ex;
      margin-bottom: 0.1ex;
      border: thin solid #888888;
      padding: 1ex 2ex 0.5ex 2ex;
      page-break-inside: avoid;
      background-color: #F0F8F8;
      line-height: 1.5;
      }
     
      .math, var {
      font-style: normal;
      font-family: sans-serif;
      color: #004444;
      }

      .as {
      font-style: normal;
      font-family: sans-serif;
      color: #000066
      }

      pre.schema.hljs.xquery { color: #070; border: thin solid #0f0; }
      pre.data.hljs.javascript { color: #007; border: thin solid #00f; }
      .inline .hljs { padding: 0; }
      .schema { color: #070; }
        .data { color: #007; }
/*      pre.schema:before { content: schema }
        pre.data:before { content: data   }
*/
      table td { vertical-align: top; }
      table th { text-align: center; }
      table { border-collapse: collapse; }
      td, th { border-style: solid; }
      .pass { background-color: #cfc; }
      .fail { background-color: #fcc; }
      span.fail { background-color: #fcc; }

      .param, a[href].param { color: #630; }
      .var { color: #056800; }
      .rdf { border-left: thick solid #77f; padding-left: .5em; }

/* Tuned to cope with different browsers behaviours */
div.grammarTable table	{ border-style: solid ;
			  border-width: 1px ;
			  border-color: #AAA ;
			  border-spacing: 0px ; 
			  border-collapse: collapse ; }

div.grammarTable table * { border-left-width: 0px ;
			   border-right-width: 0px ;
			   border-color: #AAA ; } 

div.grammarTable table * tr   { border-top-style: solid ;
			  border-top-width: 1px ;
			  border-top-color: #AAA ; } 

.grammar	{ text-align: left ;
                  vertical-align: top ; }


div.shexjTable table	{ border-style: solid ;
			  border-width: 1px ;
			  border-color: #AAA ;
			  border-spacing: 0px ; 
			  border-collapse: collapse ; }

div.shexjTable table * { border-left-width: 0px ;
			   border-right-width: 0px ;
			   border-color: #AAA ; } 

div.shexjTable table * tr   { border-top-style: solid ;
			  border-top-width: 1px ;
			  border-top-color: #AAA ; }

div.shexjTable th { text-align: right; }

.grammarTable tr.obj td:nth-child(2) { text-align: right; }
.grammarTable tr.obj td:nth-child(3) { text-align: right; }

.comment, .comment a[href] { color: #e20; font-style: italic; }

.relativeIRI { color: #058; }
.keyword { color: #c0c; }
.valueSet { font-style: italic }

.grammarTable .grammarParagraph /* needs .grammarTable specificity for at least FF and chromium */
    { border-left:thin solid white; border-right:thin solid white; }

.grammarTable tr.obj td:nth-child(1) {
    border: thin solid white;
    background-color: white;
    border-right: thin solid #AAA;
}

.grammarTable tr.params td:nth-child(1) {
    border: thin solid white;
    border-right: thin solid #AAA;
}

.grammarTable tr.params td:nth-child(2) {
    padding-left: .25em;
}

.label { font-weight: bold; }

.grammarParagraph {
    font-style: oblique;
}

/* Embarassing hack to occlude border on first <td/> */
/* Needed when the previous table ended with an empty 1st <td/> */
.borderHack {
    border-bottom: thick solid white !important;
}
.borderHack td:nth-child(1) {
    border-top:none !important;
}

.code {
  color: #C83500;
  font-family: Menlo, Consolas, "DejaVu Sans Mono", Monaco, monospace;
  font-size: .9em;
  page-break-inside: avoid;
  text-transform: none;
}
/* ul li div[float] paints the bullet on the right. */
.codelist li > div {
    /* adding a div creates a blank rest of line in the li */
    /* list-style-type: none; could shut off the bullets*/
    /* margin-top: -2.5ex; or push them up */
    display: inline-flex; /* inline-flex works but I've not researched why. */
}

.function { white-space: nowrap; }

      .example {
      display: inline-block;
      }
      .example.wrapper {
      background-color: #fff;
      }
      .example.wrapper pre {
      background-color: #fcfaee;
      margin-left: 0;
      line-height: 1.2;
      }
      .fake-example { background-color: #FCFAEE }
      .example.wrapper .fail {
      background-color: #fceefa
      }

.tight li { margin: 0; line-height: 1; }

.line-labels {
    float: left;
    padding: 0;
    margin: 0;
    text-align: right;
    border-top: solid medium transparent;
}

.trace li {
    list-style-type: none;
    font-style: normal;
    font-family: sans-serif;
    color: #003333;
    margin: 0 0 0 .5em;
    line-height: 1.2;
}

.trace ul {
    padding-left: 0;
    margin-left: .5em;
}

.leadup {
    margin-bottom: 0;
}

.followup {
    margin-top: 0;
}

.lineno.schema {
    border-radius: .4em;
    background-color: #ECEAEE;
    border: thin solid #DCDADE;
}

.lineno.data {
    border-radius: .4em;
    background-color: #ECFADE;
    border: thin solid #DCEACE;
}

.exsec, .validation span:nth-child(1) {
    font-weight: bold;
}

.lookit {
    font-weight: bold;
}

.repchoice pre {
    margin-top: 0;
    margin-bottom: 0;
}

.repchoice.error, div.example .error {
    background-color: #fff7f7;
    border: medium solid #efe7e7;
}

/* .repchosen::before { */
/*     text-align: right; */
/*     display: block; */
/*     font-size: 67%; */
/*     margin-top: -1ex; */
/*     margin-bottom: -2ex; */
/*     margin-right: -.5em; /\* @@ would like it to stick out -1em but gives horiz scrollbars *\/ */
/* } */

/* .inline .repchosen::before { */
/*     margin-top: -.2ex; */
/*     margin-right: 0; */
/* } */

/* .repchosen.json::before { */
/*     content: "𝙅/c"; */
/* } */

/* .repchosen.shexc::before { */
/*     content: "j/𝗖"; */
/* } */

.rephidden { display: none; }

.noreason { display: none; border-right: none; }

ol.algorithm {
  counter-reset: numsection;
  list-style-type: none;
}
ol.algorithm li {
  margin: 0.5em 0;
}
ol.algorithm li:before {
  font-weight: bold;
  counter-increment: numsection;
  content: counters(numsection, ".") ") ";
}

/* simupre (ab)uses respec's willingness to dive into non-<pre/>s */
.simupre { white-space: pre; font-family: monospace; }

dd > dl {
    margin-left: -2em;
    border-left: 2em solid #f7f7f7;
    Margin-top: 0;
}