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

{{ block content }}

<style>
.question-box {
    border: 2px solid #222;
    padding: 16px 20px;
    margin: 16px 0;
}
.invest-input {
    display: block;
    width: 200px;
    font-size: 1.1em;
    padding: 10px;
    text-align: center;
    border: 2px solid #222;
    border-radius: 4px;
    margin: 8px auto 0 auto;
}
</style>

<div class="question-box">
    <p>You are endowed with <strong>50 points</strong> that you can choose to keep or invest in a project. Points that are not invested in the project are yours to keep, if this question is selected for payment.</p>
    <p>The project's returns depend on its success:</p>
    <ul>
        <li>If the project is <strong>successful</strong>, you will receive <strong>3 times</strong> the amount you chose to invest.</li>
        <li>If the project is <strong>unsuccessful</strong>, you will <strong>lose</strong> the amount invested.</li>
    </ul>
    <p>The project's success rate is the following:</p>
    <p style="text-align: center;"><strong>40%</strong></p>
</div>

<p>Please report how many points you want to invest in this project. You may pick any number between 0 and 50, including 0 or 50:</p>
{{ formfield_errors 'risk1_invest' }}
<input type="number" name="risk1_invest" min="0" max="50" step="1" class="invest-input">

<p></p>
{{ next_button }}

{{ endblock }}