diff --git a/ui/src/App.tsx b/ui/src/App.tsx
index cc3ccdfca..db1aa1166 100644
--- a/ui/src/App.tsx
+++ b/ui/src/App.tsx
@@ -1,4 +1,4 @@
-import { Suspense } from 'react';
+import { Suspense, useEffect } from 'react';
 import { Provider } from 'react-redux';
 import { PersistGate } from 'redux-persist/integration/react';
 import { FullPageLoader } from '@contentstack/venus-components';
@@ -18,6 +18,20 @@ import { useNetworkCheck } from './components/NetworkProvider';
 function App() {
   const isOnline = useNetworkCheck();
 
+  useEffect(() => {
+    const selectModal = document.querySelector('.ReactModalPortal');
+    
+    if (selectModal instanceof HTMLElement) {
+      if (!isOnline) {
+        // Hide the modal by setting display to none
+        selectModal.style.display = 'none';
+      } else {
+        // Show the modal by setting display to block
+        selectModal.style.display = 'block';
+      }
+    }
+  }, [isOnline]);
+
   return (
     <>
       {isOnline ? (
@@ -38,5 +52,4 @@ function App() {
     </>
   );
 }
-
 export default App;
diff --git a/ui/src/components/DestinationStack/DestinationStack.scss b/ui/src/components/DestinationStack/DestinationStack.scss
index 3dd0b32ed..27a29f24a 100644
--- a/ui/src/components/DestinationStack/DestinationStack.scss
+++ b/ui/src/components/DestinationStack/DestinationStack.scss
@@ -50,6 +50,7 @@
     background-color: $color-brand-white-base;
     .description {
       line-height: 24px;
+      font-family: $font-family-primary;
     }
     .step_block {
       padding: 0 !important;