diff --git a/my_compassion/static/src/css/child_profile_timeline.css b/my_compassion/static/src/css/child_profile_timeline.css
index 7a122085..44f9732f 100644
--- a/my_compassion/static/src/css/child_profile_timeline.css
+++ b/my_compassion/static/src/css/child_profile_timeline.css
@@ -90,14 +90,15 @@
     align-items: center;
     -ms-flex-negative: 0;
     flex-shrink: 0;
-    width: 40px;
-    height: 40px;
+    width: 50px;
+    height: 50px;
+    margin-left: -5px;
     border-radius: 50%;
     box-shadow: 0 0 0 4px hsl(0, 0%, 100%), inset 0 2px 0 rgba(0, 0, 0, 0.08), 0 3px 0 4px rgba(0, 0, 0, 0.05);
 }
 .cd-timeline__img .pictogram {
-    width: 45px;
-    height: 45px;
+    width: 55px;
+    height: 55px;
 }
 @media (min-width: 64rem) {
     .cd-timeline__img {
@@ -126,6 +127,11 @@
     padding: 1.25em;
     box-shadow: 0 3px 0 hsl(205, 38%, 89%);
 }
+
+.cd-timeline__content > p.text-muted {
+    margin-bottom: 0;
+}
+
 .cd-timeline__content::before {
     content: "";
     position: absolute;
@@ -164,6 +170,11 @@
         border-left-color: hsl(0, 0%, 100%);
     }
 }
+
+.cd-timeline__date {
+    font-size: 16px;
+}
+
 @media (min-width: 64rem) {
     .cd-timeline__date {
         position: absolute;
diff --git a/my_compassion/static/src/css/my2_children_card.css b/my_compassion/static/src/css/my2_children_card.css
index 03c45a8a..01f80044 100644
--- a/my_compassion/static/src/css/my2_children_card.css
+++ b/my_compassion/static/src/css/my2_children_card.css
@@ -9,3 +9,12 @@
     object-fit: cover;
     object-position: 50% 0;
 }
+
+.children-card {
+    max-width: 400px;
+    margin: 0 auto;
+}
+
+.children-card .pending {
+    font-size: 1.2rem;
+}
diff --git a/my_compassion/static/src/css/my2_dashboard.css b/my_compassion/static/src/css/my2_dashboard.css
index b314bc06..8f753ebf 100644
--- a/my_compassion/static/src/css/my2_dashboard.css
+++ b/my_compassion/static/src/css/my2_dashboard.css
@@ -18,6 +18,7 @@
 
 .dashboard-banner h1 {
     font-family: "NeighbourSans Medium";
+    font-size: 2rem;
 }
 
 .dashboard-grid button,
@@ -25,3 +26,9 @@
     margin-top: 1.5rem;
     width: 100%;
 }
