{{ block title }}
    Your codename is {{participant.participant_name}}.
{{ endblock }}

{{block style}}
<style>
    table, th, td {
  padding: 8px;}
    table td:first-child{
        border-right: 1px solid gray; }
    table th {
        border-bottom: 1px solid gray; }
</style>
{{endblock}}

{{ block content }}
    <p> You have been assigned to <span style ="font-weight: bold; color: blue"> {{if participant.in_GroupA}} Group A {{else}} Group B {{endif}} </span>,
        and your codename for this experiment will be <span style ="font-weight: bold; color: blue">{{participant.participant_name}}</span>.<br>

    <br>
    You will be interacting with the following participants (list includes you) during the experiment:<br>
    <table style="margin-left: auto;margin-right: auto; text-align:center; width=10cm; border-collapse: separate">

        <tr>
            <th>Group A </th> <th> Group B </th>
        </tr>
        <tr>
            <td> {{Aname1}}</td> <td> {{Bname1}}</td>
        </tr>
        <tr>
            <td> {{Aname2}}</td> <td> {{Bname2}}</td>
        </tr>
        <tr>
            <td> {{Aname3}}</td> <td> {{Bname3}}</td>
        </tr>
        <tr>
            <td> {{Aname4}}</td> <td> {{Bname4}}</td>
        </tr>
    </table>
    <i style="font-size:medium; color: blue"> Notice that participants' names always begins with the group letter that they are a member of. For example, all members of Group A are named after cities that begin with the letter 'A'.</i>
    </p>
    <hr>
    <p> <b> THE EXPERIMENT WILL BEGIN NOW.</b> <br>
    The experiment is organized in two parts.
    Instructions for Part I will be read out loud when everyone is ready.
    After the instructions are read out loud, the experimenter will share a passcode that you can enter below to proceed to Part I. </p>
    <span style="color: blue"> Enter the passcode to begin Part I:</span> {{formfields}}
    <button class="otree-btn-next btn btn-primary"> Begin Part I</button>

{{ endblock }}