<!DOCTYPE html>
<html lang="en">
  <head>
    <title>{{TITLE}}</title>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css" integrity="sha512-1ycn6IcaQQ40/MKBW2W4Rhis/DbILU74C1vSrLJxCq57o941Ym01SwNsOMqvEBFlcgUa6xLiPY/NS5R+E6ztJQ==" crossorigin="anonymous" referrerpolicy="no-referrer">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/css/bootstrap.min.css" integrity="sha384-KyZXEAg3QhqLMpG8r+8fhAXLRk2vvoC2f3B09zVXn8CA5QIVfZOJ3BCsw2P0p/We" crossorigin="anonymous">
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.0/dist/js/bootstrap.bundle.min.js" integrity="sha384-U1DAWAznBHeqEIlVSCgzq+c9gqGAJn5c/t99JyeKa9xxaYpSvHU5awsuZVVFIhvj" crossorigin="anonymous"></script>
    <script type="text/javascript" async
      src="https://cdn.jsdelivr.net/npm/mathjax@2/MathJax.js?config=TeX-AMS_CHTML">
    </script>
    <script type="text/javascript">
      window.addEventListener("load", () => {
        for (let i of document.querySelectorAll(".collapse ul")) {
          let tog = document.createElement("div");
          tog.innerHTML = i.previousSibling.textContent;
          tog.className = "toggle";
          tog.onclick = () => tog.classList.toggle("show");
          i.parentElement.removeChild(i.previousSibling);
          i.parentElement.insertBefore(tog, i);
        }
      });
      // Open the collapsible demo an "#example" link points to, then scroll to
      // it.  getElementById (not querySelector) matches ids that contain a dot,
      // e.g. "Class.method-example1".
      function openHashTarget () {
        if (! window.location.hash) { return; }
        let el = document.getElementById (
          decodeURIComponent (window.location.hash.slice (1)));
        if (! el) { return; }
        if (el.classList.contains ("collapse") &&
            ! el.classList.contains ("show")) {
          bootstrap.Collapse.getOrCreateInstance (el).show ();
        }
        el.scrollIntoView ();
      }
      window.addEventListener ("DOMContentLoaded", openHashTarget);
      window.addEventListener ("hashchange", openHashTarget);
      // When the collapsible named by the current URL fragment is collapsed,
      // drop the fragment (replaceState: no scroll, no history entry).  Otherwise
      // the fragment would still equal this id, so clicking the same #example
      // link again fires no "hashchange" and the example would not re-expand.
      document.addEventListener ("hide.bs.collapse", (e) => {
        if (e.target.id && window.location.hash === "#" + e.target.id) {
          history.replaceState (null, "",
            window.location.pathname + window.location.search);
        }
      });
    </script>
    <style>
    h5.fs {
    margin-top: -0.15em;
    margin-bottom: -0.15em;
    }
    h6:hover {
      color: gray;
    }
    code {
    font-family: Consolas, "Courier New", monospace;
    border-radius: 0.3em;
    white-space: nowrap;
    color: gray;
    }
    code.description {
    font-family: Consolas, "Courier New", monospace;
    border-radius: 0.3em;
    white-space: normal;
    font-size:1.2em;
    color: gray;
    }
    var {
    font-family: Consolas, "Courier New", monospace;
    border-radius: 0.3em;
    font-style: normal;
    font-weight: bold;
    color: gray;
    }
    td {
      vertical-align: top;
    }
    [id^="togList"],                        /* HIDE CHECKBOX */
    [id^="togList"] ~ .list,                /* HIDE LIST */
    [id^="togList"] + label  span + span,   /* HIDE "Collapse" */
    [id^="togList"]:checked + label span{   /* HIDE "Expand" (IF CHECKED) */
      display:none;
    }
    [id^="togList"]:checked + label span + span{
      display:inline-block;                 /* SHOW "Collapse" (IF CHECKED) */
    }
    [id^="togList"]:checked ~ .list{
      display:block;                        /* SHOW LIST (IF CHECKED) */
    }
    </style>
  </head>
  <body>
{{BODY}}
  </body>
</html>
