diff --git a/lib/web/templates/email/participation/card/_metadata.html.heex b/lib/web/templates/email/participation/card/_metadata.html.heex
index 63e6b03d7..05316b591 100644
--- a/lib/web/templates/email/participation/card/_metadata.html.heex
+++ b/lib/web/templates/email/participation/card/_metadata.html.heex
@@ -9,7 +9,7 @@
   </thead>
   <tbody style="vertical-align: baseline; margin: 0; padding: 0; border: 0;">
     <tr style="vertical-align: baseline; margin: 0; padding: 0; border: 0;" align="left">
-      <td style="word-wrap: break-word; border-collapse: collapse; color: rgb(10,10,10); font-family: Helvetica,Arial,sans-serif; font-weight: normal; line-height: 1.3; font-size: 16px; margin: 0; padding: 16px 0; border: 0;" valign="middle" align="left">
+      <td style="word-wrap: break-word; border-collapse: collapse; color: rgb(10,10,10); font-family: Helvetica,Arial,sans-serif; font-weight: normal; line-height: 1.3; font-size: 16px; margin: 0; padding: 16px 0 10px; border: 0;" valign="middle" align="left">
         <div style="vertical-align: baseline; margin: 0 0 0 10px; padding: 0; border: 0;">
           <div class="event__content_info" style="vertical-align: baseline; display: inline-block; margin: 0; padding: 0; border: 0;">
             <table style="border-spacing: 0; border-collapse: collapse; vertical-align: baseline; text-align: left; margin: 0; padding: 0; border: 0;">
diff --git a/lib/web/templates/email/participation/event_card.html.heex b/lib/web/templates/email/participation/event_card.html.heex
index f799cf3a3..eb2ccb29b 100644
--- a/lib/web/templates/email/participation/event_card.html.heex
+++ b/lib/web/templates/email/participation/event_card.html.heex
@@ -11,12 +11,12 @@
     <table class="button btn-attend event__content_position" style="border-spacing: 0; border-collapse: collapse; vertical-align: baseline; text-align: left; width: auto; margin: 0; padding: 0; border: 0;">
       <tbody style="vertical-align: baseline; margin: 0; padding: 0; border: 0;">
         <tr style="vertical-align: baseline; margin: 0; padding: 0; border: 0;" align="left">
-          <td style="word-wrap: break-word; border-collapse: collapse; color: rgb(10,10,10); font-family: Helvetica,Arial,sans-serif; font-weight: normal; line-height: 1.3; font-size: 16px; margin: 0; padding: 0; border: 0;" valign="baseline" align="left">
+          <td style="word-wrap: break-word; border-collapse: collapse; color: rgb(10,10,10); font-family: Helvetica,Arial,sans-serif; font-weight: normal; line-height: 1.3; font-size: 16px; margin: 0; padding: 20px 0 0; border: 0;" valign="baseline" align="left">
             <table style="border-spacing: 0; border-collapse: collapse; vertical-align: baseline; text-align: left; margin: 0; padding: 0; border: 0;">
               <tbody style="vertical-align: baseline; margin: 0; padding: 0; border: 0;">
                 <tr style="vertical-align: baseline; margin: 0; padding: 0; border: 0;" align="left">
