Backed our new styles out of ink.css and moved them into style.css. Small margin tweaks, looking good to go.

emails/assets/css/ink.css

@@ -417,38 +417,6 @@ h6 a:visited {
 
 /* Buttons */
 
-.better-button td{
-  -webkit-border-radius: 2px;
-  -moz-border-radius: 2px;
-  border-radius: 2px;
-}
-
-.better-button a{
-  text-decoration: none; 
-  -webkit-border-radius: 2px; 
-  -moz-border-radius: 2px;
-  border-radius: 2px;
-
-  padding: 12px 25px;
-  border: 1px solid #ff8f2b;
-  display: inline-block;
-  color: #FFF;
-}
-
-.better-button:hover a {
-  color: #FFFFFF !important;
-  background-color: #F2821E;
-  border: 1px solid #F2821E;  
-}
-
-.better-button:visited a {
-  color: #FFFFFF !important;
-}
-
-.better-button:active a {
-  color: #FFFFFF !important;
-}
-
 table.button,
 table.tiny-button,
 table.small-button,
@@ -721,4 +689,4 @@ body.outlook p {
   table[class="body"] .hide-for-desktop {
     display: inherit !important;
   }
-}
+}

emails/assets/css/style.css

@@ -5,6 +5,37 @@ body, table.body, h1, h2, h3, h4, h5, h6, p, td {
   -webkit-text-size-adjust: none;
 }
 
+h1 {font-size: 40px;}
+h2 {font-size: 36px;}
+h3 {
+  font-size: 22px;
+  margin-top: 20px;
+}
+h4 {font-size: 20px;}
+h5 {font-size: 18px;}
+h6 {font-size: 16px;}
+
+.emphasis {
+  font-weight: 600;
+}
+
+a {
+  color: #E67612;
+  text-decoration: none;
+}
+
+a:hover {
+  color: #ff8f2b !important;
+}
+
+a:active {
+  color: #F2821E !important;
+}
+
+a:visited {
+  color: #E67612 !important;
+}
+
 table.facebook td {
   background: #3b5998;
   border-color: #2d4473;
@@ -65,3 +96,40 @@ table.google-plus:hover td {
   }
 }
 
+table.better-button {
+  margin-top: 10px;
+  margin-bottom: 20px;
+}
+
+table.columns td.better-button {
+  -webkit-border-radius: 2px;
+  -moz-border-radius: 2px;
+  border-radius: 2px;
+  padding-bottom: 0px;
+}
+
+.better-button a {
+  text-decoration: none; 
+  -webkit-border-radius: 2px; 
+  -moz-border-radius: 2px;
+  border-radius: 2px;
+
+  padding: 12px 25px;
+  border: 1px solid #ff8f2b;
+  display: inline-block;
+  color: #FFF;
+}
+
+.better-button:hover a {
+  color: #FFFFFF !important;
+  background-color: #F2821E;
+  border: 1px solid #F2821E;  
+}
+
+.better-button:visited a {
+  color: #FFFFFF !important;
+}
+
+.better-button:active a {
+  color: #FFFFFF !important;
+}

emails/templates/invited_to_org.html

@@ -32,17 +32,9 @@
 				</tr>
 				<tr>				
 					<td class="center">
-<!-- 						<table class="button radius">
-							<tr>
-								<td>
-									<a href="[[.GrafanaUrl]]">Log in now</a>
-								</td>
-							</tr>
-						</table> -->
-
-	                    <table align="center" border="0" cellspacing="0" cellpadding="0">
+	                    <table class="better-button" align="center" border="0" cellspacing="0" cellpadding="0">
 	                    	<tr>
-	                          <td align="center" class="better-button" style="padding-bottom: 0px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;" bgcolor="#ff8f2b"><a href="[[.GrafanaURL]]" target="_blank">Log in now</a></td>
+	                          <td align="center" class="better-button" bgcolor="#ff8f2b"><a href="[[.AppURL]]" target="_blank">Log in now</a></td>
 	                        </tr>
 	                    </table>
 

emails/templates/new_user_invite.html

@@ -25,22 +25,14 @@
 			<table class="twelve columns">
 				<tr>
 					<td class="center">
-						<p>You've been invited to join the <span class="emphasis">[[.OrgName]]</span> organization by <span class="emphasis">[[.InvitedBy]]</span></p>
-						<p>To accept your invitation and join the team, please click the link below:</p>
+						<p>You've been invited to join the <span class="emphasis">[[.OrgName]]</span> organization by <span class="emphasis">[[.InvitedBy]]</span>. To accept your invitation and join the team, please click the link below:</p>
 					</td>
 				</tr>
 				<tr>				
 					<td class="center">