+
+@media screen and (max-width: 639px) {
+    .grid-item-container {
+        min-width: min(100%, 300px);
+    }
+}
diff --git a/my_compassion/static/src/css/my2_donation_item.css b/my_compassion/static/src/css/my2_donation_item.css
index 64ee9a5c..cc53d1a1 100644
--- a/my_compassion/static/src/css/my2_donation_item.css
+++ b/my_compassion/static/src/css/my2_donation_item.css
@@ -1,5 +1,4 @@
 .donation-item-container {
-    border-left: 5px solid;
     container-type: inline-size;
     container-name: donation-item-container;
     font-size: 18px;
@@ -16,6 +15,8 @@
 
 .donation-item-container .action-button {
     cursor: pointer;
+    position: relative;
+    z-index: 1;
 }
 
 .donation-item-container .action-button:hover span {
diff --git a/my_compassion/templates/components/my2_children_card.xml b/my_compassion/templates/components/my2_children_card.xml
index a2f9dbe4..1b39d8fb 100644
--- a/my_compassion/templates/components/my2_children_card.xml
+++ b/my_compassion/templates/components/my2_children_card.xml
@@ -20,7 +20,8 @@
         <t t-set="sponsorship_type" t-value="sponsorship_type or 'standard'" />
         <t t-set="show_status" t-value="not show_status == False" />
         <div class="children-card text-center mb-3 mt-3">
-            <div class="p-4 d-flex flex-column align-items-center bg-high-eggshell">
+            <div class="p-4 d-flex flex-column align-items-center bg-low-eggshell position-relative rounded-pill">
+                <a t-attf-href="/my2/children/{{child.id}}" class="stretched-link" aria-label="Child profile" />
                 <!-- Child Image -->
                 <img
                     class="rounded-circle img-fluid mb-2"
@@ -31,7 +32,7 @@
                 <div class="h2 mb-0">
                     <t t-esc="child.preferred_name" />
                 </div>
-                <div class="small" t-if="sponsorship and sponsorship.state in ('draft', 'waiting', 'mandate')">
+                <div class="pending" t-if="sponsorship and sponsorship.state in ('draft', 'waiting', 'mandate')">
                     <span
                         class="badge bg-low-yellow"
                         title="Your sponsorship is being confirmed and will become active soon"
diff --git a/my_compassion/templates/components/my2_donation_item.xml b/my_compassion/templates/components/my2_donation_item.xml
index c53cd7f4..274371c2 100644
--- a/my_compassion/templates/components/my2_donation_item.xml
+++ b/my_compassion/templates/components/my2_donation_item.xml
@@ -37,16 +37,25 @@
     <!-- DONATION ITEM BUTTON -->
     <template id="DonationItemButton" name="Donation Item Button">
         <t t-set="color" t-value="button.get('color') or 'dark-blue'" />
-        <t t-if="button.get('action') == 'link'" t-set="onclick" t-valuef="location.href='#{button.get('href')}'" />
+        <t
+            t-if="button.get('action') == 'link'"
+            t-set="onclick"
+            t-valuef="event.stopPropagation(); location.href='#{button.get('href')}'"
+        />
         <t
             t-elif="button.get('action') == 'event'"
             t-set="onclick"
-            t-valuef="this.dispatchEvent(new CustomEvent('#{button.get('custom_event')}', {bubbles: true, detail: #{button.get('detail')}}))"
+            t-valuef="event.stopPropagation(); this.dispatchEvent(new CustomEvent('#{button.get('custom_event')}', {bubbles: true, detail: #{button.get('detail')}}))"
         />
         <div t-attf-class="action-button #{button_top_class}" t-att-onclick="onclick">
-            <i t-if="button.get('icon')" t-attf-class="tiny-text icon-#{button.get('icon')} text-#{color}" />
-            <i t-if="button.get('pictogram')" t-attf-class="tiny-text #{button.get('pictogram')} text-#{color}" />
-            <span t-if="button.get('label')" t-attf-class="tiny-text bold text-#{color}">
+            <i
+                t-if="button.get('icon')"
+                t-attf-class="{{'' if large_icon else 'tiny-text'}} icon-#{button.get('icon')} text-#{color}"
+            />
+            <span
+                t-if="button.get('label')"
+                t-attf-class="tiny-text {{'font-italic' if large_icon else ''}} bold text-#{color}"
+            >
                 <t t-esc="button.get('label')" />
             </span>
         </div>
@@ -72,22 +81,31 @@
                 t-attf-style="--image_url: url('#{image}');"
             />
         </t>
+        <t t-set="redirect_link" t-value="redirect_link or ''" />
+        <t t-set="redirect_label" t-value="redirect_label or ''" />
+        <!-- Donation item container -->
         <div
-            t-attf-class="donation-item-container p-2 d-flex rounded-lg bg-#{bg_color} border-#{accent_color} #{top_class}"
+            t-attf-class="donation-item-container d-flex bg-#{bg_color} border-#{accent_color} #{top_class} position-relative rounded-pill padding-pill"
             t-attf-style="min-width: #{min_width}"
         >
+            <t t-if="redirect_link">
+                <a t-attf-href="{{redirect_link}}" class="stretched-link" t-attf-aria-label="{{redirect_label}}" />
+            </t>
             <div
                 t-attf-class="thumbnail responsive-lg mr-3 flex-shrink-0 rounded-lg #{not image and image_fallback_pictogram or ''}"
                 t-attf-style="--image_url: url('#{image}');"
             />
+            <!-- Donation details -->
             <t t-if="not primary_button" t-raw="small_thumbnail_content" />
             <div class="w-100 d-flex flex-column justify-content-between">
+                <!-- Donation Title -->
                 <div class="d-flex align-items-start">
                     <t t-if="primary_button" t-raw="small_thumbnail_content" />
                     <div class="flex-grow-1 d-flex flex-column">
                         <div t-attf-class="text-#{title_color} body-large bold">
                             <t t-esc="name" />
                         </div>
+                        <!-- Donation recipient -->
                         <div t-if="recipient" t-attf-class="text-#{recipient_color} body-small bold">
                             To
                             <t t-esc="recipient" />
@@ -102,11 +120,13 @@
                         </t>
                     </t>
                 </div>
+                <!-- Donation edit -->
                 <div t-attf-class="mt-2 d-flex justify-content-#{'between' if primary_button else 'end'}">
                     <t t-if="primary_button" t-call="my_compassion.DonationItemButton">
                         <t t-set="button" t-value="primary_button" />
                     </t>
-                    <div t-attf-class="text-#{price_color} ">
+                    <!-- Donation price -->
+                    <div t-attf-class="text-#{price_color} lead">
                         <t t-esc="currency_name" />
                         <t t-if="price % 1 == 0" t-set="price" t-value="'{0}.-'.format(int(price))" />
                         <t t-else="" t-set="price" t-value="'{0:.2f}'.format(price)" />
@@ -122,84 +142,59 @@
         </div>
     </template>
     <template id="SponsorshipDonationItem" name="Sponsorship Donation Item">
-        <t t-set="label_see_profile">See profile</t>
-        <t t-set="label_see_more">See more</t>
-        <t t-if="sponsorship.type == 'CSP'">
-            <t t-set="product_template" t-value="sponsorship.contract_line_ids[:1].product_id.product_tmpl_id" />
-            <t t-if="product_template">
-                <t t-set="csp_my_compassion_name" t-value="product_template.my_compassion_name" />
-                <t t-set="csp_thanks_name" t-value="product_template.thanks_name" />
-                <t t-set="csp_default_name">Compassion survival program</t>
-                <t t-set="displayed_title" t-value="csp_my_compassion_name or csp_thanks_name or csp_default_name" />
-                <t
-                    t-set="image_fallback_pictogram"
-                    t-value="product_template.my_compassion_pictogram.class_name or 'pictogram-gift-donation-general'"
-                />
-                <t t-if="product_template.is_published">
-                    <t t-set="displayed_image" t-value="website.image_url(product_template, 'my_compassion_image')" />
-                    <t
-                        t-set="primary_button_data"
-                        t-value="{
-                'label': label_see_more,
-                'pictogram': product_template.my_compassion_pictogram.class_name or 'pictogram-gift-donation-general',
-                'action': 'link',
-                'href': '/my2/gifts/' + str(product_template.id),
-                'color': 'low-blue'
-            }"
-                    />
-                </t>
-                <t
-                    t-set="secondary_buttons_data"
-                    t-value="[
-                {
-                    'icon': 'download01',
-                    'color': 'low-blue',
-                    'action': 'link',
-                    'href': '/my/download/csp_bvr?csp_id=' + str(sponsorship.id),
-                }
-            ]"
-                />
-            </t>
-        </t>
-        <t t-else="">
-            <t t-set="image_fallback_pictogram" t-value="'pictogram-child-sponsorship'" />
-            <t t-set="displayed_title" t-value="sponsorship.child_id.preferred_name" />
-            <t t-set="displayed_image" t-valuef="/web/image/compassion.child/#{sponsorship.child_id.id}/portrait" />
-            <t
-                t-set="primary_button_data"
-                t-value="{
-            'label': label_see_profile,
-            'pictogram': 'pictogram-child-sponsorship',
-            'action': 'link',
-            'href': '/my2/children/' + str(sponsorship.child_id.id),
-            'color': 'low-blue'
-        }"
-            />
+        <t t-set="is_csp" t-value="sponsorship.type == 'CSP'" />
+        <!-- is Compassion Survival Program ? -->
+        <t t-set="pt" t-value="is_csp and sponsorship.contract_line_ids[:1].product_id.product_tmpl_id" />
+        <!-- product template -->
+        <t
+            t-set="name"
+            t-value="pt.my_compassion_name or pt.thanks_name or 'Compassion survival program' if is_csp else sponsorship.child_id.preferred_name"
+        />
+        <t
+            t-set="image"
+            t-value="website.image_url(pt, 'my_compassion_image') if is_csp else '/web/image/compassion.child/%s/portrait' % sponsorship.child_id.id"
+        />
+        <t
+            t-set="pictogram"
+            t-value="(pt.my_compassion_pictogram.class_name or 'pictogram-gift-donation-general') if is_csp else 'pictogram-child-sponsorship'"
+        />
+        <t t-set="href" t-value="'/my2/gifts/%s' % pt.id if is_csp else '/my2/children/%s' % sponsorship.child_id.id" />
+        <!-- donations page or child profile page -->
+        <t t-call="my_compassion.DonationItemComponent">
+            <t t-set="image_fallback_pictogram" t-value="pictogram" />
+            <t t-set="name" t-value="name" />
+            <t t-set="image" t-value="image if not is_csp else ''" />
+            <t t-set="subtext" t-value="sponsorship.payment_mode_id.display_name" />
+            <t t-set="price" t-value="sponsorship.total_amount" />
             <t