-                  <td style="word-wrap: break-word; border-collapse: collapse; color: rgb(255,255,255); font-family: Helvetica,Arial,sans-serif; font-weight: 500; line-height: 1.3; font-size: 16px; border-radius: 4px; margin: 0; padding: 0px; border: none;" valign="middle" bgcolor="FE3859" align="center">
-                    <a href={Routes.page_url(Mobilizon.Web.Endpoint, :event, @event.uuid)} style="color: rgb(255,255,255); font-family: Helvetica,Arial,sans-serif; font-weight: bold; text-align: left; line-height: 14px; text-decoration: none; vertical-align: baseline; font-size: 16px; display: inline-block; border-radius: 3px; white-space: nowrap; margin: 0; padding: 12px 32px; border: none;" target="_blank">
+                  <td style="word-wrap: break-word; border-collapse: collapse; color: rgb(255,255,255); font-family: Helvetica,Arial,sans-serif; font-weight: 500; line-height: 1.3; font-size: 16px; border-radius: 4px; margin: 0; padding: 0px; border: none;" valign="middle" bgcolor="3C376E" align="center">
+                    <a href={Routes.page_url(Mobilizon.Web.Endpoint, :event, @event.uuid)} style="color: rgb(255,255,255); font-family: Helvetica,Arial,sans-serif; text-align: left; line-height: 14px; text-decoration: none; vertical-align: baseline; font-size: 20px; display: inline-block; border: 1px solid #3C376E; border-radius: 15px; white-space: nowrap; margin: 0; padding: 15px 25px; border: none;" target="_blank">
                       <%= gettext("Manage your participation") %>
                     </a>
                   </td>
@@ -33,12 +33,12 @@
     <table class="button btn-attend event__content_position" style="border-spacing: 0; border-collapse: collapse; vertical-align: baseline; text-align: left; width: auto; margin: 0; padding: 0; border: 0;">
       <tbody style="vertical-align: baseline; margin: 0; padding: 0; border: 0;">
         <tr style="vertical-align: baseline; margin: 0; padding: 0; border: 0;" align="left">
-          <td style="word-wrap: break-word; border-collapse: collapse; color: rgb(10,10,10); font-family: Helvetica,Arial,sans-serif; font-weight: normal; line-height: 1.3; font-size: 16px; margin: 0; padding: 0; border: 0;" valign="baseline" align="left">
+          <td style="word-wrap: break-word; border-collapse: collapse; color: rgb(10,10,10); font-family: Helvetica,Arial,sans-serif; font-weight: normal; line-height: 1.3; font-size: 16px; margin: 0; padding: 20px 0 0; border: 0;" valign="baseline" align="left">
             <table style="border-spacing: 0; border-collapse: collapse; vertical-align: baseline; text-align: left; margin: 0; padding: 0; border: 0;">
               <tbody style="vertical-align: baseline; margin: 0; padding: 0; border: 0;">
                 <tr style="vertical-align: baseline; margin: 0; padding: 0; border: 0;" align="left">
-                  <td style="word-wrap: break-word; border-collapse: collapse; color: rgb(255,255,255); font-family: Helvetica,Arial,sans-serif; font-weight: 500; line-height: 1.3; font-size: 16px; border-radius: 4px; margin: 0; padding: 0px; border: none;" valign="middle" bgcolor="FE3859" align="center">
-                    <a href={Routes.page_url(Mobilizon.Web.Endpoint, :event, @event.uuid)} style="color: rgb(255,255,255); font-family: Helvetica,Arial,sans-serif; font-weight: bold; text-align: left; line-height: 14px; text-decoration: none; vertical-align: baseline; font-size: 16px; display: inline-block; border-radius: 3px; white-space: nowrap; margin: 0; padding: 12px 32px; border: none;" target="_blank">
+                  <td style="word-wrap: break-word; border-collapse: collapse; color: rgb(255,255,255); font-family: Helvetica,Arial,sans-serif; font-weight: 500; line-height: 1.3; font-size: 16px; border-radius: 4px; margin: 0; padding: 0px; border: none;" valign="middle" bgcolor="3C376E" align="center">
+                    <a href={Routes.page_url(Mobilizon.Web.Endpoint, :event, @event.uuid)} style="color: rgb(255,255,255); font-family: Helvetica,Arial,sans-serif; text-align: left; line-height: 14px; text-decoration: none; vertical-align: baseline; font-size: 20px; display: inline-block; border: 1px solid #3C376E; border-radius: 15px; white-space: nowrap; margin: 0; padding: 15px 25px; border: none;" target="_blank">
                       <%= gettext("Participate") %>
                     </a>
                   </td>