diff --git a/src/app/features/know-your-hazards/components/map-kyh/map-kyh.component.ts b/src/app/features/know-your-hazards/components/map-kyh/map-kyh.component.ts
index cff4f6cf..b4421207 100644
--- a/src/app/features/know-your-hazards/components/map-kyh/map-kyh.component.ts
+++ b/src/app/features/know-your-hazards/components/map-kyh/map-kyh.component.ts
@@ -27,7 +27,7 @@ import { GoogleAnalyticsService } from 'ngx-google-analytics';
 export class MapKyhComponent implements OnInit {
   map!: Map;
   geolocateControl!: GeolocateControl;
-  centerMarker!: Marker;
+  //centerMarker!: Marker;
   mapStyle: MapStyle = 'terrain';
 
   kyhLegend: boolean = true;
@@ -35,7 +35,7 @@ export class MapKyhComponent implements OnInit {
 
   private _unsub = new Subject();
   private _changeStyle = new Subject();
-
+  private centerMarker: mapboxgl.Marker | null = null;
   constructor(
     private gaService: GoogleAnalyticsService,
     private mapService: MapService,
@@ -246,7 +246,7 @@ export class MapKyhComponent implements OnInit {
 
   async initMarkers() {
     this.centerMarker = new mapboxgl.Marker({
-      color: '#FF0000',
+      color: '#4D4C51',
       draggable: true,
     })
       .setLngLat(this.kyhService.currentCoords)
@@ -380,6 +380,10 @@ export class MapKyhComponent implements OnInit {
       this.map.setStyle(environment.mapbox.styles[style]);
       this._changeStyle.next();
     }
+    if (this.centerMarker) {
+      this.centerMarker.remove();
+      this.centerMarker = null; // Reset the marker
+    }
   }
 }