diff --git a/content/batch/index.mdx b/content/batch/index.mdx
index 1896d0f..1e4f701 100644
--- a/content/batch/index.mdx
+++ b/content/batch/index.mdx
@@ -29,11 +29,15 @@ Select a Batch below to learn more about it.
         alt="Image"
         className="bg-white"
         />
-
-        #### Learn
-       Learn HTML, CSS, JS and Git & Github
+        <h4>Learn</h4>
+        <p>Learn HTML, CSS, JS and Git & Github</p>
+        <div className="flex-grow"></div>
+        <div className="text-center mt-4">
+          <a href="/join/learn" className="rounded-full px-4 py-2" style={{ textAlign: 'center', color: 'black', backgroundColor: 'white', borderRadius: '18px', fontSize: '16px', width: 'fit-content', margin: '0 auto', padding: '8px 16px' }}>Join</a>
+        </div>
     </Card>
-     <Card href="/batch/dsa/loops">
+
+    <Card href="/batch/dsa/loops">
         <Image
         src="/dsa_in_javascript.svg"
         width="350"
@@ -41,25 +45,31 @@ Select a Batch below to learn more about it.
         alt="Image"
         className="bg-white"
         />
-
-        #### DSA in Javascript
-       Learn data structures and algorithms in JavaScript
+        <h4>DSA in Javascript</h4>
+        <p>Learn data structures and algorithms in JavaScript</p>
+        <div className="flex-grow"></div>
+        <div className="text-center mt-4">
+          <a href="/join/dsa" className="rounded-full px-4 py-2" style={{ textAlign: 'center', color: 'black', backgroundColor: 'white', borderRadius: '18px', fontSize: '16px', width: 'fit-content', margin: '0 auto', padding: '8px 16px' }}>Join</a>
+        </div>
     </Card>
 
-    <Card href= "/batch/build/react/fundamentals">
-    <Image
+    <Card href="/batch/build/react/fundamentals">
+        <Image
         src="/build_img.svg"
         width="350"
         height="200"
         alt="Image"
         className="bg-white"
         />
-
-        #### Build
-        Master React, Redux and Next Js
+        <h4>Build</h4>
+        <p>Master React, Redux and Next Js</p>
+        <div className="flex-grow"></div>
+        <div className="text-center mt-4">
+          <a href="/join/build" className="rounded-full px-4 py-2" style={{ textAlign: 'center', color: 'black', backgroundColor: 'white', borderRadius: '18px', fontSize: '16px', width: 'fit-content', margin: '0 auto', padding: '8px 16px' }}>Join</a>
+        </div>
     </Card>
 
-     <Card href= "/batch/hire/hire">
+    <Card href="/batch/hire/hire">
         <Image
         src="/hire_img.svg"
         width="350"
@@ -67,8 +77,11 @@ Select a Batch below to learn more about it.
         alt="Image"
         className="bg-white"
         />
-
-        #### Hire
-        Get Interview Tips and Tricks
+        <h4>Hire</h4>
+        <p>Get Interview Tips and Tricks from Experts</p>
+        <div className="flex-grow"></div>
+        <div className="text-center mt-4">
+          <a href="/join/hire" className="rounded-full px-4 py-2" style={{ textAlign: 'center', color: 'black', backgroundColor: 'white', borderRadius: '18px', fontSize: '16px', width: 'fit-content', margin: 'auto', padding: '8px 16px' }}>Join</a>
+        </div>
     </Card>
 </div>