{% extends "global/Page.html" %}
{% load otree static %}

{% block styles %}
    <style>
        .otree-timer {
            display: none;
        }
    </style>
{% endblock %}

{% block scripts %}
    <script>
        $(function () {
            $('.otree-timer__time-left').on('update.countdown', function (event) {
                if (event.offset.totalSeconds === 10) {
                    $('.otree-timer').show();
                }
            });
        });
    </script>
{% endblock %}

{% block title %}
    Welcome
{% endblock %}

{% block content %}
<div style="alignment: center;padding-bottom: 20px"> Please click "next" when you are ready to begin the experiment. </div>

    {% next_button %}

{% endblock %}