{{ block title }}
    Task 3 of 3
{{ endblock }}

{{ block content }}
<style>
ul {
  font-size: 18px;
}
</style>


    <img src="{{ static 'comb_inst.png' }}" width="700"/>
<ul>
    <li>The one who stops first will get 80% of the total money in the box at that time, and the other one gets the remaining 20%.</li>
     <li>If both stop at the same time, they will equally divide the money in the box.</li>
</ul>
{{ formfields }}
After <span id="timer">60</span> seconds you can move to the next page whenever you are ready. <br>
<span style="color:red">If you do not move to the next page, your answer will not be recorded, and you will not get paid.</span> <br>
<button class="o-tree-btn-next btn btn-primary" id="Next" style="visibility:hidden;">Next</button>
<script>
    window.onload = function () {
    setTimeout(function(){document.querySelector("#Next").style.visibility = "visible";}, 120000);
}

var startTime, countAmt, interval;

function now() {
return ((new Date()).getTime());
}

function tick() {
var elapsed = now() - startTime;
var cnt = countAmt - elapsed;
var elem = document.getElementById("timer");
if (cnt > 0) {
elem.innerHTML = Math.round(cnt / 1000);
} else {
elem.innerHTML = "0";
clearInterval(interval);
}
}

function startTimer(secs) {
clearInterval(interval);
document.getElementById("timer").innerHTML = secs;
countAmt = secs * 1000;
startTime = now();
interval = setInterval(tick, 1000);
}

startTimer(120);



</script>

{{ endblock }}