{% block title %}
<div style="display: flex; justify-content: center;">
    <span>Preliminary Round 1</span>
</div>
{% endblock %}

{{ block content }}
<div style="display: flex; flex-direction: column; align-items: center; text-align: center; margin-top: 30px;">
<br>
<p>Suppose that you were randomly matched with 2 other participants, and received the <b>high</b> endowment of 30 ECUs.</p>

<p><i>How many ECU(s) would you like to contribute to the joint project?</i></p>

    {{formfields}}
</div>
<br><br>
<div style = " display: flex; justify-content: center; align-items: right; ">
        <button class="btn btn-danger">Submit</button>

    </div>

<style>
    .btn-next {
        display: block;
        width: 200px;
        margin: 30px auto 0;
        padding: 10px;
        background-color: #3498db;
        color: white;
        border: none;
        border-radius: 5px;
        font-size: 18px;
        cursor: pointer;
        text-align: center;
    }

    .btn-next:hover {
        background-color: #2980b9;
    }
</style>
{{ endblock }}