{% macro submenu(nav) -%}
    {% for file, item in nav %}
        <li{% if isActiveMenuItem(file, item, filename) or item.sub %} class="{{ 'active' if isActiveMenuItem(file, item, filename) }}{{ ' nk-drop-item' if item.sub }}"{% endif %}>
            <a href="{{file | safe}}"{{ ' target="' + item.target + '"' if item.target }}>
                {{item.name | safe}}
                {% if item.description -%}
                    <span class="nk-item-descr">{{item.description | safe}}</span>
                {%- endif %}
            </a>
            {%- if item.sub -%}
                <ul class="dropdown">
                    {{ submenu(item.sub) }}
                </ul>
            {%- endif %}
        </li>
    {%- endfor %}
{%- endmacro %}

{% if navigation_full == 'from navigation' %}
    {% set navigation_full = navigation %}
{% endif %}
<!--
    START: Fullscreen Navbar

    Additional Classes:
        .nk-navbar-dark
        .nk-navbar-align-center
        .nk-navbar-align-right
        .nk-navbar-items-effect-1
        .nk-navbar-drop-effect-1
        .nk-navbar-drop-effect-2
-->
<nav class="nk-navbar nk-navbar-full nk-navbar-full-style-2 nk-navbar-align-center{{ ' nk-navbar-dark' if nav_full_dark }}{{ ' nk-navbar-items-effect-1' if nav_items_effect == 1 }} nk-navbar-drop-effect-{{ nav_full_drop_effect }}" id="nk-full">
    {% if nav_full_bg %}
        <div class="nk-navbar-bg">
            <div class="bg-image">
                <img src="{{ nav_full_bg }}" alt="" class="jarallax-img">
            </div>
        </div>
    {% endif %}
    <div class="nk-nav-table">
        <div class="nk-nav-row">
            <div class="container{{ '-fluid' if nav_in_container == false }}">
                <div class="nk-nav-header">
                    <div class="nk-nav-close nk-navbar-full-toggle">
                        <span class="nk-icon-close"></span>
                    </div>
                </div>
            </div>
        </div>
        <div class="nk-nav-row-full nk-nav-row">
            <div class="container">
                <div class="row vertical-gap text-left">
                    <div class="col-md-6 col-lg-4 offset-lg-2">
                        <div class="nk-gap-3"></div>
                        <ul class="nk-nav">
                            {{ submenu(navigation_full) }}
                        </ul>
                        <div class="nk-gap-3 d-none d-lg-block"></div>
                        <div class="nk-gap-3"></div>
                    </div>
                    <div class="col-md-6">
                        <div class="nk-gap-3 d-none d-md-block"></div>
                        <div class="nk-widget">
                            <h4 class="nk-widget-title{{ ' text-white' if nav_full_dark }}">Find Us</h4>
                            <p>10111 Santa Monica Boulevard, <br> Los Angeles</p>
                        </div>
                        <div class="nk-widget">
                            <h4 class="nk-widget-title{{ ' text-white' if nav_full_dark }}">Contact Us</h4>
                            <p>+44 987 065 908 <br> info@Example.com</p>
                            <div class="nk-social nk-social-left pt-10">
                                <ul>
                                    <li><a class="nk-social-twitter" href="https://twitter.com/"><span><span class="nk-social-front fa fa-twitter"></span><span class="nk-social-back fa fa-twitter"></span></span></a></li>
                                    <li><a class="nk-social-facebook" href="https://www.facebook.com/"><span><span class="nk-social-front fa fa-facebook"></span><span class="nk-social-back fa fa-facebook"></span></span></a></li>
                                    <li><a class="nk-social-dribbble" href="https://dribbble.com/"><span><span class="nk-social-front fa fa-dribbble"></span><span class="nk-social-back fa fa-dribbble"></span></span></a></li>
                                    <li><a class="nk-social-instagram" href="https://www.instagram.com/"><span><span class="nk-social-front fa fa-instagram"></span><span class="nk-social-back fa fa-instagram"></span></span></a></li>
                                    <li><a class="nk-social-behance" href="https://behance.com/"><span><span class="nk-social-front fa fa-behance"></span><span class="nk-social-back fa fa-behance"></span></span></a></li>
                                </ul>
                            </div>
                        </div>
                        <div class="nk-gap-3"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</nav>
<!-- END: Fullscreen Navbar -->