diff --git a/templates/cloud_14_day_arrears.html b/templates/cloud_14_day_arrears.html
index 85f76433769..395a78824dc 100644
--- a/templates/cloud_14_day_arrears.html
+++ b/templates/cloud_14_day_arrears.html
@@ -142,7 +142,6 @@
     .button-cloud a {
       background-color: #1C58D9 !important;
       font-weight: 400 !important;
-      font-family: Open Sans, sans-serif !important;
       font-size: 16px !important;
       line-height: 18px !important;
       color: #FFFFFF !important;
@@ -340,6 +339,13 @@
         padding: 0px 0px 0px 12px !important;
       }
     }
+
+    @media only screen and (min-width:480px) {
+      .mj-column-per-50 {
+        width: 100% !important;
+        max-width: 100% !important;
+      }
+    }
   </style>
 </head>
 
@@ -413,7 +419,7 @@
                                   <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:separate;line-height:100%;">
                                     <tr>
                                       <td align="center" bgcolor="#FFFFFF" role="presentation" style="border:none;border-radius:4px;border-top:16px;cursor:auto;mso-padding-alt:10px 25px;background:#FFFFFF;" valign="middle">
-                                        <a href="{{.Props.SiteURL}}/admin_console/billing/subscription?action=show_delinquency_modal" style="display: inline-block; background: #FFFFFF; margin: 0; text-transform: none; mso-padding-alt: 0px; border-radius: 4px; text-decoration: none; background-color: #1C58D9; font-family: Open Sans, sans-serif; font-size: 16px; line-height: 18px; color: #FFFFFF; padding: 15px 24px; font-weight: 400;" target="_blank">
+                                        <a href="{{.Props.SiteURL}}/admin_console/billing/subscription?action=show_delinquency_modal" style="display: inline-block; background: #FFFFFF; font-family: Open Sans, sans-serif; margin: 0; text-transform: none; mso-padding-alt: 0px; border-radius: 4px; text-decoration: none; background-color: #1C58D9; font-size: 16px; line-height: 18px; color: #FFFFFF; padding: 15px 24px; font-weight: 400;" target="_blank">
                                           {{.Props.Button}}
                                         </a>
                                       </td>
diff --git a/templates/cloud_30_day_arrears.html b/templates/cloud_30_day_arrears.html
index 2388bc3b678..aae98b9df45 100644
--- a/templates/cloud_30_day_arrears.html
+++ b/templates/cloud_30_day_arrears.html
@@ -142,7 +142,6 @@
     .button-cloud a {
       background-color: #1C58D9 !important;
       font-weight: 400 !important;
-      font-family: Open Sans, sans-serif !important;
       font-size: 16px !important;
       line-height: 18px !important;
       color: #FFFFFF !important;
@@ -340,6 +339,13 @@
         padding: 0px 0px 0px 12px !important;
       }
     }
+
+    @media only screen and (min-width:480px) {
+      .mj-column-per-50 {
+        width: 100% !important;
+        max-width: 100% !important;
+      }
+    }
   </style>
 </head>
 
@@ -426,7 +432,7 @@
                                   <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:separate;line-height:100%;">
                                     <tr>
                                       <td align="center" bgcolor="#FFFFFF" role="presentation" style="border:none;border-radius:4px;cursor:auto;mso-padding-alt:10px 25px;background:#FFFFFF;" valign="middle">
-                                        <a href="{{.Props.SiteURL}}/admin_console/billing/subscription" style="display: inline-block; background: #FFFFFF; color: #ffffff; font-family: Open Sans, sans-serif; font-size: 13px; font-weight: normal; line-height: 120%; margin: 0; text-transform: none; padding: 10px 25px; mso-padding-alt: 0px; border-radius: 4px; text-decoration: none;" target="_blank">
+                                        <a href="{{.Props.SiteURL}}/admin_console/billing/subscription" style="display: inline-block; background: #FFFFFF; color: #1C58D9; font-family: Open Sans, sans-serif; font-size: 13px; font-weight: normal; line-height: 120%; margin: 0; text-transform: none; padding: 10px 25px; mso-padding-alt: 0px; border-radius: 4px; text-decoration: none;" target="_blank">
                                           {{.Props.LimitsDocs}}
                                         </a>
                                       </td>
