From b6764877dab6b71e2c376a9f3b150b5314423986 Mon Sep 17 00:00:00 2001
From: ouidade <ouidade@figureslibres.io>
Date: Mon, 22 Apr 2024 15:01:19 +0200
Subject: [PATCH] animated background less speed

---
 .../custom/colloque2024/js/animation_home.js  | 185 ++++++++----------
 .../template/page--front.html.twig            |  43 ++--
 2 files changed, 97 insertions(+), 131 deletions(-)

diff --git a/web/themes/custom/colloque2024/js/animation_home.js b/web/themes/custom/colloque2024/js/animation_home.js
index 86e68d8e..ec406bdc 100644
--- a/web/themes/custom/colloque2024/js/animation_home.js
+++ b/web/themes/custom/colloque2024/js/animation_home.js
@@ -34,21 +34,17 @@ console.log(dropdowns1);
 Array.from(dropdowns1).forEach(dropdown1 => {
  function slideDown() {
   let translateY = 0; // Position de départ (en bas)
-  let duration = 6000; // Durée de l'animation en millisecondes
+  let duration = 17000; // Durée de l'animation en millisecondes
   let startTime = null; // Temps de départ de l'animation
   function animate(timestamp) {
     if (!startTime) startTime = timestamp; // Initialise le temps de départ si ce n'est pas déjà fait
     let progress = (timestamp - startTime) / duration; // Calcul de la progression de l'animation
-    progress = Math.min(progress, 0.3); // Limite la progression à 1 (pour éviter un dépassement)
-    progress = easeInOut(progress);
-    translateY = 65 * progress; // Déplacement d'un pixel vers le haut à chaque itération
+    progress = Math.min(progress, 0.3); // Limite la progression à 0.3 (pour éviter un dépassement)
+    translateY = 410 * progress * (0.48 - progress); // Réduction de la vitesse vers la fin de l'animation
     dropdown1.style.transform = `translateY(${translateY}%)`; // Appliquer la transformation
-    if (progress < 0.8) {
-      requestAnimationFrame(animate);
+    if (progress < 0.999999) {
+        requestAnimationFrame(animate);
     }
-  }
-  function easeInOut(t) {
-    return t < 0.5 ? 4 * t * t : -1 + (10 - 2 * t) * t;
 }
 requestAnimationFrame(animate);
 }
@@ -60,22 +56,18 @@ console.log(dropdowns2);
 Array.from(dropdowns2).forEach(dropdown2 => {
  function slideDown() {
   let translateY = 0; // Position de départ (en bas)
-  let duration = 9000; // Durée de l'animation en millisecondes
+  let duration = 20000; // Durée de l'animation en millisecondes
   let startTime = null; // Temps de départ de l'animation
   function animate(timestamp) {
     if (!startTime) startTime = timestamp; // Initialise le temps de départ si ce n'est pas déjà fait
     let progress = (timestamp - startTime) / duration; // Calcul de la progression de l'animation
     progress = Math.min(progress, 0.3); // Limite la progression à 1 (pour éviter un dépassement)
-    progress = easeInOut(progress);
-    translateY = 120 * progress; // Déplacement d'un pixel vers le haut à chaque itération
+    translateY = 280 * progress * (1 - progress); // Déplacement d'un pixel vers le haut à chaque itération
     dropdown2.style.transform = `translateY(${translateY}%)`; // Appliquer la transformation
-    if (progress < 0.8) {
+    if (progress < 0.999) {
       requestAnimationFrame(animate);
     }
   }
-  function easeInOut(t) {
-    return t < 0.5 ? 4 * t * t : -1 + (10 - 2 * t) * t;
-}
 requestAnimationFrame(animate);
 }
 slideDown(); // Lancer l'animation lorsque la page est chargée
@@ -86,22 +78,18 @@ console.log(dropdowns3);
 Array.from(dropdowns3).forEach(dropdown3 => {
  function slideDown() {
   let translateY = 0; // Position de départ (en bas)
-  let duration = 7000; // Durée de l'animation en millisecondes
+  let duration = 18000; // Durée de l'animation en millisecondes
   let startTime = null; // Temps de départ de l'animation
   function animate(timestamp) {
     if (!startTime) startTime = timestamp; // Initialise le temps de départ si ce n'est pas déjà fait
     let progress = (timestamp - startTime) / duration; // Calcul de la progression de l'animation
     progress = Math.min(progress, 0.5); // Limite la progression à 1 (pour éviter un dépassement)
-    progress = easeInOut(progress);
-    translateY = 75 * progress; // Déplacement d'un pixel vers le haut à chaque itération
+    translateY = 235 * progress * (1 - progress); // Déplacement d'un pixel vers le haut à chaque itération
     dropdown3.style.transform = `translateY(${translateY}%)`; // Appliquer la transformation
     if (progress < 0.8) {
       requestAnimationFrame(animate);
     }
   }
-  function easeInOut(t) {
-    return t < 0.5 ? 4 * t * t : -1 + (10 - 2 * t) * t;
-}
 requestAnimationFrame(animate);
 }
 slideDown(); // Lancer l'animation lorsque la page est chargée
@@ -112,22 +100,18 @@ console.log(dropdowns4);
 Array.from(dropdowns4).forEach(dropdown4 => {
  function slideDown() {
   let translateY = 0; // Position de départ (en bas)
-  let duration = 6000; // Durée de l'animation en millisecondes
+  let duration = 25000; // Durée de l'animation en millisecondes
   let startTime = null; // Temps de départ de l'animation
   function animate(timestamp) {
     if (!startTime) startTime = timestamp; // Initialise le temps de départ si ce n'est pas déjà fait
     let progress = (timestamp - startTime) / duration; // Calcul de la progression de l'animation
     progress = Math.min(progress, 0.5); // Limite la progression à 1 (pour éviter un dépassement)
-    progress = easeInOut(progress);
-    translateY = 85 * progress; // Déplacement d'un pixel vers le haut à chaque itération
+    translateY = 335 * progress * (1 - progress); // Déplacement d'un pixel vers le haut à chaque itération
     dropdown4.style.transform = `translateY(${translateY}%)`; // Appliquer la transformation
     if (progress < 0.8) {
       requestAnimationFrame(animate);
     }
   }
-  function easeInOut(t) {
-    return t < 0.5 ? 4 * t * t : -1 + (10 - 2 * t) * t;
-}
 requestAnimationFrame(animate);
 }
 slideDown(); // Lancer l'animation lorsque la page est chargée
@@ -138,51 +122,43 @@ let dropdowns5 = document.getElementsByClassName('dropdown5');
 console.log(dropdowns5);
 Array.from(dropdowns5).forEach(dropdown5 => {
  function slideDown() {
-  let translateY = 0; // Position de départ (en bas)
-  let duration = 6000; // Durée de l'animation en millisecondes
-  let startTime = null; // Temps de départ de l'animation
-  function animate(timestamp) {
-    if (!startTime) startTime = timestamp; // Initialise le temps de départ si ce n'est pas déjà fait
-    let progress = (timestamp - startTime) / duration; // Calcul de la progression de l'animation
-    progress = Math.min(progress, 0.5); // Limite la progression à 1 (pour éviter un dépassement)
-    progress = easeInOut(progress);
-    translateY = 70 * progress; // Déplacement d'un pixel vers le haut à chaque itération
-    dropdown5.style.transform = `translateY(${translateY}%)`; // Appliquer la transformation
-    if (progress < 0.8) {
-      requestAnimationFrame(animate);
+    let translateY = 0; // Position de départ (en bas)
+    let duration = 10000; // Durée de l'animation en millisecondes
+    let startTime = null; // Temps de départ de l'animation
+    function animate(timestamp) {
+      if (!startTime) startTime = timestamp; // Initialise le temps de départ si ce n'est pas déjà fait
+      let progress = (timestamp - startTime) / duration; // Calcul de la progression de l'animation
+      progress = Math.min(progress, 0.5); // Limite la progression à 1 (pour éviter un dépassement)
+      translateY = 200 * progress * (1 - progress); // Déplacement d'un pixel vers le haut à chaque itération
+      dropdown5.style.transform = `translateY(${translateY}%)`; // Appliquer la transformation
+      if (progress < 0.8) {
+        requestAnimationFrame(animate);
+      }
     }
+    requestAnimationFrame(animate);
   }
-  function easeInOut(t) {
-    return t < 0.5 ? 4 * t * t : -1 + (10 - 2 * t) * t;
-}
-requestAnimationFrame(animate);
-}
-slideDown(); // Lancer l'animation lorsque la page est chargée
+  slideDown(); // Lancer l'animation lorsque la page est chargée
 });
 
 let tolefts1 = document.getElementsByClassName('toleft1');
 Array.from(tolefts1).forEach(toleft1 => {
-    function slideLeft() {
-        let translateX = 0; // Position de départ (en bas)
-        let duration = 5000; // Durée de l'animation en millisecondes
-        let startTime = null; // Temps de départ de l'animation
-        function animate(timestamp) {
-            if (!startTime) startTime = timestamp; // Initialise le temps de départ si ce n'est pas déjà fait
-            let progress = (timestamp - startTime) / duration; // Calcul de la progression de l'animation
-            progress = Math.min(progress, 0.5); // Limite la progression à 1 (pour éviter un dépassement)
-            progress = easeInOut(progress);
-            translateX = -35 * progress; // -20 est la distance maximale à laquelle vous voulez déplacer l'élément
-            toleft1.style.transform = `translateX(${translateX}%)`;
-            if (progress < 0.8) {
-                requestAnimationFrame(animate);
-            }
-        }
-        function easeInOut(t) {
-            return t < 0.5 ? 4 * t * t : -1 + (4 - 2 * t) * t;
-        }
-        requestAnimationFrame(animate);
-    }
-    slideLeft(); // Lancer l'animation lorsque la page est chargée
+  function slideLeft() {
+      let translateX = 0; // Position de départ (en bas)
+      let duration = 10000; // Durée de l'animation en millisecondes
+      let startTime = null; // Temps de départ de l'animation
+      function animate(timestamp) {
+          if (!startTime) startTime = timestamp; // Initialise le temps de départ si ce n'est pas déjà fait
+          let progress = (timestamp - startTime) / duration; // Calcul de la progression de l'animation
+          progress = Math.min(progress, 0.5); // Limite la progression à 1 (pour éviter un dépassement)
+          translateX = -100 * progress * (1 - progress); // -20 est la distance maximale à laquelle vous voulez déplacer l'élément
+          toleft1.style.transform = `translateX(${translateX}%)`;
+          if (progress < 0.8) {
+              requestAnimationFrame(animate);
+          }
+      }
+      requestAnimationFrame(animate);
+  }
+  slideLeft(); // Lancer l'animation lorsque la page est chargée
 });
 
 
@@ -196,16 +172,12 @@ Array.from(tolefts2).forEach(toleft2 => {
             if (!startTime) startTime = timestamp; // Initialise le temps de départ si ce n'est pas déjà fait
             let progress = (timestamp - startTime) / duration; // Calcul de la progression de l'animation
             progress = Math.min(progress, 0.5); // Limite la progression à 1 (pour éviter un dépassement)
-            progress = easeInOut(progress);
-            translateX = -32 * progress; // -20 est la distance maximale à laquelle vous voulez déplacer l'élément
+            translateX = -32 * progress * (1 - progress); // -20 est la distance maximale à laquelle vous voulez déplacer l'élément
             toleft2.style.transform = `translateX(${translateX}%)`;
             if (progress < 0.8) {
                 requestAnimationFrame(animate);
             }
         }
-        function easeInOut(t) {
-            return t < 0.5 ? 4 * t * t : -1 + (4 - 2 * t) * t;
-        }
         requestAnimationFrame(animate);
     }
     slideLeft(); // Lancer l'animation lorsque la page est chargée
@@ -221,16 +193,12 @@ Array.from(tolefts3).forEach(toleft3 => {
             if (!startTime) startTime = timestamp; // Initialise le temps de départ si ce n'est pas déjà fait
             let progress = (timestamp - startTime) / duration; // Calcul de la progression de l'animation
             progress = Math.min(progress, 0.5); // Limite la progression à 1 (pour éviter un dépassement)
-            progress = easeInOut(progress);
-            translateX = -35 * progress; // -20 est la distance maximale à laquelle vous voulez déplacer l'élément
+            translateX = -45 * progress * (1 - progress); // -20 est la distance maximale à laquelle vous voulez déplacer l'élément
             toleft3.style.transform = `translateX(${translateX}%)`;
             if (progress < 0.8) {
                 requestAnimationFrame(animate);
             }
         }
-        function easeInOut(t) {
-            return t < 0.5 ? 4 * t * t : -1 + (4 - 2 * t) * t;
-        }
         requestAnimationFrame(animate);
     }
     slideLeft(); // Lancer l'animation lorsque la page est chargée
@@ -241,22 +209,18 @@ let tolefts4 = document.getElementsByClassName('toleft4');
 Array.from(tolefts4).forEach(toleft4 => {
     function slideLeft() {
         let translateX = 0; // Position de départ (en bas)
-        let duration = 5000; // Durée de l'animation en millisecondes
+        let duration = 8000; // Durée de l'animation en millisecondes
         let startTime = null; // Temps de départ de l'animation
         function animate(timestamp) {
             if (!startTime) startTime = timestamp; // Initialise le temps de départ si ce n'est pas déjà fait
             let progress = (timestamp - startTime) / duration; // Calcul de la progression de l'animation
             progress = Math.min(progress, 0.5); // Limite la progression à 1 (pour éviter un dépassement)
-            progress = easeInOut(progress);
-            translateX = -29 * progress; // -20 est la distance maximale à laquelle vous voulez déplacer l'élément
+            translateX = -110 * progress * (0.90 - progress); // -20 est la distance maximale à laquelle vous voulez déplacer l'élément
             toleft4.style.transform = `translateX(${translateX}%)`;
             if (progress < 0.8) {
                 requestAnimationFrame(animate);
             }
         }
-        function easeInOut(t) {
-            return t < 0.5 ? 4 * t * t : -1 + (4 - 2 * t) * t;
-        }
         requestAnimationFrame(animate);
     }
     slideLeft(); // Lancer l'animation lorsque la page est chargée
@@ -266,18 +230,24 @@ let torights1 = document.getElementsByClassName('toright1');
 Array.from(torights1).forEach(toright1 => {
  function slideRight() {
   let translateX = 0; // Position de départ (en bas)
-  function animate() {
-    translateX += 0.5; // Déplacement d'un pixel vers le haut à chaque itération
+  let duration = 13000; // Durée de l'animation en millisecondes
+  let startTime = null; // Temps de départ de l'animation
+  function animate(timestamp) {
+    if (!startTime) startTime = timestamp; // Initialise le temps de départ si ce n'est pas déjà fait
+    let progress = (timestamp - startTime) / duration; // Calcul de la progression de l'animation
+    progress = Math.min(progress, 0.5); // Limite la progression à 1 (pour éviter un dépassement)
+    translateX = 135 * progress * (0.99 - progress); // Déplacement d'un pixel vers le haut à chaque itération
     toright1.style.transform = `translateX(${translateX}%)`; // Appliquer la transformation
-    if (translateX < 31) { // Limite la hauteur à laquelle la forme doit être animée
+    if (progress < 0.8) { // Limite la hauteur à laquelle la forme doit être animée
       requestAnimationFrame(animate); // Appel récursif de la fonction animate
     }
   }
-  animate(); // Lancer l'animation
+  requestAnimationFrame(animate);
 }
 slideRight(); // Lancer l'animation lorsque la page est chargée
 });
 
+
 let torights2 = document.getElementsByClassName('toright2');
 Array.from(torights2).forEach(toright2 => {
  function slideRight() {
@@ -297,18 +267,22 @@ slideRight(); // Lancer l'animation lorsque la page est chargée
 
 
 let torights3 = document.getElementsByClassName('toright3');
-console.log(torights3)
 Array.from(torights3).forEach(toright3 => {
- function slideRight() {
+ function slideRight(timestamp) {
   let translateX = 0; // Position de départ (en bas)
-  function animate() {
-    translateX += 0.9; // Déplacement d'un pixel vers le haut à chaque itération
+  let duration = 13000; // Durée de l'animation en millisecondes
+  let startTime = null; // Temps de départ de l'animation
+  function animate(timestamp) {
+    if (!startTime) startTime = timestamp; // Initialise le temps de départ si ce n'est pas déjà fait
+    let progress = (timestamp - startTime) / duration; // Calcul de la progression de l'animation
+    progress = Math.min(progress, 0.5); // Limite la progression à 1 (pour éviter un dépassement)
+    translateX = 240 * progress * (0.98 - progress); // Déplacement d'un pixel vers le haut à chaque itération
     toright3.style.transform = `translateX(${translateX}%)`; // Appliquer la transformation
-    if (translateX < 59) { // Limite la hauteur à laquelle la forme doit être animée
+    if (progress < 0.8) { // Limite la hauteur à laquelle la forme doit être animée
       requestAnimationFrame(animate); // Appel récursif de la fonction animate
     }
   }
-  animate(); // Lancer l'animation
+  requestAnimationFrame(animate);
 }
 slideRight(); // Lancer l'animation lorsque la page est chargée
 });
@@ -317,17 +291,22 @@ slideRight(); // Lancer l'animation lorsque la page est chargée
 let moveups = document.getElementsByClassName('moveup');
 console.log(moveups);
 Array.from(moveups).forEach(moveup => {
- function slideUp() {
-  let translateY = 100; // Position de départ (en bas)
-  function animate() {
-    translateY -= 0.5; // Déplacement d'un pixel vers le haut à chaque itération
-    moveup.style.transform = `translateY(${translateY}%)`; // Appliquer la transformation
-    if (translateY > -0) { // Limite la hauteur à laquelle la forme doit être animée
-      requestAnimationFrame(animate); // Appel récursif de la fonction animate
+  function slideUp() {
+    let translateY = 0; // Position de départ (en bas)
+    let duration = 6000; // Durée de l'animation en millisecondes
+    let startTime = null; // Temps de départ de l'animation
+    function animate(timestamp) {
+      if (!startTime) startTime = timestamp; // Initialise le temps de départ si ce n'est pas déjà fait
+      let progress = (timestamp - startTime) / duration; // Calcul de la progression de l'animation
+      progress = Math.min(progress, 0.8); // Limite la progression à 1 (pour éviter un dépassement)
+      translateY = -10 * progress * (1 - progress); // Déplacement d'un pixel vers le haut à chaque itération
+      moveup.style.transform = `translateY(${translateY}%)`; // Appliquer la transformation
+      if (progress < 0.8) {
+        requestAnimationFrame(animate);
+      }
     }
-  }
-  animate(); // Lancer l'animation
-}
+    requestAnimationFrame(animate);
+  } 
 slideUp(); // Lancer l'animation lorsque la page est chargée
 });
 
diff --git a/web/themes/custom/colloque2024/template/page--front.html.twig b/web/themes/custom/colloque2024/template/page--front.html.twig
index 13a8e58e..9fd06db8 100644
--- a/web/themes/custom/colloque2024/template/page--front.html.twig
+++ b/web/themes/custom/colloque2024/template/page--front.html.twig
@@ -84,10 +84,7 @@
      id="layer1"
      transform="translate(-51.525162,-32.699875)">
      <circle style="fill:#ff804d;fill-opacity:1;stroke:none;stroke-width:0.0232253;paint-order:fill markers stroke"
-       id="circle_orange"
-       cx="84.683075"
-       cy="132.53793"
-       r="15.890945" />
+       id="circle_orange" cx="84.683075" cy="132.53793" r="15.890945" />
        <circle style="fill:#349a84;fill-opacity:1;stroke:none;stroke-width:0.0232253;paint-order:fill markers stroke"
        id="circle_pop_trans" cx="136.45699" cy="74.141045" r="15.890945" />
        <circle style="fill:#ff804d;fill-opacity:1;stroke:none;stroke-width:0.0232253;paint-order:fill markers stroke"
@@ -111,17 +108,14 @@
        
        
 
-       <circle
-       style="fill:#ff804d;fill-opacity:1;stroke:none;stroke-width:0.0232253;paint-order:fill markers stroke"
-       id="circle_orange_3"
-       cx="375.24548"
-       cy="166.11342"
-       r="15.890945" /><circle
-       style="fill:#b9ce00;fill-opacity:1;stroke:none;stroke-width:0.0232253;paint-order:fill markers stroke"
-       id="circle_vert_clair_erable_5"
-       cx="437.38623"
-       cy="165.2007"
-       r="15.890945" />
+       <circle style="fill:#ff804d;fill-opacity:1;stroke:none;stroke-width:0.0232253;paint-order:fill markers stroke"
+       id="circle_orange_3" cx="375.24548" cy="166.11342" r="15.890945" />
+       <circle style="fill:#b9ce00;fill-opacity:1;stroke:none;stroke-width:0.0232253;paint-order:fill markers stroke"
+       id="circle_vert_clair_erable_5" cx="437.38623" cy="165.2007" r="15.890945" />
+
+       <path style="filter:url(#f5);fill:#b9ce00;fill-opacity:1;stroke:none"
+       d="m 442.70309,151.34247 c -2.16405,0.16719 -4.2637,0.74796 -6.15277,1.83301 -12.5874,7.23004 -6.72502,27.5444 7.93188,26.41208 5.739,-0.44336 14.95781,-2.24109 18.75404,-6.93204 3.69834,-4.57 2.81908,-12.55101 -1.70959,-16.24526 -4.33146,-3.53336 -13.29117,-5.49519 -18.82356,-5.06779 z"
+       id="path_circle_vert_clair_erable_5" />
        
        <circle style="fill:#ff804d;fill-opacity:1;stroke:none;stroke-width:0.0232253;paint-order:fill markers stroke"
        id="circle_orange_4" cx="289" cy="216.84201" r="15.890945" />
@@ -141,9 +135,9 @@
        d="m 176.96306,228.27149 c 0.28713,-1.66598 0.86969,-3.23411 2.10196,-4.64922 0.98738,-1.13386 2.20392,-2.12354 3.70487,-2.87043 6.97221,-3.4694 16.7678,-1.26697 19.76085,4.79211 0.78557,1.59028 0.9903,3.27791 0.75119,4.95918 -0.36348,2.5558 -2.61938,4.53937 -3.35343,7.00485 -1.73601,5.83082 -2.62133,11.8178 -4.2762,17.66708 -0.65342,2.30955 -2.18477,5.79646 -5.66198,6.29444 -3.93982,0.56424 -5.83643,-3.36487 -6.56082,-5.67454 -0.58593,-1.8682 -0.59903,-3.8034 -0.83564,-5.70307 -0.51428,-4.12917 -0.76337,-8.33141 -1.93444,-12.39795 -0.47645,-1.6545 -1.74598,-2.95288 -2.65106,-4.46326 -0.88579,-1.47815 -1.32445,-3.33945 -1.0453,-4.95919 z"
        id="path_circle_vert_erable_4" class="moveup"/>
        <circle style="fill:#b9ce00;fill-opacity:1;stroke:none;stroke-width:0.0232253;paint-order:fill markers stroke"
-       id="circle_vert_clair_erable_6" class="dropdown2" cx="139.32957" cy="44.208164" r="15.890945" />
+       id="circle_vert_clair_erable_6" class="dropdown2" cx="138.32957" cy="-20.208164" r="15.890945" />
        <path style="filter:url(#f5);fill:#b9ce00;fill-opacity:1;stroke:none"
-       d="m 124.37597,33.869337 c 0.16719,2.16405 0.74796,4.2637 1.83301,6.15277 7.23004,12.5874 27.5444,6.72502 26.41208,-7.93188 -0.44336,-5.739 -2.24109,-14.95781 -6.93204,-18.75404 -4.57,-3.69834 -12.55101,-2.81908 -16.24526,1.70959 -3.53336,4.33146 -5.49519,13.29117 -5.06779,18.82356 z"
+       d="m 124.37597,-23.869337 c 0.16719,2.16405 0.74796,4.2637 1.83301,6.15277 7.23004,12.5874 27.5444,6.72502 26.41208,-7.93188 -0.44336,-5.739 -2.24109,-14.95781 -6.93204,-18.75404 -4.57,-3.69834 -12.55101,-2.81908 -16.24526,1.70959 -3.53336,4.33146 -5.49519,13.29117 -5.06779,18.82356 z"
        id="path_circle_vert_clair_erable_6" class="dropdown2" />
       
        <circle style="fill:#b9ce00;fill-opacity:1;stroke:none;stroke-width:0.0322974;paint-order:fill markers stroke"
@@ -162,8 +156,12 @@
        <path style="filter:url(#f5);fill:#ff804d;fill-opacity:1;stroke:none;stroke-width:1.25134"
        d="m 528.79932,30.726038 c -0.21033,2.69351 -0.94097,5.30686 -2.30601,7.65812 -9.09574,15.66707 -34.65217,8.37038 -33.22766,-9.87252 0.55777,-7.14312 2.8194,-18.61743 8.72084,-23.34246 5.74928,-4.60318 15.78977,-3.5088 20.43731,2.12787 4.44514,5.39121 6.91321,16.54302 6.37552,23.42899 z"
        id="path_circle_orange_6" class="dropdown5"/>
+       
        <circle style="fill:#ff804d;fill-opacity:1;stroke:none;stroke-width:0.0232253;paint-order:fill markers stroke"
        id="circle_orange_5" cx="484.91324" cy="165.12646" r="15.890945" />
+       <path style="filter:url(#f5);fill:#ff804d;fill-opacity:1;stroke:none"
+       d="m 482.59447,150.98761 c 2.16405,0.16719 4.2637,0.74796 6.15277,1.83301 12.5874,7.23004 6.72502,27.5444 -7.93188,26.41208 -5.739,-0.44336 -14.95781,-2.24109 -18.75404,-6.93204 -3.69834,-4.57 -2.81908,-12.55101 1.70959,-16.24526 4.33146,-3.53336 13.29117,-5.49519 18.82356,-5.06779 z"
+       id="path_circle_orange_5" />
        <circle style="fill:#b9ce00;fill-opacity:1;stroke:none;stroke-width:0.0232253;paint-order:fill markers stroke"
        id="circle_vert_clair_erable_4" cx="438.36194" cy="74.165817" r="15.890945" />
        <circle style="fill:#349a84;fill-opacity:1;stroke:none;stroke-width:0.0330534;paint-order:fill markers stroke"
@@ -177,17 +175,6 @@
        d="m 193.12822,-20 c -20.03075,1.78212 -17.31022,32.693118 2.6358,30.918578 20.03076,-1.7821 17.31021,-32.693148 -2.6358,-30.918578 z"
        id="path_circle_vert_erable" class="dropdown1" />
        
-       
-
-       <path style="filter:url(#f5);fill:#b9ce00;fill-opacity:1;stroke:none"
-       d="m 442.70309,151.34247 c -2.16405,0.16719 -4.2637,0.74796 -6.15277,1.83301 -12.5874,7.23004 -6.72502,27.5444 7.93188,26.41208 5.739,-0.44336 14.95781,-2.24109 18.75404,-6.93204 3.69834,-4.57 2.81908,-12.55101 -1.70959,-16.24526 -4.33146,-3.53336 -13.29117,-5.49519 -18.82356,-5.06779 z"
-       id="path_circle_vert_clair_erable_5" />
-       
-       <path style="filter:url(#f5);fill:#ff804d;fill-opacity:1;stroke:none"
-       d="m 482.59447,150.98761 c 2.16405,0.16719 4.2637,0.74796 6.15277,1.83301 12.5874,7.23004 6.72502,27.5444 -7.93188,26.41208 -5.739,-0.44336 -14.95781,-2.24109 -18.75404,-6.93204 -3.69834,-4.57 -2.81908,-12.55101 1.70959,-16.24526 4.33146,-3.53336 13.29117,-5.49519 18.82356,-5.06779 z"
-       id="path_circle_orange_5" />
-    
-       
        <path style="filter:url(#f5);fill:#b9ce00;fill-opacity:1;stroke:none;stroke-width:1.19737"
        d="m 462.8305,58.142036 c -20.03075,1.78212 -17.31022,32.693116 2.6358,30.918576 20.03076,-1.7821 17.31021,-32.693146 -2.6358,-30.918576 z"
        id="path_circle_vert_clair_erable_2" class="toleft4"/>