<div class="mb-4">
    <a href="{{config.wwwroot}}/theme/moove/reports/period.php" class="btn btn-primary btn-lg">
        <i class="fa fa-signal"></i> {{#str}}seeperiodreport, theme_moove{{/str}}
    </a>
</div>

<div class="row">
    <div class="col-md-8">
        {{{newuserschart}}}
    </div>

    <div class="col-md-4">
        <div class="small-box bg-2">
            <div class="inner">
                <h3>{{{totalusers}}}</h3>

                <p>{{#str}}totalusers, theme_moove{{/str}}</p>
            </div>
            <div class="icon">
                <i class="fa fa-users"></i>
            </div>
        </div>

        <div class="small-box bg-1">
            <div class="inner">
                <h3>{{{onlineusers}}}</h3>

                <p>{{#str}}onlineusers, theme_moove{{/str}}</p>
            </div>
            <div class="icon">
                <i class="fa fa-plug"></i>
            </div>
        </div>

        <div class="small-box bg-3">
            <div class="inner">
                <h3>{{{totalcourses}}}</h3>

                <p>{{#str}}totalcourses, theme_moove{{/str}}</p>
            </div>
            <div class="icon">
                <i class="fa fa-institution"></i>
            </div>
        </div>
        <div class="small-box bg-4">
            <div class="inner">
                <h3>{{{totalenrolments}}}</h3>

                <p>{{#str}}totalenrolments, theme_moove{{/str}}</p>
            </div>
            <div class="icon">
                <i class="fa fa-graduation-cap"></i>
            </div>
        </div>
    </div>
</div>

<div class="row">
    <div class="col-md-6">
        {{{newenrolmentschart}}}
    </div>
    <div class="col-md-6">
        {{{coursesconclusionschart}}}
    </div>
</div>

<div class="row">
    <div class="col-md-6">
        {{{topenrolmentcourseschart}}}
    </div>
    <div class="col-md-6">
        {{{topconclusionscourseschart}}}
    </div>
</div>