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

{% block title %}

{% endblock %}

{% block content %}

<style>
img {
  float: right;
}
.clearfix {
  overflow: auto;
}
</style>


<h1 align=center><font color="blue">Round 1 Rules</font></H1>
<font size="4">
<div style="border: thin solid black">
<div class="clearfix" >
<br><img src="{% static "global/R1.png" %}" style="width:280px;height:200px;margin-left:5px;" />

        <ul>
            <li>For every point that B bids, the computer puts 1 'B' ball in the Bid Bag.</li>
            <li>For every point that A bids, the computer puts 3 'A' balls in the Bid Bag.</li>
        </ul>

</div>
<div class="clearfix">
<br><img src="{% static "global/BidBag.jpg" %}" style="width:280px;height:200px;margin-left:5px;" />
<p> &nbsp; &nbsp;Then the computer draws 1 ball at random from the bid bag.
        <ul>
            <li>If the computer draws an 'A' ball, then A wins</li>
            <li>If the computer draws a 'B' ball, then B wins</li>
        </ul>
</p>
</div>
    </div>
<br>
    <br></font>
    {% next_button %}

{% endblock %}