diff --git a/client/src/components/flami/FlamiShow.tsx b/client/src/components/flami/FlamiShow.tsx
index 06db6ac..c6a7a7e 100644
--- a/client/src/components/flami/FlamiShow.tsx
+++ b/client/src/components/flami/FlamiShow.tsx
@@ -9,11 +9,11 @@ const FlamiShow = ({ flami }: { flami: FlamiData }) => {
 
   useEffect(() => {
     setCurrentAnimation("Jump");
-    setCurrentKeptAnimation("Atchoum");
+    setCurrentKeptAnimation("Jump");
     setTimeout(() => {
       setCurrentAnimation("Idle");
       setCurrentKeptAnimation("Idle");
-    }, 3200);
+    }, 1300);
   }, [setCurrentAnimation]);
 
   return (
diff --git a/client/src/components/map/Map.tsx b/client/src/components/map/Map.tsx
index 154a260..d315a41 100644
--- a/client/src/components/map/Map.tsx
+++ b/client/src/components/map/Map.tsx
@@ -8,12 +8,13 @@ import {
 } from "react-leaflet";
 import { Icon, LatLng } from "leaflet";
 import { Step } from "../../interfaces/step.interface";
-import { useEffect } from "react";
+import { useEffect, useState } from "react";
 import { Button } from "../ui";
 import { APIHandler } from "../../utils/api/api-handler";
 import { useAuth } from "../../hooks/useAuth";
 import toast from "react-hot-toast";
 import { GenericResponse } from "../../interfaces/api-response/generic-response";
+import { SearchIcon } from "react-line-awesome";
 
 const Map = ({
   currentStep,
@@ -41,12 +42,11 @@ const Map = ({
     iconSize: [40, 40],
   });
 
-  const geolocalisation = currentStep
-    ? new LatLng(
-        currentStep.geolocalisation.latitude,
-        currentStep.geolocalisation.longitude
-      )
-    : new LatLng(43.282, 5.405);
+  const [geolocalisation, setGeolocation] = useState(new LatLng(43.282, 5.405));
+
+  useEffect(() => {
+    if(currentStep) setGeolocation(new LatLng(currentStep.geolocalisation.latitude, currentStep.geolocalisation.longitude))
+  }, [currentStep, setGeolocation])
 
   const MapRecenter = ({
     lat,
@@ -66,7 +66,17 @@ const Map = ({
   };
 
   return (
-    <div className="h-96 rounded-2xl overflow-hidden">
+    <div className="h-96 rounded-2xl overflow-hidden relative">
+      { currentStep ? (<Button className="absolute bottom-0 left-0 z-500 w-fit text-alabaster-900 pr-5" onClick={() => { 
+        setGeolocation(new LatLng(currentStep.geolocalisation.latitude, currentStep.geolocalisation.longitude)) 
+      }}>
+        <SearchIcon role="decoration"/> Etape actuelle
+      </Button>) : null }
+      { flamiPosition ? (<Button className="absolute bottom-0 right-0 z-500 w-fit text-alabaster-900 pr-5" onClick={() => { 
+        setGeolocation(new LatLng(flamiPosition.latitude, flamiPosition.longitude)) 
+      }}>
+        <SearchIcon role="decoration"/> Mon Flami
+      </Button>) : null }
       <MapContainer
         center={geolocalisation}
         zoom={12}
@@ -79,6 +89,7 @@ const Map = ({
           lng={geolocalisation.lng}
           zoomLevel={12}
         />
+
         <TileLayer url="https://tiles.stadiamaps.com/tiles/alidade_smooth/{z}/{x}/{y}{r}.png" />
 
         {steps &&
@@ -112,8 +123,8 @@ const Map = ({
                         },
                       });
                     })}>Récupérer le badge</Button>
-                  ) : null
-                }
+                    ) : null
+                  }
               </Popup>
             </Marker>
           ))}
diff --git a/client/src/pages/flami/CosmeticPage.tsx b/client/src/pages/flami/CosmeticPage.tsx
index 7fa9705..2808b4b 100644
--- a/client/src/pages/flami/CosmeticPage.tsx
+++ b/client/src/pages/flami/CosmeticPage.tsx
@@ -42,6 +42,8 @@ const CosmeticPage = () => {
     });
   }, [token]);
 
+  const [currentAnimation, setCurrentAnimation] = useState("Idle");
+
   const changeCosmetic = useCallback(
     (id: string, category: string) => {
       if (
@@ -77,11 +79,15 @@ const CosmeticPage = () => {
             token
           ).then((res) => {
             setFlami(res.data.my_flami);
+            setCurrentAnimation("Atchoum");
+            setTimeout(() => {
+              setCurrentAnimation("Idle");
+            }, 1);
           });
         }
       }
     },
-    [token, flami]
+    [token, flami, setCurrentAnimation]
   );
 
   const selectIconDisplay = useCallback(() => {
@@ -144,7 +150,9 @@ const CosmeticPage = () => {
   return (
     <section className="flex flex-col gap-6 mb-24">
       <TopBar title="Modifier mon flami" hasReturn={true} prevPage="/" />
-      {flami ? <MyFlamiDisplay animation="Idle" myFlami={flami} /> : null}
+      {flami ? (
+        <MyFlamiDisplay animation={currentAnimation} myFlami={flami} />
+      ) : null}
       <div className="grid grid-cols-3 gap-4 w-full">
         <Button
           variant={"secondary"}
diff --git a/client/src/pages/map/MapPage.tsx b/client/src/pages/map/MapPage.tsx
index 7e8f7b7..250effb 100644
--- a/client/src/pages/map/MapPage.tsx
+++ b/client/src/pages/map/MapPage.tsx
@@ -39,7 +39,7 @@ const MapPage = () => {
   };
 
   const handleCurrentStep = () => {
-    APIHandler<Step>(`/etape/actuelle`, true).then((res) => {
+    APIHandler<Step>(`/etape/15`, true).then((res) => {
       setCurrentFlameLocation(res.data);
       handleNextStep(res.data.etape_numero);
     });
diff --git a/client/tailwind.config.js b/client/tailwind.config.js
index 8f7f257..368a1f4 100644
--- a/client/tailwind.config.js
+++ b/client/tailwind.config.js
@@ -98,6 +98,7 @@ export default {
       },
       zIndex: {
         100: "100",
+        500: "500",
       },
     },
   },