{{ block title }}Title{{ endblock }}
{{ block content }}

<div id="header-logo">
    <span><img src="https://www.smu.edu.sg/sites/all/themes/smubase_nw2_rev/svg/logo-d-smu.svg" alt="smu-logo" width="200" height="auto"></span>
    <span><p style="margin-top:10px; font-size:11px;"><i>Created by the Centre for Teaching Excellence.</i></p></span>
    <hr>
</div>

<h3 id="title">Round {{player.round_number}}</h3>

<p>
You will make your bidding decision for {{Constants.num_rounds}} rounds. In between rounds, you will observe the winning bid and your earnings. Your {{player.number_of_opponents}} opponents will change from round to round. Values are randomly generated in each round.
</p>
<p>
Please make your bid now. The amount can be any value so long as it is greater than {{Constants.min_allowable_bid}}.<br>
</p>

<p id="item_value"; style = font-size:16px;>
    <strong>Your item value is currently {{player.item_value_actual}}</strong> <br>
</p>

{{ formfields }}

<button id = "bid-btn">
       Bid
</button>

<style>
    #item_value{
        color: green;
    }
    
     #bid-btn {
    color: #0066CC;
    font-weight: 800;
    background-color: white;
    padding: 5px 30px;
    border: 4px solid #0066CC;
    border-radius: 4px;
    margin-left: 0px;
    }
    
    #bid-btn:disabled {
    color: #808080;
    background-color: #C8C8C8;
    border: 4px solid #abcdef;
    }
    
    .otree-body {
        background-color: {{ Constants.style_background_color }};
        color: {{ Constants.style_text_color }};
    }
    
    .otree-title {
    visibility: hidden;
    height: 0;
    }
</style>

{{ endblock }}