I am having trouble with the image resizing in Gmail app (Mobile). It shows the image smaller than other mobile clients that show it at 440px. Does anyone know how to get this to respond, and look better in the app?


<style type="text/css">
    .ReadMsgBody {width: 100%; background-color: #ffffff;}
    .ExternalClass {width: 100%; background-color: #ffffff;}
    body     {width: 100%; background-color: #ffffff; margin:0; padding:0; -webkit-font-smoothing: antialiased;font-family: Helvetica, sans-serif;}
            {-ms-text-size-adjust:100%;}
    table {border-collapse: collapse;}
            {mso-table-lspace:0pt;
             mso-table-rspace:0pt;}

    @media only screen and (max-width: 640px)  {
                    body[yahoo] .deviceWidth {width:440px!important; padding:0;}    
                    body[yahoo] .center {text-align: center!important;}     
            }

    @media only screen and (max-width: 479px) {
                    body[yahoo] .deviceWidth {width:280px!important; padding:0;}    
                    body[yahoo] .center {text-align: center!important;}     
            }

    @media only screen and (max-width: 479px) {
    img[class="FontSize"]{
        width:75px !important;
        } 
      }

</style>
    <!--POST
    %%[
    Var @cid Set @cid = "Subscription_Campaign_080315_Version"
    ]%%
    POST-->
</head>
<custom name="opencounter" type="tracking">
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0" yahoo="fix" style="font-family: Helvetica, sans-serif; table-layout: fixed;">

<table width="100%" border="0" cellpadding="0" cellspacing="0" align="center" style="table-layout: fixed;">
    <tr>
        <td width="100%" align="center" valign="top" bgcolor="#ffffff" style="padding-top:20px">
            <table width="600" border="0" cellpadding="0" cellspacing="0" align="center" class="deviceWidth" style="table-layout: fixed;">
                <tr>
                    <td align="center" style="font-family: Helvetica, sans-serif; padding:0px 10px 0px 10px;">


                    <!-- START PreHeader Message -->
                    <div style="font-size: 1px; line-height:1px; color: #ffffff;"></div>
                    <!-- END PreHeader Message -->



                    <!-- START View in Browser-->
                    <div style="font-size:10px; line-height:10px;">&nbsp;</div>
                    <div style="font-family:Verdana, Geneva, sans-serif; font-size:9px; color:#444444;"> To view this email as a web page, go <a href="#" style="color:#3ca7dd;" target="_blank"><span style="color:#3ca7dd;">here.</span></a><br>
                    </div>
                    <!-- END View in Browser-->


                    <div style="font-size:10px; line-height:10px;">&nbsp;</div>
                    </td>
                </tr>
            </table>


            <!-- START Header -->
            <table width="600" class="deviceWidth" border="0" cellpadding="0" cellspacing="0" align="center" bgcolor="#ffffff" style="border-collapse:collapse; mso-table-lspace:0pt; mso-table-rspace:0pt; table-layout: fixed;">
                <tr>
                    <td valign="top" bgcolor="#ffffff">
                    </td>
                </tr>
            </table>
            <!-- END Header -->


             <!-- START Header -->
  <div style="background-color:#ffffff;"><!--[if mso | IE]>
      <table role="presentation" border="0" cellpadding="0" cellspacing="0" width="600" align="center" style="width:600px;">
        <tr>
          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
      <![endif]--><div class="deviceWidth" style="margin:0px auto;max-width:600px;background:#88c548;">
      <table class="deviceWidth" role="presentation" cellpadding="0" cellspacing="0" style="font-size:0px;width:100%;background:#88c548; table-layout: fixed;" align="center" border="0">
          <tbody>
              <tr>
                  <td style="text-align:center;vertical-align:top;direction:ltr;font-size:0px;padding:20px 0px;">
                      <!--[if mso | IE]>
      <table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td style="vertical-align:top;width:600px;">
      <![endif]-->
                      <div aria-labelledby="mj-column-per-100" class="mj-column-per-100 outlook-group-fix" style="vertical-align:top;display:inline-block;direction:ltr;font-size:13px;text-align:left;width:100%;">
                          <table role="presentation" cellpadding="0" cellspacing="0" width="100%" border="0">
                              <tbody>
                                  <tr>
                                      <td style="word-break:break-word;font-size:0px;padding:10px 25px;padding-top:0px;padding-bottom:0px;" align="center">
                                          <div style="cursor:auto;color:#FFFFFE;font-family:Helvetica,Arial,sans-serif;font-size:24px;line-height:120%;">

                        6 Fun Ways to Do Your Family History

                                          </div>
                                      </td>
                                  </tr>
                              </tbody>
                          </table>
                      </div>
                      <!--[if mso | IE]>
      </td></tr></table>
      <![endif]-->
                  </td>
              </tr>
          </tbody>
      </table>
      </div>
            </div>
        </td>
    </tr>
    </table>
      <!--[if mso | IE]>
      </td></tr></table>
      <![endif]-->
            <!-- END Header -->


            <!-- START 2 Column with Small Image on Left -->
            <table width="100%" border="0" cellpadding="0" cellspacing="0" align="center" style="table-layout: fixed;" class="deviceWidth">
    <tr>
        <td width="100%" align="center" valign="top" bgcolor="#ffffff" style="padding-top:0px">

            <table width="600" border="0" cellpadding="0" cellspacing="0" align="center" class="deviceWidth" style="table-layout: fixed;">
                <tr>
                    <td align="center" style="font-family: Helvetica, sans-serif; padding:0px 10px 0px 10px;">
                <tr>
                 <td height="15"></td>
                 </tr>
                <tr>
                    <td style="padding:0px 0px 20px 0px">
                        <table align="left" width="35%" cellpadding="0" cellspacing="0" border="0" class="deviceWidth">
                            <tr>
                                <td class="deviceWidth" valign="top" align="center" class="center" style="padding:0px 0px 10px 0px">
                                    <p class="deviceWidth" style="mso-table-lspace:0;mso-table-rspace:0; margin:0"><a href="#"><img class="deviceWidth" src="http://image.familysearch.ldschurch.org/lib/fe6315707166057a711d/m/3/6ways440x300.png" alt="" border="0" width="200" style="width: 200px; display: block;" /></a></p>
                                </td>
                            </tr>
                        </table>                       
                        <table style="table-layout: fixed;" align="right" width="63%" cellpadding="0" cellspacing="0" border="0" class="deviceWidth">
                            <tr>

                                <td style="font-size: 24px; line-height: 28px; font-weight: normal; text-align: left; color: #606060; font-family: Helvetica, sans-serif; vertical-align: top; padding:0px 8px 0px 8px">

                                    <table>
                                    </table>
                                    <p style="mso-table-lspace:0;mso-table-rspace:0; margin:0;">  
                                    It is easier than ever to participate in family history. Learn 6 fun ways to get started
                                    </p>
                                </td>
                            </tr>
                        </table>  
                    </td></tr></td>
            </table>
            <!-- END 2 Column with Small Image on Left -->


      <!--[if mso | IE]>
      <table role="presentation" border="0" cellpadding="0" cellspacing="0" width="600" align="center" style="width:600px;">
        <tr>
          <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;">
      <![endif]-->
      <div style="margin:0px auto;max-width:600px;background:#ffffff;">
          <table role="presentation" cellpadding="0" cellspacing="0" style="font-size:0px;width:100%;background:#ffffff;" align="center" border="0">
              <tbody>
                  <tr>
                      <td style="text-align:center;vertical-align:top;direction:ltr;font-size:0px;padding:1px 0px;">
                          <!--[if mso | IE]>
      <table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td style="vertical-align:top;width:400px;">
      <![endif]-->
                          <div aria-labelledby="mj-column-px-400" class="mj-column-px-400 outlook-group-fix" style="vertical-align:top;display:inline-block;direction:ltr;font-size:13px;text-align:left;width:100%;">
                              <table role="presentation" cellpadding="0" cellspacing="0" width="100%" border="0" >
                                  <tbody>
                                      <tr>
                                          <td style="word-break:break-word;font-size:0px;padding:10px 0px;" align="center">
                                              <table role="presentation" cellpadding="0" cellspacing="0" style="border-collapse:separate;width:200px;" align="center" border="0">
                                                  <tbody>
                                                      <tr>
                                                          <td style="border:none;border-radius:3px;color:#ffffff;cursor:auto;height:35px;padding:10px 25px;  box-shadow: #e6e6e6 0px 4px 0px, #174896 0px -30px 50px inset; border-radius: 5px;" align="center" valign="middle" bgcolor="#4688c7"><a href="#" style="text-decoration: none; color: #ffffff; font-family: Helvetica, Arial, sans-serif; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 500; font-size: 22px;" class="buttonText" target="_blank">
                                                                                                Learn More
                                                                                                </a>
                                                          </td>
                                                      </tr>
                                                  </tbody>
                                              </table>
                                          </td>
                                      </tr>
                                  </tbody>
                              </table>
                          </div>
                          <!--[if mso | IE]>
      </td></tr></table>
      <![endif]-->
                      </td>
                  </tr>
              </tbody>
          </table>
      </div>
      <!--[if mso | IE]>
      </td></tr></table>
      <![endif]-->


        </td>
                </tr>
    </table>
    </body>
    </custom>
</html>