diff --git a/react-ystemandchess/src/features/about-us/benefit-of-math-tut/MathTutBenefitPage.scss b/react-ystemandchess/src/features/about-us/benefit-of-math-tut/MathTutBenefitPage.scss
index 3382e7d5..ddb468c5 100644
--- a/react-ystemandchess/src/features/about-us/benefit-of-math-tut/MathTutBenefitPage.scss
+++ b/react-ystemandchess/src/features/about-us/benefit-of-math-tut/MathTutBenefitPage.scss
@@ -35,7 +35,9 @@ body {
 }
 
 #main-content-math {
-  padding: 24px 0 32px 0;
+  background-color: $brand-color-primary;
+  padding: 0;
+  min-height: 100vh;
 }
 
 .text-title-md-math {
@@ -47,6 +49,15 @@ body {
   margin-bottom: 10px;
 }
 
+// ...existing code...
+
+.pictureMath {
+  object-fit: contain;
+  width: max(100%, 300px);
+  height: 450px;
+}
+// ...existing code...
+
 .picture-math,
 .picture {
   width: 90%;
@@ -58,6 +69,9 @@ body {
   object-fit: cover;
 }
 
+
+
+
 .text-caption-math,
 .text-caption {
   color: $caption-color;
@@ -75,6 +89,7 @@ body {
   line-height: 1.7;
   color: $text-color;
   text-align: justify;
+  text-indent: 2em; // Add a tab space at the beginning, like MLA format
 }
 
 .rectdiv2-math {
@@ -82,24 +97,17 @@ body {
   display: flex;
   justify-content: center;
   align-items: center;
-  height: 160px; // Reduce height to fit content
-  //margin: 20px auto; // Center-align the quote section
-  //padding: 10px;
-  //max-width: 800px;
+  height: auto;
+  min-height: 160px;
+  padding: 20px 0;
+  width: 100%;
 }
 
 .recttext-math {
-  // font-size: 1.6rem;
-  // font-weight: 500;
-  // color: $highlight-color;
-  // text-align: center;
-  // line-height: 1.4;
-  // width: 80%;
-
-  max-width: 500px; // Limit the width of the paragraph
-  margin: 0 auto 15px; // Center align with auto margins
+  max-width: 800px; // Limit the width of the paragraph
+  margin: 0 auto; // Center align with auto margins
   padding: 0 20px; // Add padding to avoid edges
-  font-size: 1.20rem;
+  font-size: 1.50rem;
   line-height: 1.7;
   color: $text-color;
   text-align: center;
@@ -115,11 +123,6 @@ footer {
   border-top: 1px solid #ddd;
 }
 
-.picture-math{
-  object-fit: contain;
-    width: max(100%, 300px);
-    height: 450px;
-}
 
 
 footer p {
diff --git a/react-ystemandchess/src/features/about-us/benefit-of-math-tut/MathTutBenefitPage.tsx b/react-ystemandchess/src/features/about-us/benefit-of-math-tut/MathTutBenefitPage.tsx
index 7d09093b..7f27d30e 100644
--- a/react-ystemandchess/src/features/about-us/benefit-of-math-tut/MathTutBenefitPage.tsx
+++ b/react-ystemandchess/src/features/about-us/benefit-of-math-tut/MathTutBenefitPage.tsx
@@ -6,7 +6,7 @@ import ImageTwo from "../../../assets/images/mathArticle/Junechamp 2.png";
 const MathTutBenefitPage = () => {
   return (
     <main id="main-content-math" role="main">
-      <section className="container-math" role="section" aria-label="Main math benefit section" tabIndex={0}>
+      <section className="container-math" role="region" aria-label="Main math benefit section" tabIndex={0}>
         <div className="text-title-md-math txt-p">
           <h1 style={{ fontWeight: "bold" }}>The Benefits of Math Tutoring</h1>
         </div>
@@ -20,7 +20,7 @@ const MathTutBenefitPage = () => {
           <figcaption className="text-caption-math txt-p">
             Students practicing their chess skills in the classroom
           </figcaption>
-        </figure>
+        </figure> 
 
         <div className="text-normal-math txt-p">
           <p>
@@ -60,7 +60,7 @@ const MathTutBenefitPage = () => {
           </p>
         </div>
       </section>
-      <section className="container rectdiv2-math" role="region" aria-label="Quote section" tabIndex={0}>
+      <section className="rectdiv2-math" role="region" aria-label="Quote section" tabIndex={0}>
         <div className="rectdiv2-wrapper">
           <p className="recttext-math">
             "This help give students confidence in their own abilities, and it
@@ -68,7 +68,7 @@ const MathTutBenefitPage = () => {
           </p>
         </div>
       </section>
-      <section className="container" role="region" aria-label="Math tutoring benefit details section" tabIndex={0}>
+      <section className="container-math" role="region" aria-label="Math tutoring benefit details section" tabIndex={0}>
         <div className="text-normal-math txt-p">
           <p>
             Math also builds up useful skills such as problem solving, logical