diff --git a/src/app/clients/clients.component.scss b/src/app/clients/clients.component.scss
index af8633cbc..721a05873 100644
--- a/src/app/clients/clients.component.scss
+++ b/src/app/clients/clients.component.scss
@@ -105,7 +105,8 @@ $color: #e2e4ec;
     width: $bar;
   }
 }
-@media (max-width: 768px) {
+
+@media (max-width <= 768px) {
   .container {
     .search-box,
     .filter-box,
@@ -155,7 +156,8 @@ $color: #e2e4ec;
     padding: 10px;
   }
 }
-@media screen and (max-width: 768px) {
+
+@media screen and (max-width > 768px) {
   .action-button {
     width: 100%;
     display: flex;
@@ -166,4 +168,4 @@ $color: #e2e4ec;
       width: 100%;
     }
   }
-}
\ No newline at end of file
+}
diff --git a/src/app/notifications/notifications-page/notifications-page.component.html b/src/app/notifications/notifications-page/notifications-page.component.html
index dd6f13346..5fb2cd44f 100644
--- a/src/app/notifications/notifications-page/notifications-page.component.html
+++ b/src/app/notifications/notifications-page/notifications-page.component.html
@@ -32,4 +32,4 @@
     </table>
     <mat-paginator [pageSizeOptions]="[10, 25, 50, 100]" showFirstLastButtons></mat-paginator>
   </div>
