{% if (categories) %} 
<div class="megamenu-background">
     <div class="">
          <div class="overflow-megamenu container">
				<div class="container-megamenu horizontal">
					<div class="megaMenuToggle">
						<div class="megamenuToogle-wrapper">
							<div class="megamenuToogle-pattern">
								<div class="container">
									<div><span></span><span></span><span></span></div>
									Navigation
								</div>
							</div>
						</div>
					</div>
					
					<div class="megamenu-wrapper">
						<div class="megamenu-pattern">
							<div class="container">
								<ul class="megamenu shift-up">
									{% for category in categories %} 
										{% if (category['children']) %} 
										<li class="with-sub-menu hover"><p class="close-menu"></p><p class="open-menu"></p>
											<a href="{{ category['href'] }}"><span><strong>{{ category['name'] }}</strong></span></a>
										{% else %} 
										<li>
											<a href="{{ category['href'] }}"><span><strong>{{ category['name'] }}</strong></span></a>
										{% endif %} 
										{% if (category['children']) %} 
											
												{% set width = '100%' %}
												{% set row_fluid = 3 %}
												{% if (category['column'] == 1) %} {% set width = '220px' %} {% set row_fluid = 12 %} {% endif %}
												{% if (category['column'] == 2) %} {% set width = '500px' %} {% set row_fluid = 6 %} {% endif %}
												{% if (category['column'] == 3) %} {% set width = '700px' %} {% set row_fluid = 4 %} {% endif %}
											
											<div class="sub-menu" style="width: {{ width }}">
												<div class="content">
													<p class="arrow"></p>
													<div class="row hover-menu">
														{% set i = 0 %}
														{% for s in 1..category['column'] %} 
														<div class="col-sm-{{ row_fluid }} mobile-enabled">
															<div class="menu">
																<ul>
 																  {% set j = i + (category['children']|length / category['column'])|round - 1 %}
 																  {% for d in i..j %} 
																	  {% if (category['children'][i] is defined) %} 
																	  <li><a href="{{ category['children'][i]['href'] }}" class="main-menu">{{ category['children'][i]['name'] }}</a></li>
																	  {% endif %}
																	  {% set i = i+1 %}
 																  {% endfor %}
																</ul>
															</div>
														</div>
														{% endfor %} 
													</div>
												</div>
											</div>
										{% endif %} 
										</li>
									{% endfor %} 
								</ul>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
</div>
{% endif %}
