diff --git a/src/components/home/TestimonialsSection.tsx b/src/components/home/TestimonialsSection.tsx
index 431e60a33..79fe372ef 100644
--- a/src/components/home/TestimonialsSection.tsx
+++ b/src/components/home/TestimonialsSection.tsx
@@ -20,23 +20,24 @@ interface TestimonialsSectionProps {
   textComponent?: ReactNode;
 }
 
-const AvatarAndText = ({ testimonial,textColor }: TestimonialProps): JSX.Element => (
+const AvatarAndText = ({ testimonial, textColor }: TestimonialProps): JSX.Element => (
   <div className="flex flex-row items-center gap-3">
     <div className="flex h-10 w-10 rounded-full">
       <Image src={testimonial.testimonialImage} width={40} height={40} alt="FixThePhoto Avatar" />
     </div>
     <div className="flex flex-col">
-      <p className={`text-xl font-semibold ${textColor}`}>
-      {testimonial.testimonialName}
-    </p>
-    <p className={`text-lg ${textColor}`}>
-      {testimonial.company}
-    </p>
+      <p className={`text-xl font-semibold ${textColor}`}>{testimonial.testimonialName}</p>
+      <p className={`text-lg ${textColor}`}>{testimonial.company}</p>
     </div>
   </div>
 );
 
-const TestimonialsSection = ({ textContent, bgColor,textComponent,textColor }: TestimonialsSectionProps): JSX.Element => {
+const TestimonialsSection = ({
+  textContent,
+  bgColor,
+  textComponent,
+  textColor,
+}: TestimonialsSectionProps): JSX.Element => {
   const testimonials = [
     {
       review: textContent.cards[0].review,
@@ -59,22 +60,18 @@ const TestimonialsSection = ({ textContent, bgColor,textComponent,textColor }: T
   ];
 
   return (
-    <section className={`overflow-hidden ${bgColor ?? 'bg-white'} py-20 px-5 lg:px-16`}>
-      <div className="flex flex-col items-center gap-20">
+    <section className={`overflow-hidden ${bgColor ?? 'bg-white'} px-5 py-20 lg:px-16`}>
+      <div className="flex flex-col items-center gap-20 text-white">
         <div className="flex max-w-5xl">
-          { textComponent}
-          <p className="text-center text-4xl font-semibold !leading-tight sm:text-5xl">
-            {textContent.title.normal} <span className="text-primary">{textContent.title.blue}</span>
-          </p>
+          {textComponent}
+          <p className="text-center text-4xl font-semibold !leading-tight sm:text-5xl">{textContent.title}</p>
         </div>
         <div className="flex w-full flex-row  flex-wrap justify-center gap-12">
           {testimonials.map((testimonial) => (
             <div className="flex max-w-[375px] flex-col justify-between gap-3" key={testimonial.review}>
               <div className="flex flex-col gap-3">
                 <FiveStars totalStars={5} />
-                <p className={`text-xl ${textColor ? textColor : 'text-gray-80'}`}>
-                  {testimonial.review}
-                </p>
+                <p className={`text-xl ${textColor ? textColor : 'text-gray-80'}`}>{testimonial.review}</p>
               </div>
               <AvatarAndText testimonial={testimonial} textColor={textColor} />
             </div>