Hi all, I was wondering if someone could help with my email alignment issue. I'm new to HTML emails and this has been quite a ride! The issue is that the main content is aligned slightly to the write within the whole email body. I would like it perfectly center. I've attached the full code below:


<!DOCTYPE html>
<html>
<head>
  <meta content="width=device-width" name="viewport">
  <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
  <title>Email</title>
</head>
<body class="" style="background-color: #f3f3f3;text-align: center; color: #30265D; font-family: Helvetica Neue, sans-serif;-webkit-font-smoothing: antialiased;color: #30265D;font-size: 14px;line-height: 1.4;margin: 0;padding: 0;-ms-text-size-adjust: 100%;-webkit-text-size-adjust: 100%;">
  <table border="0" cellpadding="0" cellspacing="0" class="body" style="border-collapse: separate;mso-table-lspace: 0pt;mso-table-rspace: 0pt;width: 100%;background-color: #f3f3f3;">


    <!-- Header -->
    <tr>
      <td style="width: 5%;font-family: sans-serif;font-size: 16px !important;vertical-align: top;"></td>
      <td style="font-family: sans-serif;font-size: 16px !important;vertical-align: top;">
        <table style="max-width: 580px;margin: 20px auto;vertical-align: bottom;border-collapse: separate;mso-table-lspace: 0pt;mso-table-rspace: 0pt;width: 100%;">
          <tr>
            <td style="font-family: sans-serif;font-size: 16px !important;vertical-align: top;"><img height="65" src="https://marketing-image-production.s3.amazonaws.com/uploads/8bf664b241329da1b487909697ed9e01a336cad6923a848cac40f780d132ec6b22a6dde554ce42fd15d04d0c87838d3a90a252b68ad251d2ff097550364e9d13.png" style="border: none;-ms-interpolation-mode: bicubic;"></td>
            <td style="font-family: sans-serif;font-size: 16px !important;vertical-align: center;">
              <div style="height: 32px; width: 0; border: #30265D 1px solid; margin: 0 10px 0 10px"></div>
            </td>
            <td style="white-space: nowrap;padding-right: 20px;font-family: sans-serif;font-size: 16px !important;vertical-align: center;">
              <a href="#" style="font-size: 14px;color: #30265D;text-decoration: none;"><img class="icon icons8-Ereader" height="20" src="https://marketing-image-production.s3.amazonaws.com/uploads/fa56cba81a538d5fe052b61b937201198370183a9dfbcc9c985d1a1b62fd9c4ccc6525d043cd9a988b54cafcbdb0e2d44c55964b5cee12ac6e07305a33815eb5.png" style="border: none;-ms-interpolation-mode: bicubic;max-width: 100%; vertical-align:bottom" width="20"> Schedule a lesson</a>
            </td>
            <td style="white-space: nowrap; padding-right: 20px;font-family: sans-serif;font-size: 16px !important;vertical-align: center;">
              <a href="#" style="font-size: 14px;color: #30265D;text-decoration: none;"><img class="icon icons8-User" height="20" src="https://marketing-image-production.s3.amazonaws.com/uploads/7bc15ae28c9183b57e2543195b297e6702ce74fadbc56c5609de411d62011c20d21b43be6302965bd9ec885397054385178471dfa2057e8b7679f1e2a1ec2444.png" style="border: none;-ms-interpolation-mode: bicubic;max-width: 100%; vertical-align:bottom;" width="20"> Become a tutor</a>
            </td>
            <td style="white-space: nowrap; padding-right: 10px;font-family: sans-serif;font-size: 16px !important;vertical-align: center;">
              <a href="#" style="font-size: 14px;color: #30265D;text-decoration: none;"><img class="icon icons8-Ratio" height="20" src="https://marketing-image-production.s3.amazonaws.com/uploads/c057abb590153f6663d037846fad483287e2196966bd84cd4fb5e7a2f18918d656cadbaf717166642459b4db6e22aa786be43381a518414b504ef1cca66d4889.png" style="border: none;-ms-interpolation-mode: bicubic;max-width: 100%; vertical-align:bottom;" width="20"> Earn 20% off</a>
            </td>
          </tr>
        </table>
      </td>
