{% load static %}
        <meta charset="UTF-8">
        <meta http-equiv='content-language' content='fr'>
        <meta content="width=device-width, initial-scale=1.0" name="viewport">

        <meta name="viewport" content="width=device-width, initial-scale=1">
      
        <!-- Meta Tags pour le SEO -->
        <meta name="keywords" content="{{ meta_keywords }}">
        <meta name="description" content="{{ meta_description }}">
      
        <meta http-equiv="x-ua-compatible" content="ie=edge,chrome=1">
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        {% if page_title %}
                <meta name="title" content="{{ page_title }}">
        {% else %}
                <meta name="title" content="{{ SITE_NAME }}">
        {% endif %}
        
        <!-- URL Canonique -->
        <link rel="canonical" href="{{ canonical_url }}">
        <link rel="preload" href="{% static 'font/Montserrat-Light.ttf' %}">
        <link rel="preload" href="{% static 'font/Montserrat-Regular.ttf' %}">
        <link rel="preload" href="{% static 'font/Montserrat-Bold.ttf' %}">
        <link rel="preload" href="{% static 'font/Montserrat-ExtraBold.ttf' %}">
        <link rel="preload" href="{% static 'font/Montserrat-SemiBold.ttf' %}">
        <link rel="preload" href="{% static 'font/Montserrat-Medium.ttf' %}">
        <link rel="preload" href="{% static 'font/lineicons.ttf' %}">

        <link rel="stylesheet" href="{% static 'css/bootstrap.min.css' %}">
        <link rel="stylesheet" href="{% static 'css/main.css' %}">

        <link rel="stylesheet" href="{% static 'css/LineIcons.2.0.css' %}">
        <link rel="stylesheet" href="{% static 'css/wrapper.css' %}">
        <link rel="stylesheet" href="{% static 'css/js_composer.min.css' %}">
        <link rel="stylesheet" href="{% static 'css/style.css' %}">
        <link rel="stylesheet" href="{% static 'css/tailwind.css' %}">
        <link rel="stylesheet" href="{% static 'css/team.css' %}">
        <link rel="stylesheet" href="{% static 'css/footer.css' %}">

        <link rel="icon" href="{% static 'img/esperanzia.png' %}">
        <link rel="favicon" href="{% static 'img/esperanzia.png' %}">
        
        <link href="https://fonts.googleapis.com/css?family=Roboto:300" rel="stylesheet">


        <script src="{% static 'js/jquery-3.5.1.min.js' %}"></script>
        <script src="{% static 'js/theme.js' %}"></script>
        
        <a href="https://wa.me/221779200224?text=Bonjour+Esperanzia" class="float" target="_blank">
                <i class="lni lni-whatsapp my-float"></i>
        </a>

        {% if user.is_authenticated %}
                <a href="{% url 'accounts:profile' %}" class="profil-float" type="button">
                        <img src="{{user.user_profile.url}}" class="rounded-full" width="60px" height="60px">
                </a>
        {% else %}
                <a href="{% url 'accounts:login' %}" class="profil-float-user" type="button">
                        <p class="rounded-full text-white" width="100px" height="30px" style="margin-top: 2.5px;">Mon profil</p>
                </a>
        {% endif %}

        <style>
        .float {
                position: fixed;
                width: 60px;
                height: 60px;
                bottom: 95px;
                right: 30px;
                background-color: #31f742;
                color: #fff;
                border-radius: 50px;
                text-align: center;
                font-size: 30px;
                box-shadow: 2px 2px 3px #999;
                z-index: 100;
        }
        .my-float {
                margin-top: 15px;
        }

        .profil-float {
                position: fixed;
                width: 60px;
                height: 60px;
                bottom: 20px;
                right: 25px;
                background-color: #5589fc;
                color: #fff;
                border-radius: 50px;
                text-align: center;
                font-size: 30px;
                box-shadow: 2px 2px 3px #999;
                z-index: 100;
        }

        .profil-float-user {
                position: fixed;
                width: 120px;
                height: 30px;
                bottom: 40px;
                right: 20px;
                background-color: #fc6f03;
                color: #fff;
                border-radius: 50px;
                text-align: center;
                font-size: 30px;
                box-shadow: 2px 2px 3px #999;
                z-index: 100;
        }

        .my-float-profil {
                margin-top: 15px;
        }
        </style>