{{ extends "global/Page.html" }}
{{ block content }}

    <!-- Text-->
        <div align="center">
            <h1>Erklärung III</h1>
            <br><br>
            In der Grafik sehen Sie, wie sich Ihr Vermögen (= Einkommen - Verbrauch) und das Vermögen
            Ihrer Gruppenmitglieder über die {{ C.ROUNDS }} Runden verändert.
            <br><br>
            Die rote Linie stellt die Grenze zwischen Vermögen und Schulden dar.
            <br><br>

        </div>
    <!--  -->

            <!-- Header -->
            <div class = "row" style = "border-style: none; text-align: center; height: 60px!important;">
                <div class="col-1"></div>
                 <div class="col-5 A"><h2> Vermögen nach Runde 1</h2></div>
                <div class="col-5 B"><h2> Vermögen nach Runde 5</h2></div>
                <div class="col-1"></div>
            </div>



            <!-- Grafiken -->
             <div class="row">
                <div class="col-1"></div>

                <div id="chart-A" class="col-5 A ChartContainerFor2">
                     {{ include 'redistribution/charts/3b1_Info.html' }}
                </div>

                <div id="chart-B" class="col-5 A ChartContainerFor2">
                   {{ include 'redistribution/charts/3b2_Info.html' }}
                </div>
            </div>

    <!-- Button -->
        <!-- Make "buttonclassfixedposition" for lab experiments and "buttonclassonline" for online experiments -->
        <div class ="buttonclassonline">{{ next_button }}</div>


{{ endblock }}