diff --git a/fleet_management/fleet_management/doctype/trip/trip_list.js b/fleet_management/fleet_management/doctype/trip/trip_list.js
index dfb37a5..28b50a9 100644
--- a/fleet_management/fleet_management/doctype/trip/trip_list.js
+++ b/fleet_management/fleet_management/doctype/trip/trip_list.js
@@ -8,7 +8,7 @@ function loadLeafletAndInitMap(frm, callback) {
 function create_dialog_and_init_map(frm) {
     const dialog = new frappe.ui.Dialog({
         title: 'Show Route',
-        fields: [{ fieldtype: 'HTML', fieldname: 'map_html', label: 'Map', options: '<div id="map" style="width:800px;height:600px;"></div>' }],
+        fields: [{ fieldtype: 'HTML', fieldname: 'map_html', label: 'Map', options: '<div id="map" style="width:100%;height:100%;"></div>' }],
         primary_action_label: 'Close',
         primary_action() {
             if (currentMap) {
@@ -20,7 +20,8 @@ function create_dialog_and_init_map(frm) {
     });
 
     // Adjust the size of the dialog
-    dialog.$wrapper.find('.modal-content').css("width", "850px");
+    dialog.$wrapper.find('.modal-content').css("width", "80%");
+    dialog.$wrapper.find('.modal-content').css("margin-left", '-80%');
     //dialog.$wrapper.find('.modal-content').css("height", "600px");
 
     // Add hide event to reload the page when the dialog is closed