<?xml version="1.0"?>
<t name="Odoo Menu" t-name="website.s_mega_menu_odoo_menu">
    <section class="s_mega_menu_odoo_menu pt16 o_colored_level o_cc o_cc1">
        <div class="container">
            <div class="row">
                <div class="col-12 col-lg-3 pt16 pb24">
                    <h4 class="text-uppercase h5 fw-bold mt-0">Computers &amp; Devices</h4>
                    <div class="s_hr pt4 pb16">
                        <hr class="w-100 mx-auto" style="border-top-width: 2px; border-top-color: var(--primary);"/>
                    </div>
                    <nav class="nav flex-column">
                        <a href="#" class="nav-link px-0" data-name="Menu Item">Laptops</a>
                        <a href="#" class="nav-link px-0" data-name="Menu Item">Desktop computers</a>
                        <a href="#" class="nav-link px-0" data-name="Menu Item">Components</a>
                        <a href="#" class="nav-link px-0" data-name="Menu Item">Tablets</a>
                        <a href="#" class="nav-link px-0" data-name="Menu Item">Smartphones</a>
                        <a href="#" class="nav-link px-0" data-name="Menu Item">iPhone</a>
                    </nav>
                </div>
                <div class="col-12 col-lg-3 pt16 pb24">
                    <h4 class="text-uppercase h5 fw-bold mt-0">Monitors</h4>
                    <div class="s_hr pt4 pb16">
                        <hr class="w-100 mx-auto" style="border-top-width: 2px; border-top-color: var(--secondary);"/>
                    </div>
                    <nav class="nav flex-column">
                        <a href="#" class="nav-link px-0" data-name="Menu Item">Televisions</a>
                        <a href="#" class="nav-link px-0" data-name="Menu Item">Office screens</a>
                        <a href="#" class="nav-link px-0" data-name="Menu Item">Projectors</a>
                    </nav>
                </div>
                <div class="col-12 col-lg-3 pt16 pb24">
                    <h4 class="text-uppercase h5 fw-bold mt-0">Electronics</h4>
                    <div class="s_hr pt4 pb16">
                        <hr class="w-100 mx-auto" style="border-top-width: 2px; border-top-color: var(--primary);"/>
                    </div>
                    <nav class="nav flex-column">
                        <a href="#" class="nav-link px-0" data-name="Menu Item">Camera</a>
                        <a href="#" class="nav-link px-0" data-name="Menu Item">GPS &amp; navigation</a>
                        <a href="#" class="nav-link px-0" data-name="Menu Item">Accessories</a>
                        <a href="#" class="nav-link px-0" data-name="Menu Item">Home audio</a>
                        <a href="#" class="nav-link px-0" data-name="Menu Item">Office audio</a>
                    </nav>
                </div>
                <div class="col-12 col-lg-3 pt16 pb24">
                    <h4 class="text-uppercase h5 fw-bold mt-0">Promotions</h4>
                    <div class="s_hr pt4 pb16">
                        <hr class="w-100 mx-auto" style="border-top-width: 2px; border-top-color: var(--secondary);"/>
                    </div>
                    <nav class="nav flex-column">
                        <a href="#" class="nav-link px-0" data-name="Menu Item">Computers</a>
                        <a href="#" class="nav-link px-0" data-name="Menu Item">Electronics</a>
                        <a href="#" class="nav-link px-0" data-name="Menu Item">Monitors</a>
                        <a href="#" class="nav-link px-0" data-name="Menu Item">Networks</a>
                    </nav>
                </div>
            </div>
        </div>
        <div class="container-fluid border-top s_mega_menu_odoo_menu_footer">
            <div class="row">
                <div class="s_mega_menu_gray_area col-12 pt8 pb8">
                    <div class="s_social_media text-center o_not_editable" data-snippet="s_social_media" data-name="Social Media" contenteditable="false">
                        <h5 class="s_social_media_title d-none" contenteditable="true">Follow us</h5>
                        <a href="/website/social/facebook" class="s_social_media_facebook me-3 ms-3" target="_blank" aria-label="Facebook">
                            <i class="fa fa-2x fa-facebook m-1 o_editable_media"/>
                        </a>
                        <a href="/website/social/twitter" class="s_social_media_twitter me-3 ms-3" target="_blank" aria-label="X">
                            <i class="fa fa-2x fa-twitter m-1 o_editable_media"/>
                        </a>
                        <a href="/website/social/linkedin" class="s_social_media_linkedin me-3 ms-3" target="_blank" aria-label="LinkedIn">
                            <i class="fa fa-2x fa-linkedin m-1 o_editable_media"/>
                        </a>
                        <a href="/website/social/github" class="s_social_media_github me-3 ms-3" target="_blank" aria-label="GitHub">
                            <i class="fa fa-2x fa-github m-1 o_editable_media"/>
                        </a>
                        <a href="/website/social/youtube" class="s_social_media_youtube me-3 ms-3" target="_blank" aria-label="YouTube">
                            <i class="fa fa-2x fa-youtube m-1 o_editable_media"/>
                        </a>
                        <a href="/website/social/instagram" class="s_social_media_instagram me-3 ms-3" target="_blank" aria-label="Instagram">
                            <i class="fa fa-2x fa-instagram m-1 o_editable_media"/>
                        </a>
                        <a href="/website/social/tiktok" class="s_social_media_tiktok me-3 ms-3" target="_blank" aria-label="TikTok">
                            <i class="fa fa-2x fa-tiktok m-1 o_editable_media"/>
                        </a>
                        <a href="/website/social/discord" class="s_social_media_discord me-3 ms-3" target="_blank" aria-label="Discord">
                            <i class="fa fa-2x fa-discord m-1 o_editable_media"/>
                        </a>
                    </div>
                </div>
            </div>
        </div>
    </section>
</t>

