{{ block title }}
Numerical Reasoning
{{ endblock }}

{{ block content }}
<style>
 {{ include C.STYLE }}
</style>

{#<div id="intro-page"><!-- intro text and start button -->#}
{#  <div id="intro-text">#}
{#    <p>Click the start button to begin the game.</p>#}
{# </div>#}
{#  <button id="start-button" onclick="startGame()">Start Game</button>#}
{#</div>#}

<div class ="box" id="game-page" >
    <div class="item left-column">
    <div class="qs" id="question"></div>
    <div class="opt" id="options"></div>

    </div>

    <div class="item right-column" id="right-column">


<!-- Add the score widget -->
      <div class="scr" id="scores">
      </div>

    </div>
    <input type="hidden" name="raw_responses" id="raw_responses">
    </div>

<script>


    {{ include C.TIMED_QUIZ }}
    {#document.addEventListener("DOMContentLoaded", function (event) {#}
    {#    $('.otree-timer__time-left').on('update.countdown', function (event) {#}
    {#        if (event.offset.totalSeconds === 59) {#}
    {#            responses['last_id'] = trials[trialIndex]['q_ID'];#}
    {#            document.getElementById('raw_responses').value = JSON.stringify(responses);#}
    {#        }#}
    {#    });#}


</script>

{{ endblock }}