{{ block title }}Part 2{{ endblock }}
{{ block content }}
<script src="{% static 'calc_script.js' %}"></script>

{% block extrastyle %}
    <link rel="stylesheet" type="text/css" href="{% static 'calculator_styles.css' %}">
{% endblock %}
    <style>
      .cell-width {
        width: 68px;
      }

    </style>

<div>
 <p style="font-size: 18px;">
  The target number for A is: <i>Target number A = 0.75 * B + 15</i>, and the target for B is:
    <i>Target number B = 0.75 * A + 15</i>.
</p>
    <table class="table" style="table-layout: fixed;">
        {% for field in a_fields %}
            <tr>
                <td style="font-size: 18px;">{{ field.label }}</td>
                <td>{{ field }}</td>
            </tr>
        {% endfor %}
    </table>
</div>
<br>
<!-- Section for 'bfirst' fields -->
<div>
 <p style="font-size: 18px;">
    1<sup>st</sup> Guessing Task: Please report the percentage of participants you think chose a given
    value of A within each of the following intervals. Be sure that the numbers you report add to 100.
</p>
    <table class="table" style="table-layout: fixed;">
        <tr>
            {% for field in bfirst_fields %}
                <td class="cell-width">{{ field }}</td>
            {% endfor %}
        </tr>
        <tr>
            {% for field in bfirst_fields %}
                <th style="font-size: 14px;">{{ field.label }}</th>
            {% endfor %}
        </tr>
    </table>
</div>
<br>
<!-- Section for 'bsecond' fields -->
<div>
 <p style="font-size: 18px;">
    2<sup>nd</sup> Guessing Task: Now you are randomly assigned to another participant in this session. You have to guess this
  participant’s answer to the previous 1<sup>st</sup> Guessing Task. How do you think that this participant filled
    in the previous guess?
</p>
    <table class="table" style="table-layout: fixed;">
        <tr>
            {% for field in bsecond_fields %}
                <td class="cell-width">{{ field }}</td>
            {% endfor %}
        </tr>
        <tr>
            {% for field in bsecond_fields %}
                <th style="font-size: 14px;">{{ field.label }}</th>
            {% endfor %}
        </tr>
    </table>
</div>


<br>

    {{ next_button }}
<br>

    {% include "payoff_calculator_component.html" %}

<br>

    {% include "simple_calculator.html" %}



{{ endblock }}