diff --git a/dev-dist/sw.js b/dev-dist/sw.js
index d3252f6..23a39ae 100644
--- a/dev-dist/sw.js
+++ b/dev-dist/sw.js
@@ -82,7 +82,7 @@ define(['./workbox-b5f7729d'], (function (workbox) { 'use strict';
     "revision": "3ca0b8505b4bec776b69afdba2768812"
   }, {
     "url": "index.html",
-    "revision": "0.grsmblr837g"
+    "revision": "0.1vefs8ecrtg"
   }], {});
   workbox.cleanupOutdatedCaches();
   workbox.registerRoute(new workbox.NavigationRoute(workbox.createHandlerBoundToURL("index.html"), {
diff --git a/src/components/DataTable/NormalTable.jsx b/src/components/DataTable/NormalTable.jsx
index 6a59aec..745bac4 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"}>
@@ -88,12 +88,13 @@ const NormalTable = ({
                 wordBreak="normal"
                 overflowWrap="normal"
                 textTransform={"none"}
+                style={{
+                  fontFamily:'Montserrat'
+                }}
               >
                 {radio? "Select":<Checkbox
                 isChecked={selectedRadio?.length === data?.length}
                 onChange={handleCheckAllChange}
-                
-
               />}
               </Th>
             )}
diff --git a/src/components/Doughnut/LineChart.jsx b/src/components/Doughnut/LineChart.jsx
index 19b5bad..6efaa9c 100644
--- a/src/components/Doughnut/LineChart.jsx
+++ b/src/components/Doughnut/LineChart.jsx
@@ -10,7 +10,7 @@ import {
   Tooltip,
   Legend,
 } from "chart.js";
-import { Box, Heading, useColorMode, useMediaQuery } from "@chakra-ui/react";
+import { Box, Heading, Text, useColorMode, useMediaQuery } from "@chakra-ui/react";
 import ChartsTabs from "../ChartsTabs";
 import dayjs from "dayjs";
 import { useGetDailyDataQuery, useGetDateWiseDataQuery, useGetMonthlyDataQuery } from "../../Services/api.service";
@@ -204,7 +204,7 @@ const LineChart = () => {
         alignItems={"center"}
         mb={{ base: 4, md: 4 }}
       >
-        <Heading
+        <Text
           mt={{ base: 2, md: 0 }}
           fontSize={{ base: "sm", md: "md" }}
           fontWeight={500}
@@ -212,7 +212,7 @@ const LineChart = () => {
           px={{ base: "8px", md: "0px" }}
         >
           Transaction History
-        </Heading>
+        </Text>
         <ChartsTabs
           setSelectedValue={setSelectedValue}
           selectedValue={selectedValue}
diff --git a/src/components/LatestTransactions/LatestTransactions.jsx b/src/components/LatestTransactions/LatestTransactions.jsx
index f354630..cf079da 100644
--- a/src/components/LatestTransactions/LatestTransactions.jsx
+++ b/src/components/LatestTransactions/LatestTransactions.jsx
@@ -243,7 +243,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 9c057ba..200ef4e 100644
--- a/src/pages/DidInfo.jsx
+++ b/src/pages/DidInfo.jsx
@@ -106,13 +106,13 @@ const DidInfo = () => {
       >
         <Container maxW="6xl" pt={"6rem"}>
           <Box display={"flex"} justifyContent={"space-between"} alignItems={"center"} mb={8}>
-            <Heading
+            <Text
               fontSize={"md"}
               fontWeight={500}
               color={colorMode === "light" ? "#000" : "#fff"}
             >
               DID Info
-            </Heading>
+            </Text>
             
             <Button fontWeight={400} color={"#fff"} border={"none"} bg={colorMode === "light" ? "#230A79" : "#312F35"} _hover={{bg: colorMode === "light" ? "#4023A6" : "#312F35"}} _focus={{outline:"none"}}
               display={'flex'} gap={2} alignItems={'center'} rounded={'sm'} size={"sm"} isLoading={isLoadingURL} onClick={handleGenrateShortURL}>
@@ -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 653113a..9f02a19 100644
--- a/src/pages/Home.jsx
+++ b/src/pages/Home.jsx
@@ -303,7 +303,7 @@ const toast = useToast()
             }
             p={{base :1,md : 5}}
             rounded={10}
-            bg={colorMode === "light" ? "#DEDBEB47" : "#232127"}
+            bg={colorMode === "light" ? "#ECEBF2" : "#232127"}
           >
             <LineChart />
           </Box>
@@ -317,13 +317,13 @@ const toast = useToast()
           justifyContent={"space-between"}
           mb={6}
         >
-          <Heading
+          <Text
             fontSize={"md"}
             fontWeight={500}
             color={colorMode === "light" ? "#000" : "#fff"}
           >
             Latest Transactions
-          </Heading>
+          </Text>
 
           
           <Link
diff --git a/src/pages/MainNet.jsx b/src/pages/MainNet.jsx
index 76ba8d1..62e6fb4 100644
--- a/src/pages/MainNet.jsx
+++ b/src/pages/MainNet.jsx
@@ -126,7 +126,7 @@ const MainNet = () => {
     // <SplashScreen/>
   ) : (
     <Box
-      bg={colorMode === "light" ? "#f5f5f7" : "none"}
+      bg={colorMode === "light" ? "#ECEBF2" : "none"}
       minH={"100vh"}
       {...OPACITY_ON_LOAD}
       p={"6rem 0 4rem 0"}
@@ -142,14 +142,14 @@ const MainNet = () => {
         justifyContent={"space-between"}
         mb={6}
       >
-        <Heading
+        <Text
           fontSize={"md"}
           fontWeight={500}
           color={colorMode === "light" ? "#000" : "#fff"}
           mb={{ base: "10px", md: "0px" }}
         >
           Main Net - Overview
-        </Heading>
+        </Text>
         <HStack to="" style={{ fontSize: "14px" }} color={colorMode === "light" ? "#000" : "#fff"} display={"flex"} gap={"3"}>
           {/* <Text as={"span"}>Total Value Locked (TVL)</Text> <Text as={"span"}>{Number(mainNetData?.data?.tvl).toFixed(3)} RBT</Text> */}
           <Text as={"span"}>Total Value Locked (TVL)</Text> <Text as={"span"}>{mainNetData?.data?.tvl} $ Mn</Text>
diff --git a/src/pages/MainNetIdOverview.jsx b/src/pages/MainNetIdOverview.jsx
index e2efb40..12d1c52 100644
--- a/src/pages/MainNetIdOverview.jsx
+++ b/src/pages/MainNetIdOverview.jsx
@@ -44,9 +44,9 @@ const MainNetOveriew = () => {
         justifyContent={"space-between"}
         mb={10}
       >
-        <Heading fontSize={"md"} fontWeight={400} color={colorMode === "light" ? "#000" : "#fff"}  mb={{base :"10px" ,md : "0px"}}>
+        <Text fontSize={"md"} fontWeight={400} color={colorMode === "light" ? "#000" : "#fff"}  mb={{base :"10px" ,md : "0px"}}>
         Main net ID  - {params?.id}
-        </Heading>
+        </Text>
         {/* <Text to="" style={{ fontSize: "14px" }} color={colorMode === "light" ? "#000" : "#fff"} display={"flex"} gap={"3"}>
           View total number of records
           <Select width={"70px"} rounded="md" size="xs">
diff --git a/src/pages/SmartContract.jsx b/src/pages/SmartContract.jsx
index de31818..c382283 100644
--- a/src/pages/SmartContract.jsx
+++ b/src/pages/SmartContract.jsx
@@ -47,9 +47,9 @@ import TransactionTable from "./Transaction/TransactionTable";
           <Box minH={"100vh"} backgroundImage={colorMode !== "light" ? `url(${bannerImage})` : "none"} backgroundSize="cover"
            backgroundRepeat="no-repeat" pb={"5rem"}>
            <Container maxW="6xl" pt={"6rem"}>
-              <Heading mb={5} fontSize={"sm"} fontWeight={400} color={colorMode === "light" ? "#000" : "#fff"}>
+              <Text mb={5} fontSize={"sm"} fontWeight={400} color={colorMode === "light" ? "#000" : "#fff"}>
                Smart Contract Info
-              </Heading>
+              </Text>
               <Box bg={colorMode === "light" ? "#F3F3F3" : "#1D1D1D"} p={4} mb={5} rounded={6}>
                   <Text color={"#969696"} fontSize={"sm"}>Smart Contract Token</Text>
                   <HStack fontSize={"sm"}>
diff --git a/src/pages/Subnet.jsx b/src/pages/Subnet.jsx
index b7ec9e1..9068df5 100644
--- a/src/pages/Subnet.jsx
+++ b/src/pages/Subnet.jsx
@@ -45,9 +45,9 @@ const Subnet = () => {
         justifyContent={"space-between"}
         mb={10}
       >
-        <Heading fontSize={"md"} fontWeight={400} color={colorMode === "light" ? "#000" : "#fff"}  mb={{base :"10px" ,md : "0px"}}>
+        <Text fontSize={"md"} fontWeight={400} color={colorMode === "light" ? "#000" : "#fff"}  mb={{base :"10px" ,md : "0px"}}>
         Subnet ID  - Overview
-        </Heading>
+        </Text>
         {/* <Text to="" style={{ fontSize: "14px" }} color={colorMode === "light" ? "#000" : "#fff"} display={"flex"} gap={"3"}>
           View total number of records
           <Select width={"70px"} rounded="md" size="xs">
diff --git a/src/pages/SubnetId.jsx b/src/pages/SubnetId.jsx
index 29a5b76..c455e57 100644
--- a/src/pages/SubnetId.jsx
+++ b/src/pages/SubnetId.jsx
@@ -117,13 +117,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"
@@ -133,14 +134,14 @@ const SubnetId = () => {
         mb={5}
         
       >
-        <Heading
+        <Text
           fontSize={"md"}
           fontWeight={500}
           color={colorMode === "light" ? "#000" : "#fff"}
           mb={{ base: "10px", md: "0px" }}
         >
           Subnet Overview {useParams?.id}
-        </Heading>
+        </Text>
         {/* <Text
           to=""
           style={{ fontSize: "14px" }}
diff --git a/src/pages/SubnetIdOverview.jsx b/src/pages/SubnetIdOverview.jsx
index 1b2d9ce..8a478fc 100644
--- a/src/pages/SubnetIdOverview.jsx
+++ b/src/pages/SubnetIdOverview.jsx
@@ -146,9 +146,9 @@ const SubnetInner = () => {
         justifyContent={"space-between"}
         mb={5}
       >
-        <Heading fontSize={"md"} fontWeight={400} color={colorMode === "light" ? "#000" : "#fff"} mb={{base :"10px" ,md : "0px"}}>
+        <Text fontSize={"md"} fontWeight={400} color={colorMode === "light" ? "#000" : "#fff"} mb={{base :"10px" ,md : "0px"}}>
         Subnet ID - {params?.id}
-        </Heading>
+        </Text>
         <HStack to="" style={{ fontSize: "14px" }} color={colorMode === "light" ? "#000" : "#fff"} display={"flex"} gap={"3"}>
           {/* <Text as={"span"}>Total Value Locked (TVL)</Text> <Text as={"span"}>{Number(data?.data?.tvl).toFixed(3)} RBT</Text> */}
           <Text as={"span"}>Total Value Locked (TVL)</Text> <Text as={"span"}>{data?.data?.tvl} $ Mn</Text>
@@ -248,7 +248,7 @@ const SubnetInner = () => {
               bg={
                 index % 2 === 0
                   ? colorMode === "light"
-                    ? "#F2EFFF"
+                    ? "#ECEBF2"
                     : "#312F35"
                   : colorMode === "light"
                   ? "#fff"
diff --git a/src/pages/SubnetIdold.jsx b/src/pages/SubnetIdold.jsx
index d7279f4..70a15a3 100644
--- a/src/pages/SubnetIdold.jsx
+++ b/src/pages/SubnetIdold.jsx
@@ -100,14 +100,14 @@ const SubnetId = () => {
         justifyContent={"space-between"}
         mb={10}
       >
-        <Heading
+        <Text
           fontSize={"md"}
           fontWeight={400}
           color={colorMode === "light" ? "#000" : "#fff"}
           mb={{ base: "10px", md: "0px" }}
         >
           Subnet Overview {params?.id}
-        </Heading>
+        </Text>
         {/* <Text
           to=""
           style={{ fontSize: "14px" }}
diff --git a/src/pages/Transaction.jsx b/src/pages/Transaction.jsx
index cc16915..c3b508c 100644
--- a/src/pages/Transaction.jsx
+++ b/src/pages/Transaction.jsx
@@ -42,9 +42,9 @@ const Transaction = () => {
         <Box minH={"100vh"} backgroundImage={colorMode !== "light" ? `url(${bannerImage})` : "none"} backgroundSize="cover"
          backgroundRepeat="no-repeat" pb={"5rem"}>
          <Container maxW="6xl" pt={"8rem"}>
-            <Heading mb={5} fontSize={"sm"} fontWeight={400} color={colorMode === "light" ? "#000" : "#fff"}>
+            <Text mb={5} fontSize={"sm"} fontWeight={400} color={colorMode === "light" ? "#000" : "#fff"}>
               Transaction Info
-            </Heading>
+            </Text>
             <Box boxShadow={colorMode === 'light'&&"md"}  bg={colorMode === "light" ? "#F3F3F3" : "#1D1D1D"} p={4} mb={5} rounded={6}>
                 <Text color={"#969696"} fontSize={"sm"}>Transaction ID</Text>
                 <HStack fontSize={"sm"}>
diff --git a/src/pages/Transaction/TransactionDetails.jsx b/src/pages/Transaction/TransactionDetails.jsx
index 9050415..c6d3db6 100644
--- a/src/pages/Transaction/TransactionDetails.jsx
+++ b/src/pages/Transaction/TransactionDetails.jsx
@@ -139,7 +139,7 @@ const TransactionDetails = () => {
       >
         <Container maxW="6xl" pt={"6rem"}>
           <HStack justifyContent={"space-between"} alignItems={"center"} mb={3}>
-            <Heading
+            <Text
               mb={5}
               fontSize={"md"}
               fontWeight={500}
@@ -149,7 +149,7 @@ const TransactionDetails = () => {
               {data?.data?.transactionType === "SC"
                 ? "Smart Contract Info"
                 : "Transaction Info"}
-            </Heading>
+            </Text>
             <Button fontWeight={400} color={"#fff"} border={"none"} bg={colorMode === "light" ? "#230A79" : "#312F35"} _hover={{bg: colorMode === "light" ? "#4023A6" : "#312F35"}} _focus={{outline:"none"}}
               display={'flex'} gap={2} alignItems={'center'} rounded={'sm'} size={"sm"} isLoading={isLoadingURL} onClick={handleGenrateShortURL}>
               <MdContentCopy/> Copy short url
@@ -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}