<li
    class="child{% if child.ancestor %} ancestor{% endif %}{% if child.selected %} active{% endif %}{% if child.children and dropdown %} children nav-dropdown{% endif %}{% if forloop.first %} first{% endif %}{% if forloop.last %} last{% endif %}"
    data-page-id="{{child.id}}"
    {% if child.parent.id %}data-parent-page-id="{{child.parent.id}}"{% endif %}
    {% if child.attr.special_nav %}data-trigger-special-nav{% endif %}
    >
    <a href="{{ child.get_absolute_url }}">
        <span>
            {{ child.get_menu_title }}
        </span>
    </a>
    {% if child.children %}
        <ul class="subnav" {% if grandchild.children and not child.parent and dropdown %}role="menu"{% endif %}>
            {% for grandchild in child.children %}
                {% include 'includes/menu/navigation_item.html' with child=grandchild %}
            {% endfor %}
        </ul>
    {% endif %}
</li>
