{{ block title }}
    News
{{ endblock }}
{{ block content }}
<ul>
    <li>    Now, all the students including you will see the news that predicts the result of the game.
</li>
    <li>
        The news is correct only with 75%.
    </li>
    <li>
        For example, if Red University is absolutely better so it will win,
        <ul>
            <li>With 75% chance the news will predict that Red University will win.</li>
            <li>With 25% chance the news will predict that Blue University will win.</li>
        </ul>
    </li>
</ul>




<style>
table, th, td {
  border: 1px solid black;
  border-collapse: collapse;
}

table.center {
  margin-left: auto;
  margin-right: auto;
}
</style>
 <table style="width:30%; text-align:center"  class="center">
    <caption style="text-align:center; caption-side:top; color:black; font-weight: bold;">Accuracy of the News</caption>
  <tr>
    <th></th>
    <th>News: Red will win</th>
    <th>News: Blue will win</th>
  </tr>
  <tr>
      <td><b>Red is better than Blue</b></td>
    <td>75%</td>
    <td >25%</td>
  </tr>
         <tr>
      <td><b>Blue is better than Red</b></td>
    <td >25%</td>
    <td >75%</td>
  </tr>
</table>

<p>
    <br> <!-- New line -->
    <h1 style="font-size:2vw;">The following is the news:<br>
{{news}}</h1>

</p>

    {{ next_button }}

{{ endblock }}