-                t-set="secondary_buttons_data"
-                t-value="[
-            {
+                t-set="secondary_buttons"
+                t-value="[{
                 'icon': 'download01',
                 'color': 'low-blue',
                 'action': 'link',
-                'href': '/my/download/gift_bvr?child_id=' + str(sponsorship.child_id.id),
-            }
-        ]"
+                'href': ('/my/download/csp_bvr?csp_id=%s' % sponsorship.id) if is_csp else ('/my/download/gift_bvr?child_id=%s' % sponsorship.child_id.id),
+            }]"
             />
-        </t>
-        <t t-call="my_compassion.DonationItemComponent">
-            <t t-set="image_fallback_pictogram" t-value="image_fallback_pictogram" />
-            <t t-set="name" t-value="displayed_title" />
-            <t t-set="image" t-value="displayed_image" />
-            <t t-set="subtext" t-value="sponsorship.payment_mode_id.display_name" />
-            <t t-set="price" t-value="sponsorship.total_amount" />
-            <t t-set="primary_button" t-value="primary_button_data" />
-            <t t-set="secondary_buttons" t-value="secondary_buttons_data" />
             <t t-set="monthly_noabbr" t-value="True" />
             <t t-set="bg_color" t-value="'light-blue'" />
             <t t-set="accent_color" t-value="'low-blue'" />
             <t t-set="title_color" t-value="'low-blue'" />
             <t t-set="price_color" t-value="'low-blue'" />
