<li>

  <li class="treenode">

      <p><tt>[% node.name %]</tt> (<em>repeated</em>)</p>

      <span class="treeline"><tt>[% node.name %]</tt> (<em>repeated</em>)</span>

      <p>

      <span class="treeline">

      </p>

      </span>

<ul>

<ul class="tree">

<ul>

<ul class="tree">

/* Indent each tree level. */
li.tree-line {

/* Indent each tree level and draw vertical tree lines next to all
   children except the last. */
ul.subtree > li {

    border-left: 0.1em solid #6185a0;

li.tree-line:last-child {

ul.subtree > li:last-child {

    border-left: 0;

/* Draw vertical tree lines next to all children except the last. */
li.tree-line {

/* Draw the vertical tree line to the last child. */
ul.subtree > li:last-child > *:first-child:before {

li.tree-line:last-child {
    border-left: 0;
}

span.tree-conn {

ul.subtree > li > *:first-child:before {
    content: "";

}
/* Draw the vertical tree line to the last child. */
li.tree-line:last-child > span.tree-conn {
    border-left: 0.1em solid #6185a0;

.tree-toggle {

/* Ensure that the + and - have the same size. */
a.tree-toggle {

    font-size: larger;

          <li class='tree-line'>
            <span class='tree-conn' />

          <li>