{% extends "global/Page.html" %}
{% load otree %}

{% block title %}
<h3 class="panel-sub-heading">
        <div align="center">
<div align="center"><span style="color: #ff0000;">***This is a practice trial***</span></div>
        </div>
    </h3>
{% endblock %}

{% block content %}

<hr style="border: 1.5px dashed black;" />
<h1 style="text-align: center;"><span style="font-size: large;">This is your contribution: <strong>{{ player.contribution }}</strong></span></h1>

<p>&nbsp;</p>
<p>&nbsp;</p>
<h2 style="text-align: center;"><span style="font-size: large;">Imagine these are your Group Members' Contributions respectively:</span></h2>
<table class="table table-hover text-center" style="width: 790px; margin: auto; height: 84px;">
<tbody>
<tr style="height: 13px;">
<th style="height: 13px; width: 200px;">
<p>Group Member 1's Contribution&nbsp;</p>
</th>
<th style="height: 13px; width: 200px;">
<p>Group Member 2's Contribution&nbsp;</p>
</th>
<th style="height: 13px; width: 200px;">
<p>Group Member 3's Contribution&nbsp;&nbsp;</p>
</th>
</tr>
<tr style="height: 7.25px;">
<td class="c" style="height: 7.25px; width: 200px;">
<p><span style="color: #000000;"><strong>44</strong></span></p>
</td>
<td class="c" style="height: 7.25px; width: 200px;">
<p><span style="color: #000000;"><strong>7</strong></span></p>
</td>
<td class="a" style="height: 7.25px; width: 200px;">
<p><span style="color: #000000;"><strong>39</strong></span></p>
</td>
</tr>
</tbody>
</table>
<center><hr style="border: 1.5px dashed black;" />
</center>
    {% next_button %}

{% endblock %}