background image with text overlay

<!-- HERO 3 - TEXT OVERLAY : START --><!--[if (gte mso 9)|(IE)]><table role="presentation" align="center" border="0" cellpadding="0" cellspacing="0" width="100%"><tr><td align="center" valign="top" width="100%"><![endif]--><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background-color: #ffffff;" width="100%">
 
  <tr>
   <td>
    <!--[if (gte mso 9)|(IE)]><table role="presentation" align="center" border="0" cellpadding="0" cellspacing="0" width="600" style="width:600px;"><tr><td align="center" valign="top" width="100%"><![endif]--><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="max-width:600px; background-color:#ffffff;" width="100%">
     
      <tr>
       <td>
        <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background-color: #ffffff;" width="100%">
         
          <tr>
           <td align="center" style="padding-top: 0px;padding-bottom:0px;padding-left:0px;padding-right:0px;" valign="top">
            <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background-color: #000000;" width="100%">
             
              <tr>
               <!-- Bulletproof Background Images c/o https://backgrounds.cm --><!-- https://litmus.com/community/discussions/6229-windows-10-mail-vml-background-solution --><td align="left" background="https://image.em.cat.com/lib/fe34157075640579701c78/m/1/3ac128e7-4b80-402d-a371-c78cbec7f5e6.jpeg" bgcolor="#000000" height="250" style="height: 250px; text-align: center; background-image:url('https://image.em.cat.com/lib/fe34157075640579701c78/m/1/3ac128e7-4b80-402d-a371-c78cbec7f5e6.jpeg'); background-position: center !important; background-size: cover !important;" valign="top">
                <!-- NOTE: Image needs to be exact dimensions for it to appear correct in 2013/2016/2019 Desktop Outlook --><!--[if gte mso 9]>
<v:image xmlns:v="urn:schemas-microsoft-com:vml" id="theImage" style="behavior: url(#default#VML); display: inline-block; position: absolute; width: 600x; height: 250px; top: 0; left: 0;right: 0; border: 0; z-index: 1;" src="https://image.em.cat.com/lib/fe34157075640579701c78/m/1/3ac128e7-4b80-402d-a371-c78cbec7f5e6.jpeg" />                             
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="display: inline-block; position: absolute; width: 600px; height: 250px; top: 0; left: 34;right: 0; border: 0; z-index: 2;">
<v:fill opacity="0%" style="z-index: 1;"/> 
<div>                       
<![endif]--><!-- Containing Table --><table align="left" border="0" cellpadding="0" cellspacing="0" role="presentation" style="max-width: 300px;" width="300">
                 
                  <tr>
                   <td align="center" class="darkbg-hero-txt" style="padding-top:52px;padding-right:0px;padding-bottom:0px;padding-left:50px;" valign="middle">
                    <table align="left" border="0" cellpadding="0" cellspacing="0" role="presentation" style="border: 3px solid #ffc506; text-align: center;max-width: 300px;" width="100%">
                     
                      <tr>
                       <td align="center" style="padding-top:0px;padding-right:0px;padding-bottom:0px;padding-left:0px;" valign="middle">
                        <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                         
                          <tr>
                           <td class="darkbg-hero-txt" style="font-family:Arial Black, Arial, Helvetica, sans-serif; color:#ffffff; text-align:left; font-weight:700; font-size:16px; mso-line-height-rule:exactly; line-height:18px;">
                            <!--[if (gte mso 9)|(IE)]><table role="presentation" align="center" border="0" cellpadding="0" cellspacing="0" width="600" style="width:100%;"><tr><td align="center" valign="top" width="100%" class="darkbg-hero-txt"><![endif]--><table border="0" cellpadding="0" cellspacing="0" role="presentation" style="margin-top: 0px; margin-right: 10px; margin-bottom: 0px; margin-left: 10px  text-align: center;" width="100%">
                             
                              <tr>
                               <td class="darkbg-hero-txt" style="font-family:Arial Black, Arial, Helvetica, sans-serif; color:#ffffff; text-align:center; font-weight:700; font-size:16px; mso-line-height-rule:exactly; line-height:18px; background-color: #000000;">
                                <span style="font-family:Arial Black, Arial, Helvetica, sans-serif; text-align:center; font-weight:700; font-size:10px; mso-line-height-rule:exactly; line-height:10px;">&nbsp;</span><br>
                                LEARN HOW THE <span style="display: inline-block">CAT<span style="font-size:  80%;display: inline-block;margin-top: -2px;vertical-align: top">&reg;</span></span><br>
                                S62 PRO STOOD UP TO<br>
                                A SPACE JOUREY.<br>
                                <span style="font-family:Arial Black, Arial, Helvetica, sans-serif; text-align:center; font-weight:700; font-size:10px; mso-line-height-rule:exactly; line-height:10px;">&nbsp;</span></td></tr></table><!--[if (gte mso 9)|(IE)]></td></tr></table><![endif]--></td></tr></table></td></tr></table></td></tr></table><!-- Containing Table END--><!--[if gte mso 9]>   
</div></v:fill></v:rect><![endif]--></td></tr></table></td></tr></table></td></tr></table><!--[if (gte mso 9)|(IE)]></td></tr></table><![endif]--></td></tr></table><!--[if (gte mso 9)|(IE)]></td></tr></table><![endif]--><!-- HERO 3 - TEXT OVERLAY : END -->