Action

<mjml lang="en">
  <mj-head>
    <mj-raw>
      <link rel="preconnect" href="https://fonts.googleapis.com">
      <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    </mj-raw>
    <mj-font name="Inter"
      href="https://fonts.googleapis.com/css2?family=Inter:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800&display=swap" />

    <mj-style>
      body {
      padding: 24px 24px;
      }

      .link {
      color: #2B7FFF;
      text-decoration: none;
      font-weight: 500;
      }
    </mj-style>
  </mj-head>
  <mj-body>
    <mj-wrapper full-width="full-width" background-color="#FFFFFF">
      <mj-section padding="0">
        <mj-column padding="0">
          <mj-image src="https://www.mailbites.io/assets/logo.png" width="164px"
            padding="0" align="left" />

          <mj-text padding="36px 0px 12px 0px"
            font-family="Inter, Helvetica, Arial, sans-serif">
            <h2 style="margin: 0; line-height: 28px">
              Hi @emmakit 🚀
            </h2>
          </mj-text>

          <mj-text padding="0" color="#7C7C7C" font-size="15px"
            line-height="24px" font-weight="400"
            font-family="Inter, Helvetica, Arial, sans-serif">
            At vero eos et accusamus et iusto odio dignissimos ducimus qui
            blanditiis praesentium voluptatum deleniti atque corrupti quos
            dolores et quas molestias excepturi sint occaecati cupiditate non
            provident.
          </mj-text>

          <mj-button href="#" align="left" background-color="#2B7FFF"
            color="#FFFFFF" border-radius="6px" padding="32px 0px 12px 0px"
            inner-padding="8px 16px" font-size="14px" font-weight="500"
            font-family="Inter, Helvetica, Arial, sans-serif">
            Take action
          </mj-button>

          <mj-text padding="0" color="#7C7C7C" font-size="12px"
            line-height="20px" font-weight="400"
            font-family="Inter, Helvetica, Arial, sans-serif">
            Cras ac eros vitae lorem scelerisque feugiat. Quisque commodo auctor
            felis, a Interdum ante dictum pharetra. Suspendisse gravida nec
            massa in blandit.
          </mj-text>
        </mj-column>
      </mj-section>

      <mj-section padding="24px 0px 0px 0px">
        <mj-column padding="0">
          <mj-divider border-width="1px" border-color="#F0F0F0"
            padding="0px 0px 20px 0px" />

          <mj-text padding="0px 0px 12px 0px" color="#000000" font-size="14px"
            line-height="24px" font-weight="400"
            font-family="Inter, Helvetica, Arial, sans-serif">
            Too many emails? <a href="https://www.mailbites.io" class="link">Manage
              your preferences</a> or <a href="https://www.mailbites.io"
              class="link">unsubscribe</a>.
          </mj-text>

          <mj-text padding="0" color="#7C7C7C" font-size="12px"
            line-height="16px" font-weight="400"
            font-family="Inter, Helvetica, Arial, sans-serif">
            Copyright © Mailbites. All rights reserved.<br />
            John Doe Ave., 32349 Faketown
          </mj-text>
        </mj-column>
      </mj-section>
    </mj-wrapper>
  </mj-body>
</mjml>