{% block styles %}
<link href="{% static 'global/styles.css' %}" rel="stylesheet">
{% endblock %}


{% block content %}
<h2><center>Sección 1 - Tarea 2</center></h2>
<br>

    <div class="instructions">
        <p>
           En esta tarea, se le emparejará con otra persona. Nunca conocerá su identidad, ni usted la de la otra persona. 
        </p>
        <p>
        En cada fila de la tabla, le pedimos que decida si prefiere la opción A o la opción B. Luego, si esta tarea es 
        seleccionada para el pago y se le asigna el rol del P1, sortearemos una fila al azar y pagaremos la decisión 
        que haya tomado en esa fila. Por ejemplo, si en la fila 8 eligió A, recibirá 20 UME y P2 0, mientras que, 
         si eligió B, usted y P2 recibirán ambos 7 UME. 

Si se le asigna el rol de P2, su pago estará determinado por la decisión de la persona en el rol de P1 emparejada con usted en la fila seleccionada al azar.
        </p>
        <p>
        Supongamos que la fila 1 en el siguiente ejemplo fue la seleccionada aleatoriamente para el pago. 
        Si P1 selecciona A recibirá 20 UME y el P2 con el que fue emparejado recibirá 0 UME. Si P1 escoge B, tanto como P1 
        como P2 recibirán 1 UME cada uno
    </p>
        <div class="div_table">
    
            <table class="table_selection">
                <tr>
                    <td colspan="3" class="cell_header_table"><b>Opción A</b></td>
                    <td colspan="3" class="cell_header_table"><b>Opción B</b></td>
                </tr>
                <tr>
                    <td class="cell_subheader_table"><b>Pago P1</b></td>
                    <td class="cell_subheader_table"><b>Pago P2</b></td>
                    <td class="cell_subheader_table" colspan="1"><b></b></td>
                    <td class="cell_subheader_table" colspan="1"><b></b></td>
                    <td class="cell_subheader_table"><b>Pago P1</b></td>
                    <td class="cell_subheader_table"><b>Pago P2</b></td>
                </tr>
            
                <tr>
                    <td class="cell_text_option">20</td>
                    <td class="cell_text_option">0</td>
                    <td class="cell_subheader_table" colspan="2"><b></b></td>
                    <td class="cell_text_option">1</td>
                    <td class="cell_text_option">1</td>
                </tr>
                <tr>
                    <td class="cell_text_option">20</td>
                    <td class="cell_text_option">0</td>
                    <td class="cell_subheader_table" colspan="2"><b></b></td>
                    <td class="cell_text_option">2</td>
                    <td class="cell_text_option">2</td>
                </tr>
                
            </table>
            
            </div>
    </div>

     {% next_button %}
{% endblock %}