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




{% block content %}
    <div class="card mx-auto" style="max-width: 1000px;">
    <div class="card-body text-block">

    <p> <b> Bitte stellen Sie sich folgende Situation vor: </b> </p>


    {% include "Description_DCE.html" %}


    <hr style="width:60%; margin:30px auto;">

    <p>
    Wenn Sie auf <i>Weiter</i> klicken, sehen Sie nacheinander sechs Entscheidungssituationen.
    In jeder dieser Situationen wählen Sie bitte das Fortbewegungsmittel, das Sie am ehesten nutzen würden.
    Es gibt keine richtigen oder falschen Antworten.
    Uns interessiert ausschließlich Ihre persönliche Entscheidung in den verschiedenen Situationen.
    </p>



    </div>
    </div>



    <br>
        {% next_button %}

    <style>
    .btn-primary {
    background-color: #003360 !important;
    border-color: #003360 !important;
    }
    .btn-primary:hover {
    background-color: #001f3f !important;
    border-color: #001f3f !important;
    }
    </style>

{% endblock %}

{% block styles %}
    <style xmlns="http://www.w3.org/1999/html">
    #header {
        display: block;
        font-weight: normal;
        font-size: 14px;
        text-align: right;
        background-color: #003360;
        color: white;
    }

    .table{
        width: 800px;
    }

    .text-block {
    text-align: justify;
    text-justify: inter-word;
    line-height: 1.6;
    font-size: 16px;
    }
    .text-block p {
    margin-bottom: 1rem;
    }
    </style>
    {% endblock %}