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

{% block title %}
    Ausgangslage
{% endblock %}

{% block content %}

<p style="text-align: justify;">Sie sind entweder Käufer oder Verkäufer eines Gutes. Diese Rollen sind fixiert.
</p>
<p style="text-align: justify;">Als <b>Verkäufer</b> können Sie bis zu 3 Einheiten eines Gutes herstellen. Die Stückkosten werden angegeben. Um einen Gewinn zu machen für eine verkaufte Einheit müssen Sie also  einen Preis grösser als diese Stückkosten verlangen.
</p>
<p>Als <b>Käufer</b> können Sie beliebig viele Einheiten kaufen. Ihre maximiale Zahlungsbereitschaft pro Einheit wird angegeben und enstpricht Ihrem Nutzen. D.h., solange Sie weniger als Ihre Zahlunsgbereitschaft als Preis einfordern, werden Sie einen positiven Netto-Nutzen aus einer Transkation ziehen.
</p>
<p>Sie können als Käufer und Verkäufer ein Kaufs- bzw. Verkaufsangebot machen: Dabei geben Sie einfach den Preis an, den Sie maximal zahlen wollen bzw minimal einfordern wollen.
</p>
<p>Sobald ein Verkäuferpreis tiefer oder gleich einem Käuferpreis ist findet ein Handel statt.
</p>
    <button class="otree-btn-next btn btn-primary next-button otree-next-button">Weiter</button>

{% endblock %}



{% block styles %}

<style>

h2 {
    text-align: center !important;
}

.otree-btn-next {
    margin: 40px auto;
    display: inherit;
}

.wrapper_control, .alert {
    min-width: 700px;
    max-width: 900px;
    min-height:200px;
    max-height:600px;
    display: table;
    margin: 0 auto 20px;
}

.control_question {
	width: 100%;
	height: 100%;
	background: rgba(199, 199, 189, 0.25);
	margin: 40px auto;
    padding: 20px 20px 10px 20px;
    position:relative;
    -webkit-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2), 0 0 20px rgba(0, 0, 0, 0.05) inset;
       -moz-box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2), 0 0 20px rgba(0, 0, 0, 0.05) inset;
            box-shadow: 0 1px 5px rgba(0, 0, 0, 0.2), 0 0 20px rgba(0, 0, 0, 0.05) inset;
    -moz-border-radius: 5px;
         border-radius: 5px;
}

</style>


{% endblock %}