  <!-- preloader -->
    <div class="preloader">
        <div class="preloader-inner">
            <span></span>
            <span></span>
            <span></span>
            <span></span>
        </div>
    </div>
    <!-- preloader-end -->

    <!-- Scroll-top -->
    <button class="scroll__top scroll-to-target" data-target="html">
        <i class="fas fa-chevron-up"></i>
    </button>
    <!-- Scroll-top-end-->

    <!-- header-area -->
     
    
    <header>
        <div class="tg-header__top">
            <div class="container">
                <div class="row align-items-center">
                    <div class="col-lg-7">
                        <div class="tg-header__top-info">
                            <ul class="list-wrap">
                                <li><i class="flaticon-placeholder"></i>5 Bouvard Farhat hached Hammem-Lif 2050</li>
                                <li><i class="flaticon-envelope"></i><a href="mailto:contact@crea-brain.com">contact@crea-brain.com</a></li>
                            </ul>
                        </div>
                    </div>
                    <div class="col-lg-5">
                        <div class="tg-header__top-right">
                            <ul class="list-wrap">
                                <li><i class="flaticon-telephone"></i><a href="tel:0021652957555">+216 52 957 555</a></li>
                                <li>
                                    <div class="tg-header__top-social">
                                        <ul class="list-wrap">
                                            <li><a href="https://www.facebook.com/Stecreabrain" target="_blank"><img src="assets/img/icons/facebook.svg" alt="" class="injectable"></a></li>
                                            <li><a href="https://x.com/home" target="_blank"><img src="assets/img/icons/twitter.svg" alt="" class="injectable"></a></li>
                                            <li><a href="https://www.instagram.com/" target="_blank"><img src="assets/img/icons/instagram.svg" alt="" class="injectable"></a></li>
                                            <li><a href="https://www.pinterest.com/" target="_blank"><img src="assets/img/icons/pinterest.svg" alt="" class="injectable"></a></li>
                                        </ul>
                                    </div>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div id="header-fixed-height"></div>
        <div id="sticky-header" class="tg-header__area tg-header__area-six">
            <div class="container" style="    max-width: 95% !important;">
                <div class="row">
                    <div class="col-12">
                        <div class="tgmenu__wrap">
                            <nav class="tgmenu__nav">
                                <div class="logo">
                                    <a href="{{ url('/') }}"><img src="assets/img/logo/logo.png" alt="Logo"></a>
                                </div>
                                <div class="tgmenu__navbar-wrap tgmenu__main-menu d-none d-lg-flex">
                                    <ul class="navigation p-relative">
                                        <li class="active menu-item-has-children tg-mega-menu-has-children"><a href="{{ url('/') }}">accueil</a>
                                           
                                        </li>
                                        <li class="menu-item-has-children"><a href="{{ url('about') }}">À propos</a>
                                            
                                        </li>
                                        <li class="menu-item-has-children"><a href="#">Services</a>
                                            <ul class="sub-menu">
                                                
                                                <li><a href="{{ url('devweb') }}">Développement d'applications</a></li>
                                                <li><a href="{{ url('integapi') }}">Intégration d’API et systèmes</a></li>
                                                <li><a href="{{ url('conseilAudit') }}">Conseil & audit IT</a></li>                                                
                                                <li><a href="{{ url('support') }}">Support technique & maintenance</a></li>
                                                <li><a href="{{ url('callcenter') }}">Centre d'appel : externalisation, positions équipées</a></li>
                                                
                                            </ul>
                                        </li>
                                        <li class="menu-item-has-children"><a href="{{ url('solution_all') }}"> Solutions</a>
                                            <ul class="sub-menu">
                                                <li><a href="{{ url('phoneris') }}">Phonéris (WebDial Pro) </a></li>
                                                <li><a href="{{ url('crm') }}">Plateforme sur mesure</a></li>    
                                                <li><a href="{{ url('rdvmanager') }}">RDV Manager</a></li>
                                            </ul>
                                        </li>
                                        <li class="menu-item-has-children"><a href="#">  Tarification</a>
                                            <ul class="sub-menu">
                                                <li><a href="{{ url('phoneris_tarif') }}">Offres Phonéris</a></li>
                                                <!--<li><a href="{{ url('pack_tarif') }}">Packs personnalisés</a></li>-->
                                               
                                            </ul>
                                        </li>
                                
                                        <li><a href="{{ url('contact_all') }}">Contact</a></li>
                                    </ul>
                                </div>
                                <div class="tgmenu__action tgmenu__action-six">
                                    <ul class="list-wrap">
                                        
                                        <li class="header-btn">
                                            <a href="https://wa.me/0021652957555?text=Bonjour," class="tg-btn tg-btn-four tg-btn-five">Contactez-nous<img src="assets/img/icons/right_arrow02.svg" alt="" class="injectable"></a>
                                        </li>
                                        <li class="offCanvas-menu">
                                            <a href="javascript:void(0)" class="menu-tigger">
                                                <img src="assets/img/icons/burger.svg" alt="" class="injectable">
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                                <div class="mobile-nav-toggler"><i class="tg-flaticon-menu"></i></div>
                            </nav>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <!-- Mobile Menu  -->
        <div class="tgmobile__menu">
            <nav class="tgmobile__menu-box">
                <div class="close-btn"><i class="tg-flaticon-close-1"></i></div>
                <div class="nav-logo">
                    <a href="{{ url('/') }}"><img src="assets/img/logo/logo.png" alt="Logo"></a>
                </div>
                <div class="tgmobile__search">
                    <form action="#">
                        <input type="text" placeholder="Search here...">
                        <button><i class="fas fa-search"></i></button>
                    </form>
                </div>
                <div class="tgmobile__menu-outer">
                    <!--Here Menu Will Come Automatically Via Javascript / Same Menu as in Header-->
                </div>
                <div class="social-links">
                    <ul class="list-wrap">
                        <li><a href="https://www.facebook.com/Stecreabrain"><i class="fab fa-facebook-f"></i></a></li>
                        <li><a href="#"><i class="fab fa-twitter"></i></a></li>
                        <li><a href="#"><i class="fab fa-instagram"></i></a></li>
                        <li><a href="#"><i class="fab fa-linkedin-in"></i></a></li>
                        <li><a href="#"><i class="fab fa-youtube"></i></a></li>
                    </ul>
                </div>
            </nav>
        </div>
        <div class="tgmobile__menu-backdrop"></div>
        <!-- End Mobile Menu -->

        <!-- header-search -->
        <div class="search__popup">
            <div class="container">
                <div class="row">
                    <div class="col-12">
                        <div class="search__wrapper">
                            <div class="search__close">
                                <button type="button" class="search-close-btn">
                                    <svg width="18" height="18" viewBox="0 0 18 18" fill="none"
                                        xmlns="http://www.w3.org/2000/svg">
                                        <path d="M17 1L1 17" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"
                                            stroke-linejoin="round"></path>
                                        <path d="M1 1L17 17" stroke="currentColor" stroke-width="1.5" stroke-linecap="round"
                                            stroke-linejoin="round"></path>
                                    </svg>
                                </button>
                            </div>
                            <div class="search__form">
                                <form action="#">
                                    <div class="search__input">
                                        <input class="search-input-field" type="text" placeholder="Type keywords here">
                                        <span class="search-focus-border"></span>
                                        <button>
                                            <svg width="20" height="20" viewBox="0 0 20 20" fill="none"
                                                xmlns="http://www.w3.org/2000/svg">
                                                <path d="M9.55 18.1C14.272 18.1 18.1 14.272 18.1 9.55C18.1 4.82797 14.272 1 9.55 1C4.82797 1 1 4.82797 1 9.55C1 14.272 4.82797 18.1 9.55 18.1Z" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
                                                <path d="M19.0002 19.0002L17.2002 17.2002" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"></path>
                                            </svg>
                                        </button>
                                    </div>
                                </form>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="search-popup-overlay"></div>
        <!-- header-search-end -->

        <!-- offCanvas-menu -->
        <div class="offCanvas__info">
            <div class="offCanvas__close-icon menu-close">
                <button><img src="assets/img/icons/times.svg" alt="" class="injectable"></button>
            </div>
            <div class="offCanvas__logo mb-30">
                <a href="{{ url('/') }}"><img src="assets/img/logo/logo.png" alt="Logo"></a>
            </div>
            <div class="offCanvas__content">
                <p>CREABRAIN crée en 2018 est une entreprise spécialisée dans les solutions technologiques innovantes pour les entreprises. Nous combinons expertise en développement web, outils de prospection téléphonique et systèmes de communication VoIP pour offrir des solutions complètes qui facilitent la croissance de votre activité. .</p>
            </div>
            
            <div class="offCanvas__side-info">
                <div class="contact-list">
                    <i class="flaticon-placeholder"></i>
                    <p>5 Bouvard Farhat hached Hammem-Lif 2050</p>
                </div>
                <div class="contact-list">
                    <i class="flaticon-telephone"></i>
                    <a href="tel:0021652957555">+216 52 957 555</a>
                </div>
                <div class="contact-list">
                    <i class="flaticon-envelope"></i>
                    <a href="mailto:contact@crea-brain.com">contact@crea-brain.com</a>
                </div>
            </div>
            <div class="offCanvas__social">
                <h6 class="title">Follow us</h6>
                <ul class="list-wrap">
                    <li><a href="https://www.facebook.com/Stecreabrain" target="_blank"><img src="assets/img/icons/facebook.svg" alt="" class="injectable"></a></li>
                    <li><a href="https://x.com/home" target="_blank"><img src="assets/img/icons/twitter.svg" alt="" class="injectable"></a></li>
                    <li><a href="https://www.instagram.com/" target="_blank"><img src="assets/img/icons/instagram.svg" alt="" class="injectable"></a></li>
                    <li><a href="https://www.pinterest.com/" target="_blank"><img src="assets/img/icons/pinterest.svg" alt="" class="injectable"></a></li>
                </ul>
            </div>
        </div>
        <div class="offCanvas__overly"></div>
        <!-- offCanvas-menu-end -->

    </header>

     <!-- header-area-end -->