Center progress bar in map header using three-column flex layout

index.html

@@ -92,9 +92,11 @@
         <span class="map-pin">📍</span>
         <span class="map-town-name">AZ-900 TOWN</span>
       </div>
-      <div class="map-right">
+      <div class="map-center">
         <div class="prog-bar-outer"><div class="prog-bar-inner" id="map-prog-bar"></div></div>
         <span class="prog-text" id="map-prog-text">0/100</span>
+      </div>
+      <div class="map-right">
         <span class="music-toggle" id="music-toggle" title="Mute/Unmute Music">🎵</span>
       </div>
     </div>