<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<!--
Responsive Email Template by @keenthemes
A component of Metronic Theme - #1 Selling Bootstrap 3 Admin Theme in Themeforest: http://j.mp/metronictheme
Licensed under MIT
-->
<div id="mailsub" class="notification" align="center">
<table width="100%" border="0" cellspacing="0" cellpadding="0" style="min-width: 320px;"><tr><td align="center" bgcolor="#eff3f8">
<!--[if gte mso 10]>
<table width="680" border="0" cellspacing="0" cellpadding="0">
<tr><td>
<![endif]-->
<table border="0" cellspacing="0" cellpadding="0" class="table_width_100" width="100%" style="max-width: 680px; min-width: 300px;">
<tr><td>
<!-- padding --><div style="height: 80px; line-height: 80px; font-size: 10px;"> </div>
</td></tr>
<!--header -->
<tr><td align="center" bgcolor="#ffffff">
<!-- padding --><div style="height: 30px; line-height: 30px; font-size: 10px;"> </div>
<table width="90%" border="0" cellspacing="0" cellpadding="0">
<tr><td align="left"><!--
Item --><div class="mob_center_bl" style="float: left; display: inline-block; width: 115px;">
<table class="mob_center" width="115" border="0" cellspacing="0" cellpadding="0" align="left" style="border-collapse: collapse;">
<tr><td align="left" valign="middle">
<!-- padding --><div style="height: 20px; line-height: 20px; font-size: 10px;"> </div>
<table width="115" border="0" cellspacing="0" cellpadding="0" >
<tr><td align="left" valign="top" class="mob_center">
<a href="#" target="_blank" style="color: #596167; font-family: Arial, Helvetica, sans-serif; font-size: 13px;">
<font face="Arial, Helvetica, sans-seri; font-size: 13px;" size="3" color="#596167">
<!--<img src="http://artloglab.com/metromail/images/logo.gif" width="115" height="19" alt="Metronic" border="0" style="display: block;" />-->
PwC Logo
</font></a>
</td></tr>
</table>
</td></tr>
</table></div><!-- Item END--><!--[if gte mso 10]>
</td>
<td align="right">
<![endif]--><!--
Item --><div class="mob_center_bl" style="float: right; display: inline-block; width: 88px;">
<table width="88" border="0" cellspacing="0" cellpadding="0" align="right" style="border-collapse: collapse;">
<tr><td align="right" valign="middle">
<!-- padding --><div style="height: 20px; line-height: 20px; font-size: 10px;"> </div>
<table width="100%" border="0" cellspacing="0" cellpadding="0" >
<tr><td align="right">
<!--social -->
<div class="mob_center_bl" style="width: 88px;">
<table border="0" cellspacing="0" cellpadding="0">
<tr><td width="30" align="center" style="line-height: 19px;">
<a href="#" target="_blank" style="color: #596167; font-family: Arial, Helvetica, sans-serif; font-size: 12px;">
<font face="Arial, Helvetica, sans-serif" size="2" color="#596167">
<img src="http://artloglab.com/metromail/images/facebook.gif" width="10" height="19" alt="Facebook" border="0" style="display: block;" /></font></a>
</td><td width="39" align="center" style="line-height: 19px;">
<a href="#" target="_blank" style="color: #596167; font-family: Arial, Helvetica, sans-serif; font-size: 12px;">
<font face="Arial, Helvetica, sans-serif" size="2" color="#596167">
<img src="http://artloglab.com/metromail/images/twitter.gif" width="19" height="16" alt="Twitter" border="0" style="display: block;" /></font></a>
</td><td width="29" align="right" style="line-height: 19px;">
<a href="#" target="_blank" style="color: #596167; font-family: Arial, Helvetica, sans-serif; font-size: 12px;">
<font face="Arial, Helvetica, sans-serif" size="2" color="#596167">
<img src="http://artloglab.com/metromail/images/dribbble.gif" width="19" height="19" alt="Dribbble" border="0" style="display: block;" /></font></a>
</td></tr>
</table>
</div>
<!--social END-->
</td></tr>
</table>
</td></tr>
</table></div><!-- Item END--></td>
</tr>
</table>
<!-- padding --><div style="height: 50px; line-height: 50px; font-size: 10px;"> </div>
</td></tr>
<!--header END-->
<!--content 1 -->
<tr><td align="center" bgcolor="#fbfcfd">
<table width="90%" border="0" cellspacing="0" cellpadding="0">
<tr><td align="center">
<!-- padding --><div style="height: 60px; line-height: 60px; font-size: 10px;"> </div>
<div style="line-height: 44px;">
<font face="Arial, Helvetica, sans-serif" size="5" color="#57697e" style="font-size: 34px;">
<span style="font-family: Arial, Helvetica, sans-serif; font-size: 34px; color: #57697e;">
Thank You!
</span></font>
</div>
<!-- padding --><div style="height: 40px; line-height: 40px; font-size: 10px;"> </div>
</td></tr>
<tr><td align="center">
<div style="line-height: 24px;">
<font face="Arial, Helvetica, sans-serif" size="4" color="#57697e" style="font-size: 15px;">
<span style="font-family: Arial, Helvetica, sans-serif; font-size: 15px; color: #57697e;">
Your donation to <b>Some Long Name Charity</b> for <b>$12.00 per paycheck</b> has been recorded. You can expect for this to be started within your next 1-2 pay periods.
</span></font>
</div>
<!-- padding --><div style="height: 40px; line-height: 40px; font-size: 10px;"> </div>
</td></tr>
<tr><td align="center">
<div style="line-height: 24px;">
<a href="#" target="_blank" style="color: #596167; font-family: Arial, Helvetica, sans-serif; font-size: 13px;">
<font face="Arial, Helvetica, sans-seri; font-size: 13px;" size="3" color="#596167">
View your Donation History</font></a>
</div>
<!-- padding --><div style="height: 60px; line-height: 60px; font-size: 10px;"> </div>
</td></tr>
</table>
</td></tr>
<!--content 1 END-->
<!--content 3 -->
<tr><td align="center" bgcolor="#ffffff" style="border-bottom-width: 1px; border-bottom-style: solid; border-bottom-color: #eff2f4;">
<table width="94%" border="0" cellspacing="0" cellpadding="0">
<tr><td align="center">
<!-- padding --><div style="height: 80px; line-height: 80px; font-size: 10px;"> </div>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr><td align="center">
<font face="Arial, Helvetica, sans-serif" size="3" color="#57697e" style="font-size: 26px;">
<span style="font-family: Arial, Helvetica, sans-serif; font-size: 26px; color: #57697e;">
PwC Causes
</span></font>
</td></tr>
</table>
<div class="mob_100" style="float: left; display: inline-block; width: 33%;">
<table class="mob_100" width="100%" border="0" cellspacing="0" cellpadding="0" align="left" style="border-collapse: collapse;">
<tr><td align="center" style="line-height: 14px; padding: 0 10px;">
<!-- padding --><div style="height: 40px; line-height: 40px; font-size: 10px;"> </div>
<div style="line-height: 14px;">
<a href="#" target="_blank" style="color: #596167; font-family: Arial, Helvetica, sans-serif; font-size: 12px;">
<font face="Arial, Helvetica, sans-serif" size="2" color="#596167">
<img src="http://artloglab.com/metromail/images/img1.jpg" width="185" alt="Image 1" border="0" style="display: block; width: 100%; height: auto;" /></font></a>
</div>
</td></tr>
</table>
</div>
<div class="mob_100" style="float: left; display: inline-block; width: 33%;">
<table class="mob_100" width="100%" border="0" cellspacing="0" cellpadding="0" align="left" style="border-collapse: collapse;">
<tr><td align="center" style="line-height: 14px; padding: 0 10px;">
<!-- padding --><div style="height: 40px; line-height: 40px; font-size: 10px;"> </div>
<div style="line-height: 14px;">
<a href="#" target="_blank" style="color: #596167; font-family: Arial, Helvetica, sans-serif; font-size: 12px;">
<font face="Arial, Helvetica, sans-serif" size="2" color="#596167">
<img src="http://artloglab.com/metromail/images/img2.jpg" width="185" alt="Image 2" border="0" style="display: block; width: 100%; height: auto;" /></font></a>
</div>
</td></tr>
</table>
</div>
<div class="mob_100" style="float: left; display: inline-block; width: 33%;">
<table class="mob_100" width="100%" border="0" cellspacing="0" cellpadding="0" align="left" style="border-collapse: collapse;">
<tr><td align="center" style="line-height: 14px; padding: 0 10px;">
<!-- padding --><div style="height: 40px; line-height: 40px; font-size: 10px;"> </div>
<div style="line-height: 14px;">
<a href="#" target="_blank" style="color: #596167; font-family: Arial, Helvetica, sans-serif; font-size: 12px;">
<font face="Arial, Helvetica, sans-serif" size="2" color="#596167">
<img src="http://artloglab.com/metromail/images/img3.jpg" width="185" alt="Image 3" border="0" style="display: block; width: 100%; height: auto;" /></font></a>
</div>
</td></tr>
</table>
</div>
</td></tr>
<tr><td><!-- padding --><div style="height: 80px; line-height: 80px; font-size: 10px;"> </div></td></tr>
</table>
</td></tr>
<!--content 3 END-->
<!--footer -->
<tr><td class="iage_footer" align="center" bgcolor="#ffffff">
<!-- padding --><div style="height: 80px; line-height: 80px; font-size: 10px;"> </div>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr><td align="center">
<font face="Arial, Helvetica, sans-serif" size="3" color="#96a5b5" style="font-size: 13px;">
<span style="font-family: Arial, Helvetica, sans-serif; font-size: 13px; color: #96a5b5;">
2015 © YourCause LLC. ALL Rights Reserved.
</span></font>
</td></tr>
</table>
<!-- padding --><div style="height: 30px; line-height: 30px; font-size: 10px;"> </div>
</td></tr>
<!--footer END-->
<tr><td>
<!-- padding --><div style="height: 80px; line-height: 80px; font-size: 10px;"> </div>
</td></tr>
</table>
<!--[if gte mso 10]>
</td></tr>
</table>
<![endif]-->
</td></tr>
</table>
</div>
/***
User Profile Sidebar by @keenthemes
A component of Metronic Theme - #1 Selling Bootstrap 3 Admin Theme in Themeforest: http://j.mp/metronictheme
Licensed under MIT
***/
body {
padding: 0;
margin: 0;
}
html { -webkit-text-size-adjust:none; -ms-text-size-adjust: none;}
@media only screen and (max-device-width: 680px), only screen and (max-width: 680px) {
*[class="table_width_100"] {
width: 96% !important;
}
*[class="border-right_mob"] {
border-right: 1px solid #dddddd;
}
*[class="mob_100"] {
width: 100% !important;
}
*[class="mob_center"] {
text-align: center !important;
}
*[class="mob_center_bl"] {
float: none !important;
display: block !important;
margin: 0px auto;
}
.iage_footer a {
text-decoration: none;
color: #929ca8;
}
img.mob_display_none {
width: 0px !important;
height: 0px !important;
display: none !important;
}
img.mob_width_50 {
width: 40% !important;
height: auto !important;
}
}
.table_width_100 {
width: 680px;
}