-					<!-- <table class="small-button radius">
-							<tr>
-								<td>
-									<a href="[[.LinkUrl]]">Complete Sign Up</a>
-								</td>
-							</tr>
-						</table> -->
-	                    <table align="center" border="0" cellspacing="0" cellpadding="0">
+	                    <table class="better-button" align="center" border="0" cellspacing="0" cellpadding="0">
 	                    	<tr>
-	                          <td align="center" class="better-button" style="padding-bottom: 0px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;" bgcolor="#ff8f2b"><a href="[[.LinkUrl]]" target="_blank">Complete Sign Up</a></td>
+	                          <td align="center" class="better-button" bgcolor="#ff8f2b"><a href="[[.LinkUrl]]" target="_blank">Accept Invitation</a></td>
 	                        </tr>
 	                    </table>
 					</td>
@@ -54,6 +46,4 @@
 			</table>
 		</td>
 	</tr>
-</table>
-
-
+</table>

public/emails/invited_to_org.html

@@ -27,6 +27,18 @@ color: #F2821E !important;
 a:visited {
 color: #E67612 !important;
 }
+body {
+font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: none;
+}
+a:hover {
+color: #ff8f2b !important;
+}
+a:active {
+color: #F2821E !important;
+}
+a:visited {
+color: #E67612 !important;
+}
 .better-button:hover a {
 color: #FFFFFF !important; background-color: #F2821E; border: 1px solid #F2821E;
 }
@@ -36,9 +48,6 @@ color: #FFFFFF !important;
 .better-button:active a {
 color: #FFFFFF !important;
 }