@@ -439,7 +445,7 @@
                                   <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:separate;line-height:100%;">
                                     <tr>
                                       <td align="center" bgcolor="#FFFFFF" role="presentation" style="border:none;border-radius:4px;border-top:16px;cursor:auto;mso-padding-alt:10px 25px;background:#FFFFFF;" valign="middle">
-                                        <a href="{{.Props.SiteURL}}/admin_console/billing/subscription" style="display: inline-block; background: #FFFFFF; margin: 0; text-transform: none; mso-padding-alt: 0px; border-radius: 4px; text-decoration: none; background-color: #1C58D9; font-family: Open Sans, sans-serif; font-size: 16px; line-height: 18px; color: #FFFFFF; padding: 15px 24px; font-weight: 400;" target="_blank">
+                                        <a href="{{.Props.SiteURL}}/admin_console/billing/subscription" style="display: inline-block; background: #FFFFFF; font-family: Open Sans, sans-serif; margin: 0; text-transform: none; mso-padding-alt: 0px; border-radius: 4px; text-decoration: none; background-color: #1C58D9; font-size: 16px; line-height: 18px; color: #FFFFFF; padding: 15px 24px; font-weight: 400;" target="_blank">
                                           {{.Props.Button}}
                                         </a>
                                       </td>
diff --git a/templates/cloud_30_day_arrears.mjml b/templates/cloud_30_day_arrears.mjml
index 8f1fff3ca10..eaff7793103 100644
--- a/templates/cloud_30_day_arrears.mjml
+++ b/templates/cloud_30_day_arrears.mjml
@@ -29,7 +29,7 @@
                 </ul>
             </mj-raw>
           </mj-text>
-          <mj-button padding-bottom="30px" align="left" href="{{.Props.SiteURL}}/admin_console/billing/subscription">
+          <mj-button color="#1C58D9" padding-bottom="30px" align="left" href="{{.Props.SiteURL}}/admin_console/billing/subscription">
             {{.Props.LimitsDocs}}
           </mj-button>
           <mj-button href="{{.Props.SiteURL}}/admin_console/billing/subscription" padding="0px" border-top="16px" font-weight="400 !important" css-class="button-cloud" font-family="Open Sans, sans-serif">
diff --git a/templates/cloud_45_day_arrears.html b/templates/cloud_45_day_arrears.html
index 03d9c87c947..0225d5b2e6b 100644
--- a/templates/cloud_45_day_arrears.html
+++ b/templates/cloud_45_day_arrears.html
@@ -142,7 +142,6 @@
     .button-cloud a {
       background-color: #1C58D9 !important;
       font-weight: 400 !important;
-      font-family: Open Sans, sans-serif !important;
       font-size: 16px !important;
       line-height: 18px !important;
       color: #FFFFFF !important;
@@ -340,6 +339,13 @@
         padding: 0px 0px 0px 12px !important;
       }
     }
+
+    @media only screen and (min-width:480px) {
+      .mj-column-per-50 {
+        width: 100% !important;
+        max-width: 100% !important;
+      }
+    }
   </style>
 </head>
 
@@ -418,7 +424,7 @@
                                   <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:separate;line-height:100%;">
                                     <tr>
                                       <td align="center" bgcolor="#FFFFFF" role="presentation" style="border:none;border-radius:4px;border-top:16px;cursor:auto;mso-padding-alt:10px 25px;background:#FFFFFF;" valign="middle">
