{{ extends 'global/Page.html' }}
{{ block title }}Decision{{ endblock }}

{{ block content }}

<p>You are now asked to make the actual decisions which will determine your earnings. Which lottery do you prefer to play – A or B? Please make 10 choices. Remember that only one of the decisions will be randomly selected for execution.</p>

<!-- Would like to disable the formfield label (to save vertical space), but instead hide it with CCS style rule. -->
<style> .col-form-label { display: none; } </style>

<!-- should avoid repeating this CSS -->
<style>
.lottery{
border: 2px solid red;
border-radius:10px;
padding:0px;
width:8.3em;
height:3.4em;
text-align:center;
vertical-align:baseline;
}
</style>

<table class="table">
  <thead>
    <th>#</th><th>Lottery A</th><th>Lottery B</th><th>Your decision?</th>
  </thead>
  <tbody>
    <tr>
      <th>1</th>
      <td>{{ lottery1 }}{{ pointsA }}</td>
      <td>{{ lottery1 }}{{ pointsB }}</td>
      <td>{{ formfield 'lottery1' }}</td>
    </tr>
    <tr>
      <th>2</th>
      <td>{{ lottery2 }}{{ pointsA }}</td>
      <td>{{ lottery2 }}{{ pointsB }}</td>
      <td>{{ formfield 'lottery2' }}</td>
    </tr>
    <tr>
      <th>3</th>
      <td>{{ lottery3 }}{{ pointsA }}</td>
      <td>{{ lottery3 }}{{ pointsB }}</td>
      <td>{{ formfield 'lottery3' }}</td>
    </tr>
    <tr>
      <th>4</th>
      <td>{{ lottery4 }}{{ pointsA }}</td>
      <td>{{ lottery4 }}{{ pointsB }}</td>
      <td>{{ formfield 'lottery4' }}</td>
    </tr>
    <tr>
      <th>5</th>
      <td>{{ lottery5 }}{{ pointsA }}</td>
      <td>{{ lottery5 }}{{ pointsB }}</td>
      <td>{{ formfield 'lottery5' }}</td>
    </tr>
    <tr>
      <th>6</th>
      <td>{{ lottery6 }}{{ pointsA }}</td>
      <td>{{ lottery6 }}{{ pointsB }}</td>
      <td>{{ formfield 'lottery6' }}</td>
    </tr>
    <tr>
      <th>7</th>
      <td>{{ lottery7 }}{{ pointsA }}</td>
      <td>{{ lottery7 }}{{ pointsB }}</td>
      <td>{{ formfield 'lottery7' }}</td>
    </tr>
    <tr>
      <th>8</th>
      <td>{{ lottery8 }}{{ pointsA }}</td>
      <td>{{ lottery8 }}{{ pointsB }}</td>
      <td>{{ formfield 'lottery8' }}</td>
    </tr>
    <tr>
      <th>9</th>
      <td>{{ lottery9 }}{{ pointsA }}</td>
      <td>{{ lottery9 }}{{ pointsB }}</td>
      <td>{{ formfield 'lottery9' }}</td>
    </tr>
    <tr>
      <th>10</th>
      <td>{{ lottery10 }}{{ pointsA }}</td>
      <td>{{ lottery10 }}{{ pointsB }}</td>
      <td>{{ formfield 'lottery10' }}</td>
    </tr>
  </tbody>
</table>

<p>Once you have made your decisions please click ‘Next’.</p>

{{ next_button }}

{{ endblock }}