<td style="width: 0%"></td>
      <!-- Header end -->

    </tr>
    <tr>
      <td style="font-family: sans-serif;font-size: 16px !important;vertical-align: top;">&nbsp;</td>
      <td class="container" style="font-family: sans-serif;font-size: 16px !important;vertical-align: top;display: block;max-width: 580px;padding: 0 !important;width: 100% !important;margin: 0 auto !important; color: #30265D;">
        <div class="content" style="box-sizing: border-box;display: block;margin: 0 auto;max-width: 580px;padding: 0 !important;">
          <!-- START CENTERED WHITE CONTAINER -->
          <img src="https://marketing-image-production.s3.amazonaws.com/uploads/3407db44804f6b2f26fc4ceac0781988fd9cdfdb45006294f4e0643fb3bb72b84891ecd1cd6edf48959748f0cf763cbc928ae84a6b13e63edb9e95b07e52b686.gif" style="border: none;-ms-interpolation-mode: bicubic;max-width: 100%;" width="100%">
          <table class="main" style="border-collapse: separate;mso-table-lspace: 0pt;mso-table-rspace: 0pt;width: 100%;background: #ffffff;border-radius: 0 !important;border-left-width: 0 !important;border-right-width: 0 !important; margin-top:-12px">
            <!-- START MAIN CONTENT AREA -->
            <tr>
              <td class="wrapper" style="font-family: sans-serif;font-size: 16px !important;vertical-align: top;box-sizing: border-box;padding: 20px !important;">
                <table border="0" cellpadding="0" cellspacing="0" style="border-collapse: separate;mso-table-lspace: 0pt;mso-table-rspace: 0pt;width: 100%;">
                  <tr>
                    <td style="font-family: sans-serif;font-size: 16px !important;vertical-align: top;">
                      <h1 style="font-family: sans-serif;font-weight: 600;line-height: 1.4;margin: 0;margin-bottom: 30px;font-size: 35px;text-align: center;padding-top: 20px;">Julia</h1>
                      <h2 style="font-family: sans-serif;font-weight: 600;line-height: 1.4;margin: 0;margin-bottom: 30px;">Welcome to LIM!</h2>
                      <p style="text-align: center;font-family: sans-serif;font-size: 20px; font-weight:600;margin: 0;margin-bottom: 15px;">Thank you for joining our<br>community!</p>
                      <p style="text-align: center;font-family: sans-serif;font-size: 18px !important;font-weight: auto;margin: 0;margin-bottom: 15px;">Your account is almost ready - we<br>just need you to activate it now.</p>
                      <button id="rating-button" style="width: 230px;height: 50px;background-color: #673bad;border: 0;color: white;font-size: 20px;margin-top: 20px;margin-bottom: 30px;cursor: pointer;">Activate My Account</button>
                      <p style="text-align: center;font-family: sans-serif;font-size: 18px !important;font-weight: normal;margin: 0;margin-bottom: 1px;">The LIM Team</p><img height="80" src="https://marketing-image-production.s3.amazonaws.com/uploads/6566fddf8ebf7b7c661127a77eaec518602048eab969e8a395a5beeaa77bef50bdf708fc305de88a6435e983df52aa1acd0b5686b15cae8787f7d193701dce50.png" style="margin-top: 10px" width="80">
                    </td>
                  </tr>
                </table>
              </td>
            </tr><!-- END MAIN CONTENT AREA -->
          </table><!-- START FOOTER -->
          <div class="footer" style="clear: both;margin-top: 10px;text-align: center;width: 100%;">
            <table border="0" cellpadding="0" cellspacing="0" style="border-collapse: separate;mso-table-lspace: 0pt;mso-table-rspace: 0pt;width: 100%;">
              <tr>
                <td></td>
              </tr>
              <tr>
                <td style="font-family: sans-serif;font-size: 14px;vertical-align: top;color: #999999;text-align: center;">
                  <table style="width: 100%;border-collapse: separate;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                    <tr>
                      <td style="font-family: sans-serif;font-size: 14px;vertical-align: top;color: #999999;text-align: center;"></td>
                      <td style="font-family: sans-serif;font-size: 14px;vertical-align: top;color: #999999;text-align: center;">
                        <p style="text-align: center;color: #30265d;font-size: 12px;margin-top: 35px;font-family: sans-serif;font-weight: normal;margin: 0;margin-bottom: 15px;">© Language in Motion LLC - USA<br>
                        Schedule a lesson at limlessons.com<br>
                        Questions? · We’re hiring!</p>
                      </td>
                    </tr>
                    <tr>
                      <td style="font-family: sans-serif;font-size: 14px;vertical-align: top;color: #999999;text-align: center;"></td>
                      <td style="font-family: sans-serif;font-size: 14px;vertical-align: top;color: #999999;text-align: center;">
                        <hr noshade style="width: 340px;border-color: #d4d6d4;border-width: 1.5px;margin-bottom: 15px;margin-top: 30px;border: 0;border-bottom: 1px solid #f6f6f6;margin: 20px 0;">
                      </td>
                      <td style="font-family: sans-serif;font-size: 14px;vertical-align: top;color: #999999;text-align: center;"></td>
                    </tr>
                    <tr>
                      <td style="font-family: sans-serif;font-size: 14px;vertical-align: top;color: #999999;text-align: center;"></td>
                      <td style="width: 400px;margin: 0 auto;text-align: center;font-family: sans-serif;font-size: 14px;vertical-align: top;color: #999999;">
                        <p style="color: #30265d;font-size: 14px;display: inline;text-align: center;font-family: sans-serif;font-weight: normal;margin: 0;margin-bottom: 15px;">Join our community:</p><a href="#" style="display: inline;text-decoration: none;color: #30265d;font-size: 14px;text-align: center;"><img height="40" src="https://png.icons8.com/facebook/color/48" style="padding-top: 10px;border: none;-ms-interpolation-mode: bicubic;max-width: 100%; vertical-align:bottom;" title="Facebook" width="40"></a> <a href="#" style="display: inline;text-decoration: none;color: #30265d;font-size: 14px;text-align: center;"><img height="40" src="https://png.icons8.com/instagram/color/48" style="padding-top: 10px;border: none;-ms-interpolation-mode: bicubic;max-width: 100%; vertical-align:bottom;" title="Instagram" width="40"></a> <a href="#" style="display: inline;text-decoration: none;color: #30265d;font-size: 14px;text-align: center;"><img height="40" src="https://png.icons8.com/play-button/color/48" style="padding-top: 10px;border: none;-ms-interpolation-mode: bicubic;max-width: 100%; vertical-align:bottom;" title="Play Button" width="44"></a>
                      </td>
                    </tr>
                  </table>
                </td>
              </tr>
            </table>
          </div>
        </div>
      </td>
    </tr>
  </table><!-- END FOOTER -->
  <!-- END CENTERED WHITE CONTAINER -->
  <table>
    <tr>
      <td style="font-family: sans-serif;font-size: 16px !important;vertical-align: top;">&nbsp;</td>
    </tr>
  </table>
</body>
</html>