
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-TWWCT9T"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->

<nav class="homeNav navigation">
    <div class="sizeCenterElm">
        <a href="/" class="logo">
            {{ img('theme::img/logo.png')
            .fit(47,43)
            .quality(100)
            .attr('title', 'Fuji Film')
            .attr('class', 'satu dua tiga')
            |raw }}
        </a>
        <button class="hamburger hamburger--elastic" type="button">
          <span class="hamburger-box">
            <span class="hamburger-inner"></span>
          </span>
        </button>

        <ul class="maniNav">
            {% for link in links('main').get() %}

                <li>
                    <a href="{{ link.url }}">{{ link.title }}</a>
                    {% if link.id == 8 %}
                        <div class="submenu">
                            <div class="sizeCenterElm grid-x">
                                <div class="medium-12 small-12 columns mainProduct">
                                    <ul>
                                        {% for category in entries('products', 'categories').orderBy('id', 'asc').take(3).get() %}
                                        <li>
                                            <a href="{{ url_locale('product', locale()) }}/{{ category.slug }}">
                                                <div class="fujiCategory">
                                                    {{ img(category.menu_image.cropped())
                                                        .attr('title', category.title)
                                                    |raw }}{# .resize(82, 62) #}
                                                </div>
                                                <div class="fujiName">
                                                    <div class="title">{{ category.title }}</div>
                                                    <p>
                                                        {{ category.menu_short_description }}
                                                    </p>
                                                </div>
                                            </a>
                                        </li>
                                        {% endfor %}
                                    </ul>
                                </div>
                                {# <div class="medium-4 columns secMenu">
                                    <ul>
                                        <li><a href="#">Where to buy</a></li>
                                    </ul>
                                    <a href="#" class="link">find your camera</a>
                                </div> #}
                            </div>
                        </div>
                    {% endif %}
                    {# {% if link.id == 14 %}
                        <div class="submenu subEvent">
                            <div class="sizeCenterElm grid-x">
                                <div class="medium-12 small-12 columns mainProduct">
                                    <ul>
                                        <li>
                                            <a href="{{ url('booking') }}">
                                                <div class="fujiName">
                                                    <div class="title">Studio</div>
                                                </div>
                                            </a>
                                        </li>
                                        <li>
                                            <a href="{{ url('event') }}">
                                                <div class="fujiName">
                                                    <div class="title">Event</div>
                                                </div>
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    {% endif %} #}
                </li>

            {% endfor %}
        </ul>
        <div class="billingual">
            {% set query = request_getQueryString() %}
            <select name="" class="changeBil" onchange="location = this.value;">
                {% for locale in ['en','id',] %}
                    <option {{ config( 'app.locale')==locale ? 'selected'}} value="{{ url_locale(request_path(), locale) }}{{ query ? '?'~query }}">{{ str_upper(locale) }}</option>
                {% endfor %}
            </select>
            <span class="btnSearch fa fa-search"></span>
        </div>
    </div>
    <ul id="menuMobile">
        {% for link in links('main').get() %}
            <li>
                <a href="{{ link.url }}">{{ link.title }}</a>
                {% if link.id == 8 %}
                    <ul>
                        {% for category in entries('products', 'categories').orderBy('id', 'asc').take(3).get() %}
                        <li>
                            <a href="{{ url_locale('product', locale()) }}/{{ category.slug }}">
                                <div class="fujiCategory">
                                    {{ img(category.menu_image.cropped())
                                        .resize(null, 73)
                                        .attr('title', category.title)
                                    |raw }}
                                </div>
                                <div class="fujiName">
                                    <div class="title">{{ category.title }}</div>
                                </div>
                            </a>
                        </li>
                        {% endfor %}
                    </ul>
                {% endif %}
                {# {% if link.id == 14 %}
                    <ul style="padding: 0;margin: 0;">
                        <li style="width: 100%;">
                            <a href="{{ url('booking') }}">
                                <div class="fujiName" style="font-size: 16px;">
                                    <div class="title">Studio</div>
                                </div>
                            </a>
                        </li>
                        <li style="width: 100%;">
                            <a href="{{ url('event') }}">
                                <div class="fujiName" style="font-size: 16px;">
                                    <div class="title">Event</div>
                                </div>
                            </a>
                        </li>
                    </ul>
                {% endif %} #}
            </li>

        {% endfor %}
    </ul>
    <div class="searchBar">
        <form action="{{ url('search') }}">
            <input type="search" id="searchBar" name="keyword" placeholder="Search..">
            <button><i class="fa fa-search" aria-hidden="true"></i></button>
        </form>
    </div>
</nav>