-                                        <a href="{{.Props.SiteURL}}/admin_console/billing/subscription?action=show_delinquency_modal" style="display: inline-block; background: #FFFFFF; margin: 0; text-transform: none; mso-padding-alt: 0px; border-radius: 4px; text-decoration: none; background-color: #1C58D9; font-family: Open Sans, sans-serif; font-size: 16px; line-height: 18px; color: #FFFFFF; padding: 15px 24px; font-weight: 400;" target="_blank">
+                                        <a href="{{.Props.SiteURL}}/admin_console/billing/subscription?action=show_delinquency_modal" style="display: inline-block; background: #FFFFFF; font-family: Open Sans, sans-serif; margin: 0; text-transform: none; mso-padding-alt: 0px; border-radius: 4px; text-decoration: none; background-color: #1C58D9; font-size: 16px; line-height: 18px; color: #FFFFFF; padding: 15px 24px; font-weight: 400;" target="_blank">
                                           {{.Props.Button}}
                                         </a>
                                       </td>
diff --git a/templates/cloud_7_day_arrears.html b/templates/cloud_7_day_arrears.html
index db1d3447bde..b59e370f290 100644
--- a/templates/cloud_7_day_arrears.html
+++ b/templates/cloud_7_day_arrears.html
@@ -142,7 +142,6 @@
     .button-cloud a {
       background-color: #1C58D9 !important;
       font-weight: 400 !important;
-      font-family: Open Sans, sans-serif !important;
       font-size: 16px !important;
       line-height: 18px !important;
       color: #FFFFFF !important;
@@ -340,6 +339,13 @@
         padding: 0px 0px 0px 12px !important;
       }
     }
+
+    @media only screen and (min-width:480px) {
+      .mj-column-per-50 {
+        width: 100% !important;
+        max-width: 100% !important;
+      }
+    }
   </style>
 </head>
 
@@ -413,7 +419,7 @@
                                   <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:separate;line-height:100%;">
                                     <tr>
                                       <td align="center" bgcolor="#FFFFFF" role="presentation" style="border:none;border-radius:4px;border-top:16px;cursor:auto;mso-padding-alt:10px 25px;background:#FFFFFF;" valign="middle">
-                                        <a href="{{.Props.SiteURL}}/admin_console/billing/subscription?action=show_delinquency_modal" style="display: inline-block; background: #FFFFFF; margin: 0; text-transform: none; mso-padding-alt: 0px; border-radius: 4px; text-decoration: none; background-color: #1C58D9; font-family: Open Sans, sans-serif; font-size: 16px; line-height: 18px; color: #FFFFFF; padding: 15px 24px; font-weight: 400;" target="_blank">
+                                        <a href="{{.Props.SiteURL}}/admin_console/billing/subscription?action=show_delinquency_modal" style="display: inline-block; background: #FFFFFF; font-family: Open Sans, sans-serif; margin: 0; text-transform: none; mso-padding-alt: 0px; border-radius: 4px; text-decoration: none; background-color: #1C58D9; font-size: 16px; line-height: 18px; color: #FFFFFF; padding: 15px 24px; font-weight: 400;" target="_blank">
                                           {{.Props.Button}}
                                         </a>
                                       </td>
diff --git a/templates/cloud_90_day_arrears.html b/templates/cloud_90_day_arrears.html
index 6da66a6dca0..da1137dbb93 100644
--- a/templates/cloud_90_day_arrears.html
+++ b/templates/cloud_90_day_arrears.html
@@ -142,7 +142,6 @@
     .button-cloud a {
       background-color: #1C58D9 !important;
       font-weight: 400 !important;
-      font-family: Open Sans, sans-serif !important;
       font-size: 16px !important;
       line-height: 18px !important;
       color: #FFFFFF !important;
@@ -340,6 +339,13 @@
         padding: 0px 0px 0px 12px !important;
       }
     }
+
+    @media only screen and (min-width:480px) {
+      .mj-column-per-50 {
+        width: 100% !important;
+        max-width: 100% !important;
+      }
+    }
   </style>
 </head>
 