+            <t t-set="large_icon" t-value="True" />
+            <t t-if="not is_csp">
+                <t
+                    t-set="primary_button"
+                    t-value="{
+                'label': 'Click to see profile',
+                'pictogram': pictogram,
+                'action': 'link',
+                'href': href,
+                'color': 'low-blue'
+                }"
+                />
+                <t t-set="redirect_link" t-value="href" />
+                <t t-set="redirect_label" t-value="'See child profile'" />
+            </t>
         </t>
     </template>
 </odoo>
diff --git a/my_compassion/templates/components/my2_letter_card.xml b/my_compassion/templates/components/my2_letter_card.xml
index 13d8bb59..2efd88d1 100644
--- a/my_compassion/templates/components/my2_letter_card.xml
+++ b/my_compassion/templates/components/my2_letter_card.xml
@@ -13,7 +13,9 @@
     <template id="my2_letter_card_component" name="Letter Card Component">
         <t t-set="child" t-value="letter.child_id" />
         <link rel="stylesheet" href="/my_compassion/static/src/css/letter_card.css" />
-        <div class="position-relative d-flex shadow-sm rounded-4 h-100">
+        <div
+            t-attf-class="position-relative d-flex shadow rounded-4 h-100 {{'bg-high-green' if letter.direction == 'Supporter To Beneficiary' else 'bg-high-blue'}}"
+        >
             <!-- Icon at the left -->
             <div>
                 <div
@@ -52,9 +54,7 @@
             <div class="flex-grow-1 d-flex flex-column ml-2 mr-2 mb-2 mt-4">
                 <!-- Top row: Title (left) and Dropdown (right) -->
                 <div class="d-flex justify-content-between align-items-start mb-4">
