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

{% block title %}
    Motivation
{% endblock %}

{% block content %}

<b>Eine glückliche Beziehung führen</b>
<div class='page-wrapper'>
    <div class='row'>
        <div class='column'>
            <div class='anchor-left'>nicht wichtig</div>
        </div>
        <div class='column'>
            <div class='radio-buttons'>{{ form.imp_relationship }}</div>
        </div>
        <div class='column'>
            <div class='anchor-right'>sehr wichtig</div>
        </div>
    </div>
    <div class='row'>
        <div class='column'>
            <div class='blank-column'></div>
        </div>
        <div class='column2'>
            <div class='choices'>1</div>
        </div>
        <div class='column2'>
            <div class='choices'>2</div>
        </div>
        <div class='column2'>
            <div class='choices'>3</div>
        </div>
        <div class='column2'>
            <div class='choices'>4</div>
        </div>
        <div class='column2'>
            <div class='choices'>5</div>
        </div>

        <div class='column'>
            <div class='blank-column'></div>
        </div>
    </div>
</div>
<br><br>

<b>Kinder haben</b>
<div class='page-wrapper'>
    <div class='row'>
        <div class='column'>
            <div class='anchor-left'>nicht wichtig</div>
        </div>
        <div class='column'>
            <div class='radio-buttons'>{{ form.imp_children }}</div>
        </div>
        <div class='column'>
            <div class='anchor-right'>sehr wichtig</div>
        </div>
    </div>
    <div class='row'>
        <div class='column'>
            <div class='blank-column'></div>
        </div>
        <div class='column2'>
            <div class='choices'>1</div>
        </div>
        <div class='column2'>
            <div class='choices'>2</div>
        </div>
        <div class='column2'>
            <div class='choices'>3</div>
        </div>
        <div class='column2'>
            <div class='choices'>4</div>
        </div>
        <div class='column2'>
            <div class='choices'>5</div>
        </div>

        <div class='column'>
            <div class='blank-column'></div>
        </div>
    </div>
</div>
<br><br>

<b>Politisch und sozial engagiert sein</b>
<div class='page-wrapper'>
    <div class='row'>
        <div class='column'>
            <div class='anchor-left'>nicht wichtig</div>
        </div>
        <div class='column'>
            <div class='radio-buttons'>{{ form.imp_engagement }}</div>
        </div>
        <div class='column'>
            <div class='anchor-right'>sehr wichtig</div>
        </div>
    </div>
    <div class='row'>
        <div class='column'>
            <div class='blank-column'></div>
        </div>
        <div class='column2'>
            <div class='choices'>1</div>
        </div>
        <div class='column2'>
            <div class='choices'>2</div>
        </div>
        <div class='column2'>
            <div class='choices'>3</div>
        </div>
        <div class='column2'>
            <div class='choices'>4</div>
        </div>
        <div class='column2'>
            <div class='choices'>5</div>
        </div>

        <div class='column'>
            <div class='blank-column'></div>
        </div>
    </div>
</div>
<br><br>

<b>Reisen und die Welt erkunden</b>
<div class='page-wrapper'>
    <div class='row'>
        <div class='column'>
            <div class='anchor-left'>nicht wichtig</div>
        </div>
        <div class='column'>
            <div class='radio-buttons'>{{ form.imp_travel }}</div>
        </div>
        <div class='column'>
            <div class='anchor-right'>sehr wichtig</div>
        </div>
    </div>
    <div class='row'>
        <div class='column'>
            <div class='blank-column'></div>
        </div>
        <div class='column2'>
            <div class='choices'>1</div>
        </div>
        <div class='column2'>
            <div class='choices'>2</div>
        </div>
        <div class='column2'>
            <div class='choices'>3</div>
        </div>
        <div class='column2'>
            <div class='choices'>4</div>
        </div>
        <div class='column2'>
            <div class='choices'>5</div>
        </div>
        <div class='column'>
            <div class='blank-column'></div>
        </div>
    </div>
</div>
<br><br>

    {% next_button %}

{% endblock %}