@@ -418,7 +424,7 @@
                                   <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:separate;line-height:100%;">
                                     <tr>
                                       <td align="center" bgcolor="#FFFFFF" role="presentation" style="border:none;border-radius:4px;border-top:16px;cursor:auto;mso-padding-alt:10px 25px;background:#FFFFFF;" valign="middle">
-                                        <a href="{{.Props.SiteURL}}/admin_console/billing/subscription?action=show_delinquency_modal" style="display: inline-block; background: #FFFFFF; margin: 0; text-transform: none; mso-padding-alt: 0px; border-radius: 4px; text-decoration: none; background-color: #1C58D9; font-family: Open Sans, sans-serif; font-size: 16px; line-height: 18px; color: #FFFFFF; padding: 15px 24px; font-weight: 400;" target="_blank">
+                                        <a href="{{.Props.SiteURL}}/admin_console/billing/subscription?action=show_delinquency_modal" style="display: inline-block; background: #FFFFFF; font-family: Open Sans, sans-serif; margin: 0; text-transform: none; mso-padding-alt: 0px; border-radius: 4px; text-decoration: none; background-color: #1C58D9; font-size: 16px; line-height: 18px; color: #FFFFFF; padding: 15px 24px; font-weight: 400;" target="_blank">
                                           {{.Props.Button}}
                                         </a>
                                       </td>
diff --git a/templates/cloud_upgrade_confirmation.html b/templates/cloud_upgrade_confirmation.html
index 49d53b82c28..9b30132f49b 100644
--- a/templates/cloud_upgrade_confirmation.html
+++ b/templates/cloud_upgrade_confirmation.html
@@ -132,7 +132,6 @@
     .button-cloud a {
       background-color: #1C58D9 !important;
       font-weight: 400 !important;
-      font-family: Open Sans, sans-serif !important;
       font-size: 16px !important;
       line-height: 18px !important;
       color: #FFFFFF !important;
@@ -330,6 +329,13 @@
         padding: 0px 0px 0px 12px !important;
       }
     }
+
+    @media only screen and (min-width:480px) {
+      .mj-column-per-50 {
+        width: 100% !important;
+        max-width: 100% !important;
+      }
+    }
   </style>
 </head>
 
@@ -398,7 +404,7 @@
                                   <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:separate;line-height:100%;">
                                     <tr>
                                       <td align="center" bgcolor="#FFFFFF" role="presentation" style="border:none;border-radius:4px;border-top:16px;cursor:auto;mso-padding-alt:10px 25px;background:#FFFFFF;" valign="middle">
-                                        <a href="{{.Props.ButtonURL}}" style="display: inline-block; background: #FFFFFF; margin: 0; text-transform: none; mso-padding-alt: 0px; border-radius: 4px; text-decoration: none; background-color: #1C58D9; font-family: Open Sans, sans-serif; font-size: 16px; line-height: 18px; color: #FFFFFF; padding: 15px 24px; font-weight: 400;" target="_blank">
+                                        <a href="{{.Props.ButtonURL}}" style="display: inline-block; background: #FFFFFF; font-family: Open Sans, sans-serif; margin: 0; text-transform: none; mso-padding-alt: 0px; border-radius: 4px; text-decoration: none; background-color: #1C58D9; font-size: 16px; line-height: 18px; color: #FFFFFF; padding: 15px 24px; font-weight: 400;" target="_blank">
                                           {{.Props.Button}}
                                         </a>
                                       </td>
diff --git a/templates/inactivity_body.html b/templates/inactivity_body.html
index e742a9e81ec..1c5507cd142 100644
--- a/templates/inactivity_body.html
+++ b/templates/inactivity_body.html
@@ -132,7 +132,6 @@
     .button-cloud a {
       background-color: #1C58D9 !important;
       font-weight: 400 !important;
-      font-family: Open Sans, sans-serif !important;
       font-size: 16px !important;
       line-height: 18px !important;
       color: #FFFFFF !important;
@@ -330,6 +329,13 @@
         padding: 0px 0px 0px 12px !important;
       }
     }