-                    <div
-                        t-attf-class="h5 #{'text-core-blue' if letter.direction != 'Supporter To Beneficiary' else ''}"
-                    >
+                    <div t-attf-class="h5 #{'text-off-black'}">
                         <t t-if="letter.direction != 'Supporter To Beneficiary'">
                             <span>From</span>
                             <t t-esc="child.preferred_name" />
@@ -67,7 +67,7 @@
                     <!-- Dots button & dropdown menu -->
                     <div class="dropdown">
                         <button
-                            class="btn btn-link p-0 border-0"
+                            t-attf-class="btn btn-link p-0 border-0 {{'text-low-blue' if letter.direction != 'Supporter To Beneficiary' else 'text-low-green'}}"
                             type="button"
                             t-att-id="'dropdownMenuButton' + str(letter.id)"
                             data-toggle="dropdown"
@@ -121,7 +121,7 @@
                     </div>
                 </div>
                 <!-- Letter date -->
-                <div class="mt-auto align-self-end tiny-text text-mid-grey">
+                <div class="mt-auto align-self-end tiny-text text-low-grey">
                     <span t-field="letter.create_date" t-options='{"widget": "date","format": "dd MMM. yyyy"}' />
                 </div>
             </div>
diff --git a/my_compassion/templates/components/my2_sponsor_child_timeline_batch.xml b/my_compassion/templates/components/my2_sponsor_child_timeline_batch.xml
index d106498e..dd55aafa 100644
--- a/my_compassion/templates/components/my2_sponsor_child_timeline_batch.xml
+++ b/my_compassion/templates/components/my2_sponsor_child_timeline_batch.xml
@@ -51,7 +51,7 @@
                             </p>
                         </t>
                         <div class="flex justify-between items-center">
-                            <span class="cd-timeline__date">
+                            <span class="cd-timeline__date text-dark-blue">
                                 <t t-esc="item['event_date']" t-options='{"widget": "date"}' />
                             </span>
                         </div>
@@ -86,7 +86,7 @@
                             </p>
                         </t>
                         <div class="flex justify-between items-center">
-                            <span class="cd-timeline__date">
+                            <span class="cd-timeline__date text-dark-blue">
                                 <t t-esc="item['event_date']" t-options='{"widget": "date"}' />
                             </span>
                         </div>
@@ -111,7 +111,7 @@
                             <t t-esc="item['title']" />
                         </p>
                         <div class="flex justify-between items-center">
-                            <span class="cd-timeline__date">
+                            <span class="cd-timeline__date text-dark-blue">
                                 <t t-esc="item['event_date']" t-options='{"widget": "date"}' />
                             </span>
                         </div>
@@ -128,7 +128,7 @@
                             <t t-esc="item['title']" />
                         </p>
                         <div class="flex justify-between items-center">
-                            <span class="cd-timeline__date">
+                            <span class="cd-timeline__date text-dark-blue">
                                 <t t-esc="item['event_date']" t-options='{"widget": "date"}' />
                             </span>
                         </div>
@@ -145,7 +145,7 @@
                             <t t-esc="item['title']" />
                         </p>
                         <div class="flex justify-between items-center">
-                            <span class="cd-timeline__date">
+                            <span class="cd-timeline__date text-dark-blue">
                                 <t t-esc="item['event_date']" t-options='{"widget": "date"}' />
                             </span>
                         </div>
diff --git a/my_compassion/templates/pages/my2_child_letters.xml b/my_compassion/templates/pages/my2_child_letters.xml
index bc3d6143..4a7c81c4 100644
--- a/my_compassion/templates/pages/my2_child_letters.xml
+++ b/my_compassion/templates/pages/my2_child_letters.xml
@@ -267,7 +267,7 @@
                 <!-- Letters -->
                 <t t-if="letters">
                     <div class="container-content d-flex flex-column align-items-center mt-4">
-                        <div class="w-100 d-flex flex-column">
+                        <div class="w-100 d-flex flex-column p-4">
                             <div class="row justify-content-center">
                                 <t t-foreach="letters" t-as="letter" t-foreach-index="i">
                                     <div
