<header class="site-header headroom">
    <!-- <div class="container-fluid"> -->
    <div class="site-header__wrap">
      <a href="{{ site.url }}" class="site-header__logo">
        <picture>
          <source media="(min-width:992px)" srcset="{{ site.theme.link }}/frontend/img/volonteka-logo.png">
          <img class="site-header__logo-img" src="{{ site.theme.link }}/frontend/img/volonteka-logo-mobile.png" alt="Volonteka logo">
        </picture>
      </a>
      <button class="hamburger hamburger--squeeze" type="button">
        <span class="hamburger-box">
          <span class="hamburger-inner"></span>
        </span>
      </button>
    </div>    
    <nav class="site-header__nav">
      <ul class="site-header__main-nav">
        {% for item in menu.main.get_items %}
            <li class="site-header__item {{item.current ? 'active' }} {{ item.get_children ? 'dropdown' }}">
                <a class="site-header__link" href="{{ item.link }}">{{ item.title }}</a>
                {% if item.get_children %}
                    <div class="dropdown__btn">
                        <svg class="icon-arrow-right-small">
                        <use xlink:href="{{ site.theme.link }}/frontend/icons/icons.svg#icon-arrow-right-small"></use>
                        </svg>
                    </div>
                    <ul class="site-header__submenu">                    
                         {% for child in item.get_children  %}
                            <li class="site-header__submenu__item">
                                <a href="{{ child.get_link }}" class="site-header__submenu__link">{{ child.title }}</a>
                            </li>  
                        {% endfor %}                      
                    </ul>
                {% endif %}
            </li>

        {% endfor %}

        <!-- GTranslate plugin flags - for Hamburger menu (mobile, tablet) views -->
        <li class="site-header__item language-mobile">
          {{ function('do_shortcode', '[gtranslate]') }}
        </li>
      </ul>
    </nav>

    <!-- GTranslate plugin flags - for DESKTOP view -->
    <div class="language-flags-desktop">
        <li class="site-header__item language-desktop">
          {{ function('do_shortcode', '[gtranslate]') }}
        </li>
    </div>
    <!-- </div> -->
  </header>