@charset "utf-8";

 h1 {color: blue}
 h2 {color: blue}
 
    #example{ margin:auto;}
    
ul, ol, dl { margin-top: 1em; margin-bottom: 1em; }
li { margin-top: 0.5em; margin-bottom: 0.5em; }

@counter-style bracketed{
    system: extends decimal;
    prefix: '[';
    suffix: ']';
}

ol{
      margin: 3px 10px 3px 10px;
      padding: 0 2em 0 2em ;
}
ol li{
      list-style-type:none;
      list-style-position: inside; 
      counter-increment: cnt;
      margin-reft: 1.5em;
      text-indent: -1.5em;
}
ol li:before {
      display: marker;
      content: "(" counter(cnt) ") ";
}

ol.bracketed{
    list-style-type: bracketed;
}

ol.bracket{
    list-style-type:none;
    counter-reset: cnt;
}
ol.bracket li{
  counter-increment: cnt;
}
ol.bracket li::before {
    content: "["counter(cnt) "] ";
}

ol.paren{
    list-style-type:none;
    counter-reset: cnt;
}
ol.paren li{
  counter-increment: cnt;
}

ol.paren li::before {
  content: "("counter(cnt) ") ";
}


body {line-height: 150%;}

bb {
 font-weight: bold;
 color: blue;
 display: inline; 
 }
bbb {
 color: blue;
 display: inline; 
 }
 rr {
 font-weight: bold;
 color: red;
 display: inline; 
 }
 rrr {
 color: red;
 display: inline; 
 }
 or {
 font-weight: bold;
 color: orange;
 display: inline; 
 }
 gg {
 font-weight: bold;
 color: green;
 display: inline; 
 }
dgg {
 font-weight: bold;
 color: darkgreen;
 display: inline; 
}
mg {
 font-weight: bold;
 color: magenta;
 display: inline; 
}
 vv {
 font-weight: bold;
 color: magenta;
 display: inline; 
 }
 yy {
 font-weight: bold;
 color: gold;
 display: inline; 
 }
pp {
 font-weight: bold;
 color: purple;
 display: inline; 
}

kl{      counter-increment: cnt -1;}
lm{      counter-increment: cnt -1;}
lp{      counter-increment: cnt 1;}
lpG{      counter-increment: cnt 5 ;}
lmG{      counter-increment: cnt -5 ;}
#xyz1 {display: none;}
#bt1 {display: none;}