diff --git a/src/components/DataTable/NormalTable.jsx b/src/components/DataTable/NormalTable.jsx
index fb9c518..ce7e20f 100644
--- a/src/components/DataTable/NormalTable.jsx
+++ b/src/components/DataTable/NormalTable.jsx
@@ -76,7 +76,7 @@ const NormalTable = ({
   };
 
   return (
-    <TableContainer boxShadow={'md'} rounded={5} overflowX={"auto"} className="h-auto w-100 table-scroll"  bg={colorMode === "light" ? "#F2EFFF" : "#312F35"}>
+    <TableContainer boxShadow={'md'} rounded={5} overflowX={"auto"} className="h-auto w-100 table-scroll"  bg={colorMode === "light" ? "#ECEBF2" : "#312F35"}>
       <Table size="sm" variant="striped" colorScheme={colorMode === "light" ? "whiteScheme" : "darkPurple"}>
         <Thead >
           <Tr bg={colorMode === "light"? "#230A79" : "#312F35"}>
diff --git a/src/components/LatestTransactions/LatestTransactions.jsx b/src/components/LatestTransactions/LatestTransactions.jsx
index 63ddd49..36baf38 100644
--- a/src/components/LatestTransactions/LatestTransactions.jsx
+++ b/src/components/LatestTransactions/LatestTransactions.jsx
@@ -259,7 +259,7 @@ const LatestTransactions = () => {
               bg={
                 index % 2 === 0
                   ? colorMode === "light"
-                    ? "#F2EFFF"
+                    ? "#ECEBF2"
                     : "#312F35"
                   : colorMode === "light"
                   ? "#fff"
diff --git a/src/components/RelatedTransactions/RelatedTransactions.jsx b/src/components/RelatedTransactions/RelatedTransactions.jsx
index 1ad2846..42b6906 100644
--- a/src/components/RelatedTransactions/RelatedTransactions.jsx
+++ b/src/components/RelatedTransactions/RelatedTransactions.jsx
@@ -6,11 +6,11 @@ const RelatedTransactions = () => {
     const { colorMode} = useColorMode();
     
   return (
-    <Box p={"4rem 0"} bg={colorMode === "light" ? "#F3F3F3" : "#101015"}>
+    <Box p={"4rem 0"} bg={colorMode === "light" ? "#ECEBF2" : "#101015"}>
        <Container maxW="6xl">
-          <Heading fontSize={"md"} fontWeight={400}>
+          <Text fontSize={"md"} fontWeight={400}>
             Related transactions info
-          </Heading>
+          </Text>
           <HStack justifyContent={"center"} mt={10}>
             <Image w={"40px"} src={Search}/>
             <Text as={"span"} color={"#787878"}>No records found</Text>
diff --git a/src/index.css b/src/index.css
index fb812d4..9ec0c53 100644
--- a/src/index.css
+++ b/src/index.css
@@ -49,11 +49,17 @@ button {
   padding: 0.6em 1.2em;
   font-size: 1em;
   font-weight: 500;
-  font-family: inherit;
+  font-family: 'Montserrat' !important;
   background-color: #1a1a1a;
   cursor: pointer;
   transition: border-color 0.25s;
 }
+input {
+  font-family: 'Montserrat' !important;
+}
+table th {
+  font-family: 'Montserrat' !important;
+}
 button:hover {
   border-color: #646cff;
 }
diff --git a/src/pages/DidInfo.jsx b/src/pages/DidInfo.jsx
index f0ce774..200ef4e 100644
--- a/src/pages/DidInfo.jsx
+++ b/src/pages/DidInfo.jsx
@@ -123,7 +123,7 @@ const DidInfo = () => {
           {data?.data ? 
           <Box
             boxShadow={colorMode === "light" && "md"}
-            bg={colorMode === "light" ? "#F3F3F3" : "#1D1D1D"}
+            bg={colorMode === "light" ? "#ECEBF2" : "#1D1D1D"}
             p={4}
             mb={5}
             rounded={6}
diff --git a/src/pages/Home.jsx b/src/pages/Home.jsx
index 534fdec..02df8d3 100644
--- a/src/pages/Home.jsx
+++ b/src/pages/Home.jsx
@@ -302,7 +302,7 @@ const toast = useToast()
             }
             p={{base :1,md : 5}}
             rounded={10}
-            bg={colorMode === "light" ? "#DEDBEB47" : "#232127"}
+            bg={colorMode === "light" ? "#ECEBF2" : "#232127"}
           >
             <LineChart />
           </Box>
diff --git a/src/pages/MainNet.jsx b/src/pages/MainNet.jsx
index b86c39e..ea440ec 100644
--- a/src/pages/MainNet.jsx
+++ b/src/pages/MainNet.jsx
@@ -123,7 +123,7 @@ const MainNet = () => {
     <FullScreenLoaader />
   ) : (
     <Box
-      bg={colorMode === "light" ? "#f5f5f7" : "none"}
+      bg={colorMode === "light" ? "#ECEBF2" : "none"}
       minH={"100vh"}
       {...OPACITY_ON_LOAD}
       p={"6rem 0 4rem 0"}
diff --git a/src/pages/SubnetId.jsx b/src/pages/SubnetId.jsx
index 3434b64..ac54c22 100644
--- a/src/pages/SubnetId.jsx
+++ b/src/pages/SubnetId.jsx
@@ -114,13 +114,14 @@ const SubnetId = () => {
   }));
   return (
     <Box
-    bg={colorMode === "light" ? "#f5f5f7" : "none"}
+      bg={colorMode === "light" ? "#f5f5f7" : "none"}
       p={"6rem 0 4rem 0"}
       backgroundImage={colorMode !== "light" ? `url(${bannerImage})` : "none"}
       position={"relative"}
       backgroundSize="cover"
       backgroundRepeat="no-repeat"
       minH={"100vh"}
+      overflowX={"hidden"}
     >
       <Container
         maxW="6xl"
diff --git a/src/pages/SubnetIdOverview.jsx b/src/pages/SubnetIdOverview.jsx
index bf5b88a..1589801 100644
--- a/src/pages/SubnetIdOverview.jsx
+++ b/src/pages/SubnetIdOverview.jsx
@@ -237,7 +237,7 @@ const SubnetInner = () => {
               bg={
                 index % 2 === 0
                   ? colorMode === "light"
-                    ? "#F2EFFF"
+                    ? "#ECEBF2"
                     : "#312F35"
                   : colorMode === "light"
                   ? "#fff"
diff --git a/src/pages/Transaction/TransactionDetails.jsx b/src/pages/Transaction/TransactionDetails.jsx
index 481ea72..c6d3db6 100644
--- a/src/pages/Transaction/TransactionDetails.jsx
+++ b/src/pages/Transaction/TransactionDetails.jsx
@@ -157,7 +157,7 @@ const TransactionDetails = () => {
           </HStack>
           <Box
             boxShadow={colorMode === "light" && "md"}
-            bg={colorMode === "light" ? "#F3F3F3" : "#1D1D1D"}
+            bg={colorMode === "light" ? "#ECEBF2" : "#1D1D1D"}
             p={4}
             mb={5}
             rounded={6}
@@ -372,7 +372,7 @@ const TransactionDetails = () => {
 
           <Box
             boxShadow={colorMode === "light" && "md"}
-            bg={colorMode === "light" ? "#F3F3F3" : "#1D1D1D"}
+            bg={colorMode === "light" ? "#ECEBF2" : "#1D1D1D"}
             p={4}
             mb={extractedArray && 5}
             rounded={6}
@@ -629,7 +629,7 @@ const TransactionDetails = () => {
 
           <Box
             boxShadow={colorMode === "light" && "md"}
-            bg={colorMode === "light" ? "#F3F3F3" : "#1D1D1D"}
+            bg={colorMode === "light" ? "#ECEBF2" : "#1D1D1D"}
             p={4}
             mb={5}
             rounded={6}