@@ -331,9 +331,7 @@
                             <t t-set="variant" t-value="'default'" />
                             <t t-set="variation" t-value="'filled'" />
                             <t t-set="label">Write a letter to a child</t>
-                            <t t-set="icon" t-value="'pictogram-letter-writing'" />
                             <t t-set="color" t-value="'core-blue'" />
-                            <t t-set="icon_color" t-value="'low-yellow'" />
                             <t t-set="text_color" t-value="'pure-white'" />
                             <t t-set="href" t-value="'/my2/children/letters/new'" />
                         </t>
diff --git a/my_compassion/templates/pages/my2_children.xml b/my_compassion/templates/pages/my2_children.xml
index 6efa201e..8e8c43a6 100644
--- a/my_compassion/templates/pages/my2_children.xml
+++ b/my_compassion/templates/pages/my2_children.xml
@@ -29,7 +29,7 @@ Page: My Compassion 2 Children Page
                 <!-- ACTIVE SPONSORSHIPS CHILDREN-->
                 <div class="container-content d-flex flex-column align-items-center mt-4 mb-5">
                     <div class="w-100 d-flex flex-column">
-                        <div class="row justify-content-center align-items-stretch">
+                        <div class="row justify-content-center align-items-stretch p-0 p-sm-3">
                             <t t-foreach="active_sponsorships" t-as="sponsorship">
                                 <div class="col-12 col-md-6 col-lg-4 mb-3">
                                     <t t-call="my_compassion.my2_children_card_component">
diff --git a/my_compassion/templates/pages/my2_dashboard.xml b/my_compassion/templates/pages/my2_dashboard.xml
index 7405e1ae..a7c37799 100644
--- a/my_compassion/templates/pages/my2_dashboard.xml
+++ b/my_compassion/templates/pages/my2_dashboard.xml
@@ -16,7 +16,7 @@ Page: My Compassion 2 Dashboard Page
 <odoo>
     <!-- DASHBOARD GRID ITEM -->
     <template id="DashboardGridItem" name="Dashboard grid item">
-        <div class="col-sm my-3 flex-grow-0">
+        <div class="col-sm my-3 flex-grow-0 grid-item-container">
             <t t-raw="0" />
         </div>
     </template>
@@ -86,10 +86,8 @@ Page: My Compassion 2 Dashboard Page
                         <t t-set="variant" t-value="'default'" />
                         <t t-set="variation" t-value="'hollow'" />
                         <t t-set="label">A new letter has arrived!</t>
-                        <t t-set="icon" t-value="'pictogram-child-focused'" />
-                        <t t-set="color" t-value="'low-green'" />
-                        <t t-set="icon_color" t-value="'low-green'" />
-                        <t t-set="text_color" t-value="'low-green'" />
+                        <t t-set="color" t-value="'low-blue'" />
+                        <t t-set="text_color" t-value="'low-blue'" />
                         <t
                             t-set="href"
                             t-value="'/my2/children/letters?year_to=2025&amp;month_from=1&amp;month_to=12&amp;sort=newest&amp;unread=true&amp;page=1'"
@@ -101,9 +99,7 @@ Page: My Compassion 2 Dashboard Page
                         <t t-set="variant" t-value="'default'" />
                         <t t-set="variation" t-value="'filled'" />
                         <t t-set="label">Write to Your sponsored child</t>
-                        <t t-set="icon" t-value="'pictogram-letter-writing'" />
                         <t t-set="color" t-value="'core-blue'" />
-                        <t t-set="icon_color" t-value="'low-yellow'" />
                         <t t-set="text_color" t-value="'pure-white'" />
                         <t t-set="href" t-value="'/my2/children/letters/new'" />
                     </t>
@@ -115,9 +111,7 @@ Page: My Compassion 2 Dashboard Page
                     <t t-set="variant" t-value="'default'" />
                     <t t-set="variation" t-value="'filled'" />
                     <t t-set="label">See my terminated sponsorships</t>
-                    <t t-set="icon" t-value="'pictogram-child-focused'" />
                     <t t-set="color" t-value="'core-blue'" />
-                    <t t-set="icon_color" t-value="'low-yellow'" />
                     <t t-set="text_color" t-value="'pure-white'" />
                     <t t-set="href" t-value="'/my2/children'" />
                 </t>
