diff --git a/src/Redux/slice/NewsInternalSlice.js b/src/Redux/slice/NewsInternalSlice.js
new file mode 100644
index 0000000..ae0fea0
--- /dev/null
+++ b/src/Redux/slice/NewsInternalSlice.js
@@ -0,0 +1,13 @@
+import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react';
+
+export const newsInternalApi = createApi({
+    reducerPath: 'newsInternal',
+    baseQuery: fetchBaseQuery({ baseUrl: 'https://rubix.betadelivery.com/api/' }),
+    endpoints: (builder) => ({
+        getNewsInternal: builder.query({
+            query: () => 'news/active',
+        }),
+    }),
+});
+
+export const { useGetNewsInternalQuery } = newsInternalApi;
\ No newline at end of file
diff --git a/src/Redux/slice/ecosystemSlice.js b/src/Redux/slice/ecosystemSlice.js
new file mode 100644
index 0000000..8b6fdfe
--- /dev/null
+++ b/src/Redux/slice/ecosystemSlice.js
@@ -0,0 +1,13 @@
+import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react'
+
+export const ecoSystem = createApi({
+    reducerPath: 'ecoSystem',
+    baseQuery: fetchBaseQuery({ baseUrl: 'https://rubix.betadelivery.com/api/' }),
+    endpoints: (builder) => ({
+        getEcoSystem: builder.query({
+            query: () => 'eco/active',
+        }),
+    }),
+});
+
+export const { useGetEcoSystemQuery } = ecoSystem;
\ No newline at end of file
diff --git a/src/Redux/slice/homeSlice.js b/src/Redux/slice/homeSlice.js
index e628717..bab0adf 100644
--- a/src/Redux/slice/homeSlice.js
+++ b/src/Redux/slice/homeSlice.js
@@ -1,7 +1,7 @@
 import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react';
 
 export const homePageApi = createApi({
-    reducerPath: 'events',
+    reducerPath: 'homeSlice',
     baseQuery: fetchBaseQuery({ baseUrl: 'https://rubix.betadelivery.com/api/' }),
     endpoints: (builder) => ({
         getHomePage: builder.query({
diff --git a/src/Redux/slice/newsSlice.js b/src/Redux/slice/newsSlice.js
index 52abd35..a7d8c81 100644
--- a/src/Redux/slice/newsSlice.js
+++ b/src/Redux/slice/newsSlice.js
@@ -5,7 +5,7 @@ export const newsApi = createApi({
     baseQuery: fetchBaseQuery({ baseUrl: 'https://rubix.betadelivery.com/api/' }),
     endpoints: (builder) => ({
         getNews: builder.query({
-            query: ({ page, pageSize }) => `admin/news?page=${page}&pageSize=${pageSize}`,
+            query: ({ page, pageSize }) => `news/active?page=${page}&pageSize=${pageSize}`,
         }),
     }),
 });
diff --git a/src/Redux/slice/resources.js b/src/Redux/slice/resources.js
index 9a5beff..3c23159 100644
--- a/src/Redux/slice/resources.js
+++ b/src/Redux/slice/resources.js
@@ -5,9 +5,12 @@ export const resourcesApi = createApi({
     baseQuery: fetchBaseQuery({ baseUrl: 'https://rubix.betadelivery.com/api/' }),
     endpoints: (builder) => ({
         getResources: builder.query({
-            query: ({ page, pageSize }) => `admin/whitepaper?page=${page}&pageSize=${pageSize}`,
+            query: ({ page, pageSize }) => `whitepaper/active?page=${page}&pageSize=${pageSize}`,
+        }),
+        getArticles: builder.query({
+            query: ({ page, pageSize }) => `artical/active?page=${page}&pageSize=${pageSize}`,
         }),
     }),
 });
 
-export const { useGetResourcesQuery } = resourcesApi;
\ No newline at end of file
+export const { useGetResourcesQuery, useGetArticlesQuery } = resourcesApi;
\ No newline at end of file
diff --git a/src/Redux/slice/statsSlice.js b/src/Redux/slice/statsSlice.js
new file mode 100644
index 0000000..986a90a
--- /dev/null
+++ b/src/Redux/slice/statsSlice.js
@@ -0,0 +1,16 @@
+import { createApi, fetchBaseQuery } from '@reduxjs/toolkit/query/react';
+
+export const statsApi = createApi({
+    reducerPath: 'statsApi',
+    baseQuery: fetchBaseQuery({ baseUrl: 'https://rubix-explorer-api.azurewebsites.net/api/' }),
+    endpoints: (builder) => ({
+        getStatsApi: builder.query({
+            query: () => 'Explorer/totalsupply',
+        }),
+        getStatApi: builder.query({
+            query: () => 'Explorer/Cards',
+        }),
+    }),
+});
+
+export const { useGetStatsApiQuery, useGetStatApiQuery } = statsApi;
diff --git a/src/Redux/store/store.js b/src/Redux/store/store.js
index 266d4af..7528242 100644
--- a/src/Redux/store/store.js
+++ b/src/Redux/store/store.js
@@ -10,6 +10,9 @@ import { learnPageApi } from '../slice/learPageSlice';
 import { homePageApi } from '../slice/homeSlice';
 import { eventsViewApi } from '../slice/eventsViewSlice';
 import { useCaseApi } from '../slice/useCaseSlice';
+import { newsInternalApi } from '../slice/NewsInternalSlice';
+import { ecoSystem } from '../slice/ecosystemSlice';
+import { statsApi } from '../slice/statsSlice';
 
 const store = configureStore({
     reducer: {
@@ -24,6 +27,9 @@ const store = configureStore({
         [homePageApi.reducerPath]: homePageApi.reducer,
         [eventsViewApi.reducerPath]: eventsViewApi.reducer,
         [useCaseApi.reducerPath]: useCaseApi.reducer,
+        [newsInternalApi.reducerPath]: newsInternalApi.reducer,
+        [ecoSystem.reducerPath]: ecoSystem.reducer,
+        [statsApi.reducerPath]: statsApi.reducer,
     },
     middleware: (getDefaultMiddleware) =>
         getDefaultMiddleware().concat(
@@ -38,6 +44,9 @@ const store = configureStore({
             homePageApi.middleware,
             eventsViewApi.middleware,
             useCaseApi.middleware,
+            newsInternalApi.middleware,
+            ecoSystem.middleware,
+            statsApi.middleware,
         ), // Add blogApi.middleware here
 });
 
diff --git a/src/components/EcoPage/EcoBanner.jsx b/src/components/EcoPage/EcoBanner.jsx
index b19ec86..4ffdb5b 100644
--- a/src/components/EcoPage/EcoBanner.jsx
+++ b/src/components/EcoPage/EcoBanner.jsx
@@ -1,6 +1,9 @@
+/* eslint-disable no-unused-vars */
 import { Box, Button, Container, Text } from "@chakra-ui/react";
 import banner from "../../assets/images/EcoBanner.png";
 import { Link } from "react-router-dom";
+import Loader from "../Loader/Loader";
+import { useGetEcoSystemQuery } from "../../Redux/slice/ecosystemSlice";
 
 const BannerContent = [
   {
@@ -17,168 +20,169 @@ const BannerContent = [
 ];
 
 const EcoBanner = () => {
+  const { data, isLoading, error } = useGetEcoSystemQuery();
+  const dataHeader = data?.data?.data;
+  console.log(dataHeader);
+  if (isLoading) {
+    return (
+      <div>
+        <Loader />
+      </div>
+    );
+  }
   return (
-    <Box
-      height={"100vh"}
-      backgroundImage={`url(${banner})`}
-      backgroundRepeat={"no-repeat"}
-      backgroundSize={"cover"}
-      display={"grid"}
-      placeContent={"center"}
-      sx={{
-        "@media (max-width: 1024px)": {
-          height: "70vh",
-        },
-        "@media (max-width: 600px)": {
-          height: "85vh",
-        },
-      }}
-    >
-      <Container
-        alignItems={"center"}
-        display={"flex"}
-        height={"100vh"}
-        alignContent={"center"}
-        paddingTop={"10%"}
-        maxW="container.xl"
-        textAlign={"left"}
-        marginTop={"2rem"}
-        paddingLeft={"3.5rem"}
-        sx={{
-          "@media (max-width: 500px)": {
-            paddingLeft: "1rem", // Correctly target paddingLeft instead of padding
-          },
-        }}
-      >
+    <>
+      {dataHeader?.map((item) => (
         <Box
-          width={"78%"}
+          key={item.id}
+          height={"100vh"}
+          backgroundImage={`url(https://rubix.betadelivery.com/${item.banner_image})`}
+          backgroundRepeat={"no-repeat"}
+          backgroundSize={"cover"}
+          display={"grid"}
+          placeContent={"center"}
           sx={{
-            "@media (max-width: 435px)": {
-              width: "100%",
+            "@media (max-width: 1024px)": {
+              height: "70vh",
+            },
+            "@media (max-width: 600px)": {
+              height: "85vh",
             },
           }}
         >
-          <Text
-            as={"h2"}
-            fontWeight={700}
-            fontSize={"52px"}
-            textTransform={"Capitalize"}
-            color={"#DE858E"}
-            lineHeight={"62px"}
-            letterSpacing={"1px"}
+          <Container
+            alignItems={"center"}
+            display={"flex"}
+            height={"100vh"}
+            alignContent={"center"}
+            paddingTop={"10%"}
+            maxW="container.xl"
+            textAlign={"left"}
+            marginTop={"2rem"}
+            paddingLeft={"3.5rem"}
             sx={{
-              "@media (max-width: 996px)": {
-                fontSize: "46px",
-              },
-              "@media (max-width: 600px)": {
-                fontSize: "40px",
-                marginBottom: "0rem",
-                lineHeight: "54px",
+              "@media (max-width: 500px)": {
+                paddingLeft: "1rem", // Correctly target paddingLeft instead of padding
               },
             }}
           >
-            <span
-              style={{
-                color: "#fff",
-              }}
-            >
-              {BannerContent[0].head}
-            </span>
-            {BannerContent[0].heading1} <br />
-            <span
-              style={{
-                color: "#fff",
-              }}
-            >
-              {BannerContent[0].heading2}
-            </span>
-          </Text>
-          <Box marginTop={"10px"} width={"80%"}>
-            <Text
-              color={"#fff"}
-              fontSize={"20px"}
-              fontWeight={"400"}
-              lineHeight={"37.5px"}
-              fontFamily={"Poppins"}
+            <Box
+              width={"78%"}
               sx={{
-                "@media (max-width: 1024px)": {
-                  fontSize: "22px",
-                },
-                "@media (max-width: 500px)": {
-                  fontSize: "16px",
-                  lineHeight: "28px",
-                },
-              }}
-            >
-              {BannerContent[1].subheading}
-            </Text>
-          </Box>
-          <Link
-            to="https://learn.rubix.net/"
-            target="_blank"
-            rel="noopener noreferrer"
-          >
-            <Button
-              position={"relative"}
-              backgroundColor={"transparent"}
-              cursor={"pointer"}
-              transition="0.3s ease-in-out"
-              color={"#fff"}
-              width={"216px"}
-              marginTop={"2rem"}
-              height={"56px"}
-              fontFamily={"Poppins"}
-              fontWeight={"400"}
-              border={"1px solid white"}
-              borderRadius={"10px"}
-              fontSize={"20px"}
-              zIndex={"1"}
-              overflow={"hidden"}
-              sx={{
-                "::before": {
-                  content: '""',
-                  position: "absolute",
-                  top: "50%",
-                  left: "50%",
-                  transform: "translate(-50%, -50%)",
-                  width: "65px",
-                  height: "65px",
-                  borderRadius: "50%",
-                  transition: "0.35s linear",
-                  zIndex: -1,
-                  bgGradient:
-                    "radial-gradient(circle, #ffffff, #eee2f2, #e7c3dc, #e5a3ba, #de858e)",
-                  opacity: "0",
-                },
-                "&:hover::before": {
+                "@media (max-width: 435px)": {
                   width: "100%",
-                  height: "120%",
-                  borderRadius: "0px",
-                  opacity: "1",
                 },
-                "@media (max-width: 500px)": {
-                  fontSize: "14px",
-                  width: "230px",
-                  height: "44px",
-                  marginTop: "2rem",
-                  bgGradient:
-                    "radial-gradient(circle, #ffffff, #eee2f2, #e7c3dc, #e5a3ba, #de858e)",
-                  color: "#000",
-                  fontWeight: "600",
-                },
-              }}
-              _hover={{
-                color: "#000",
-                border: "1px solid white",
-                zIndex: 1,
               }}
             >
-              {BannerContent[2].btn}
-            </Button>
-          </Link>
+              <Text
+                as={"h2"}
+                fontWeight={700}
+                fontSize={"52px"}
+                textTransform={"Capitalize"}
+                color={"#DE858E"}
+                lineHeight={"62px"}
+                letterSpacing={"1px"}
+                sx={{
+                  "@media (max-width: 996px)": {
+                    fontSize: "46px",
+                  },
+                  "@media (max-width: 600px)": {
+                    fontSize: "40px",
+                    marginBottom: "0rem",
+                    lineHeight: "54px",
+                  },
+                }}
+              >
+                {item.Heading}
+              </Text>
+              <Box marginTop={"10px"} width={"80%"}>
+                <Text
+                  color={"#fff"}
+                  fontSize={"20px"}
+                  fontWeight={"400"}
+                  lineHeight={"37.5px"}
+                  fontFamily={"Poppins"}
+                  sx={{
+                    "@media (max-width: 1024px)": {
+                      fontSize: "22px",
+                    },
+                    "@media (max-width: 500px)": {
+                      fontSize: "16px",
+                      lineHeight: "28px",
+                    },
+                  }}
+                >
+                  {item.sub_heading}
+                </Text>
+              </Box>
+              <Link
+                to={item.CTO_button_link}
+                target="_blank"
+                rel="noopener noreferrer"
+              >
+                <Button
+                  position={"relative"}
+                  backgroundColor={"transparent"}
+                  cursor={"pointer"}
+                  transition="0.3s ease-in-out"
+                  color={"#fff"}
+                  width={"216px"}
+                  marginTop={"2rem"}
+                  height={"56px"}
+                  fontFamily={"Poppins"}
+                  fontWeight={"400"}
+                  border={"1px solid white"}
+                  borderRadius={"10px"}
+                  fontSize={"20px"}
+                  zIndex={"1"}
+                  overflow={"hidden"}
+                  sx={{
+                    "::before": {
+                      content: '""',
+                      position: "absolute",
+                      top: "50%",
+                      left: "50%",
+                      transform: "translate(-50%, -50%)",
+                      width: "65px",
+                      height: "65px",
+                      borderRadius: "50%",
+                      transition: "0.35s linear",
+                      zIndex: -1,
+                      bgGradient:
+                        "radial-gradient(circle, #ffffff, #eee2f2, #e7c3dc, #e5a3ba, #de858e)",
+                      opacity: "0",
+                    },
+                    "&:hover::before": {
+                      width: "100%",
+                      height: "120%",
+                      borderRadius: "0px",
+                      opacity: "1",
+                    },
+                    "@media (max-width: 500px)": {
+                      fontSize: "14px",
+                      width: "230px",
+                      height: "44px",
+                      marginTop: "2rem",
+                      bgGradient:
+                        "radial-gradient(circle, #ffffff, #eee2f2, #e7c3dc, #e5a3ba, #de858e)",
+                      color: "#000",
+                      fontWeight: "600",
+                    },
+                  }}
+                  _hover={{
+                    color: "#000",
+                    border: "1px solid white",
+                    zIndex: 1,
+                  }}
+                >
+                  {item.CTO_button_title}
+                </Button>
+              </Link>
+            </Box>
+          </Container>
         </Box>
-      </Container>
-    </Box>
+      ))}
+    </>
   );
 };
 
diff --git a/src/components/HomePage/Stats.jsx b/src/components/HomePage/Stats.jsx
index 40cfc5f..907dc87 100644
--- a/src/components/HomePage/Stats.jsx
+++ b/src/components/HomePage/Stats.jsx
@@ -3,12 +3,15 @@ import { useInView } from "react-intersection-observer";
 import CountUp from "react-countup";
 import banner from "../../assets/images/Statsbanner.png";
 import { useMediaQuery } from "@chakra-ui/react";
+import { useGetStatsApiQuery } from "../../Redux/slice/statsSlice";
 
 const StatsContent = {
   heading: `Key Statistics`,
 };
 
 const Stats = () => {
+  const { data, isLoading, error } = useGetStatsApiQuery();
+  console.log(data);
   const [isSmallScreen] = useMediaQuery("(max-width: 435px)");
   const { ref, inView } = useInView({
     threshold: 0.5,
diff --git a/src/components/NavBar/NavBar.jsx b/src/components/NavBar/NavBar.jsx
index fa6534d..2e89159 100644
--- a/src/components/NavBar/NavBar.jsx
+++ b/src/components/NavBar/NavBar.jsx
@@ -325,7 +325,6 @@ const NavBar = () => {
                     </PopoverBody>
                   </PopoverContent>
                 </Popover>
-
                 <Popover
                   isOpen={isHoveredBuild}
                   onClose={() => setIsHoveredBuild(false)}
@@ -461,7 +460,6 @@ const NavBar = () => {
                     </PopoverBody>
                   </PopoverContent>
                 </Popover>
-
                 <Popover
                   isOpen={isHoveredCases}
                   onClose={() => setIsHoveredCases(false)}
@@ -658,7 +656,6 @@ const NavBar = () => {
                       </PopoverBody> */}
                   </PopoverContent>
                 </Popover>
-
                 {/* <Link
                   to="/community"
                   className="link"
@@ -814,6 +811,28 @@ const NavBar = () => {
                         </Box>
                       </Link>
                     </PopoverBody>
+
+                    <PopoverBody>
+                      <Link
+                        to="/ecosystem"
+                        className="link"
+                        style={
+                          location.pathname === "/ecosystem"
+                            ? highlight
+                            : normal
+                        }
+                      >
+                        <Box
+                          display={"flex"}
+                          alignItems={"center"}
+                          gap={"1rem"}
+                          marginBottom={"1rem"}
+                        >
+                          <Image src={subnetsIcon} width={`${iconwidth}`} />
+                          EcoSystem
+                        </Box>
+                      </Link>
+                    </PopoverBody>
                   </PopoverContent>
                 </Popover>
 
@@ -835,7 +854,6 @@ const NavBar = () => {
                     style={location.pathname === "/" ? active : linkStyle}
                   />
                 </Link> */}
-
                 <Link
                   to="/Contact"
                   className="link"
diff --git a/src/components/NewsInternal/NewsInternalPage.jsx b/src/components/NewsInternal/NewsInternalPage.jsx
new file mode 100644
index 0000000..4e5f313
--- /dev/null
+++ b/src/components/NewsInternal/NewsInternalPage.jsx
@@ -0,0 +1,286 @@
+/* eslint-disable no-unused-vars */
+import React, { useEffect } from "react";
+import NotFound from "../../pages/NotFound";
+import { Avatar, Box, Image, Text, Textarea } from "@chakra-ui/react";
+import x from "../../assets/images/x.png";
+import linked from "../../assets/images/linked.png";
+import tele from "../../assets/images/tele.png";
+import fb from "../../assets/images/fb.png";
+import Chip from "../Chip/Chip";
+import { Link, useParams } from "react-router-dom";
+import Loader from "../Loader/Loader";
+import { useGetNewsInternalQuery } from "../../Redux/slice/NewsInternalSlice";
+
+const NewsInternalPage = () => {
+  const { title_slug } = useParams();
+  const { data, error, isLoading } = useGetNewsInternalQuery();
+  const newsPosts = data?.data?.data?.rows;
+  console.log(data?.data?.data?.rows);
+
+  useEffect(() => {
+    window.scrollTo(0, 0);
+  }, []);
+
+  if (isLoading) {
+    return (
+      <div>
+        <Loader />
+      </div>
+    );
+  }
+
+  const matchingNewsPost = newsPosts
+    ? newsPosts.find((item) => item.title_slug === title_slug)
+    : null;
+
+  console.log(matchingNewsPost);
+  return (
+    <>
+      {matchingNewsPost ? (
+        <Box
+          bg="#000000"
+          height={"auto"}
+          display={"flex"}
+          gap={7}
+          justifyContent={"center"}
+          alignItems={"center"}
+          flexDirection={"column"}
+          color="white"
+          key={matchingNewsPost.id}
+          sx={{}}
+        >
+          <Box
+            bg="#000000"
+            minHeight={"60vh"}
+            width={"70vw"}
+            display={"flex"}
+            gap={5}
+            marginTop={10}
+            justifyContent={"end"}
+            alignItems={"center"}
+            flexDirection={"column"}
+            color="white"
+            sx={{
+              "@media (max-width: 600px)": {
+                minHeight: "inherit",
+                width: "100vw",
+                marginTop: "6rem",
+              },
+            }}
+          >
+            <Text
+              textAlign={"center"}
+              className="rubix-fw-600"
+              fontSize={"40px"}
+              fontFamily={"Mona Sans"}
+              color={"#fff"}
+              sx={{
+                "@media (max-width: 600px)": {
+                  fontSize: "28px",
+                  lineHeight: "45px",
+                  padding: "0px 1rem",
+                },
+              }}
+            >
+              {matchingNewsPost.title}
+            </Text>
+
+            <Text
+              textAlign={"center"}
+              className="rubix-text-xsmall rubix-fw-500"
+              sx={{
+                "@media (max-width: 600px)": {
+                  fontSize: "35px",
+                },
+              }}
+            >
+              {(function () {
+                const createdAtDate = new Date(matchingNewsPost.createdAt);
+                const formattedDate = createdAtDate
+                  .toLocaleDateString("en-GB", {
+                    day: "2-digit",
+                    month: "2-digit",
+                    year: "2-digit",
+                  })
+                  .replace(/\//g, "-");
+                return (
+                  <Text
+                    as={"span"}
+                    textAlign={"center"}
+                    className="rubix-text-xsmall rubix-fw-500"
+                    marginLeft={"10px"}
+                    sx={{
+                      "@media (max-width: 600px)": {
+                        fontSize: "35px",
+                      },
+                    }}
+                  >
+                    {formattedDate}
+                  </Text>
+                );
+              })()}
+            </Text>
+
+            <Box display={"flex"} gap={3} textAlign={"center"}>
+              <Avatar
+                size="lg"
+                name="Dan Abrahmov"
+                src={`https://rubix.betadelivery.com/${matchingNewsPost.profile_image}`}
+              />
+
+              <Box
+                textAlign={"start"}
+                display={"flex"}
+                flexDirection={"column"}
+                alignItems={"start"}
+                justifyContent={"center"}
+                className="rubix-text-xsmall rubix-fw-500"
+              >
+                <Text>{matchingNewsPost.author_name}</Text>
+                <Text>{matchingNewsPost.author_designation}</Text>
+              </Box>
+            </Box>
+          </Box>
+          {/* ========[ Banner ]======= */}
+          <Box
+            height={"70vh"}
+            width={"85vw"}
+            backgroundImage={`url(https://rubix.betadelivery.com/${matchingNewsPost.banner_image})`}
+            backgroundRepeat={"no-repeat"}
+            backgroundSize={"cover"}
+            position="relative"
+            sx={{
+              "@media (max-width: 600px)": {
+                height: "215px",
+                width: "100%",
+              },
+            }}
+          >
+            <Box
+              position="absolute"
+              top={0}
+              left={0}
+              width="100%"
+              height="100%"
+              backgroundColor="rgba(0, 0, 0, 0.5)"
+            />
+          </Box>
+
+          <Box
+            bg="#000000"
+            width={"85vw"}
+            height={"auto"}
+            display={"flex"}
+            pb={"60px"}
+            gap={5}
+            justifyContent={"center"}
+            alignItems={"center"}
+            flexDirection={"column"}
+            color="white"
+            position={"relative"}
+            paddingBottom={"5rem"}
+            sx={{
+              "@media (max-width: 600px)": {
+                display: "block",
+                top: "inherit",
+              },
+            }}
+          >
+            <Box
+              position={"absolute"}
+              top={0}
+              left={0}
+              display={"flex"}
+              flexDirection={"column"}
+              alignItems={"center"}
+              gap={2}
+              sx={{
+                "@media (max-width: 600px)": {
+                  bottom: "0px",
+                  top: "inherit",
+                  display: "block",
+                  width: "100%",
+                  marginBottom: "20px",
+                  marginTop: "20px",
+                },
+              }}
+            >
+              <Text
+                className="rubix-text-xsmall"
+                sx={{
+                  "@media (max-width: 600px)": {
+                    marginBottom: "15px",
+                  },
+                }}
+              >
+                Share
+              </Text>
+
+              <Text
+                sx={{
+                  "@media (max-width: 600px)": {
+                    display: "flex",
+                    justifyContent: "space-between",
+                    width: "60%",
+                  },
+                }}
+              >
+                <Link to="https://t.me/rubixblockchain" target="_blank">
+                  <Image cursor={"pointer"} mb={4} w={6} h={6} src={tele} />
+                </Link>
+                <Link to="https://twitter.com/rubixchain" target="_blank">
+                  <Image cursor={"pointer"} mb={4} w={6} h={6} src={x} />
+                </Link>
+                <Link to="https://www.facebook.com/RubixChain" target="_blank">
+                  <Image cursor={"pointer"} mb={4} w={6} h={6} src={fb} />
+                </Link>
+                <Link
+                  to="https://www.linkedin.com/company/rubixnet/"
+                  target="_blank"
+                >
+                  <Image cursor={"pointer"} mb={4} w={6} h={6} src={linked} />
+                </Link>
+              </Text>
+            </Box>
+            <Box
+              bg="#000000"
+              width={"68vw"}
+              height={"auto"}
+              display={"flex"}
+              flexDirection={"column"}
+              gap={5}
+              justifyContent={"start"}
+              color="white"
+              sx={{
+                "@media (max-width: 600px)": {
+                  width: "100%",
+                },
+              }}
+            >
+              <Box
+                pt={5}
+                pb={5}
+                sx={{
+                  "@media (max-width: 600px)": {
+                    marginBottom: "3rem",
+                  },
+                }}
+              >
+                <Text
+                  pb={5}
+                  className="rubix-text-small"
+                  dangerouslySetInnerHTML={{ __html: matchingNewsPost.content }}
+                />
+                {/* <Text>{matchingNewsPost.content}</Text> */}
+              </Box>
+            </Box>
+          </Box>
+        </Box>
+      ) : (
+        <NotFound />
+      )}
+    </>
+  );
+};
+
+export default NewsInternalPage;
diff --git a/src/components/NewsPage/NewsContent.jsx b/src/components/NewsPage/NewsContent.jsx
index 9ea6476..2e08ca3 100644
--- a/src/components/NewsPage/NewsContent.jsx
+++ b/src/components/NewsPage/NewsContent.jsx
@@ -100,9 +100,9 @@ const NewsContent = () => {
 
   const totalItems = data?.data?.totalItems;
   const totalPages = data?.data?.totalPages;
-  const newsCard = data?.data?.rows;
+  const newsCard = data?.data?.data?.rows;
 
-  console.log(data?.data?.totalPages);
+  console.log(data?.data?.data?.rows);
 
   if (!newsCard) {
     return (
@@ -144,7 +144,7 @@ const NewsContent = () => {
         >
           {newsCard?.map((content) => (
             <>
-              <Link>
+              <Link to={`/news/${content.title_slug}`}>
                 <Box
                   key={content.id}
                   width={"340px"}
diff --git a/src/components/ResourcesPage/tabInsideContent/TabsArticles.jsx b/src/components/ResourcesPage/tabInsideContent/TabsArticles.jsx
index e8aaad0..dde6189 100644
--- a/src/components/ResourcesPage/tabInsideContent/TabsArticles.jsx
+++ b/src/components/ResourcesPage/tabInsideContent/TabsArticles.jsx
@@ -4,7 +4,16 @@ import pic from "../../../assets/images/eventsPic.png";
 const TabsArticles = () => {
   return (
     <>
-      <Box backgroundColor={"#151515"} padding={"2rem"} borderRadius={"5px"}>
+      <Box
+        backgroundColor={"#151515"}
+        padding={"2rem"}
+        borderRadius={"5px"}
+        sx={{
+          "@media (max-width: 600px)": {
+            padding: "2rem 1rem",
+          },
+        }}
+      >
         <Text paddingBottom={"1rem"}>Newest Post</Text>
         <Box
           display={"flex"}
diff --git a/src/components/ResourcesPage/tabInsideContent/TabsVideo.jsx b/src/components/ResourcesPage/tabInsideContent/TabsVideo.jsx
index 5d6af48..d8b639c 100644
--- a/src/components/ResourcesPage/tabInsideContent/TabsVideo.jsx
+++ b/src/components/ResourcesPage/tabInsideContent/TabsVideo.jsx
@@ -1,54 +1,134 @@
 import { Badge, Box, Image, Text } from "@chakra-ui/react";
-import pic from "../../../assets/images/eventsPic.png";
+import pic1 from "../../../assets/images/eventsPic.png";
+import pic2 from "../../../assets/images/BuildBanner.webp";
+import pic3 from "../../../assets/images/learnBanner.webp";
+import { Swiper, SwiperSlide } from "swiper/react";
+// Import Swiper styles
+import "swiper/css";
+import "swiper/css/pagination";
+import "swiper/css/navigation";
+
+import { Navigation, Pagination, Autoplay } from "swiper/modules";
+
+const videoTab = [
+  {
+    id: 1,
+    badge: `Video, 27 mins`,
+    title: `The Proofchain Technical Whitepaper`,
+    descript: `Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut et
+                massa mi. Aliquam in hendrerit urna. Pellentesque sit amet
+                sapien fringilla, mattis ligula consectetur, ultrices mauris.
+                Maecenas vitae,Aliquam in hendrerit urna. Pellentesque sit amet
+                sapien fringilla, mattis ligula consectetur, ultrices mauris.
+                Maecenas vitae,Aliquam in hendrerit urna. Pellentesque sit amet
+                sapien fringilla, mattis ligula consectetur, ultrices mauris.
+                Maecenas vitae`,
+    thumbnail: pic1,
+  },
+  {
+    id: 2,
+    badge: `Video, 27 mins`,
+    title: `The Proofchain Technical Whitepaper`,
+    descript: `Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut et
+                massa mi. Aliquam in hendrerit urna. Pellentesque sit amet
+                sapien fringilla, mattis ligula consectetur, ultrices mauris.
+                Maecenas vitae,Aliquam in hendrerit urna. Pellentesque sit amet
+                sapien fringilla, mattis ligula consectetur, ultrices mauris.
+                Maecenas vitae,Aliquam in hendrerit urna. Pellentesque sit amet
+                sapien fringilla, mattis ligula consectetur, ultrices mauris.
+                Maecenas vitae`,
+    thumbnail: pic2,
+  },
+  {
+    id: 3,
+    badge: `Video, 27 mins`,
+    title: `The Proofchain Technical Whitepaper`,
+    descript: `Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut et
+                massa mi. Aliquam in hendrerit urna. Pellentesque sit amet
+                sapien fringilla, mattis ligula consectetur, ultrices mauris.
+                Maecenas vitae,Aliquam in hendrerit urna. Pellentesque sit amet
+                sapien fringilla, mattis ligula consectetur, ultrices mauris.
+                Maecenas vitae,Aliquam in hendrerit urna. Pellentesque sit amet
+                sapien fringilla, mattis ligula consectetur, ultrices mauris.
+                Maecenas vitae`,
+    thumbnail: pic3,
+  },
+];
 
 const TabsVideo = () => {
   return (
-    <Box backgroundColor={"#151515"} padding={"2rem"} borderRadius={"5px"}>
+    <Box
+      backgroundColor={"#151515"}
+      padding={"2rem"}
+      borderRadius={"5px"}
+      className="tabspagination"
+      sx={{
+        "@media (max-width: 600px)": {
+          padding: "2rem 1rem",
+        },
+      }}
+    >
       <Text paddingBottom={"1rem"}>Newest Post</Text>
-      <Box
-        display={"flex"}
-        alignItems={"center"}
-        justifyContent={"start"}
-        gap={"2rem"}
-        sx={{
-          "@media (max-width: 600px)": {
-            flexDirection: "column",
-          },
+      <Swiper
+        pagination={true}
+        navigation={true}
+        modules={[Navigation, Pagination, Autoplay]}
+        autoplay={{
+          delay: 10000,
+          disableOnInteraction: true,
         }}
+        loop={true}
       >
-        <Box>
-          <Image src={pic} />
-        </Box>
-        <Box flex={"1"}>
-          <Badge
-            backgroundColor={"transparent"}
-            color={"#fff"}
-            fontWeight={"500"}
-            fontFamily={"Poppins"}
-            fontSize={"14px"}
-            marginBottom={"1rem"}
-          >
-            News & Article
-          </Badge>
-          <Text
-            as={"h2"}
-            className="rubix-text-subheading"
-            marginBottom={"1rem"}
-          >
-            The Proofchain Technical Whitepaper
-          </Text>
-          <Text className="rubix-text-small">
-            Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut et massa
-            mi. Aliquam in hendrerit urna. Pellentesque sit amet sapien
-            fringilla, mattis ligula consectetur, ultrices mauris. Maecenas
-            vitae,Aliquam in hendrerit urna. Pellentesque sit amet sapien
-            fringilla, mattis ligula consectetur, ultrices mauris. Maecenas
-            vitae,Aliquam in hendrerit urna. Pellentesque sit amet sapien
-            fringilla, mattis ligula consectetur, ultrices mauris. Maecenas
-            vitae
-          </Text>
-        </Box>
-      </Box>
+        {videoTab.map((item) => (
+          <SwiperSlide key={item.id}>
+            <Box
+              display={"flex"}
+              alignItems={"start"}
+              justifyContent={"start"}
+              gap={"2rem"}
+              sx={{
+                "@media (max-width: 600px)": {
+                  flexDirection: "column",
+                },
+              }}
+            >
+              <Box>
+                <Image
+                  src={item.thumbnail}
+                  maxW={"418px"}
+                  minH={"280px"}
+                  sx={{
+                    "@media (max-width: 600px)": {
+                      maxW: "100%",
+                      minH: "auto",
+                    },
+                  }}
+                />
+              </Box>
+              <Box flex={"1"}>
+                <Badge
+                  backgroundColor={"transparent"}
+                  color={"#fff"}
+                  fontWeight={"500"}
+                  fontFamily={"Poppins"}
+                  fontSize={"14px"}
+                  marginBottom={"1rem"}
+                >
+                  {item.badge}
+                </Badge>
+                <Text
+                  as={"h2"}
+                  className="rubix-text-subheading"
+                  marginBottom={"1rem"}
+                >
+                  {item.title}
+                </Text>
+                <Text className="rubix-text-small">{item.descript}</Text>
+              </Box>
+            </Box>
+          </SwiperSlide>
+        ))}
+      </Swiper>
     </Box>
   );
 };
diff --git a/src/index.css b/src/index.css
index 454e25f..a9854d5 100644
--- a/src/index.css
+++ b/src/index.css
@@ -177,7 +177,33 @@ span.swiper-pagination-bullet {
   border: none;
 }
 
+.tabspagination .swiper-pagination {
+  top: 94% !important;
+}
+
+.tabspagination .swiper-button-prev:after,
+.swiper-button-next:after {
+  font-weight: bolder;
+  font-size: xx-large;
+}
+
+.tabspagination .swiper-button-next {
+  left: 98%;
+}
+
+.tabspagination .swiper-button-prev {
+  right: 98%;
+}
+
 @media only screen and (max-width: 600px) {
+  .tabspagination .swiper-button-prev,
+  .tabspagination .swiper-button-next {
+    display: none;
+  }
+  .tabspagination .swiper-pagination {
+    top: 98% !important;
+  }
+
   .swiper-button-prev:after,
   .swiper-button-next:after {
     font-size: 30px;
diff --git a/src/pages/Ecosystem.jsx b/src/pages/Ecosystem.jsx
index c3cfd84..a213873 100644
--- a/src/pages/Ecosystem.jsx
+++ b/src/pages/Ecosystem.jsx
@@ -1,12 +1,14 @@
 import EcoBanner from "../components/EcoPage/EcoBanner";
 import EnterPrises from "../components/EcoPage/EnterPrises";
 import LearnMore from "../components/Community/LearnMore";
+import LearnDev from "../components/LearnPage/LearnDev";
 
 const Ecosystem = () => {
   return (
     <div>
       <EcoBanner />
-      <EnterPrises />
+      {/* <EnterPrises /> */}
+      <LearnDev />
       <LearnMore />
     </div>
   );
diff --git a/src/pages/NewsInternal.jsx b/src/pages/NewsInternal.jsx
new file mode 100644
index 0000000..679c1c4
--- /dev/null
+++ b/src/pages/NewsInternal.jsx
@@ -0,0 +1,11 @@
+import NewsInternalPage from "../components/NewsInternal/NewsInternalPage";
+
+const NewsInternal = () => {
+  return (
+    <>
+      <NewsInternalPage />
+    </>
+  );
+};
+
+export default NewsInternal;
diff --git a/src/routes/_routes.jsx b/src/routes/_routes.jsx
index 93916f4..8566cd8 100644
--- a/src/routes/_routes.jsx
+++ b/src/routes/_routes.jsx
@@ -20,12 +20,12 @@ import HomePage from "../pages/HomePage";
 import LearnPage from "../pages/LearnPage";
 import NotFound from "../pages/NotFound";
 import UseCases from "../pages/UseCases";
-import fintech from "../assets/images/usecase-bg.png";
-import adTech from "../assets/images/addtech.jpg";
-import martech from "../assets/images/martech.png";
-import security from "../assets/images/i&security-bg.png";
-import tele from "../assets/images/Telecom-bg.png";
-import healthTech from "../assets/images/health-tech.png";
+// import fintech from "../assets/images/usecase-bg.png";
+// import adTech from "../assets/images/addtech.jpg";
+// import martech from "../assets/images/martech.png";
+// import security from "../assets/images/i&security-bg.png";
+// import tele from "../assets/images/Telecom-bg.png";
+// import healthTech from "../assets/images/health-tech.png";
 import Form from "../components/Contact/Form";
 import ResourcesPage from "../pages/ResourcesPage";
 import VideoInternal from "../components/VideoInternal/VideoInternal";
@@ -34,6 +34,7 @@ import Events from "../pages/Events";
 import NewsPage from "../pages/NewsPage";
 import EventsInternnal from "../pages/EventsInternnal";
 import BlogPost from "../components/BlogPost/BlogPost";
+import NewsInternal from "../pages/NewsInternal";
 
 export const route = [
   {
@@ -129,6 +130,10 @@ export const route = [
     path: "/:title_slug",
     element: <UseCases />,
   },
+  {
+    path: "news/:title_slug",
+    element: <NewsInternal />,
+  },
 
   // {
   //   path: "fin-tech",