-body {
-font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: none;
-}
 @media only screen and (max-width: 600px) {
   table[class="body"] img {
     width: auto !important; height: auto !important;
@@ -115,7 +124,7 @@ font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-
 			<table class="twelve columns" style="border-collapse: collapse; border-spacing: 0; margin: 0 auto; padding: 0; text-align: left; vertical-align: top; width: 580px">
 				<tr style="padding: 0; text-align: left; vertical-align: top" align="left">
 					<td style="-moz-hyphens: auto; -webkit-font-smoothing: antialiased; -webkit-hyphens: auto; -webkit-text-size-adjust: none; border-collapse: collapse !important; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; hyphens: auto; line-height: 19px; margin: 0; padding: 0px 0px 10px; text-align: left; vertical-align: top; word-break: break-word" align="left" valign="top">
-						<h3 style="-webkit-font-smoothing: antialiased; -webkit-text-size-adjust: none; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 26px; font-weight: normal; line-height: 1.3; margin: 0; padding: 0; text-align: left; word-break: normal" align="left">You have been added to {{.OrgName}}</h3>
+						<h3 style="-webkit-font-smoothing: antialiased; -webkit-text-size-adjust: none; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 22px; font-weight: normal; line-height: 1.3; margin: 20px 0 0; padding: 0; text-align: left; word-break: normal" align="left">You have been added to {{.OrgName}}</h3>
 					</td>
 					<td class="expander" style="-moz-hyphens: auto; -webkit-font-smoothing: antialiased; -webkit-hyphens: auto; -webkit-text-size-adjust: none; border-collapse: collapse !important; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; hyphens: auto; line-height: 19px; margin: 0; padding: 0; text-align: left; vertical-align: top; visibility: hidden; width: 0px; word-break: break-word" align="left" valign="top"></td>
 				</tr>
@@ -138,11 +147,9 @@ font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-
 				</tr>
 				<tr style="padding: 0; text-align: left; vertical-align: top" align="left">				
 					<td class="center" style="-moz-hyphens: auto; -webkit-font-smoothing: antialiased; -webkit-hyphens: auto; -webkit-text-size-adjust: none; border-collapse: collapse !important; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; hyphens: auto; line-height: 19px; margin: 0; padding: 0px 0px 10px; text-align: center; vertical-align: top; word-break: break-word" align="center" valign="top">
-
-
-	                    <table align="center" border="0" cellspacing="0" cellpadding="0" style="border-collapse: collapse; border-spacing: 0; padding: 0; text-align: left; vertical-align: top">
+	                    <table class="better-button" align="center" border="0" cellspacing="0" cellpadding="0" style="border-collapse: collapse; border-spacing: 0; margin-bottom: 20px; margin-top: 10px; padding: 0; text-align: left; vertical-align: top">
 	                    	<tr style="padding: 0; text-align: left; vertical-align: top" align="left">
-	                          <td align="center" class="better-button" style="-moz-border-radius: 2px; -moz-hyphens: auto; -webkit-border-radius: 2px; -webkit-font-smoothing: antialiased; -webkit-hyphens: auto; -webkit-text-size-adjust: none; border-collapse: collapse !important; border-radius: 2px; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; hyphens: auto; line-height: 19px; margin: 0; padding: 0px; text-align: left; vertical-align: top; word-break: break-word" bgcolor="#ff8f2b" valign="top"><a href="{{.GrafanaURL}}" target="_blank" style="-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; border: 1px solid #ff8f2b; color: #FFF; display: inline-block; padding: 12px 25px; text-decoration: none">Log in now</a></td>
+	                          <td align="center" class="better-button" bgcolor="#ff8f2b" style="-moz-border-radius: 2px; -moz-hyphens: auto; -webkit-border-radius: 2px; -webkit-font-smoothing: antialiased; -webkit-hyphens: auto; -webkit-text-size-adjust: none; border-collapse: collapse !important; border-radius: 2px; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; hyphens: auto; line-height: 19px; margin: 0; padding: 0px; text-align: left; vertical-align: top; word-break: break-word" valign="top"><a href="{{.AppURL}}" target="_blank" style="-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; border: 1px solid #ff8f2b; color: #FFF; display: inline-block; padding: 12px 25px; text-decoration: none">Log in now</a></td>
 	                        </tr>
 	                    </table>
 

public/emails/new_user_invite.html

@@ -27,6 +27,18 @@ color: #F2821E !important;
 a:visited {
 color: #E67612 !important;
 }
+body {
+font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: none;
+}
+a:hover {
+color: #ff8f2b !important;
+}
+a:active {
+color: #F2821E !important;
+}
+a:visited {
+color: #E67612 !important;
+}
 .better-button:hover a {
 color: #FFFFFF !important; background-color: #F2821E; border: 1px solid #F2821E;
 }
@@ -36,9 +48,6 @@ color: #FFFFFF !important;
 .better-button:active a {
 color: #FFFFFF !important;
 }
-body {
-font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: none;
-}
 @media only screen and (max-width: 600px) {
   table[class="body"] img {
     width: auto !important; height: auto !important;
@@ -115,7 +124,7 @@ font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-
 			<table class="twelve columns" style="border-collapse: collapse; border-spacing: 0; margin: 0 auto; padding: 0; text-align: left; vertical-align: top; width: 580px">
 				<tr style="padding: 0; text-align: left; vertical-align: top" align="left">
 					<td style="-moz-hyphens: auto; -webkit-font-smoothing: antialiased; -webkit-hyphens: auto; -webkit-text-size-adjust: none; border-collapse: collapse !important; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; hyphens: auto; line-height: 19px; margin: 0; padding: 0px 0px 10px; text-align: left; vertical-align: top; word-break: break-word" align="left" valign="top">
-						<h3 style="-webkit-font-smoothing: antialiased; -webkit-text-size-adjust: none; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 26px; font-weight: normal; line-height: 1.3; margin: 0; padding: 0; text-align: left; word-break: normal" align="left">You're invited to join {{.OrgName}}</h3>
+						<h3 style="-webkit-font-smoothing: antialiased; -webkit-text-size-adjust: none; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 22px; font-weight: normal; line-height: 1.3; margin: 20px 0 0; padding: 0; text-align: left; word-break: normal" align="left">You're invited to join {{.OrgName}}</h3>
 					</td>
 					<td class="expander" style="-moz-hyphens: auto; -webkit-font-smoothing: antialiased; -webkit-hyphens: auto; -webkit-text-size-adjust: none; border-collapse: collapse !important; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; hyphens: auto; line-height: 19px; margin: 0; padding: 0; text-align: left; vertical-align: top; visibility: hidden; width: 0px; word-break: break-word" align="left" valign="top"></td>
 				</tr>
@@ -131,16 +140,14 @@ font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-
 			<table class="twelve columns" style="border-collapse: collapse; border-spacing: 0; margin: 0 auto; padding: 0; text-align: left; vertical-align: top; width: 580px">
 				<tr style="padding: 0; text-align: left; vertical-align: top" align="left">
 					<td class="center" style="-moz-hyphens: auto; -webkit-font-smoothing: antialiased; -webkit-hyphens: auto; -webkit-text-size-adjust: none; border-collapse: collapse !important; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; hyphens: auto; line-height: 19px; margin: 0; padding: 0px 0px 10px; text-align: center; vertical-align: top; word-break: break-word" align="center" valign="top">
-						<p style="-webkit-font-smoothing: antialiased; -webkit-text-size-adjust: none; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; line-height: 19px; margin: 0 0 10px; padding: 0; text-align: left" align="left">You've been invited to join the <span class="emphasis" style="font-weight: 600">{{.OrgName}}</span> organization by <span class="emphasis" style="font-weight: 600">{{.InvitedBy}}</span></p>
-						<p style="-webkit-font-smoothing: antialiased; -webkit-text-size-adjust: none; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; line-height: 19px; margin: 0 0 10px; padding: 0; text-align: left" align="left">To accept your invitation and join the team, please click the link below:</p>
+						<p style="-webkit-font-smoothing: antialiased; -webkit-text-size-adjust: none; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; line-height: 19px; margin: 0 0 10px; padding: 0; text-align: left" align="left">You've been invited to join the <span class="emphasis" style="font-weight: 600">{{.OrgName}}</span> organization by <span class="emphasis" style="font-weight: 600">{{.InvitedBy}}</span>. To accept your invitation and join the team, please click the link below:</p>
 					</td>
 				</tr>
 				<tr style="padding: 0; text-align: left; vertical-align: top" align="left">				
 					<td class="center" style="-moz-hyphens: auto; -webkit-font-smoothing: antialiased; -webkit-hyphens: auto; -webkit-text-size-adjust: none; border-collapse: collapse !important; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; hyphens: auto; line-height: 19px; margin: 0; padding: 0px 0px 10px; text-align: center; vertical-align: top; word-break: break-word" align="center" valign="top">
-					
-	                    <table align="center" border="0" cellspacing="0" cellpadding="0" style="border-collapse: collapse; border-spacing: 0; padding: 0; text-align: left; vertical-align: top">
+	                    <table class="better-button" align="center" border="0" cellspacing="0" cellpadding="0" style="border-collapse: collapse; border-spacing: 0; margin-bottom: 20px; margin-top: 10px; padding: 0; text-align: left; vertical-align: top">
 	                    	<tr style="padding: 0; text-align: left; vertical-align: top" align="left">
-	                          <td align="center" class="better-button" style="-moz-border-radius: 2px; -moz-hyphens: auto; -webkit-border-radius: 2px; -webkit-font-smoothing: antialiased; -webkit-hyphens: auto; -webkit-text-size-adjust: none; border-collapse: collapse !important; border-radius: 2px; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; hyphens: auto; line-height: 19px; margin: 0; padding: 0px; text-align: left; vertical-align: top; word-break: break-word" bgcolor="#ff8f2b" valign="top"><a href="{{.LinkUrl}}" target="_blank" style="-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; border: 1px solid #ff8f2b; color: #FFF; display: inline-block; padding: 12px 25px; text-decoration: none">Complete Sign Up</a></td>
+	                          <td align="center" class="better-button" bgcolor="#ff8f2b" style="-moz-border-radius: 2px; -moz-hyphens: auto; -webkit-border-radius: 2px; -webkit-font-smoothing: antialiased; -webkit-hyphens: auto; -webkit-text-size-adjust: none; border-collapse: collapse !important; border-radius: 2px; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; hyphens: auto; line-height: 19px; margin: 0; padding: 0px; text-align: left; vertical-align: top; word-break: break-word" valign="top"><a href="{{.LinkUrl}}" target="_blank" style="-moz-border-radius: 2px; -webkit-border-radius: 2px; border-radius: 2px; border: 1px solid #ff8f2b; color: #FFF; display: inline-block; padding: 12px 25px; text-decoration: none">Accept Invitation</a></td>
 	                        </tr>
 	                    </table>
 					</td>
@@ -155,9 +162,6 @@ font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-
 		</td>
 	</tr>
 </table>
-
-
-
 								
 								<table class="row footer" style="border-collapse: collapse; border-spacing: 0; display: block; margin-top: 20px; padding: 0px; position: relative; text-align: left; vertical-align: top; width: 100%">
 									<tr style="padding: 0; text-align: left; vertical-align: top" align="left">

public/emails/reset_password.html

@@ -27,6 +27,18 @@ color: #F2821E !important;
 a:visited {
 color: #E67612 !important;
 }
+body {
+font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: none;
+}
+a:hover {
+color: #ff8f2b !important;
+}
+a:active {
+color: #F2821E !important;
+}
+a:visited {
+color: #E67612 !important;
+}
 .better-button:hover a {
 color: #FFFFFF !important; background-color: #F2821E; border: 1px solid #F2821E;
 }
@@ -36,9 +48,6 @@ color: #FFFFFF !important;
 .better-button:active a {
 color: #FFFFFF !important;
 }
-body {
-font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: none;
-}
 @media only screen and (max-width: 600px) {
   table[class="body"] img {
     width: auto !important; height: auto !important;
@@ -113,7 +122,7 @@ font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-
 			<table class="twelve columns" style="border-collapse: collapse; border-spacing: 0; margin: 0 auto; padding: 0; text-align: left; vertical-align: top; width: 580px">
 				<tr style="padding: 0; text-align: left; vertical-align: top" align="left">
 					<td style="-moz-hyphens: auto; -webkit-font-smoothing: antialiased; -webkit-hyphens: auto; -webkit-text-size-adjust: none; border-collapse: collapse !important; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; hyphens: auto; line-height: 19px; margin: 0; padding: 0px 0px 10px; text-align: left; vertical-align: top; word-break: break-word" align="left" valign="top">
-						<h3 style="-webkit-font-smoothing: antialiased; -webkit-text-size-adjust: none; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 26px; font-weight: normal; line-height: 1.3; margin: 0; padding: 0; text-align: left; word-break: normal" align="left">Hi {{.Name}}</h3>
+						<h3 style="-webkit-font-smoothing: antialiased; -webkit-text-size-adjust: none; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 22px; font-weight: normal; line-height: 1.3; margin: 20px 0 0; padding: 0; text-align: left; word-break: normal" align="left">Hi {{.Name}}</h3>
 					</td>
 					<td class="expander" style="-moz-hyphens: auto; -webkit-font-smoothing: antialiased; -webkit-hyphens: auto; -webkit-text-size-adjust: none; border-collapse: collapse !important; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; hyphens: auto; line-height: 19px; margin: 0; padding: 0; text-align: left; vertical-align: top; visibility: hidden; width: 0px; word-break: break-word" align="left" valign="top"></td>
 				</tr>

public/emails/welcome_on_signup.html

@@ -27,6 +27,18 @@ color: #F2821E !important;
 a:visited {
 color: #E67612 !important;
 }
+body {
+font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: none;
+}
+a:hover {
+color: #ff8f2b !important;
+}
+a:active {
+color: #F2821E !important;
+}
+a:visited {
+color: #E67612 !important;
+}
 .better-button:hover a {
 color: #FFFFFF !important; background-color: #F2821E; border: 1px solid #F2821E;
 }
@@ -36,9 +48,6 @@ color: #FFFFFF !important;
 .better-button:active a {
 color: #FFFFFF !important;
 }
-body {
-font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; -webkit-text-size-adjust: none;
-}
 @media only screen and (max-width: 600px) {
   table[class="body"] img {
     width: auto !important; height: auto !important;
@@ -113,7 +122,7 @@ font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-
 			<table class="twelve columns" style="border-collapse: collapse; border-spacing: 0; margin: 0 auto; padding: 0; text-align: left; vertical-align: top; width: 580px">
 				<tr style="padding: 0; text-align: left; vertical-align: top" align="left">
 					<td style="-moz-hyphens: auto; -webkit-font-smoothing: antialiased; -webkit-hyphens: auto; -webkit-text-size-adjust: none; border-collapse: collapse !important; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; hyphens: auto; line-height: 19px; margin: 0; padding: 0px 0px 10px; text-align: left; vertical-align: top; word-break: break-word" align="left" valign="top">
-						<h3 style="-webkit-font-smoothing: antialiased; -webkit-text-size-adjust: none; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 26px; font-weight: normal; line-height: 1.3; margin: 0; padding: 0; text-align: left; word-break: normal" align="left">Hi {{.Name}}</h3>
+						<h3 style="-webkit-font-smoothing: antialiased; -webkit-text-size-adjust: none; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 22px; font-weight: normal; line-height: 1.3; margin: 20px 0 0; padding: 0; text-align: left; word-break: normal" align="left">Hi {{.Name}}</h3>
 					</td>
 					<td class="expander" style="-moz-hyphens: auto; -webkit-font-smoothing: antialiased; -webkit-hyphens: auto; -webkit-text-size-adjust: none; border-collapse: collapse !important; color: #222222; font-family: 'Open Sans', 'Helvetica Neue', 'Helvetica', Helvetica, Arial, sans-serif; font-size: 14px; font-weight: normal; hyphens: auto; line-height: 19px; margin: 0; padding: 0; text-align: left; vertical-align: top; visibility: hidden; width: 0px; word-break: break-word" align="left" valign="top"></td>
 				</tr>