{{ block title }}
   Instructions
{{ endblock }}
{{ block content }}

  <style>
    .tab {
        display: none;
    }
</style>



{{include C.INSTRUCTION_TEMPLATE}}


<script>

    let activeTab = 0;
    let tabs = document.getElementsByClassName('tab');

    function showCurrentTabOnly() {
      for (let i = 0; i < tabs.length; i++) {
        let tab = tabs[i];
        if (i === activeTab) {
          tab.style.display = 'block';
          tab.scrollIntoView();
        } else {
          tab.style.display = 'none';
        }
      }
    }

    showCurrentTabOnly();
    for (let btn of document.getElementsByClassName('btn-tab')) {
        btn.onclick = function () {
            activeTab += parseInt(btn.dataset.offset);
            showCurrentTabOnly();
        }
    }
</script>

{{ endblock }}