+
+    @media only screen and (min-width:480px) {
+      .mj-column-per-50 {
+        width: 100% !important;
+        max-width: 100% !important;
+      }
+    }
   </style>
 </head>
 
diff --git a/templates/invite_body.html b/templates/invite_body.html
index 730240f9585..017afb677ed 100644
--- a/templates/invite_body.html
+++ b/templates/invite_body.html
@@ -152,7 +152,6 @@
     .button-cloud a {
       background-color: #1C58D9 !important;
       font-weight: 400 !important;
-      font-family: Open Sans, sans-serif !important;
       font-size: 16px !important;
       line-height: 18px !important;
       color: #FFFFFF !important;
@@ -350,6 +349,13 @@
         padding: 0px 0px 0px 12px !important;
       }
     }
+
+    @media only screen and (min-width:480px) {
+      .mj-column-per-50 {
+        width: 100% !important;
+        max-width: 100% !important;
+      }
+    }
   </style>
 </head>
 
diff --git a/templates/license_up_for_renewal.html b/templates/license_up_for_renewal.html
index f91f3c2b4d9..13780c89c5d 100644
--- a/templates/license_up_for_renewal.html
+++ b/templates/license_up_for_renewal.html
@@ -132,7 +132,6 @@
     .button-cloud a {
       background-color: #1C58D9 !important;
       font-weight: 400 !important;
-      font-family: Open Sans, sans-serif !important;
       font-size: 16px !important;
       line-height: 18px !important;
       color: #FFFFFF !important;
@@ -330,6 +329,13 @@
         padding: 0px 0px 0px 12px !important;
       }
     }
+
+    @media only screen and (min-width:480px) {
+      .mj-column-per-50 {
+        width: 100% !important;
+        max-width: 100% !important;
+      }
+    }
   </style>
 </head>
 
diff --git a/templates/messages_notification.html b/templates/messages_notification.html
index f36e8e986d3..9c40227203d 100644
--- a/templates/messages_notification.html
+++ b/templates/messages_notification.html
@@ -152,7 +152,6 @@
     .button-cloud a {
       background-color: #1C58D9 !important;
       font-weight: 400 !important;
-      font-family: Open Sans, sans-serif !important;
       font-size: 16px !important;
       line-height: 18px !important;
       color: #FFFFFF !important;
@@ -350,6 +349,13 @@
         padding: 0px 0px 0px 12px !important;
       }
     }
+
+    @media only screen and (min-width:480px) {
+      .mj-column-per-50 {
+        width: 100% !important;
+        max-width: 100% !important;
+      }
+    }
   </style>
 </head>
 
diff --git a/templates/partials/style.css b/templates/partials/style.css
index f353ecf4a6e..f91787b5d9c 100644
--- a/templates/partials/style.css
+++ b/templates/partials/style.css
@@ -40,7 +40,6 @@
 .button-cloud a {
   background-color: #1C58D9 !important;
   font-weight: 400 !important;
-  font-family: Open Sans, sans-serif !important;
   font-size: 16px !important;
   line-height: 18px !important;
   color: #FFFFFF !important;
@@ -238,3 +237,10 @@
   }
 }
 
+@media only screen and (min-width:480px) {
+    .mj-column-per-50 {
+        width: 100% !important;
+        max-width: 100% !important;
+    }
+}
+
diff --git a/templates/payment_failed_body.html b/templates/payment_failed_body.html
index 7cff2a096c4..0d8daf6b7c9 100644
--- a/templates/payment_failed_body.html
+++ b/templates/payment_failed_body.html
@@ -142,7 +142,6 @@
     .button-cloud a {
       background-color: #1C58D9 !important;
       font-weight: 400 !important;
-      font-family: Open Sans, sans-serif !important;
       font-size: 16px !important;
       line-height: 18px !important;
       color: #FFFFFF !important;
@@ -340,6 +339,13 @@
         padding: 0px 0px 0px 12px !important;
       }
     }