@@ -140,9 +134,7 @@ Page: My Compassion 2 Dashboard Page
                     <t t-set="variant" t-value="'default'" />
                     <t t-set="variation" t-value="'filled'" />
                     <t t-set="label">My donations</t>
-                    <t t-set="icon" t-value="'pictogram-letter-writing'" />
                     <t t-set="color" t-value="'mid-brown'" />
-                    <t t-set="icon_color" t-value="'pure-white'" />
                     <t t-set="text_color" t-value="'pure-white'" />
                     <t t-set="href" t-value="'/my2/donations'" />
                 </t>
@@ -166,9 +158,7 @@ Page: My Compassion 2 Dashboard Page
                     <t t-set="variant" t-value="'default'" />
                     <t t-set="variation" t-value="'filled'" />
                     <t t-set="label">Translate a letter</t>
-                    <t t-set="icon" t-value="'pictogram-letter-writing'" />
                     <t t-set="color" t-value="'mid-green'" />
-                    <t t-set="icon_color" t-value="'low-green'" />
                     <t t-set="text_color" t-value="'pure-white'" />
                     <t t-set="href" t-value="'https://translate.compassion.ch'" />
                 </t>
diff --git a/my_compassion/templates/pages/my2_donation_details.xml b/my_compassion/templates/pages/my2_donation_details.xml
index b7bff7a4..1b905961 100644
--- a/my_compassion/templates/pages/my2_donation_details.xml
+++ b/my_compassion/templates/pages/my2_donation_details.xml
@@ -48,7 +48,7 @@
                                 <div class="mt-3 ml-4 body-standard text-mid-brown">The reality...</div>
                                 <t t-foreach="product.my_compassion_impact_before_ids" t-as="line">
                                     <div class="mt-2 d-flex">
-                                        <i class="mr-2 icon-alert-circle text-mid-brown flex-shrink-0" />
+                                        <i class="mr-2 icon-alert-circle text-mid-brown flex-shrink-0 mt-1" />
                                         <t t-esc="line.description" />
                                     </div>
                                 </t>
@@ -58,7 +58,7 @@
                                 <div class="mt-3 ml-4 body-standard text-mid-green">With your help we can...</div>
                                 <t t-foreach="product.my_compassion_impact_after_ids" t-as="line">
                                     <div class="mt-2 d-flex">
-                                        <i class="mr-2 icon-check-heart text-mid-green flex-shrink-0" />
+                                        <i class="mr-2 icon-check-heart text-mid-green flex-shrink-0 mt-1" />
                                         <t t-esc="line.description" />
                                     </div>
                                 </t>
diff --git a/my_compassion/templates/pages/my2_gift_package.xml b/my_compassion/templates/pages/my2_gift_package.xml
index bdcdc342..67dbbd45 100644
--- a/my_compassion/templates/pages/my2_gift_package.xml
+++ b/my_compassion/templates/pages/my2_gift_package.xml
@@ -29,9 +29,9 @@
                 <t t-if="line.is_gift" t-set="recipient" t-value="line.gift_recipient_id.preferred_name" />
                 <t t-set="title_color" t-value="'low-black'" />
                 <t t-set="accent_color" t-value="'mid-green'" />
-                <t t-set="price_color" t-value="'low-green'" />
-                <t t-set="recipient_color" t-value="'low-green'" />
-                <t t-set="bg_color" t-value="'mid-eggshell'" />
+                <t t-set="price_color" t-value="'mid-green'" />
+                <t t-set="recipient_color" t-value="'mid-green'" />
+                <t t-set="bg_color" t-value="'low-eggshell'" />
                 <t t-set="price" t-value="line.price_total" />
                 <t t-set="currency_name" t-value="line.currency_id.name" />
                 <t
@@ -41,7 +41,7 @@
                 <t t-set="_txt_Edit_Details_1">Edit Details</t>
                 <t
                     t-set="primary_button"
-                    t-value="{'icon': 'edit05', 'label': _txt_Edit_Details_1, 'color': 'low-green', 'action': 'event', 'custom_event': 'donation-item:edit', 'detail': {'order_line_id': line.id}}"
+                    t-value="{'icon': 'edit05', 'label': _txt_Edit_Details_1, 'color': 'mid-green', 'action': 'event', 'custom_event': 'donation-item:edit', 'detail': {'order_line_id': line.id}}"
                 />
                 <t
                     t-set="secondary_buttons"
