{{~ it : MainItem }}

    <li class="{{= MainItem.CssClass }}" data-id="{{= MainItem.CategoryID }}" data-element="topCategory.root">
        <section>
            {{? MainItem.IsSeperator }}
                <span data-active-parent data-href="{{= MainItem.AutoUrl }}" class="header {{= MainItem.Children.length > 0 ? 'has_children' : ''}} {{= MainItem.SVGImage != '' ? 'has_icon' : ''}}" data-element="topCategoryLink" {{= (MainItem.LinkRedirect ? 'data-redirect' : '') }}>
                    {{? MainItem.SVGImage != ''}}
                        <span class="svg_menuicon svg_{{= MainItem.CategoryID }}">
                            {{= MainItem.SVGImage }}
                        </span>
                    {{?}}
                    {{= MainItem.Name }}
                </span>
            {{??}}
                <a data-active-parent href="{{= MainItem.AutoUrl }}" class="{{= MainItem.Children.length > 0 ? 'has_children' : ''}} {{= MainItem.SVGImage != '' ? 'has_icon' : ''}}" data-element="topCategoryLink" {{= (MainItem.LinkRedirect ? 'data-redirect' : '') }} {{= (MainItem.LinkIsExternal ? 'rel="external"' : '') }}>
                    {{? MainItem.SVGImage != ''}}
                        <span class="svg_menuicon svg_{{= MainItem.CategoryID }}">
                            {{= MainItem.SVGImage }}
                        </span>
                    {{?}}
                    {{= MainItem.Name }}
                </a>
            {{?}}

            {{? MainItem.Children.length > 0}}
                <div class="drop section_wrapper clearfix l2" data-element="topCategory.drop">
                    <div>
                        <div class="drop_categories wrapper">
                            {{~ MainItem.Children : SecondItem }}
                                <div>
                                    <a {{? SecondItem.IsSeperator }}data-{{?}}href="{{= SecondItem.AutoUrl }}" class="{{? SecondItem.IsSeperator }}no-cursor{{?}} {{= SecondItem.CssClass }} show-third-level" data-id="{{= SecondItem.CategoryID }}">
                                        {{? SecondItem.SVGImage != ''}}
                                            <span class="svg_menuicon svg_{{= SecondItem.CategoryID }}">
                                                {{= SecondItem.SVGImage }}
                                            </span>
                                        {{?}}
                                        {{= SecondItem.Name }}
                                    </a>
                                </div>
                            {{~}}
                        </div>
                        <div class="drop_content clearfix">
                           
                            <div class="wrapper">                              

                                {{~ MainItem.Children : SecondItem }}
                                    
                                    <ul class="{{= SecondItem.CssClass }} {{= SecondItem.CssClassAddon }} third-level-item" data-id="{{= SecondItem.CategoryID }}">
                                        <li class="{{= SecondItem.TopContentBlocks.length > 0 ? 'has_topblocks' : '' }} {{= SecondItem.SideContentBlocks.length > 0 ? 'has_sideblocks' : '' }}">
                                            {{? SecondItem.TopContentBlocks.length > 0 }}
                                                <div class="dropdown_link--all">
                                                {{~ SecondItem.TopContentBlocks : ContentItem }}
                                                    <a href="{{= ContentItem.LinkUrl }}" {{? ContentItem.LinkIsExternal}}rel="external"{{?}} class="parent">{{= ContentItem.Headline }}</a>
                                                {{~}}
                                                </div>
                                            {{?}}
                                            
                                            <div class="wrapper__left-right">
                                                <div class="wrapper__left">
                                                    <section>
                                                        {{? SecondItem.IsSeperator }}
                                                            <span data-active-parent data-href="{{= SecondItem.AutoUrl }}" class="header {{= SecondItem.Children.length > 0 ? 'has_children' : ''}} {{= SecondItem.SVGImage != '' ? 'has_icon' : ''}}" {{= (SecondItem.LinkRedirect ? 'data-redirect' : '') }}>
                                                                {{? SecondItem.SVGImage != ''}}
                                                                    <span class="svg_menuicon svg_{{= SecondItem.CategoryID }}">
                                                                        {{= SecondItem.SVGImage }}
                                                                    </span>
                                                                {{?}}
                                                                {{= SecondItem.Name }}
                                                            </span>
                                                        {{??}}
                                                            <a data-active-parent href="{{= SecondItem.AutoUrl }}" class="  {{= SecondItem.Children.length > 0 ? 'has_children' : ''}} {{= SecondItem.SVGImage != '' ? 'has_icon' : ''}}" {{= (SecondItem.LinkIsExternal ? 'rel="external"' : '') }} {{= (SecondItem.LinkRedirect ? 'data-redirect' : '') }}>
                                                                {{? SecondItem.SVGImage != ''}}
                                                                    <span class="svg_menuicon svg_{{= SecondItem.CategoryID }}">
                                                                        {{= SecondItem.SVGImage }}
                                                                    </span>
                                                                {{?}}
                                                                {{= SecondItem.Name }}
                                                            </a>
                                                        {{?}}
                                            
                                                        {{? SecondItem.Children.length > 0}}
                                                            {{= it.subTemplate(SecondItem.Children, {level: 3}) }}
                                                        {{?}}
                                                    </section>
                                                </div>
                                                {{? SecondItem.SideContentBlocks.length > 0 }}
                                                    <div class="wrapper__right">
                                                        <div class="sideblocks sideblocks__wrapper">
                                                            {{~ SecondItem.SideContentBlocks : ContentItem }}
                                                                <div class="sideblocks__item">
                                                                    {{? ContentItem.HasImage }}
                                                                        <div class="sideblocks__item__img">
                                                                            {{? ContentItem.HasLink }}
                                                                                <a href="{{= ContentItem.LinkUrl }}" {{? ContentItem.LinkIsExternal}}rel="external"{{?}} class="parent"> 
                                                                            {{?}}
                                                                                <img src="{{= UploadUrl.ContentBlock_Mobile }}{{= ContentItem.Image }}" alt="{{= ContentItem.ImageAlt }} "/>
                                                                            {{? ContentItem.HasLink }}
                                                                                </a>
                                                                            {{?}}
                                                                        </div>
                                                                    {{?}}

                                                                    {{? ContentItem.HasBody }}
                                                                        <div class="sideblocks__item__txt">
                                                                            {{? ContentItem.HasVisibleHeadline }}
                                                                                <span class="h4">{{= ContentItem.Headline }}</span>
                                                                            {{?}}

                                                                            {{= ContentItem.Description }}
                                                                        
                                                                            {{? ContentItem.HasLink && ContentItem.LinkText != '' }}
                                                                                <p><a class="item__link" href="{{= ContentItem.LinkUrl }}" {{? ContentItem.LinkIsExternal}}rel="external"{{?}}>{{= ContentItem.LinkText }}</a></p>
                                                                            {{?}}
                                                                        </div>
                                                                    {{?}}
                                                                </div>
                                                            {{~}}
                                                        </div>
                                                    </div>   
                                                {{?}}
                                            </div>

                                            {{? SecondItem.CategoryID == 12 }}
                                                <div class="dropdown_link--special">
                                                    <a href="/fonster-fonsterdorrar/12" class="parent"><span>Vilken serie ska jag välja?</span> – Tryck här! </a>
                                                </div>
                                            {{?}}
                                        </li>
                                    </ul>
                                
                                {{~}}                                
                            </div>
                        </div>
                    </div>
                </div>
            {{?}}
        </section>
    </li>
{{~}}