{{ block title }}Your Choice{{ endblock }}
{{ block content }}

    <div class="form-group required">
        <table class="table table-bordered text-center" style="width: auto; margin: auto">
            <tr>
                <th colspan="2" rowspan="2"></th>
                <th colspan="2">Random SKIMmer</th>
            </tr>
            <tr>
                <th>Cooperate</th>
                <th>Defect</th>
            </tr>
            <tr>
                <th rowspan="2"><span>You</span></th>
                <td><button name="cooperate" value="True" class="btn btn-primary btn-large">Cooperate</button></td>
            <td>You both get 1 year in prison<br>[<span style="color:blue"><b>3 points</b></span>, 3 points]</td>
            <td>You get 5 years in prison, they go free<br>[<span style="color:blue"><b>0 points</b></span>, 5 points]</td>
            </tr>
            <tr>
                <td><button name="cooperate" value="False" class="btn btn-primary btn-large" >Defect</button></td>
            <td>You go free, they get 5 years in prison<br>[<span style="color:blue"><b>5 points</b></span>, 0 points]</td>
            <td>You both get 3 years in prison<br>[<span style="color:blue"><b>1 points</b></span>, 1 points]</td>
            </tr>
        </table>
    </div>

    <p>You can chat with the other SKIMmer here.</p>

    {{ chat nickname=my_nickname}}

    {{ include_sibling 'instructions.html' }}

<style>
    .btn {
        width: -webkit-fill-available !important;
    }
</style>

{{ endblock }}