+
+    @media only screen and (min-width:480px) {
+      .mj-column-per-50 {
+        width: 100% !important;
+        max-width: 100% !important;
+      }
+    }
   </style>
 </head>
 
@@ -418,7 +424,7 @@
                                   <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:separate;line-height:100%;">
                                     <tr>
                                       <td align="center" bgcolor="#FFFFFF" role="presentation" style="border:none;border-radius:4px;border-top:16px;cursor:auto;mso-padding-alt:10px 25px;background:#FFFFFF;" valign="middle">
-                                        <a href="{{.Props.SiteURL}}/admin_console/billing/subscription?action=show_delinquency_modal" style="display: inline-block; background: #FFFFFF; margin: 0; text-transform: none; mso-padding-alt: 0px; border-radius: 4px; text-decoration: none; background-color: #1C58D9; font-family: Open Sans, sans-serif; font-size: 16px; line-height: 18px; color: #FFFFFF; padding: 15px 24px; font-weight: 400;" target="_blank">
+                                        <a href="{{.Props.SiteURL}}/admin_console/billing/subscription?action=show_delinquency_modal" style="display: inline-block; background: #FFFFFF; font-family: Open Sans, sans-serif; margin: 0; text-transform: none; mso-padding-alt: 0px; border-radius: 4px; text-decoration: none; background-color: #1C58D9; font-size: 16px; line-height: 18px; color: #FFFFFF; padding: 15px 24px; font-weight: 400;" target="_blank">
                                           {{.Props.Button}}
                                         </a>
                                       </td>
diff --git a/templates/reset_body.html b/templates/reset_body.html
index 3f1d3c95ce5..e5f62d4dec3 100644
--- a/templates/reset_body.html
+++ b/templates/reset_body.html
@@ -132,7 +132,6 @@
     .button-cloud a {
       background-color: #1C58D9 !important;
       font-weight: 400 !important;
-      font-family: Open Sans, sans-serif !important;
       font-size: 16px !important;
       line-height: 18px !important;
       color: #FFFFFF !important;
@@ -330,6 +329,13 @@
         padding: 0px 0px 0px 12px !important;
       }
     }
+
+    @media only screen and (min-width:480px) {
+      .mj-column-per-50 {
+        width: 100% !important;
+        max-width: 100% !important;
+      }
+    }
   </style>
 </head>
 
diff --git a/templates/verify_body.html b/templates/verify_body.html
index 8f0acf64cc1..5c8cc5550fb 100644
--- a/templates/verify_body.html
+++ b/templates/verify_body.html
@@ -132,7 +132,6 @@
     .button-cloud a {
       background-color: #1C58D9 !important;
       font-weight: 400 !important;
-      font-family: Open Sans, sans-serif !important;
       font-size: 16px !important;
       line-height: 18px !important;
       color: #FFFFFF !important;
@@ -330,6 +329,13 @@
         padding: 0px 0px 0px 12px !important;
       }
     }
+
+    @media only screen and (min-width:480px) {
+      .mj-column-per-50 {
+        width: 100% !important;
+        max-width: 100% !important;
+      }
+    }
   </style>
 </head>
 
diff --git a/templates/welcome_body.html b/templates/welcome_body.html
index 4954cf7b853..28ea7d65f57 100644
--- a/templates/welcome_body.html
+++ b/templates/welcome_body.html
@@ -132,7 +132,6 @@
     .button-cloud a {
       background-color: #1C58D9 !important;
       font-weight: 400 !important;
-      font-family: Open Sans, sans-serif !important;
       font-size: 16px !important;
       line-height: 18px !important;
       color: #FFFFFF !important;
@@ -330,6 +329,13 @@
         padding: 0px 0px 0px 12px !important;
       }
     }
+
+    @media only screen and (min-width:480px) {
+      .mj-column-per-50 {
+        width: 100% !important;
+        max-width: 100% !important;
+      }
+    }
   </style>
 </head>