templates/home/index.html.twig line 1

Open in your IDE?
  1. {% extends 'base.html.twig' %}
  3. {% block title %}Maison Eiffel - Accueil
  4. {% endblock %}
  6. {% block body %}
  7.     <div class="mainContainer">
  8.         <header class="header">
  9.             <div class="header__top">
  10.                 <p class="adress-top">
  11.                     <a target="_blank" href="https://www.google.fr/maps/place/Maison+Esth%C3%A9tique/@48.8615633,2.2789474,16.69z/data=!4m6!3m5!1s0x47e66f5e9a727869:0x49ccc3d8e92e5224!8m2!3d48.8614277!4d2.2820639!16s%2Fg%2F11pxx2nfx0?entry=ttu">
  12.                         <i class='fas fa-map-marker-alt'></i>
  13.                         Nous trouver sur la carte</a>
  14.                     <a href="/avis">
  15.                         <i class="far fa-star"></i>
  16.                         Avis certifiés</a>
  17.                 </p>
  18.             </div>
  19.     
  20.             <div class="header__main">
  21.                 <div class="header__main__content">
  22.                     <a href="{{ path('home') }}" class="logo">
  23.                         <img src="{{ asset('assets/images/logo.png') }}" alt=""></a>
  24.     
  25.                         <ul class='menu'>
  26.                             <li>
  27.                                 <a href="{{ path('home') }}">Notre centre</a>
  28.                             </li>
  29.     
  30.                             <li id="menuButton" class="deroul-specialites" onClick='openSpecialites()'>
  31.                                 <a>Nos spécialités</a>
  32.                             </li>
  34.                             <li class="deroul-specialites">
  35.                                 <a href="{{ path('besoins') }}">Vos besoins</a>
  36.                             </li>
  37.     
  38.                             <li>
  39.                                 <a href="{{ path('blog') }}">Blog</a>
  40.                             </li>
  41.                             <li>
  42.                                 <a href="{{ path('avis') }}">Avis</a>
  43.                             </li>
  44.                             <li class="link-contact">
  45.                                 <a href="{{ path('contact') }}">Contact</a>
  46.                                 <div class="link-border-contact"></div>
  47.                                 <div class="link-back-contact"></div>
  48.                             </li>
  49.                         </ul>
  50.     
  51.                         <label class="mobile-menu-btn">
  52.                             <i class="fas fa-bars" onclick='displayMenu()' id='open'></i>
  53.                             <i class="fas fa-times" onclick='closeMenu()' id='close'></i>
  54.                         </label>
  55.     
  56.                         <div class="adress">
  57.                             <div class="adress-box">
  58.                                     <strong>
  59.                                         <a href="tel:0153700512" style="color:black;"><i class="far fa-calendar"></i>
  60.                                         01 53 70 05 12</strong></a>
  61.                                     <br>
  62.                                         <a href="https://www.treatwell.fr/salon/maison-eiffel-esthetique/">Rendez-vous</a>
  63.     
  64.                             </div>
  65.     
  66.     
  67.                         </div>
  68.                     </div>
  69.                         <ul class="deroul n1" id="deroulant-spe">
  70.                                     <li>
  71.                                         <a href="{{ path('specialites_plasma') }}">Plasma</a>
  72.                                     </li>
  73.                                     <li>
  74.                                         <a href="{{ path('specialites_injection') }}">Injection</a>
  75.                                     </li>
  76.                                     <li>
  77.                                         <a href="{{ path('specialites_toxine') }}">Toxine</a>
  78.                                     </li>
  79.                                     <li>
  80.                                         <a href="{{ path('specialites_philart') }}">Philart</a>
  81.                                     </li>
  82.                                     <li>
  83.                                         <a href="{{ path('specialites_morpheus') }}">Morpheus</a>
  84.                                     </li>
  85.                                     <li>
  86.                                         <a href="{{ path('specialites_morpheus') }}">Virtu RF</a>
  87.                                     </li>
  88.                                     <li>
  89.                                         <a href="{{ path('specialites_laser-resurfacing') }}">Laser resurfacing</a>
  90.                                     </li>
  91.                                     <li>
  92.                                         <a href="{{ path('specialites_epilation-laser') }}">Epilation laser</a>
  93.                                     </li>
  94.                                     <li>
  95.                                         <a href="{{ path('specialites_cryolipolyse') }}">Cryolipolyse</a>
  96.                                     </li>
  97.                                     <li>
  98.                                         <a href="{{ path('specialites_peeling') }}">Peeling</a>
  99.                                     </li>
  100.                                     <li>
  101.                                         <a href="{{ path('specialites_peel-mask-creme') }}">Peel Mask</a>
  102.                                     </li>
  103.                                     <li>
  104.                                         <a href="{{ path('specialites_radiofrequence') }}">Radiofréquence</a>
  105.                                     </li>
  106.                                     <li>
  107.                                         <a href="{{ path('specialites_luminotherapie') }}">Luminotherapie</a>
  108.                                     </li>
  109.                                     <li>
  110.                                         <a href="{{ path('specialites_hydrafacial') }}">Hydrafacial</a>
  111.                                     </li>
  112.                                     <li>
  113.                                         <a href="{{ path('specialites_microneedling') }}">Microneedling</a>
  114.                                     </li>
  115.                                     <li>
  116.                                         <a href="{{ path('specialites_blanchiment-dentaire') }}">Blanchiment Dentaire</a>
  117.                                     </li>
  118.                                     <li>
  119.                                         <a href="{{ path('specialites_drainage-cardiosynchronise-stendo') }}">Drainage</a>
  120.                                     </li>
  121.                                     <li>
  122.                                         <a href="{{ path('specialites_mesotherapie-capillaire') }}">Mésothérapie Capillaire</a>
  123.                                     </li>
  124.                                 </ul>
  125.             </div>
  126.     
  127.             <div class="header__list" id='header__list'>
  128.                 <ul class="menu-mobile">
  129.                     <li>
  130.                         <a href="{{ path('home') }}">Notre centre</a>
  131.                     </li>
  132.     
  133.                     <li class="deroul-mobile">
  134.                         <button class="menuonclick" onclick="openSousMenu()">
  135.                             Nos specialites
  136.                             <img class="arrowdown" src="{{ asset('assets/images/arrow-down.png') }}" alt="arrow down">
  137.                         </button>
  138.                         <ul class="deroul-click">
  139.                             <li><a href="{{ path('specialites_plasma') }}">Plasma</a></li>
  140.                             <li><a href="{{ path('specialites_injection') }}">Injection</a></li>
  141.                             <li><a href="{{ path('specialites_toxine') }}">Toxine</a></li>
  142.                             <li><a href="{{ path('specialites_philart') }}">Philart</a></li>
  143.                             <li><a href="{{ path('specialites_morpheus') }}">Morpheus</a></li>
  144.                             <li><a href="{{ path('specialites_laser-resurfacing') }}">Laser resurfacing</a></li>
  145.                         </ul>
  146.                     </li>
  147.     
  148.                     <li>
  149.                         <a href="{{ path('besoins') }}">Vos besoins</a>
  150.                     </li>
  151.     
  152.                     <li>
  153.                         <a href="{{ path('blog') }}">Blog</a>
  154.                     </li>
  155.     
  156.                     <li>
  157.                         <a href="{{ path('avis') }}">
  158.                             Avis
  159.                         </a>
  160.                     </li>
  161.                     <li>
  162.                         <a href="{{ path('contact') }}">
  163.                             Contact
  164.                         </a>
  165.                     </li>
  166.                 </ul>
  167.             </div>
  168.     
  169.     
  170.         </header>
  172.         <div class='video-container'>
  173.             <video class='video' autoPlay muted loop>
  174.                 <source src="{{ asset('assets/images/video.mp4') }}" type='video/mp4' />
  175.             </video>
  176.             <!-- <div class='container-text-video'>
  177.                 <h2 class="title-video">LOREM IPSUM DOLOR</h2>
  178.                 <p class="text-video">Lorsque cela est possible, nous déconseillons d'exposer les nœuds DOM, mais cela peut être
  179.                     une trappe de sortie utile. Notez que cette approche nécessite que vous ajoutiez du code au composant enfant. Si vous
  180.                     n'avez absolument aucun contrôle sur l'implémentation du composant enfant, votre dernière option consiste à utiliser 
  181.                     findDOMNode, mais cela est déconseillé et obsolète dans StrictMode.</p>
  182.                 <div class="en-savoir-plus">
  183.                     <div class="ligne-video"></div>
  184.                     <li class="text-esp"><a href="{{ path('contact') }}">En savoir plus</a></li>
  185.                 </div>
  186.             </div> -->
  187.         </div>
  189.         <div class="about-us">
  190.             <div class="container-about-infos">
  191.                 <div class="about-info" data-aos="fade-right" data-aos-duration="1500">
  192.                     <h2 class="title-about">Chez<br/> <span>Maison Eiffel Esthétique</span></h2>
  193.                     <p class='about-text'>
  194.                         Nous vous accueillons dans un véritable écrin avec la promesse d’une écoute attentive et
  195.                         d’une expertise reconnue pour sublimer votre beauté.<br />
  196.                         Notre vocation est de vous offrir un moment privilégié où votre beauté naturelle doit refléter
  197.                         l’harmonie entre l’être et le paraître et où vos rêves esthétiques prennent vie dans une
  198.                         atmosphère de bienveillance et d’excellence.
  199.                     </p>
  200.                     
  201.                 </div>
  202.             </div>
  204.             <div class="about-image-container" data-aos="fade-left" data-aos-duration="1500">
  205.                 <img class="about-img" src="{{ asset('assets/images/me.jpg') }}" alt="image d'illustration centre"/>
  206.                 
  207.                 <div class="about-border-square"></div>
  208.             </div>
  209.         </div>
  210.        
  211.         <section class="section-doctor" >
  212.             <div class="container-img-doctor" data-aos="fade-right" data-aos-duration="1500">
  213.                 <img class="doctor-img" src="{{ asset('assets/images/YL.jpeg') }}" alt="docteur" />
  214.                 <div class="square-border-doctor"></div>
  215.             </div>
  216.             <div class="container-info-doctor" data-aos="fade-left" data-aos-duration="1500">
  217.                 <h1 class="title-doctor">Yann<span> Lévy</span></h1>
  218.                 <p class="text-doctor">Pour cela, nous explorons continuellement les frontières de la science esthétique pour vous
  219. apporter des solutions efficaces, sûres à la pointe de l&#39;innovation dans le monde de
  220. l&#39;esthétique</p>
  221.                 <p class="text-doctor">Nous savons que votre confiance, votre satisfaction et votre épanouissement sont le miroir
  222. de notre réussite.</p>
  223.                 <a class="container-buttonBorder" target="_blank" href="https://www.treatwell.fr/salon/maison-eiffel-esthetique/">
  224.                     <p class="buttonBorder">Prendre rendez-vous</p>
  225.                     <p class="border-buttonBorder"></p>
  226.                     <p class="back-buttonBorder"></p>
  227.                 </a>
  228.                 
  229.             </div>
  230.             <div class="square-border-info n1"></div>
  231.             <div class="square-border-info n2"></div>
  232.         </section>
  234.         <div class='specialites-container' data-aos="fade-up" data-aos-duration="1500">
  235.                 <div class='container-text-specialites'>
  236.                     <!--p class="title-about">Nos Spécialités</p>-->
  237.                     <h1 class='titleOffer' style="text-align:center;" ><span>Nos</span>Spécialités</h1>
  238.                     <p class="text-specialites">Pour vous satisfaire nous travaillons sur plusieurs mécanismes naturels favorisant la
  239.                         régénération, la réparation ou la correction d’un aspect de la peau, d’un regard, d’un
  240.                         sourire, d’une chevelure, d’une ligne du visage ou du corps.</p>
  241.                 </div>
  242.                 <div class="container-specialites">
  243.                 <div class="container-specialites-frame">
  244.                     <div class="specialites-frame">
  245.                         <div class="specialites">
  246.                             <img class="mosaique n1" src="{{ asset('assets/images/pexels-elina-fairytale-3865530.jpg') }}" alt='spe' />
  247.                             <p class="text-frame">EPILATION<br/> LASER</p>
  248.                         </div>
  249.                     </div>
  250.                     <div class="specialites-frame">
  251.                         <div class="specialites">
  252.                             <img class="mosaique n2" src="{{ asset('assets/images/mosaique.jpg') }}" alt='spe' />
  253.                             <p class="text-frame">MÉDECINE<br/> ESTHETIQUE</p>
  254.                         </div>
  255.                     </div>
  256.                     <div class="specialites-frame">
  257.                         <div class="specialites">
  258.                             <img class="mosaique n3" src="{{ asset('assets/images/pexels-gustavo-fring-5622040.jpg') }}" alt='spe' /> 
  259.                             <p class="text-frame">HYDRAFACIAL</p>
  260.                         </div>
  261.                     </div>
  262.                     <div class="specialites-frame">
  263.                         <div class="specialites">
  264.                             <img class="mosaique n6" src="{{ asset('assets/images/pexels-samad-ismayilov-735552_r@2x.png') }}" alt='spe' />
  265.                             <p class="text-frame">TRAITEMENT<br/> DE LA PEAU</p>
  266.                         </div>
  267.                     </div>
  268.                     <div class="specialites-frame">
  269.                         <div class="specialites">
  270.                             <img class="mosaique n6" src="{{ asset('assets/images/mosaique6.png') }}" alt='spe' />
  271.                             <p class="text-frame">TRAITEMENT<br/> DE LA PEAU</p>
  272.                         </div>
  273.                     </div>
  274.                 </div>
  275.                 <div class="container-specialites-frame">
  276.                     <div class="specialites-frame">
  277.                         <div class="specialites">
  278.                             <img class="mosaique n4" src="{{ asset('assets/images/pexels-gustavo-fring-5622040.jpg') }}" alt='spe' />
  279.                             <p class="text-frame">SOINS <br/>VISAGE</p>
  280.                         </div>
  281.                     </div>
  282.                     <div class="specialites-frame">
  283.                         <div class="specialites">
  284.                             <img class="mosaique n5" src="{{ asset('assets/images/0ca6f3c43d3ca79a66945c464b16017c.jpeg') }}" alt='spe' />
  285.                             <p class="text-frame">SOINS<br/> CAPILAIRE</p>
  286.                         </div>
  287.                     </div>
  288.                     <div class="specialites-frame">
  289.                         <div class="specialites">
  290.                             <img class="mosaique n6" src="{{ asset('assets/images/27de1f60e3c1a90a389aa6794cef999b.jpeg') }}" alt='spe' />
  291.                             <p class="text-frame">TRAITEMENT<br/> DE LA PEAU</p>
  292.                         </div>
  293.                     </div>
  294.                     <div class="specialites-frame">
  295.                         <div class="specialites">
  296.                             <img class="mosaique n6" src="{{ asset('assets/images/pexels-samad-ismayilov-735552.jpg') }}" alt='spe' />
  297.                             <p class="text-frame">TRAITEMENT<br/> DE LA PEAU</p>
  298.                         </div>
  299.                     </div>
  300.                     <div class="specialites-frame">
  301.                         <div class="specialites">
  302.                             <img class="mosaique n6" src="{{ asset('assets/images/epilation-laser-centre-du-champs-de-mars-1536x1171.jpg') }}" alt='spe' />
  303.                             <p class="text-frame">TRAITEMENT<br/> DE LA PEAU</p>
  304.                         </div>
  305.                     </div>
  306.                 </div>
  307.             </div>
  308.         </div>
  310.         <div class="center">
  311.             <!--<h2 class="title-about" data-aos="fade-up" data-aos-duration="1500" style="text-transform: lowercase;">
  312.                 Notre centre et nos équipes
  313.             </h2>-->
  314.             <h1  data-aos="fade-up" data-aos-duration="1500" class='titleOffer' style="color:white;"><span>Notre centre</span>et nos équipes</h1>
  317.             <P class="text" data-aos="fade-up" data-aos-duration="1500">
  318. Qu’il s’agisse de traitements anti-âges, de soins de la peau, de correction corporelle ou de
  319. toute autre préoccupation esthétique, nous disposons des solutions avancées et des
  320. partenaires pour répondre à vos besoins.            </P>
  322.             <div class="slider">
  323.                 <div class="slide-container swiper">
  324.                     <div class="slide-content" data-aos="fade-up" data-aos-duration="1500">
  325.                         <div class="card-wrapper swiper-wrapper">
  326.                             <div class="card swiper-slide">
  328.                                 <img src="{{ asset('assets/images/me.jpg') }}" alt="">
  329.                             </div>
  331.                             <div class="card swiper-slide slide0">
  332.                                  <img src="{{ asset('assets/images/maisoneiffel equipe_2.jpg') }}" alt="">
  333.                             </div>
  335.                             <div class="card swiper-slide">
  336.                                 <img src="{{ asset('assets/images/soin1.jpg') }}" alt="">
  337.                             </div>
  339.                             <div class="card swiper-slide">
  340.                                 <img src="{{ asset('assets/images/soin2.jpg') }}" alt="">
  341.                             </div>
  342.                         </div>
  343.                     </div>
  344.                     <div class="swiper-button-next swiper-navBtn"></div>
  345.                     <div class="swiper-button-prev swiper-navBtn"></div>
  346.                     <div class="swiper-pagination"></div>
  347.                 </div>
  349.             </div>
  350.         </div>
  352.         <!--<div class="slider-avis" data-aos="fade-up" data-aos-duration="1500">
  353.             <div class="slide-container-avis swiperAvis" >
  354.                 <div class="slide-content-avis" >
  355.             <div class="card-wrapper-avis swiper-wrapper">
  356.               <div class="card-avis swiper-slide">
  357.                 <div class="testimonial-list-entry">
  358.                   <p class="testimonial">
  359.                     “La douceur et la bienveillance de Sofia font partie intégrante du soin. J’ai adoré la lampe Led en fin de soin qui cristallise les bienfaits des vitamines. Je rêve encore de son massage de nuque 🥰”
  360.                   </p>
  361.                   <p class="testimonial-list-entry__details">Jenifer</p>
  362.                 </div>
  363.               </div>
  364.               <div class="card-avis swiper-slide slide0">
  365.                 <div class="testimonial-list-entry">
  366.                   <p class="testimonial">
  367.                     “Une expertise à toute épreuve et une réelle connaissance des outils techniques et des actifs prodigués. Ma peau est beaucoup plus belle à la quarantaine qu’à mes trente ans! Très loin devant d’autres maisons d’esthétique. Toute ma reconnaissance 💐à Naella qui commence à connaître ma peau mieux que moi.✨”
  368.                   </p>
  369.                   <p class="testimonial-list-entry__details">Malika 🌺</p>
  370.                 </div>
  371.               </div>
  372.               <div class="card-avis swiper-slide">
  373.                 <div class="testimonial-list-entry">
  374.                   <p class="testimonial">
  375.                     “C’est toujours un grand moment de Bonheur d’aller faire un soin chez Maison Eiffel Esthétique.”
  376.                   </p>
  377.                   <p class="testimonial-list-entry__details">Magalhaes</p>
  378.                 </div>
  379.               </div>
  380.               <div class="card-avis swiper-slide">
  381.                 <div class="testimonial-list-entry">
  382.                   <p class="testimonial">
  383.                     “Toujours formidable! Ma peau renaît à chaque soin et quel moment de bonheur et de détente. Je recommande mille pour-cent! Merci encore Naella🧚‍♀️ Se sentir « bien dans sa peau » prend tout son sens.🌹”
  384.                   </p>
  385.                   <p class="testimonial-list-entry__details">Libessart</p>
  386.                 </div>
  387.               </div>
  388.               <div class="card-avis swiper-slide">
  389.                 <div class="testimonial-list-entry">
  390.                   <p class="testimonial">
  391.                     “Je suis patiente de la clinique depuis des années je n' habite pas paris et que ce soit la chirurgie esthétique ou soin esthétique je ne changerai d' adresse ces professionnels rassurant compétences dans tous les domaines.”
  392.                   </p>
  393.                   <p class="testimonial-list-entry__details">Chavant</p>
  394.                 </div>
  395.               </div>
  396.             </div>
  397.                 </div>
  398.                 <div class="swiper-button-next-avis swiper-navBtn-avis">
  399.                     <div class="line-swiper-button"></div>
  400.                     <div class="line-swiper-button"></div>
  401.                 </div>
  402.                 <div class="swiper-button-prev-avis swiper-navBtn-avis">
  403.                     <div class="line-swiper-button"></div>
  404.                     <div class="line-swiper-button"></div>
  405.                 </div>
  406.                 <div class="swiper-pagination-avis"></div>
  407.             </div>
  408.         </div>-->
  411.         <!-- <div class='blog-container' data-aos="fade-right"  data-aos-duration="1500">
  412.             <div class='container-text-specialites'>
  413.                 <p class="title-specialites">NOTRE BLOG</p>
  414.                 <p class="text-specialites">Lorsque cela est possible, nous déconseillons d'exposer les nœuds DOM, mais cela peut être
  415.                     une trappe de sortie utile. Notez que cette approche nécessite que vous ajoutiez du code au composant enfant. </p>
  416.                 <div class="container-blog-frame">
  417.                     <div class="blog-frame">
  418.                         <div class="blog-div-img">
  419.                             <img src="{{ asset('assets/images/27de1f60e3c1a90a389aa6794cef999b.jpeg') }}" alt='spe' />    
  420.                         </div>
  421.                         <div class="blog-div-text">
  422.                             <p class="div-text-title">Lorem ipsum dolor sit amet</p>
  423.                             <p class="div-text-text">Lorem ipsum dolor sit amet,<br/>consetetur sadipscing elitr...</p>
  424.                             <div class='div-time'>
  425.                                 <img src="{{ asset('assets/images/horloge.png') }}" alt='horloge' />
  426.                                 <p class="time-text">4 min</p>
  427.                             </div>
  428.                             
  429.                         </div>
  430.                     </div>
  431.                     <div class="blog-frame">
  432.                         <div class="blog-div-img">
  433.                             <img src="{{ asset('assets/images/27de1f60e3c1a90a389aa6794cef999b.jpeg') }}" alt='spe' />    
  434.                         </div>
  435.                         <div class="blog-div-text">
  436.                             <p class="div-text-title">Lorem ipsum dolor sit amet</p>
  437.                             <p class="div-text-text">Lorem ipsum dolor sit amet,<br/>consetetur sadipscing elitr...</p>
  438.                             <div class='div-time'>
  439.                                 <img src="{{ asset('assets/images/horloge.png') }}" alt='horloge' />
  440.                                 <p class="time-text">4 min</p>
  441.                             </div>
  442.                             
  443.                         </div>
  444.                     </div>
  445.                     <div class="blog-frame">
  446.                         <div class="blog-div-img">
  447.                             <img src="{{ asset('assets/images/27de1f60e3c1a90a389aa6794cef999b.jpeg') }}" alt='spe' />    
  448.                         </div>
  449.                         <div class="blog-div-text">
  450.                             <p class="div-text-title">Lorem ipsum dolor sit amet</p>
  451.                             <p class="div-text-text">Lorem ipsum dolor sit amet,<br/>consetetur sadipscing elitr...</p>
  452.                             <div class='div-time'>
  453.                                 <img src="{{ asset('assets/images/horloge.png') }}" alt='horloge' />
  454.                                 <p class="time-text">4 min</p>
  455.                             </div>
  456.                         </div>
  457.                     </div>
  458.                 </div>
  459.                 <div class='div-blog-button'>
  460.                     <button class='blog-button' ><a href="{{ path('blog') }}">Lire plus d'articles</a></button>
  461.                 </div>
  462.                 </div>
  463.             </div> -->
  464.         <div class="containerTitleBlog" data-aos="fade-up" data-aos-duration="1500">
  465.             <h1 class='titleOffer'><span>Notre</span>Blog</h1>
  466.         </div>
  468.         <section class="sectionBlog">
  469.             <div class="containerBlog" data-aos="fade-up" data-aos-duration="1500">
  470.                 <img class="imgBlog" src="{{ asset('assets/images/m1.jpeg') }}" />
  471.                 <div class="containerTextBlog">
  472.                     <p class="titleBlog">Morpheus : une avancée spectaculaire dans le domaine de la beauté à tester à la Maison Eiffel</p>
  473.                     <a href="{{ path('article3') }}" class="readMoreBlog">Lire plus<img class="arrowBlog" src="{{ asset('assets/images/arrow.png')}}" alt="flèche"/></a>
  474.                 </div>
  475.             </div>
  476.             <div class="containerBlog" data-aos="fade-up" data-aos-duration="1500">
  477.                 <img class="imgBlog" src="{{ asset('assets/images/me.jpg')}}" />
  478.                 <div class="containerTextBlog">
  479.                     <p class="titleBlog">Le Centre Esthétique Maison Eiffel recommande 4 soins pour avoir une peau lumineuse en plein hiver</p>
  480.                     <a href="{{ path('article') }}" class="readMoreBlog">Lire plus<img class="arrowBlog" src="{{ asset('assets/images/arrow.png')}}" alt="flèche"/></a>
  481.                 </div>
  482.             </div>
  483.             <div class="containerBlog" data-aos="fade-up" data-aos-duration="1500">
  484.                 <img class="imgBlog" src="{{ asset('assets/images/microneedling.jpg') }}" />
  485.                 <div class="containerTextBlog">
  486.                     <p class="titleBlog">Les 3 soins stars de la parisienne pour bien commencer la saison</p>
  487.                     <a href="{{ path('article1') }}" class="readMoreBlog">Lire plus<img class="arrowBlog" src="{{ asset('assets/images/arrow.png')}}" alt="flèche"/></a>
  488.                 </div>
  489.             </div>
  490.         </section>
  491.         
  492.         <br> <br> <br><br>
  493. <footer>
  494.   <div class="footerNew-container">
  495.     <div class="footerNew-left">
  496.       <div class="footerNew-contact-info">
  497.         <div class="footerNew-contact-item">
  498.           <div class="footerNew-icon-circle">
  499.             <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" stroke="white" stroke-width="2" viewBox="0 0 24 24" aria-hidden="true">
  500.               <path d="M21 15.8V18a2 2 0 0 1-2 2h-1a16.009 16.009 0 0 1-13-13V5a2 2 0 0 1 2-2h2.2a1 1 0 0 1 1 .76l.72 3.18a1 1 0 0 1-.27.95L8.53 9.47a12 12 0 0 0 6 6l1.58-1.58a1 1 0 0 1 .95-.27l3.18.72a1 1 0 0 1 .76 1Z" />
  501.             </svg>
  502.           </div>
  503.           <a href="tel:0153700512"> 01 53 70 05 12</a>
  504.         </div>
  505.         <div class="footerNew-contact-item">
  506.           <div class="footerNew-icon-circle">
  507.             <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" stroke="white" stroke-width="2" viewBox="0 0 24 24" aria-hidden="true">
  508.               <path d="M21 8V6a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v2m18 0v10a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8m18 0L12 13 3 8" />
  509.             </svg>
  510.           </div>
  511.           <a href="mailto:contact@maison-eiffel-esthetique.fr">Envoyez-nous un message</a>
  512.         </div>
  513.         <div class="footerNew-contact-item">
  514.           <div class="footerNew-icon-circle">
  515.             <svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" fill="none" stroke="white" stroke-width="2" viewBox="0 0 24 24" aria-hidden="true">
  516.               <path d="M12 2a10 10 0 0 1 10 10c0 7.5-10 10-10 10S2 19.5 2 12A10 10 0 0 1 12 2Z" />
  517.               <circle cx="12" cy="12" r="3" />
  518.             </svg>
  519.           </div>
  520.           <a href="#">Nous trouver</a>
  521.         </div>
  522.       </div>
  523.     </div>
  525.     <div class="footerNew-right">
  526.       <div class="footerNew-column">
  527.         <h4>Nos spécialités</h4>
  528.         <ul>
  529.           <li><a href="/specialites/epilation-laser">Épilation laser</a></li>
  530.           <li><a href="/specialites/hydrafacial">Hydrafacial</a></li>
  531.           <li><a href="/specialites/injection">Injection</a></li>
  532.           <li><a href="#">Polynucléotides</a></li>
  533.           <li><a href="/specialites/morpheus">Morpheus</a></li>
  534.           <li><a href="#">Virtu RF</a></li>
  535.         </ul>
  536.       </div>
  537.     <div class="footerNew-column">
  538.         <h4>Vos besoins</h4>
  539.         <ul class="footerNew-dropdown">
  540.             <li>
  541.             <button class="footerNew-dropdown-button">Qualité de peau</button>
  542.             <ul class="footerNew-submenu">
  543.                 <li><a href="/specialites/peeling">Peeling</a></li>
  544.                 <li><a href="/specialites/laser-resurfacing">Laser resurfacing</a></li>
  545.                 <li><a href="/specialites/hydrafacial">Hydrafacial</a></li>
  546.                 <li><a href="/specialites/microneedling">Microneedling</a></li>
  547.             </ul>
  548.             </li>
  549.             <li>
  550.             <button class="footerNew-dropdown-button">Relâchement cutané</button>
  551.             <ul class="footerNew-submenu">
  552.                 <li><a href="/specialites/virturf">Virtu RF</a></li>
  553.             </ul>
  554.             </li>
  555.             <li>
  556.             <button class="footerNew-dropdown-button">Vieillissement cutané</button>
  557.             <ul class="footerNew-submenu">
  558.                 <li><a href="/specialites/philart">Philart</a></li>
  559.             </ul>
  560.             </li>
  561.             <li>
  562.             <button class="footerNew-dropdown-button">Densité des cheveux</button>
  563.             <ul class="footerNew-submenu">
  564.                 <li><a href="/specialites/philart">Polynucléotides cheveux (Philart Mésothérapie)</a></li>
  565.             </ul>
  566.             </li>
  567.             <li>
  568.             <button class="footerNew-dropdown-button">Amincissement</button>
  569.             <ul class="footerNew-submenu">
  570.                 <li><a href="/specialites/cryolipolyse">Cryolipolyse</a></li>
  571.             </ul>
  572.             </li>
  573.             <li>
  574.             <button class="footerNew-dropdown-button">Rides et ridules</button>
  575.             <ul class="footerNew-submenu">
  576.                 <li><a href="#">Philart</a></li>
  577.                 <li><a href="/specialites/morpheus">Morpheus</a></li>
  578.                 <li><a href="#">Injections et Toxine</a></li>
  579.             </ul>
  580.             </li>
  581.         </ul>
  582.         </div>
  585.       <div class="footerNew-column">
  586.         <h4>Actualités</h4>
  587.         <ul>
  588.           <li><a href="/article/morpheus-une-avancee-spectaculaire-dans-le-domaine-de-la-beaute-a-tester-a-la-maison-eiffel">Morpheus : Une avancée spectaculaire</a></li>
  589.           <li><a href="/article/le-centre-esthetique-maison-eiffel-recommande-4-soins-pour-avoir-une-peau-lumineuse-en-plein-hiver">4 soins pour une peau lumineuse</a></li>
  590.           <li><a href="/article/les-3-soins-stars-de-la-parisienne-pour-bien-commencer-la-saison">Les 3 soins stars</a></li>
  591.           <li><a href="/article/lasers-peeling-radiofrequence-des-traitements-de-reference-pour-une-peau-parfaite">Traitements de référence pour une peau parfaite</a></li>
  592.         </ul>
  593.       </div>
  594.     </div>
  595.   </div>
  597.   <div class="footerNew-bottom">
  598.     <p>&copy; 2024 | <a href="/mentions-legales">Mentions légales</a> | <a href="/politique-de-confidentialite">Politique de confidentialité</a></p>
  599.   </div>
  600. </footer>
  601.     </div>
  602.     <script src="swiper-bundle.min.js"></script>
  604.     <script src="https://cdn.jsdelivr.net/npm/swiper@8/swiper-bundle.min.js"></script>
  606.     <script src="{{ asset('assets/js/script.js') }}"></script>
  607.     <script src="https://unpkg.com/aos@next/dist/aos.js"></script>
  608.     <script>
  609.         AOS.init();
  610.     </script>
  611.     <script>
  612.         window.EMBED_SO_CONFIG = {
  613.         "id": "a1346be1-90c9-4b5c-9934-32815bb7c846",
  614.         "position": "left"
  615.         }
  616.         function openSpecialites() {
  617.         const menu = document.getElementById('deroulant-spe');
  618.         
  619.         // Toggle le menu
  620.         if(menu.style.display === "none" || menu.style.display === "") {
  621.             menu.style.display = 'block';
  622.             
  623.             // Ajoute un écouteur pour détecter les clics en dehors
  624.             document.addEventListener('click', closeOnClickOutside);
  625.         } else {
  626.             menu.style.display = 'none';
  627.             document.removeEventListener('click', closeOnClickOutside); // Retire l'écouteur
  628.         }
  629.         }
  631.         // Fonction qui ferme le menu si on clique à l'extérieur
  632.         function closeOnClickOutside(event) {
  633.         const menu = document.getElementById('deroulant-spe');
  634.         const button = document.getElementById('menuButton'); // Le bouton qui ouvre le menu
  636.         // Si l'élément cliqué n'est pas le menu ni le bouton, on referme le menu
  637.         if (!menu.contains(event.target) && !button.contains(event.target)) {
  638.             menu.style.display = 'none';
  639.             document.removeEventListener('click', closeOnClickOutside); // Retire l'écouteur
  640.         }
  641.         }
  643.         document.querySelectorAll('.footerNew-dropdown-button').forEach(button => {
  644.         button.addEventListener('click', () => {
  645.             const parentLi = button.parentElement;
  647.             // Toggle active class
  648.             parentLi.classList.toggle('active');
  650.             // Close other open menus (optional, for better UX)
  651.             document.querySelectorAll('.footerNew-dropdown li').forEach(li => {
  652.             if (li !== parentLi) {
  653.                 li.classList.remove('active');
  654.             }
  655.             });
  656.         });
  657.         });
  659.     </script>
  660.     <script src="https://embed.so/js/embed.js"></script>
  661. {% endblock %}