{% load otree_tags staticfiles %}

<div class="instructions well well-lg">

    <div>
        <p>
            Here you are asked to consider a series of choices <em>as if</em> they had real financial consequences. <br>
            Please try to be as accurate as possible in assessing how you would choose in each situation.
        </p>
    </div>

        <hr>
    <div>
        <p>
            Consider that you have been randomly paired with another person, whom we will refer to simply as
            <strong>the other</strong>. This other person is someone you do not know and will remain mutually anonymous.
            All of your choices are completely confidential. You will be making a series of choices about
            allocating resources between you and this other person. You will indicate your choices by <strong>selecting
            either column A, B, or C</strong> on each of the following directions. Your decisions yield money for
            both yourself and the other person.
        </p>
    </div>

    <div>
        <p>
            In the example below, a person has chosen to distribute money so that he/she receives £100, whereas the anonymous other person receives £50. The person has marked his/her
            choice by circling the corresponding column B. As you can see, your choices will influence both
            the amount of money you receive and the amount of money the other receives.
            Before you begin, please keep in mind that there are no right or wrong answers - for each question
            choose the option that you prefer most. When you have made all your decisions, <strong>press the Continue
            button at the bottom of the screen</strong> to complete this decision task.
        </p>
    </div>

    <div class="tdm-item" align="center" style="margin-top: 2em; margin-bottom: 2em;">
        <table>
            <tr>
                <th class="tdm-cell">EXAMPLE</th>
                <th class="tdm-cell tdm-choice"><strong>A</strong></th>
                <th class="tdm-cell tdm-choice"><strong>B</strong></th>
                <th class="tdm-cell tdm-choice"><strong>C</strong></th>
            <tr>
                <td class="tdm-cell"><strong>You receive</strong></td>
                <td class="tdm-cell tdm-choice">90</td>
                <td class="tdm-cell tdm-choice">100</td>
                <td class="tdm-cell tdm-choice">90</td>
            </tr>                                    <tr>
            <td class="tdm-cell"><strong>Other receives</strong></td>
                <td class="tdm-cell tdm-choice">0</td>
                <td class="tdm-cell tdm-choice">50</td>
                <td class="tdm-cell tdm-choice">90</td>
            </tr>
            <tr>
                <td class="tdm-cell"></td>
                <td class="tdm-cell tdm-choice"><input type="radio" disabled="True" /></td>
                <td class="tdm-cell tdm-choice"><input type="radio" disabled="True" checked="True" /></td>
                <td class="tdm-cell tdm-choice"><input type="radio" disabled="True" /></td>
            </tr>
        </table>
    </div>

    <hr>
</div>