-</div>
\ No newline at end of file
+</div>
diff --git a/src/app/system/external-services/amazon-s3/amazon-s3.component.ts b/src/app/system/external-services/amazon-s3/amazon-s3.component.ts
index 2f2cff00e..4dfb97d1f 100644
--- a/src/app/system/external-services/amazon-s3/amazon-s3.component.ts
+++ b/src/app/system/external-services/amazon-s3/amazon-s3.component.ts
@@ -54,7 +54,9 @@ export class AmazonS3Component implements OnInit {
   getConfigurationValue(configuration: any): string {
     const value = configuration.value;
     if (configuration.name === 's3_access_key' || configuration.name === 's3_secret_key') {
-      return value ? value.replace(value.substr(1, value.length - 3), value.substr(1, value.length - 3).replace(/./g, '*')) : '';
+      return value
+        ? value.replace(value.substr(1, value.length - 3), value.substr(1, value.length - 3).replace(/./g, '*'))
+        : '';
     }
     return value;
   }
diff --git a/src/app/web-app.component.ts b/src/app/web-app.component.ts
index a44d286ce..47cb0960b 100644
--- a/src/app/web-app.component.ts
+++ b/src/app/web-app.component.ts
@@ -42,14 +42,14 @@ const log = new Logger('MifosX');
     trigger('opacityScale', [
       transition(':enter', [
         style({ opacity: 0, transform: 'scale(.95)' }),
-        animate('100ms ease-out', style({ opacity: 1, transform: 'scale(1)' })),
-      ]),
+        animate('100ms ease-out', style({ opacity: 1, transform: 'scale(1)' }))]),
       transition(':leave', [
         style({ opacity: 1, transform: 'scale(1)' }),
-        animate('75ms ease-in', style({ opacity: 0, transform: 'scale(.95)' })),
-      ]),
-    ]),
-  ],
+        animate('75ms ease-in', style({ opacity: 0, transform: 'scale(.95)' }))])
+
+    ])
+
+  ]
 })
 export class WebAppComponent implements OnInit {
   buttonConfig: KeyboardShortcutsConfiguration;
@@ -91,31 +91,30 @@ export class WebAppComponent implements OnInit {
     this.i18nService = new I18nService(this.translateService);
 
     this.router.events
-  .pipe(
-    filter((event) => event instanceof NavigationEnd),
-    map(() => {
-      let route = this.activatedRoute;
-      while (route.firstChild) {
-        route = route.firstChild;
-      }
-      return route;
-    }),
-    switchMap((route) => route.data.pipe(catchError(() => of({ title: 'APP_NAME' })))),
-    switchMap((data) => {
-      const rawTitle = data['title'] || 'APP_NAME';
-      return this.translateService.get(`labels.titles.${rawTitle}`);
-    })
-  )
-  .subscribe((translatedTitle) => {
-    this.titleService.setTitle(translatedTitle);  
-  });
-
+      .pipe(
+        filter((event) => event instanceof NavigationEnd),
+        map(() => {
+          let route = this.activatedRoute;
+          while (route.firstChild) {
+            route = route.firstChild;
+          }
+          return route;
+        }),
+        switchMap((route) => route.data.pipe(catchError(() => of({ title: 'APP_NAME' })))),
+        switchMap((data) => {
+          const rawTitle = data['title'] || 'APP_NAME';
+          return this.translateService.get(`labels.titles.${rawTitle}`);
+        })
+      )
+      .subscribe((translatedTitle) => {
+        this.titleService.setTitle(translatedTitle);
+      });
 
     this.alertService.alertEvent.subscribe((alertEvent: Alert) => {
       this.snackBar.open(`${alertEvent.message}`, 'Close', {
         duration: 2000,
         horizontalPosition: 'right',
-        verticalPosition: 'top',
+        verticalPosition: 'top'
       });
     });
 
@@ -126,7 +125,7 @@ export class WebAppComponent implements OnInit {
         if (this.authenticationService.getUserLoggedIn()) {
           this.alertService.alert({
             type: 'Session timeout',
-            message: this.translateService.instant('labels.text.Session timed out'),
+            message: this.translateService.instant('labels.text.Session timed out')
           });
           this.dialog.open(SessionTimeoutDialogComponent);
           this.logout();
@@ -161,11 +160,15 @@ export class WebAppComponent implements OnInit {
           document.getElementById('runReport')?.click();
           break;
         case 'cancel':
-          const cancelButtons = Array.from(document.querySelectorAll('button')).filter((el) => el.textContent?.trim() === 'Cancel');
+          const cancelButtons = Array.from(document.querySelectorAll('button')).filter(
+            (el) => el.textContent?.trim() === 'Cancel'
+          );
           cancelButtons[0]?.click();
           break;
         case 'submit':
-          const submitButtons = Array.from(document.querySelectorAll('button')).filter((el) => el.textContent?.trim() === 'Submit');
+          const submitButtons = Array.from(document.querySelectorAll('button')).filter(
+            (el) => el.textContent?.trim() === 'Submit'
+          );
           submitButtons[0]?.click();
           break;
         default:
diff --git a/src/environments/environment.prod.ts b/src/environments/environment.prod.ts
index a7c86b57d..d05b3fc95 100644
--- a/src/environments/environment.prod.ts
+++ b/src/environments/environment.prod.ts
@@ -16,7 +16,9 @@ export const environment = {
     loadedEnv['fineractApiUrls'] ||
     'https://sandbox.mifos.community,https://demo.mifos.community,https://localhost:8443,' + window.location.origin,
   // For connecting to server running elsewhere set the base API URL
-  baseApiUrl: loadedEnv['fineractApiUrl'] || window.location.origin,
+  baseApiUrl:
+    loadedEnv['fineractApiUrl'] ||
+    (loadedEnv['fineractApiUrls']?.length > 0 ? loadedEnv['fineractApiUrls'][0] : window.location.origin),
   oauthServerUrl: loadedEnv['oauthServerUrl'] || loadedEnv['fineractApiUrl'] + loadedEnv['apiProvider'],
   allowServerSwitch: env.allow_switching_backend_instance,
   apiProvider: loadedEnv['apiProvider'] || '/fineract-provider/api',
diff --git a/src/environments/environment.ts b/src/environments/environment.ts
index af7a810ab..88c5e6486 100644
--- a/src/environments/environment.ts
+++ b/src/environments/environment.ts
@@ -21,7 +21,9 @@ export const environment = {
     loadedEnv['fineractApiUrls'] ||
     'https://sandbox.mifos.community,https://demo.mifos.community,https://localhost:8443,' + window.location.origin,
   // For connecting to server running elsewhere set the base API URL
-  baseApiUrl: loadedEnv['baseApiUrl'] || window.location.origin,
+  baseApiUrl:
+    loadedEnv['fineractApiUrl'] ||
+    (loadedEnv['fineractApiUrls']?.length > 0 ? loadedEnv['fineractApiUrls'][0] : window.location.origin),
   allowServerSwitch: env.allow_switching_backend_instance,
   apiProvider: loadedEnv['apiProvider'] || '/fineract-provider/api',
   apiVersion: loadedEnv['apiVersion'] || '/v1',