{{ block title }}Introduction{{ endblock }}
{{ block content }}

    <link rel="stylesheet" type="text/css"
    href="{{ static 'global/matrix.css' }}"/>

    <p>
        You have been randomly and anonymously paired with another participant. One of you will be selected at random to be participant A; the other will be participant B. You will learn whether you are participant A or B prior to making any decision. 
    </p>

    <p>
        Participant A and B must choose either option 1 or 2. This gives four possible outcomes, each with a different payoff, as shown in the table: 
    </p>


    <p><i>In each cell, the amount to the left is the payoff for participant A and to the right for participant B.</i></p>

    <table class='table table-bordered text-center'
           style='width: auto; margin: auto'>
        <tr>
            <th colspan=2 rowspan=2></th>
            <th colspan=2>Participant B</th>
        </tr>
        <tr>
            <th>Option 1</th>
            <th>Option 2</th>
        </tr>
        <tr>
            <th rowspan=2><span style="transform: rotate(-90deg);">Participant A</span></th>
            <th>Option 1</th>
            <td>{{ Constants.both_cooperate_payoff }}, {{ Constants.both_cooperate_payoff }}</td>
            <td>0, {{ Constants.betray_payoff }}</td>
        </tr>
        <tr>
            <th>Option 2</th>
            <td>{{ Constants.betray_payoff }}, 0</td>
            <td>{{ Constants.both_defect_payoff }}, {{ Constants.both_defect_payoff }}</td>
        </tr>
    </table>

    <ul>
        <li>
            If both of you choose different strategies, the one with option 1 will get {{Constants.betrayed_payoff}} and the other will get {{Constants.betray_payoff}}. 
        </li>
        <li>
            If you both choose option 2, both of you will get {{Constants.both_defect_payoff}}. 
        </li>
        <li>
            If you both choose option 1, you both gain a reasonable amount of {{Constants.both_cooperate_payoff}}.  
        </li>
    </ul>
    <p>
        Participant A is the first mover and can decide to choose option 1 or 2 towards participant B. After that, participant B (the second mover) will be announced the decision of participant A and participant B have to decide whether he/she should choose option 1 or 2.
    </p>


    {{ next_button }}

{{ endblock }}