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

{% block styles %}
<style>
.content {
    height: 100%;
    justify-content: center;
    align-items: center;
    border: 5px solid black;
    font-size: 1.3rem;
    text-align: center;
    padding-top: 5%;
}
.page-header {
    margin: 0px;
}

.otree-body.container {
    margin: 0px auto 0px;
    font-weight: normal;
}

.otree-btn-next {
margin-top: 3rem;
}

p { text-align: justify; }

body {background-color:black;}

.input-group, input.form-control, select.form-control, textarea.form-control {
    max-width: 600px;
    margin:auto;
}
</style>
{% endblock %}

{% block title %}
{% endblock %}

{% block content %}
<div class="row content">
    <div class="col-7">
        <p>Thanks for completing Phase 1 and Phase 2 of this study! </p>
        <p>Before showing you how much you earned,
            we would like to hear about your experience.
            Please, use the box below to tell us whether you had any issues in completing the task or have
            comments about the study:</p>
        <br>

        {% formfields %}

        <p><b><font color="red">In order to be paid what you have earned, you must click on the button below and continue to the final page of the study.</font></b> There, you will learn your bonus payment and find the link to confirm your participation.</p>
         <button id="confirm" type="submit" class="btn btn-next otree-btn-next btn-primary">Submit Your Feedback</button>
    </div>
</div>

{% endblock %}