diff --git a/challenges/chat_app_css_illustration/index.html b/challenges/chat_app_css_illustration/index.html
index a0035eb1..5adbd9a2 100644
--- a/challenges/chat_app_css_illustration/index.html
+++ b/challenges/chat_app_css_illustration/index.html
@@ -39,17 +39,17 @@
       class="flex flex-col items-center justify-center overflow-hidden py-4 lg:h-screen lg:flex-row"
     >
       <div
-        class="from-light-violet to-light-magenta relative -top-10 right-40 h-[630px] w-72 rounded-b-full bg-gradient-to-t lg:-top-28 lg:right-96 lg:h-[900px] lg:w-[550px]"
+        class="from-light-violet to-light-magenta relative -top-10 right-40 h-[630px] w-72 rounded-b-full bg-gradient-to-t lg:-top-28 lg:right-80 lg:h-[800px] lg:w-[450px]"
       ></div>
       <div
-        class="bg-light-grayish-violet relative left-40 top-0 h-[550px] w-72 rounded-t-full lg:left-[300px] lg:top-28 lg:h-[750px] lg:w-[500px]"
+        class="bg-light-grayish-violet relative left-40 top-0 h-[550px] w-72 rounded-t-full lg:left-[290px] lg:top-28 lg:h-[750px] lg:w-[500px]"
       ></div>
 
       <div
         class="absolute flex flex-col items-center justify-center lg:flex-row"
       >
         <div
-          class="drop-shadow-light-violet w-[250px] rounded-3xl bg-white p-2 drop-shadow-2xl"
+          class="drop-shadow-light-violet w-[255px] rounded-3xl bg-white p-2 drop-shadow-2xl"
         >
           <div
             class="bg-light-grayish-violet drop-shadow-pale-violet flex w-full flex-col justify-center rounded-2xl"
@@ -65,7 +65,7 @@
             <div
               class="from-light-violet to-light-magenta flex w-full items-center rounded-t-3xl bg-gradient-to-r py-2"
             >
-              <div class="mt-3 flex w-full items-center pl-2">
+              <div class="flex w-full items-center pl-2 pt-4">
                 <svg
                   xmlns="http://www.w3.org/2000/svg"
                   fill="none"
@@ -99,60 +99,62 @@
                   alt="Samuel Green's Avatar"
                   class="mx-1 h-8 w-8 rounded-full border-2"
                 />
-                <div class="py-2">
+                <div class="">
                   <h2 class="text-xs font-extrabold text-white">
                     Samuel Green
                   </h2>
-                  <span class="text-pale-violet text-[0.5rem]"
-                    >Available to Walk</span
-                  >
+                  <p class="text-pale-violet text-[0.5rem]">
+                    Available to Walk
+                  </p>
                 </div>
               </div>
             </div>
-            <div class="text-moderate-violet p-2 text-xs font-extralight">
+            <div class="text-moderate-violet px-2 text-xs font-extralight">
               <p
-                class="w-32 rounded-lg rounded-bl-sm bg-gray-200 p-2 text-[0.5rem]"
+                class="my-2 w-32 rounded-lg rounded-bl-sm bg-gray-200 px-2 text-[0.5rem]"
               >
-                That sounds great. I’d be happy with that.
+                That sounds great. I’d be happy to discuss more.
               </p>
               <p
-                class="mt-2 w-32 rounded-lg rounded-bl-sm bg-gray-200 p-2 text-[0.5rem]"
+                class="w-32 rounded-lg rounded-bl-sm bg-gray-200 p-1 text-[0.5rem]"
               >
                 Could you send over some pictures of your dog, please?
               </p>
             </div>
-            <div class="flex justify-end gap-2 px-2">
-              <img
-                src="images/dog-image-1.jpg"
-                alt="dog's image 1"
-                class="h-12 w-12 rounded-xl"
-              />
-              <img
-                src="images/dog-image-2.jpg"
-                alt="dog's image 2"
-                class="h-12 w-12 rounded-xl"
-              />
-              <img
-                src="images/dog-image-3.jpg"
-                alt="dog's image 3"
-                class="h-12 w-12 rounded-xl"
-              />
-            </div>
-            <div
-              class="text-very-dark-desaturated-violet flex flex-col items-end px-2 pb-2 text-xs font-extralight"
-            >
-              <p
-                class="mt-2 w-36 rounded-lg rounded-br-sm bg-gray-50 p-1 text-[0.5rem]"
-              >
-                Here are a few pictures. She’s a happy girl!
-              </p>
-              <p
-                class="mt-2 w-24 rounded-lg rounded-br-sm bg-gray-50 px-1 py-2 text-[0.5rem]"
+            <div class="mt-4 flex flex-col items-end">
+              <div class="flex gap-2 pr-2">
+                <img
+                  src="images/dog-image-1.jpg"
+                  alt="dog's image 1"
+                  class="h-11 w-11 rounded-xl"
+                />
+                <img
+                  src="images/dog-image-2.jpg"
+                  alt="dog's image 2"
+                  class="h-11 w-11 rounded-xl"
+                />
+                <img
+                  src="images/dog-image-3.jpg"
+                  alt="dog's image 3"
+                  class="h-11 w-11 rounded-xl"
+                />
+              </div>
+              <div
+                class="text-very-dark-desaturated-violet flex flex-col items-end px-2 pb-2 text-xs font-extralight"
               >
-                Can you make it?
-              </p>
+                <p
+                  class="mt-2 w-36 rounded-lg rounded-br-sm bg-gray-50 px-1 py-1 text-[0.5rem]"
+                >
+                  Here are a few pictures. She’s a happy girl!
+                </p>
+                <p
+                  class="mt-2 w-24 rounded-lg rounded-br-sm bg-gray-50 px-1 py-1 text-[0.5rem]"
+                >
+                  Can you make it?
+                </p>
+              </div>
             </div>
-            <div class="px-2 py-2 text-xs font-extralight">
+            <div class="px-2 text-xs font-extralight">
               <p
                 class="text-moderate-violet w-32 rounded-lg rounded-bl-sm bg-gray-200 p-1 text-[0.5rem]"
               >
@@ -212,12 +214,12 @@ <h4 class="px-2 text-sm font-extrabold text-white">$49</h4>
           </div>
         </div>
         <div
-          class="mt-12 flex flex-col px-6 py-2 pb-12 text-center lg:w-[570px] lg:px-20 lg:text-left"
+          class="mt-12 flex flex-col px-6 py-2 text-center lg:w-[570px] lg:px-28 lg:pr-24 lg:text-left"
         >
-          <h1 class="text-very-dark-desaturated-violet py-2 text-4xl font-bold">
+          <h1 class="text-very-dark-desaturated-violet text-2xl font-semibold">
             Simple booking
           </h1>
-          <p class="text-dark-grayish-violet text-m pt-6 leading-relaxed">
+          <p class="text-dark-grayish-violet py-4 text-xs leading-relaxed">
             Stay in touch with our dog walkers through the chat interface. This
             makes it easy to discuss arrangements and make bookings. Once the
             walk has been completed you can rate your walker and book again all