{% block title %}
<center>Thank you for your participation</center>
{% endblock %}

{% block styles %}
    <style>
        button {
            width: 20em;
        }

        button .msg {display: none}
        button:hover .cover {display: none}
        button:hover .msg {display: inline}
    </style>
{% endblock %}

{% block content %}

<br>

            <h5>Please remain seated and do not disturb other participants</h5>
            <p>While the session has finished for you, other participants may not have finished yet.</p>

<h5>Please sign your receipt</h5>
            <p>An experimenter will come to your cubicle with a receipt.
                Verify that the payment is correct and then sign the receipt.
                If you are not sure about anything, raise your hand and an experimenter will come to your cubicle.</p>
            <p>Note: If you hover over the boxes below, you will be able to see a reminder of your participant ID
                and your final earnings.</p>

            <h5>Please stay seated until you have been told that you may leave</h5>
            <p>An experimenter will come to your cubicle to collect your receipt and let you know that you can leave
                the lab.</p>
            <p>It is very important that we collect a complete set of signed receipts and that the instructions and
                other materials (lab number card and pen) remain on your desk.
                To ensure this happens, and avoid disturbing others, we will let participants leave one at a time.</p>
            <p>Please be patient. We will endeavor to get this completed as soon as possible.
                If you have signed your receipt, please feel free to collect your belongs together and prepare to leave
                the lab, so long as that does not involve disturbing the other participants.</p>



            <h5> To remind you</h5>
            <div class="row" hidden>
               <div class="col">
                   <p>Your lab number is the number of the computer cubicle that you are sitting at, which is also the
                       number on the card you were given before entering the lab.</p>
               </div>
            </div>
            <div class="row justify-content-between">
                <div class="col">
                    <p>Your participant ID code can be revealed here:</p>
                </div>
                <div class="col">
                    <button type="button" class="btn btn-primary btn-large" >
                        <em class="cover">{{ hover_message }}</em>
                        <em class="msg">{{ redemption_code }}</em>
                    </button>
                </div>
            </div>
            <div class="row justify-content-between">
                <div class="col">
                    <p>Your final payment can be revealed again here:</p>
                </div>
                <div class="col">
                    <button type="button"  class="btn btn-primary btn-large" >
                        <em class="cover">{{ hover_message }}</em><em class="msg">{{ total_payoff }}</em>
                    </button>
                </div>
            </div>

<br>
            <h5>If you have any questions or concerns about today's session</h5>
            <p>Please contact Paweł Dziewulski (p.k.dziewulski@sussex.ac.uk).</p>

{% endblock %}