<!DOCTYPE html>
<html
  xmlns="http://www.w3.org/1999/xhtml"
  xmlns:v="urn:schemas-microsoft-com:vml"
  xmlns:o="urn:schemas-microsoft-com:office:office"
>
  <head>
    <title> </title>
    <!--[if !mso]><!-->
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <!--<![endif]-->
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <style type="text/css">
      #outlook a {
        padding: 0;
      }

      body {
        margin: 0;
        padding: 0;
        -webkit-text-size-adjust: 100%;
        -ms-text-size-adjust: 100%;
      }

      table,
      td {
        border-collapse: collapse;
        mso-table-lspace: 0pt;
        mso-table-rspace: 0pt;
      }

      img {
        border: 0;
        height: auto;
        line-height: 100%;
        outline: none;
        text-decoration: none;
        -ms-interpolation-mode: bicubic;
      }

      p {
        display: block;
        margin: 13px 0;
      }
    </style>
    <!--[if mso]>
      <noscript>
        <xml>
          <o:OfficeDocumentSettings>
            <o:AllowPNG />
            <o:PixelsPerInch>96</o:PixelsPerInch>
          </o:OfficeDocumentSettings>
        </xml>
      </noscript>
    <![endif]-->
    <!--[if lte mso 11]>
      <style type="text/css">
        .mj-outlook-group-fix {
          width: 100% !important;
        }
      </style>
    <![endif]-->

    <!--[if !mso]><!-->
    <link
      href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700"
      rel="stylesheet"
      type="text/css"
    />
    <link
      href="https://fonts.googleapis.com/css?family=Ubuntu:300,400,500,700"
      rel="stylesheet"
      type="text/css"
    />
    <style type="text/css">
      @import url(https://fonts.googleapis.com/css?family=Roboto:300,400,500,700);
      @import url(https://fonts.googleapis.com/css?family=Ubuntu:300,400,500,700);
    </style>
    <!--<![endif]-->

    <style type="text/css">
      @media only screen and (min-width: 480px) {
        .mj-column-per-100 {
          width: 100% !important;
          max-width: 100%;
        }
      }
    </style>
    <style media="screen and (min-width:480px)">
      .moz-text-html .mj-column-per-100 {
        width: 100% !important;
        max-width: 100%;
      }
    </style>

    <style type="text/css">
      @media only screen and (max-width: 480px) {
        table.mj-full-width-mobile {
          width: 100% !important;
        }

        td.mj-full-width-mobile {
          width: auto !important;
        }
      }

      noinput.mj-menu-checkbox {
        display: block !important;
        max-height: none !important;
        visibility: visible !important;
      }

      @media only screen and (max-width: 480px) {
        .mj-menu-checkbox[type="checkbox"] ~ .mj-inline-links {
          display: none !important;
        }

        .mj-menu-checkbox[type="checkbox"]:checked ~ .mj-inline-links,
        .mj-menu-checkbox[type="checkbox"] ~ .mj-menu-trigger {
          display: block !important;
          max-width: none !important;
          max-height: none !important;
          font-size: inherit !important;
        }

        .mj-menu-checkbox[type="checkbox"] ~ .mj-inline-links > a {
          display: block !important;
        }

        .mj-menu-checkbox[type="checkbox"]:checked
          ~ .mj-menu-trigger
          .mj-menu-icon-close {
          display: block !important;
        }

        .mj-menu-checkbox[type="checkbox"]:checked
          ~ .mj-menu-trigger
          .mj-menu-icon-open {
          display: none !important;
        }
      }
    </style>
  </head>

  <body style="word-spacing: normal">
    <div style="">
      <!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="" role="presentation" style="width:600px;" width="600" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]-->

      <div style="margin: 0px auto; max-width: 600px">
        <table
          align="center"
          border="0"
          cellpadding="0"
          cellspacing="0"
          role="presentation"
          style="width: 100%"
        >
          <tbody>
            <tr>
              <td
                style="
                  direction: ltr;
                  font-size: 0px;
                  padding: 0px;
                  text-align: center;
                "
              >
                <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:600px;" ><![endif]-->

                <div
                  class="mj-column-per-100 mj-outlook-group-fix"
                  style="
                    font-size: 0px;
                    text-align: left;
                    direction: ltr;
                    display: inline-block;
                    vertical-align: top;
                    width: 100%;
                  "
                >
                  <table
                    border="0"
                    cellpadding="0"
                    cellspacing="0"
                    role="presentation"
                    style="vertical-align: top"
                    width="100%"
                  >
                    <tbody>
                      <tr>
                        <td
                          align="center"
                          style="
                            font-size: 0px;
                            padding: 10px 25px;
                            word-break: break-word;
                          "
                        >
                          <table
                            border="0"
                            cellpadding="0"
                            cellspacing="0"
                            role="presentation"
                            style="
                              border-collapse: collapse;
                              border-spacing: 0px;
                            "
                          >
                            <tbody>
                              <tr>
                                <td style="width: 550px">
                                  <img
                                    height="auto"
                                    src="https://raw.githubusercontent.com/mealie-recipes/mealie/9571816ac4eed5beacfc0abf6c03eff1427fd0eb/frontend/static/mealie-email-banner.png"
                                    style="
                                      border: 0;
                                      display: block;
                                      outline: none;
                                      text-decoration: none;
                                      height: auto;
                                      width: 100%;
                                      font-size: 13px;
                                    "
                                    width="550"
                                  />
                                </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><table align="center" border="0" cellpadding="0" cellspacing="0" class="" role="presentation" style="width:600px;" width="600" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]-->

      <div style="margin: 0px auto; max-width: 600px">
        <table
          align="center"
          border="0"
          cellpadding="0"
          cellspacing="0"
          role="presentation"
          style="width: 100%"
        >
          <tbody>
            <tr>
              <td
                style="
                  direction: ltr;
                  font-size: 0px;
                  padding: 20px 0;
                  text-align: center;
                "
              >
                <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:600px;" ><![endif]-->

                <div
                  class="mj-column-per-100 mj-outlook-group-fix"
                  style="
                    font-size: 0px;
                    text-align: left;
                    direction: ltr;
                    display: inline-block;
                    vertical-align: top;
                    width: 100%;
                  "
                >
                  <table
                    border="0"
                    cellpadding="0"
                    cellspacing="0"
                    role="presentation"
                    style="vertical-align: top"
                    width="100%"
                  >
                    <tbody>
                      <tr>
                        <td
                          align="center"
                          style="
                            font-size: 0px;
                            padding: 0px 25px;
                            word-break: break-word;
                          "
                        >
                          <div
                            style="
                              font-family: Roboto, Helvetica Neue, Helvetica,
                                Arial, sans-serif;
                              font-size: 20px;
                              line-height: 1;
                              text-align: center;
                              color: #e38333;
                            "
                          >
                            <h2>{{ data.header_text }}</h2>
                          </div>
                        </td>
                      </tr>

                      <tr>
                        <td
                          align="left"
                          style="
                            font-size: 0px;
                            padding: 10px 25px;
                            word-break: break-word;
                          "
                        >
                          <div
                            style="
                              font-family: Roboto, Helvetica Neue, Helvetica,
                                Arial, sans-serif;
                              font-size: 13px;
                              line-height: 1;
                              text-align: left;
                              color: #000000;
                            "
                          >
                            <div style="text-align: center">
                              <b>Hi there!</b>
                            </div>
                            <div><br /></div>
                            <div style="text-align: center">
                              {{ data.message_top }}
                            </div>
                            <div><br /></div>
                          </div>
                        </td>
                      </tr>

                      <tr>
                        <td
                          align="center"
                          vertical-align="middle"
                          style="
                            font-size: 0px;
                            padding: 10px 25px;
                            word-break: break-word;
                          "
                        >
                          <table
                            border="0"
                            cellpadding="0"
                            cellspacing="0"
                            role="presentation"
                            style="border-collapse: separate; line-height: 100%"
                          >
                            <tbody>
                              <tr>
                                <td
                                  align="center"
                                  bgcolor="#e38333"
                                  role="presentation"
                                  style="
                                    border: none;
                                    border-radius: 3px;
                                    cursor: auto;
                                    mso-padding-alt: 10px 15px;
                                    background: #e38333;
                                  "
                                  valign="middle"
                                >
                                  <a
                                    href="{{ data.button_link }}"
                                    style="
                                      display: inline-block;
                                      background: #e38333;
                                      color: #ffffff;
                                      font-family: Ubuntu, Helvetica, Arial,
                                        sans-serif;
                                      font-size: 13px;
                                      font-weight: 700;
                                      line-height: 120%;
                                      margin: 0;
                                      text-decoration: none;
                                      text-transform: none;
                                      padding: 10px 15px;
                                      mso-padding-alt: 0px;
                                      border-radius: 3px;
                                    "
                                  >
                                    {{ data.button_text}}
                                  </a>
                                </td>
                              </tr>
                            </tbody>
                          </table>
                        </td>
                      </tr>

                      <tr>
                        <td
                          align="left"
                          style="
                            font-size: 0px;
                            padding: 10px 25px;
                            word-break: break-word;
                          "
                        >
                          <div
                            style="
                              font-family: Roboto, Helvetica Neue, Helvetica,
                                Arial, sans-serif;
                              font-size: 10px;
                              line-height: 1.5;
                              text-align: left;
                              color: #000000;
                            "
                          >
                            <div style="text-align: center">
                              {{ data.message_bottom}}
                            </div>
                          </div>
                        </td>
                      </tr>

                      <tr>
                        <td
                          align="center"
                          style="
                            font-size: 0px;
                            padding: 10px 25px;
                            word-break: break-word;
                          "
                        >
                          <table
                            border="0"
                            cellpadding="0"
                            cellspacing="0"
                            role="presentation"
                            style="
                              border-collapse: collapse;
                              border-spacing: 0px;
                            "
                          ></table>
                        </td>
                      </tr>

                      <tr>
                        <td
                          align="center"
                          style="
                            font-size: 0px;
                            padding: 5px 0px;
                            word-break: break-word;
                          "
                        >
                          <div class="mj-inline-links" style="">
                            <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0" align="center"><tr><td style="padding:15px 10px;" class="" ><![endif]-->

                            <a
                              class="mj-link"
                              href="https://github.com/hay-kot/mealie"
                              target="_blank"
                              style="
                                display: inline-block;
                                color: #dd8333;
                                font-family: Roboto, Helvetica Neue, Helvetica,
                                  Arial, sans-serif;
                                font-size: 13px;
                                font-weight: normal;
                                line-height: 22px;
                                text-decoration: none;
                                text-transform: uppercase;
                                padding: 15px 10px;
                              "
                            >
                              Github
                            </a>

                            <!--[if mso | IE]></td><td style="padding:15px 10px;" class="" ><![endif]-->

                            <a
                              class="mj-link"
                              href="https://discord.gg/PfByzb5EKH"
                              target="_blank"
                              style="
                                display: inline-block;
                                color: #dd8333;
                                font-family: Roboto, Helvetica Neue, Helvetica,
                                  Arial, sans-serif;
                                font-size: 13px;
                                font-weight: normal;
                                line-height: 22px;
                                text-decoration: none;
                                text-transform: uppercase;
                                padding: 15px 10px;
                              "
                            >
                              Discord
                            </a>

                            <!--[if mso | IE]></td><td style="padding:15px 10px;" class="" ><![endif]-->

                            <a
                              class="mj-link"
                              href="https://hay-kot.github.io/mealie/"
                              target="_blank"
                              style="
                                display: inline-block;
                                color: #dd8333;
                                font-family: Roboto, Helvetica Neue, Helvetica,
                                  Arial, sans-serif;
                                font-size: 13px;
                                font-weight: normal;
                                line-height: 22px;
                                text-decoration: none;
                                text-transform: uppercase;
                                padding: 15px 10px;
                              "
                            >
                              Documentation
                            </a>

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

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

      <!--[if mso | IE]></td></tr></table><![endif]-->
    </div>
  </body>
</html>
