{% extends "timeline-page.html" %}

{% block stylesheets %}
    {{ super() }}
    <link rel="stylesheet" href="{{ url_for('static', filename='css/consent.css') }}"/>
{% endblock %}

{% block main_body %}
  <div class="main-div">
    <h1>{{ pgettext("consent-title", "We need your consent to proceed") }}</h1>
    <hr>
    <div class="consent-body">
        <div class="text-left" style="font-size:18px">
            {{ consent.overview(config) }}
            {{ consent.purpose(config) }}
            {{ consent.procedure(config) }}
            {{ consent.voluntary(config) }}
            {{ consent.confidentiality(config) }}
            {{ consent.collaborations(config) }}
            {{ consent.security(config) }}
            {{ consent.risks(config) }}
            {{ consent.benefits(config) }}

            <h4>{{ pgettext("consent-compensation", "Compensation") }}</h4>
            <p class="consent-text">
                {{ pgettext("consent-compensation", "This study is completely voluntary; you will not receive any monetary compensation for participation.") }}
                {{ pgettext("consent-compensation", "By doing the task you are helping science, thank you!") }}
            </p>

            {{ consent.rights(config) }}
            {{ consent.contact(config) }}
            {{ consent.consent(config) }}
        </div>
        {{ consent.buttons(config) }}
      </div>
  </div>
{% endblock %}