{% macro active(activePage='home') %}
<ul class="main-menu">
    <li class="menu-item menu-item-has-children"><a href="#" class="{%if activePage == 'home' %} active {% endif %}">HOME</a>
        <ul class="sub-menu">
            <li class="menu-item current-menu-item">
                <a href="../../../one-theme/templates/macros/index.html">Home One</a>
            </li>
            <li class="menu-item">
                <a href="../../../one-theme/templates/macros/index-2.html">Home Two</a>
            </li>
            <li class="menu-item">
                <a href="../../../one-theme/templates/macros/index-3.html">Home Three</a>
            </li>
            <li class="menu-item">
                <a href="../../../one-theme/templates/macros/index-4.html">Home Four</a>
            </li>
            <li class="menu-item">
                <a href="../../../one-theme/templates/macros/index-5.html">Home Five</a>
            </li>
            <li class="menu-item">
                <a href="../../../one-theme/templates/macros/index-6.html">Home Six</a>
            </li>
            <li class="menu-item">
                <a href="../../../one-theme/templates/macros/index-7.html">Home Seven</a>
            </li>
            <li class="menu-item">
                <a href="../../../one-theme/templates/macros/index-8.html">Home Eight</a>
            </li>
        </ul>
    </li>
    <li class="menu-item current-menu-parent menu-item-has-children">
        <a href="#" class="{%if activePage == 'pages' %} active {% endif %}">PAGES</a>
        <ul class="sub-menu">
            <li class="menu-item current-menu-item">
                <a href="#">Two levels - current page</a>
            </li>
        </ul>
    </li>
    <li class="menu-item menu-item-has-children">
        <a href="#" class="{%if activePage == 'portfolio' %} active {% endif %}">PORTFOLIO</a>
        <ul class="sub-menu">
            <li class="menu-item"><a href="#">Leve 2</a></li>
            <li class="menu-item"><a href="#">Leve 2</a></li>
            <li class="menu-item menu-item-has-children">
                <a href="#">Leve 2</a>
                <ul class="sub-menu">
                    <li class="menu-item"><a href="#">Leve 3</a></li>
                    <li class="menu-item"><a href="#">Leve 3</a></li>
                    <li class="menu-item"><a href="#">Leve 3</a></li>
                </ul>
            </li>
        </ul>
    </li>
    <li class="menu-item">
        <a href="#">EVENTS</a>
        </li>
    <li class="menu-item">
        <a href="#" class="{%if activePage == 'contact' %} active {% endif %}">CONTACT</a>
    </li>
    <li class="menu-item">
        <a href="#" class="{%if activePage == 'about' %} active {% endif %}">ABOUT</a>
    </li>
    <li class="menu-item">
        <a href="#" class="{%if activePage == 'blog' %} active {% endif %}">BLOG</a>
    </li>
</ul>
{% endmacro %}