<div id="header" class="container-fluid fixed-top">
    <div class="row-fluid header-top">
        <nav role="banner" class="navbar navbar-light bg-faded navbar-expand moodle-has-zindex">
            <div class="col">
                <!-- navigation -->
                <div data-region="drawer-toggle" class="d-inline-block nav-drawer-toggle mr-4">
                    <button aria-expanded="{{#navdraweropen}}true{{/navdraweropen}}{{^navdraweropen}}false{{/navdraweropen}}" aria-controls="nav-drawer" type="button" class="btn nav-link btn-secondary my-auto" data-action="toggle-drawer" data-side="left" data-preference="drawer-open-nav">{{#pix}}i/menubars{{/pix}}<span class="sr-only">{{#str}}sidepanel, core{{/str}}</span>
                        <span aria-hidden="true"> </span>
                        <span aria-hidden="true"> </span>
                        <span aria-hidden="true"> </span>
                    </button>
                </div>
                <!-- I have cut the code form here-->

                <!--Brand/Logo-->
                <div class="d-inline-block header-logo">
                    <a class="navbar-brand logo mr-5" href="{{ config.wwwroot }}/?redirect=0">
                        <img src="{{logo}}"  alt="My3D">
                    </a>
                </div>
            </div>
            <div class="col d-none d-lg-inline-block">
                <ul class="navbar-nav custommenu-header">
                    {{{ output.custom_menu }}}
                </ul>
            </div>

            <!-- navbar_plugin_output -->

            <div class="col-auto">
                <ul class="navbar-nav ml-auto">
                    <li class="nav-item mr-3 d-none d-lg-inline-block pluginmenu">
                        {{{ output.navbar_plugin_output }}}
                    </li>
                    <li class="nav-item my-auto">
                        {{#usermenu}}
							{{> core/user_menu }}
						{{/usermenu}}
                    </li>
                </ul>
            </div>
        </nav>
    </div>
    <div class="row-fluid header-bottom navbar-custom">
        <div class="col-xs-12 col-sm-12 col-md-6">
            <ul class="nav navbar-nav my-auto d-md-block">
                <!-- Learning format-->
                <li class = "nav-item d-inline-flex">
                    {{#learningformat}}
                        {{{learningformat}}}
                    {{/learningformat}}
                </li>
                <li class = "nav-item d-inline-flex">
                    {{#fpcategories}}
                        {{{fpcategories}}}
                    {{/fpcategories}}
                </li>
                <li class = "nav-item d-inline-flex">
                    {{#sortmenu}}
                        {{{sortmenu}}}
                    {{/sortmenu}}
                </li>
            </ul>
        </div>
        <div class="coursesearch col-xs-12 col-sm-12 col-md-6">
            <span class = "nav-item d-none d-md-inline-flex w-100">
                <form action="{{surl}}" method="get" class="w-100 mb-0">
                    <div class="input-group input-group-lg">
                        <input type="search" name="search" class="form-control my-2 input-group-lg">
                        <div class="input-group-append">
                            <button type="submit" name="button" class="btn btn-light my-2"><i class="fas fa-search"></i></button>
                        </div>
                    </div>
                </form>
            </span>
            <span class="nav-item d-xs-inline-flex d-md-none">
                <div class="d-lg-flex">
                    {{{ output.search_box }}}
                </div>
            </span>
        </div>
    </div>
</div>