@@ -107,10 +107,10 @@
         <!-- TOTAL AMOUNT -->
         <div
             t-if="len(order.order_line) &gt;= 1"
-            class="mt-5 px-3 pt-3 pb-2 w-100 rounded-lg bg-light-green d-flex justify-content-between"
+            class="mt-5 w-100 bg-light-green d-flex justify-content-between rounded-pill padding-pill"
         >
-            <div class="text-mid-green body-large bold">Total amount</div>
-            <div class="text-dark-blue body-large bold">
+            <div class="text-off-black body-large bold">Total amount</div>
+            <div class="text-off-black body-large bold d-flex align-items-center m-0">
                 <t t-set="amount" t-value="order.amount_total" />
                 <t t-esc="order.currency_id.name" />
                 <t t-if="amount % 1 == 0" t-esc="int(amount)" />
diff --git a/theme_compassion_2025/static/src/scss/base/_borders.scss b/theme_compassion_2025/static/src/scss/base/_borders.scss
index 222bab2c..12751ac9 100644
--- a/theme_compassion_2025/static/src/scss/base/_borders.scss
+++ b/theme_compassion_2025/static/src/scss/base/_borders.scss
@@ -31,3 +31,11 @@
 .rounded-5 {
   border-radius: 1rem !important;
 }
+
+.rounded-pill {
+  border-radius: 25px !important;
+}
+
+.padding-pill {
+  padding: 10px 15px !important;
+}
diff --git a/theme_compassion_2025/templates/components/Vignette.xml b/theme_compassion_2025/templates/components/Vignette.xml
index 7dc63abc..423f7075 100644
--- a/theme_compassion_2025/templates/components/Vignette.xml
+++ b/theme_compassion_2025/templates/components/Vignette.xml
@@ -32,7 +32,7 @@
                         t-attf-class="card-body h-25 py-2 flex-grow-0 d-flex bg-#{bg_color} #{learn_more_text and 'rounded-0' or ''}"
                     >
                         <div t-attf-class="d-flex flex-column justify-content-center flex-grow-1">
-                            <div class="pl-3">
+                            <div class="pl-0 pl-sm-3">
                                 <h3 t-attf-class="card-title m-0 text-#{color}">
                                     <t t-raw="title" />
                                 </h3>
diff --git a/theme_compassion_2025/templates/components/buttons/ThemedButton.xml b/theme_compassion_2025/templates/components/buttons/ThemedButton.xml
index fbe7a4a5..707e10d5 100644
--- a/theme_compassion_2025/templates/components/buttons/ThemedButton.xml
+++ b/theme_compassion_2025/templates/components/buttons/ThemedButton.xml
@@ -36,7 +36,9 @@
 <odoo>
     <template id="ThemedButtonComponent_Content" name="Button Content">
         <t t-if="icon">
-            <span t-attf-class="btn__icon #{'btn__icon--' + variant if label else ''} text-#{icon_color}">
+            <span
+                t-attf-class="btn__icon #{'btn__icon--' + variant if label else ''} text-#{icon_color} d-flex align-items-center justify-content-center"
+            >
                 <i t-att-class="icon" />
             </span>
         </t>
diff --git a/theme_compassion_2025/views/footer.xml b/theme_compassion_2025/views/footer.xml
index 122418f8..e21641e7 100644
--- a/theme_compassion_2025/views/footer.xml
+++ b/theme_compassion_2025/views/footer.xml
@@ -19,7 +19,7 @@
                                 class="col-12 d-flex flex-column flex-lg-row justify-content-center align-items-center"
                             >
                                 <div
-                                    class="py-1 px-lg-4 d-flex flex-column flex-lg-row align-items-center align-items-lg-start justify-content-center"
+                                    class="py-1 px-lg-4 d-flex flex-column flex-lg-row align-items-center justify-content-center"
                                 >
                                     <div class="mb-1 mb-lg-0 mr-lg-2" style="font-size: 1.2rem;">
                                         <i class="icon-marker-pin01 bg-low-yellow text-primary" />