Pen Settings

HTML

CSS

CSS Base

Vendor Prefixing

Add External Stylesheets/Pens

Any URLs added here will be added as <link>s in order, and before the CSS in the editor. You can use the CSS from another Pen by using its URL and the proper URL extension.

+ add another resource

JavaScript

Babel includes JSX processing.

Add External Scripts/Pens

Any URL's added here will be added as <script>s in order, and run before the JavaScript in the editor. You can use the URL of any other Pen and it will include the JavaScript from that Pen.

+ add another resource

Packages

Add Packages

Search for and use JavaScript packages from npm here. By selecting a package, an import statement will be added to the top of the JavaScript editor for this package.

Behavior

Auto Save

If active, Pens will autosave every 30 seconds after being saved once.

Auto-Updating Preview

If enabled, the preview panel updates automatically as you code. If disabled, use the "Run" button to update.

Format on Save

If enabled, your code will be formatted when you actively save your Pen. Note: your code becomes un-folded during formatting.

Editor Settings

Code Indentation

Want to change your Syntax Highlighting theme, Fonts and more?

Visit your global Editor Settings.

HTML

              
                <!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>Getting the Most Out of MindNode for iOS (2/3)</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;
    }

    .ReadMsgBody {
      width: 100%;
    }

    .ExternalClass {
      width: 100%;
    }

    .ExternalClass * {
      line-height: 100%;
    }

    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]><!-->
  <style type="text/css">
    @media only screen and (max-width:480px) {
      @-ms-viewport {
        width: 320px;
      }
      @viewport {
        width: 320px;
      }
    }
  </style>
  <!--<![endif]-->
  <!--[if mso]>
        <xml>
        <o:OfficeDocumentSettings>
          <o:AllowPNG/>
          <o:PixelsPerInch>96</o:PixelsPerInch>
        </o:OfficeDocumentSettings>
        </xml>
        <![endif]-->
  <!--[if lte mso 11]>
        <style type="text/css">
          .outlook-group-fix { width:100% !important; }
        </style>
        <![endif]-->
  <!--[if !mso]><!-->
  <link href="https://newsletter.mindnode.com/assets/css/fonts.css" rel="stylesheet" type="text/css">
  <style type="text/css">
    @import url(https://newsletter.mindnode.com/assets/css/fonts.css);
  </style>
  <!--<![endif]-->
  <style type="text/css">
    @media only screen and (min-width:480px) {
      .mj-column-per-100 {
        width: 100% !important;
        max-width: 100%;
      }
      .mj-column-per-60 {
        width: 60% !important;
        max-width: 60%;
      }
      .mj-column-per-40 {
        width: 40% !important;
        max-width: 40%;
      }
    }
  </style>
  <style type="text/css">
    @media only screen and (max-width:480px) {
      table.full-width-mobile {
        width: 100% !important;
      }
      td.full-width-mobile {
        width: auto !important;
      }
    }
  </style>
</head>

<body style="background-color:#f4f6fc;">
  <div style="display:none;font-size:1px;color:#ffffff;line-height:1px;max-height:0px;max-width:0px;opacity:0;overflow:hidden;">Let's cultivate the context in your mind maps.</div>
  <div style="background-color:#f4f6fc;">
    <!-- PRE-HEADER -->
    <!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="" 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 0px 20px 0px;text-align:center;vertical-align:top;">
              <!--[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 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
                <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                  <tbody>
                    <tr>
                      <td style="vertical-align:top;padding:0;">
                        <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                          <tr>
                            <td align="left" style="font-size:0px;padding:0px 0px 0px 25px;word-break:break-word;">
                              <div style="font-family:PaulGroteskSoft, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:12px;font-weight:100;line-height:23px;text-align:left;color:#4b4b4b;">
                                <p style="text-align:right; margin:10px 5px; color:#8e8e8e">Getting the Most Out of MindNode for iOS - Part&nbsp;2&nbsp;of&nbsp;3</p>
                              </div>
                            </td>
                          </tr>
                        </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]-->
    <!-- HEADER -->
    <!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]-->
    <div style="background:#ffffff;background-color:#ffffff;Margin:0px auto;max-width:600px;">
      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#ffffff;background-color:#ffffff;width:100%;">
        <tbody>
          <tr>
            <td style="direction:ltr;font-size:0px;padding:20px 0;text-align:center;vertical-align:top;">
              <!--[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 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
                <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                  <tbody>
                    <tr>
                      <td style="vertical-align:top;padding:0;">
                        <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                          <tr>
                            <td align="center" style="font-size:0px;padding:50px 0 0 0;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:600px;"><img alt="MindNode for iOS" height="auto" src="https://newsletter.mindnode.com/assets/mindnode-ios-logo-on-white-1200.jpg" style="margin: 0px; border: none; display: block; outline: none; text-decoration: none; height: auto; width: 100%;"
                                        title="MindNode Logo" width="600"></td>
                                  </tr>
                                </tbody>
                              </table>
                            </td>
                          </tr>
                          <tr>
                            <td align="center" style="font-size:0px;padding:10px 0 0 0;word-break:break-word;">
                              <div style="font-family:PaulGroteskSoft, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:16px;font-weight:100;line-height:23px;text-align:center;color:#4b4b4b;">
                                <h1 style="color: #4b4b4b; font-weight: 400; font-size: 32px; line-height: 46px;">Cultivating Context</h1>
                              </div>
                            </td>
                          </tr>
                          <tr>
                            <td align="center" style="font-size:0px;padding:0 0 60px 0;word-break:break-word;">
                              <div style="font-family:PaulGroteskSoft, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:16px;font-weight:100;line-height:23px;text-align:center;color:#75a7df;">- Getting the Most Out of MindNode for iOS -</div>
                            </td>
                          </tr>
                          <tr>
                            <td align="center" style="font-size:0px;padding:10px 0px;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:600px;"><img alt height="706" src="https://newsletter.mindnode.com/assets/series/onboarding/mindnode_onboarding-email-2-header.gif" style="margin: 0px; border: none; display: block; outline: none; text-decoration: none; height: 706px; width: 100%;"
                                        width="600"></td>
                                  </tr>
                                </tbody>
                              </table>
                            </td>
                          </tr>
                        </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]-->
    <!-- MAIN CONTENT -->
    <!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]-->
    <div style="background:#ffffff;background-color:#ffffff;Margin:0px auto;max-width:600px;">
      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#ffffff;background-color:#ffffff;width:100%;">
        <tbody>
          <tr>
            <td style="direction:ltr;font-size:0px;padding:20px 50px;text-align:center;vertical-align:top;">
              <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:500px;" ><![endif]-->
              <div class="mj-column-per-100 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
                <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                  <tbody>
                    <tr>
                      <td style="vertical-align:top;padding:0;">
                        <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                          <tr>
                            <td align="left" style="font-size:0px;padding:15px 0;word-break:break-word;">
                              <div style="font-family:PaulGroteskSoft, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:16px;font-weight:100;line-height:23px;text-align:left;color:#4b4b4b;">
                                <h2 style="font-size: 32px; font-weight: 400; line-height: 48px; color: #6c6cd7; margin-top: 0px;">More Thoughts<br>Call For More Context</h2>
                                <p style="margin:20px 0">Not all thoughts are alike, and not all ideas will fit into a node's title. This is why we have created features like notes, tasks, and connections for you. Here is how you can use them:</p>
                              </div>
                            </td>
                          </tr>
                        </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="" style="width:600px;" width="600" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]-->
    <div style="background:#ffffff;background-color:#ffffff;Margin:0px auto;max-width:600px;">
      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#ffffff;background-color:#ffffff;width:100%;">
        <tbody>
          <tr>
            <td style="direction:ltr;font-size:0px;padding:20px 50px 0 50px;text-align:center;vertical-align:top;">
              <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:300px;" ><![endif]-->
              <div class="mj-column-per-60 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
                <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                  <tbody>
                    <tr>
                      <td style="vertical-align:top;padding:0;">
                        <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                          <tr>
                            <td align="center" style="font-size:0px;padding:0 30px 20px 0;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:270px;"><img height="270" src="https://newsletter.mindnode.com/assets/series/onboarding/mindnode_onboarding-email-2-part-1-ios.gif" style="margin: 0px; border: none; display: block; outline: none; text-decoration: none; height: 270px; width: 100%;"
                                        width="270"></td>
                                  </tr>
                                </tbody>
                              </table>
                            </td>
                          </tr>
                        </table>
                      </td>
                    </tr>
                  </tbody>
                </table>
              </div>
              <!--[if mso | IE]></td><td class="" style="vertical-align:top;width:200px;" ><![endif]-->
              <div class="mj-column-per-40 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
                <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                  <tbody>
                    <tr>
                      <td style="vertical-align:top;padding:0;">
                        <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                          <tr>
                            <td align="left" style="font-size:0px;padding:0;word-break:break-word;">
                              <div style="font-family:PaulGroteskSoft, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:16px;font-weight:100;line-height:23px;text-align:left;color:#4b4b4b;">
                                <h3 style="font-size: 23px; font-weight: 400; line-height: 30px; margin-top: 0px;">1. Notes: The Ideas Behind Ideas</h3>
                                <p style="margin:20px 0">Want to keep the node title slick? Use the <b>notes field in the Notes Panel to add further details.</b></p>
                              </div>
                            </td>
                          </tr>
                        </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="" style="width:600px;" width="600" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]-->
    <div style="background:#ffffff;background-color:#ffffff;Margin:0px auto;max-width:600px;">
      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#ffffff;background-color:#ffffff;width:100%;">
        <tbody>
          <tr>
            <td style="direction:ltr;font-size:0px;padding:0 50px 60px 50px;text-align:center;vertical-align:top;">
              <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:500px;" ><![endif]-->
              <div class="mj-column-per-100 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
                <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                  <tbody>
                    <tr>
                      <td style="vertical-align:top;padding:0;">
                        <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                          <table style="float:left; text-align:left; color:#8e8e8e; font-size:12px; font-family:PaulGroteskSoft, 'Helvetica Neue', Helvetica, Arial, sans-serif">
                            <tbody>
                              <tr>
                                <td colspan="2" style="padding-bottom:10px">Keyboard shortcuts:</td>
                              </tr>
                              <tr>
                                <td style="width:240px; font-size:20px; vertical-align:top"><img src="https://newsletter.mindnode.com/assets/series/onboarding/b_cmd.gif" width="58" height="30" style="border: 0px; margin: 0px; width: 58px; height: 30px;" alt="⌘"> <span style="position:relative; top:-10px">&nbsp;+&nbsp;</span>                                  <img src="https://newsletter.mindnode.com/assets/series/onboarding/b_3.gif" width="34" height="30" style="border: 0px; margin: 0px; width: 34px; height: 30px;" alt="4"></td>
                                <td><strong>Show Notes Inspector</strong></td>
                              </tr>
                              <tr>
                                <td style="width:240px; font-size:20px; padding-bottom:10px"><img src="https://newsletter.mindnode.com/assets/series/onboarding/b_option.gif" width="58" height="30" style="border: 0px; margin: 0px; width: 58px; height: 30px;" alt="⌘"> <span style="position:relative; top:-10px">&nbsp;+&nbsp;</span>                                  <img src="https://newsletter.mindnode.com/assets/series/onboarding/b_cmd.gif" width="58" height="30" style="border: 0px; margin: 0px; width: 58px; height: 30px;" alt="⇧"> <span style="position:relative; top:-10px">&nbsp;+&nbsp;</span>                                  <img src="https://newsletter.mindnode.com/assets/series/onboarding/b_3.gif" width="34" height="30" style="border: 0px; margin: 0px; width: 34px; height: 30px;" alt="K"></td>
                                <td style="padding-bottom:10px"><strong>Show Notes Popover</strong></td>
                              </tr>
                            </tbody>
                          </table>
                        </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="" style="width:600px;" width="600" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]-->
    <div style="background:#ffffff;background-color:#ffffff;Margin:0px auto;max-width:600px;">
      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#ffffff;background-color:#ffffff;width:100%;">
        <tbody>
          <tr>
            <td style="direction:ltr;font-size:0px;padding:40px 50px 0 50px;text-align:center;vertical-align:top;">
              <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:200px;" ><![endif]-->
              <div class="mj-column-per-40 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
                <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                  <tbody>
                    <tr>
                      <td style="vertical-align:top;padding:0;">
                        <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                          <tr>
                            <td align="right" style="font-size:0px;padding:0;word-break:break-word;">
                              <div style="font-family:PaulGroteskSoft, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:16px;font-weight:100;line-height:23px;text-align:right;color:#4b4b4b;">
                                <h3 style="font-size: 23px; font-weight: 400; line-height: 30px; margin-top: 0px;">2. Tasks: Getting Thoughts Done</h3>
                                <p style="margin:20px 0">Your thoughts are actually to-dos? Simply convert nodes into tasks by <b>tapping "Add Task" in the Action Inspector in the floating panel.</b><br><br>Mark them as done by tapping on the circle.</p>
                              </div>
                            </td>
                          </tr>
                        </table>
                      </td>
                    </tr>
                  </tbody>
                </table>
              </div>
              <!--[if mso | IE]></td><td class="" style="vertical-align:top;width:300px;" ><![endif]-->
              <div class="mj-column-per-60 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
                <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                  <tbody>
                    <tr>
                      <td style="vertical-align:top;padding:0;">
                        <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                          <tr>
                            <td align="center" style="font-size:0px;padding:0 0 20px 30px;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:270px;"><img height="270" src="https://newsletter.mindnode.com/assets/series/onboarding/mindnode_onboarding-email-2-part-2-ios.gif" style="margin: 0px; border: none; display: block; outline: none; text-decoration: none; height: 270px; width: 100%;"
                                        width="270"></td>
                                  </tr>
                                </tbody>
                              </table>
                            </td>
                          </tr>
                        </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="" style="width:600px;" width="600" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]-->
    <div style="background:#ffffff;background-color:#ffffff;Margin:0px auto;max-width:600px;">
      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#ffffff;background-color:#ffffff;width:100%;">
        <tbody>
          <tr>
            <td style="direction:ltr;font-size:0px;padding:0 50px 60px 50px;text-align:center;vertical-align:top;">
              <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:500px;" ><![endif]-->
              <div class="mj-column-per-100 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
                <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                  <tbody>
                    <tr>
                      <td style="vertical-align:top;padding:0;">
                        <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                          <table style="float:right; text-align:right; color:#8e8e8e; font-size:12px; font-family:PaulGroteskSoft, 'Helvetica Neue', Helvetica, Arial, sans-serif">
                            <tbody>
                              <tr>
                                <td colspan="2" style="padding-bottom:10px">Keyboard shortcuts:</td>
                              </tr>
                              <tr>
                                <td style="padding-bottom:10px"><strong>Convert&nbsp;Node to Task&nbsp;</strong></td>
                                <td style="width:240px; font-size:20px; padding-bottom:10px"><img src="https://newsletter.mindnode.com/assets/series/onboarding/b_shift.gif" width="58" height="30" style="border: 0px; margin: 0px; width: 58px; height: 30px;" alt="⇧"> <span style="position:relative; top:-10px">&nbsp;+&nbsp;</span>                                  <img src="https://newsletter.mindnode.com/assets/series/onboarding/b_cmd.gif" width="58" height="30" style="border: 0px; margin: 0px; width: 58px; height: 30px;" alt="⌘"> <span style="position:relative; top:-10px">&nbsp;+&nbsp;</span>                                  <img src="https://newsletter.mindnode.com/assets/series/onboarding/b_t.gif" width="34" height="30" style="border: 0px; margin: 0px; width: 34px; height: 30px;" alt="T"></td>
                              </tr>
                              <tr>
                                <td><strong>Mark Task as &quot;Done&quot;</strong></td>
                                <td style="width:240px; font-size:20px"><img src="https://newsletter.mindnode.com/assets/series/onboarding/b_control.gif" width="58" height="30" style="border: 0px; margin: 0px; width: 58px; height: 30px;" alt="⌘"> <span style="position:relative; top:-10px">&nbsp;+&nbsp;</span>                                  <img src="https://newsletter.mindnode.com/assets/series/onboarding/b_cmd.gif" width="58" height="30" style="border: 0px; margin: 0px; width: 58px; height: 30px;" alt="⌘"> <span style="position:relative; top:-10px">&nbsp;+&nbsp;</span>                                  <img src="https://newsletter.mindnode.com/assets/series/onboarding/b_t.gif" width="34" height="30" style="border: 0px; margin: 0px; width: 34px; height: 30px;" alt="U"></td>
                              </tr>
                            </tbody>
                          </table>
                        </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="" style="width:600px;" width="600" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]-->
    <div style="background:#ffffff;background-color:#ffffff;Margin:0px auto;max-width:600px;">
      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#ffffff;background-color:#ffffff;width:100%;">
        <tbody>
          <tr>
            <td style="direction:ltr;font-size:0px;padding:40px 50px 0 50px;text-align:center;vertical-align:top;">
              <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:300px;" ><![endif]-->
              <div class="mj-column-per-60 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
                <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                  <tbody>
                    <tr>
                      <td style="vertical-align:top;padding:0;">
                        <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                          <tr>
                            <td align="center" style="font-size:0px;padding:0 30px 20px 0;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:270px;"><img height="270" src="https://newsletter.mindnode.com/assets/series/onboarding/mindnode_onboarding-email-2-part-3-ios.gif" style="margin: 0px; border: none; display: block; outline: none; text-decoration: none; height: 270px; width: 100%;"
                                        width="270"></td>
                                  </tr>
                                </tbody>
                              </table>
                            </td>
                          </tr>
                        </table>
                      </td>
                    </tr>
                  </tbody>
                </table>
              </div>
              <!--[if mso | IE]></td><td class="" style="vertical-align:top;width:200px;" ><![endif]-->
              <div class="mj-column-per-40 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
                <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                  <tbody>
                    <tr>
                      <td style="vertical-align:top;padding:0;">
                        <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                          <tr>
                            <td align="left" style="font-size:0px;padding:0;word-break:break-word;">
                              <div style="font-family:PaulGroteskSoft, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:16px;font-weight:100;line-height:23px;text-align:left;color:#4b4b4b;">
                                <h3 style="font-size: 23px; font-weight: 400; line-height: 30px; margin-top: 0px;">3. Connections: Tie Thoughts Together</h3>
                                <p style="margin:20px 0"><b>Select a node and tap the "Connect" button</b> in the Action Inspector in the floating panel.<br><br>A separate menu will show up where you can add and edit the <b>connection title.</b></p>
                              </div>
                            </td>
                          </tr>
                        </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="" style="width:600px;" width="600" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]-->
    <div style="background:#ffffff;background-color:#ffffff;Margin:0px auto;max-width:600px;">
      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#ffffff;background-color:#ffffff;width:100%;">
        <tbody>
          <tr>
            <td style="direction:ltr;font-size:0px;padding:0 50px 60px 50px;text-align:center;vertical-align:top;">
              <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:500px;" ><![endif]-->
              <div class="mj-column-per-100 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
                <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                  <tbody>
                    <tr>
                      <td style="vertical-align:top;padding:0;">
                        <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                          <table style="float:left; text-align:left; color:#8e8e8e; font-size:12px; font-family:PaulGroteskSoft, 'Helvetica Neue', Helvetica, Arial, sans-serif">
                            <tbody>
                              <tr>
                                <td colspan="2" style="padding-bottom:10px">Keyboard shortcuts:</td>
                              </tr>
                              <tr>
                                <td style="width:170px; font-size:20px; padding-bottom:10px"><img src="https://newsletter.mindnode.com/assets/series/onboarding/b_cmd.gif" width="58" height="30" style="border: 0px; margin: 0px; width: 58px; height: 30px;" alt="⌘"> <span style="position:relative; top:-10px">&nbsp;+&nbsp;</span>                                  <img src="https://newsletter.mindnode.com/assets/series/onboarding/b_l.gif" width="34" height="30" style="border: 0px; margin: 0px; width: 34px; height: 30px;" alt="L"></td>
                                <td style="padding-bottom:10px"><strong>Connect 2 Selected Nodes</strong></td>
                              </tr>
                            </tbody>
                          </table>
                        </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]-->
    <!-- CTA -->
    <!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]-->
    <div style="background:#ffffff;background-color:#ffffff;Margin:0px auto;max-width:600px;">
      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#ffffff;background-color:#ffffff;width:100%;">
        <tbody>
          <tr>
            <td style="direction:ltr;font-size:0px;padding:20px 50px 30px 50px;text-align:center;vertical-align:top;">
              <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:500px;" ><![endif]-->
              <div class="mj-column-per-100 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
                <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                  <tbody>
                    <tr>
                      <td style="vertical-align:top;padding:0;">
                        <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                          <tr>
                            <td align="center" style="font-size:0px;padding:0;word-break:break-word;">
                              <div style="font-family:PaulGroteskSoft, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:16px;font-weight:100;line-height:23px;text-align:center;color:#4b4b4b;">
                                <h4 style="font-weight: 400; font-size: 18px; margin-bottom: 10px;">What's on your mind?</h4>
                                <p style="margin-top:0">Open MindNode and...</p>
                              </div>
                            </td>
                          </tr>
                          <tr>
                            <td align="center" vertical-align="middle" style="font-size:0px;padding:0;word-break:break-word;">
                              <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse:separate;width:190px;line-height:100%;">
                                <tr>
                                  <td align="center" bgcolor="#ff5f69" role="presentation" style="border:none;border-radius:5px;cursor:auto;padding:25px;background:#ff5f69;" valign="middle"><a href="mindnode://newDocument" style="background: #ff5f69; color: white; font-family: PaulGroteskSoft, 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 16px; font-weight: bold; line-height: 23px; Margin: 0; text-decoration: none; text-transform: none;"
                                      target="_blank"><span style="font-size: 18px !important;">Give It Some Context</span></a></td>
                                </tr>
                              </table>
                            </td>
                          </tr>
                        </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]-->
    <!-- HELP SECTION -->
    <!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]-->
    <div style="background:#ffffff;background-color:#ffffff;Margin:0px auto;max-width:600px;">
      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#ffffff;background-color:#ffffff;width:100%;">
        <tbody>
          <tr>
            <td style="direction:ltr;font-size:0px;padding:0 50px 20px 50px;text-align:center;vertical-align:top;">
              <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:500px;" ><![endif]-->
              <div class="mj-column-per-100 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
                <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                  <tbody>
                    <tr>
                      <td style="vertical-align:top;padding:0;">
                        <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                          <tr>
                            <td style="font-size:0px;padding:30px 0 50px 0;word-break:break-word;">
                              <p style="border-top:solid 2px #f3f3f3;font-size:1;margin:0px auto;width:100%;"></p>
                              <!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" style="border-top:solid 2px #f3f3f3;font-size:1;margin:0px auto;width:500px;" role="presentation" width="500px" ><tr><td style="height:0;line-height:0;"> &nbsp;
</td></tr></table><![endif]-->
                            </td>
                          </tr>
                          <tr>
                            <td align="left" style="font-size:0px;padding:0;word-break:break-word;">
                              <div style="font-family:PaulGroteskSoft, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:16px;font-weight:100;line-height:23px;text-align:left;color:#4b4b4b;">
                                <h4 style="font-weight: 400; font-size: 18px; margin-bottom: 10px;">Need More Help?</h4>
                              </div>
                            </td>
                          </tr>
                          <table width="100%" style="width:100%; font-family:PaulGroteskSoft, 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size:16px; line-height:23px; color: #4b4b4b">
                            <tbody>
                              <tr>
                                <td><br><img src="https://newsletter.mindnode.com/assets/icon_twitter.gif" width="57" height="48" style="border: 0px; margin: 0px; width: 57px; height: 48px;" alt></td>
                                <td style="vertical-align:middle; padding:10px 0 0 20px"><strong>If you want to join the conversation about MindNode, or if you need any help, <a href="https://twitter.com/intent/tweet?text=@mindnode%20" target="_blank" style="color: #5a5ad2;">send us a tweet.</a></strong></td>
                              </tr>
                              <tr>
                                <td colspan="2" style="padding:40px 0 15px 0">Do you have a specific question?</td>
                              </tr>
                              <tr style="height:40px">
                                <td><img src="https://newsletter.mindnode.com/assets/icon_support.gif" width="20" height="34" style="border: 0px; margin: 0px; width: 20px; height: 34px;" alt></td>
                                <td>Visit our <a href="https://MindNode.com/support" target="_blank" style="color: #5a5ad2;">support page.</a></td>
                              </tr>
                              <tr style="height:40px">
                                <td><img src="https://newsletter.mindnode.com/assets/icon_email.gif" width="30" height="25" style="border: 0px; margin: 0px; width: 30px; height: 25px;" alt></td>
                                <td>Write us an <a href="/cdn-cgi/l/email-protection#2f5c5a5f5f405d5b6f4246414b41404b4a014c4042" style="color: #5a5ad2;">email.</a></td>
                              </tr>
                            </tbody>
                          </table>
                        </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]-->
    <!-- LINK TO MAC VERSION -->
    <!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]-->
    <div style="background:#ffffff;background-color:#ffffff;Margin:0px auto;max-width:600px;">
      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#ffffff;background-color:#ffffff;width:100%;">
        <tbody>
          <tr>
            <td style="direction:ltr;font-size:0px;padding:0;text-align:center;vertical-align:top;">
              <!--[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 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
                <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                  <tbody>
                    <tr>
                      <td style="border-bottom:1px solid #e6e6e6;vertical-align:top;padding:0;">
                        <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                          <tr>
                            <td style="font-size:0px;padding:40px 50px;word-break:break-word;">
                              <p style="border-top:solid 2px #f3f3f3;font-size:1;margin:0px auto;width:100%;"></p>
                              <!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" style="border-top:solid 2px #f3f3f3;font-size:1;margin:0px auto;width:500px;" role="presentation" width="500px" ><tr><td style="height:0;line-height:0;"> &nbsp;
</td></tr></table><![endif]-->
                            </td>
                          </tr>
                          <tr>
                            <td align="left" style="font-size:0px;padding:0 50px 50px 50px;word-break:break-word;">
                              <div style="font-family:PaulGroteskSoft, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:16px;font-weight:100;line-height:23px;text-align:left;color:#4b4b4b;">
                                <p style="margin:10px 0"></p>
                                <h4 style="font-weight: 400; font-size: 18px; margin-bottom: 10px;">Not Working on iOS?</h4><span>There's also a guide to&nbsp;<a target="_blank" href="https://newsletter.mindnode.com/onboarding-mac-02.html" style="color: #5a5ad2;">get the most out of MindNode for Mac.</a></span>
                                <p></p>
                              </div>
                            </td>
                          </tr>
                        </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]-->
    <!-- FOOTER -->
    <!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" class="" style="width:600px;" width="600" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]-->
    <div style="background:#f3f3f3;background-color:#f3f3f3;Margin:0px auto;max-width:600px;">
      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#f3f3f3;background-color:#f3f3f3;width:100%;">
        <tbody>
          <tr>
            <td style="direction:ltr;font-size:0px;padding:30px 0px 20px 0px;text-align:center;vertical-align:top;">
              <!--[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 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
                <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                  <tbody>
                    <tr>
                      <td style="vertical-align:top;padding:0;">
                        <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                          <tr>
                            <td align="center" style="font-size:0px;padding:0;word-break:break-word;">
                              <!--[if mso | IE]><table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" ><tr><td><![endif]-->
                              <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;">
                                <tr>
                                  <td style="padding:15px;">
                                    <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#6e6e6e;border-radius:3px;width:20px;">
                                      <tr>
                                        <td style="font-size:0;height:20px;vertical-align:middle;width:20px;"><a href="https://twitter.com/mindnode" target="_blank" style="color: #5a5ad2;"><img height="20" src="https://www.mailjet.com/images/theme/v1/icons/ico-social/twitter.png" style="border: 0px; margin: 0px; border-radius: 3px;" width="20"></a></td>
                                      </tr>
                                    </table>
                                  </td>
                                </tr>
                              </table>
                              <!--[if mso | IE]></td><td><![endif]-->
                              <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;">
                                <tr>
                                  <td style="padding:15px;">
                                    <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#6e6e6e;border-radius:3px;width:20px;">
                                      <tr>
                                        <td style="font-size:0;height:20px;vertical-align:middle;width:20px;"><a href="https://facebook.com/mindnode" target="_blank" style="color: #5a5ad2;"><img height="20" src="https://www.mailjet.com/images/theme/v1/icons/ico-social/facebook.png" style="border: 0px; margin: 0px; border-radius: 3px;" width="20"></a></td>
                                      </tr>
                                    </table>
                                  </td>
                                </tr>
                              </table>
                              <!--[if mso | IE]></td><td><![endif]-->
                              <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;">
                                <tr>
                                  <td style="padding:15px;">
                                    <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#6e6e6e;border-radius:3px;width:20px;">
                                      <tr>
                                        <td style="font-size:0;height:20px;vertical-align:middle;width:20px;"><a href="https://www.youtube.com/MindNodeApp" target="_blank" style="color: #5a5ad2;"><img height="20" src="https://www.mailjet.com/images/theme/v1/icons/ico-social/youtube.png" style="border: 0px; margin: 0px; border-radius: 3px;" width="20"></a></td>
                                      </tr>
                                    </table>
                                  </td>
                                </tr>
                              </table>
                              <!--[if mso | IE]></td><td><![endif]-->
                              <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;">
                                <tr>
                                  <td style="padding:15px;">
                                    <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#6e6e6e;border-radius:3px;width:20px;">
                                      <tr>
                                        <td style="font-size:0;height:20px;vertical-align:middle;width:20px;"><a href="https://github.com/ideasoncanvas" target="_blank" style="color: #5a5ad2;"><img height="20" src="https://www.mailjet.com/images/theme/v1/icons/ico-social/github.png" style="border: 0px; margin: 0px; border-radius: 3px;" width="20"></a></td>
                                      </tr>
                                    </table>
                                  </td>
                                </tr>
                              </table>
                              <!--[if mso | IE]></td><td><![endif]-->
                              <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="float:none;display:inline-table;">
                                <tr>
                                  <td style="padding:15px;">
                                    <table border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#6e6e6e;border-radius:3px;width:20px;">
                                      <tr>
                                        <td style="font-size:0;height:20px;vertical-align:middle;width:20px;"><a href="https://mindnode.com" target="_blank" style="color: #5a5ad2;"><img height="20" src="https://www.mailjet.com/images/theme/v1/icons/ico-social/web.png" style="border: 0px; margin: 0px; border-radius: 3px;" width="20"></a></td>
                                      </tr>
                                    </table>
                                  </td>
                                </tr>
                              </table>
                              <!--[if mso | IE]></td></tr></table><![endif]-->
                            </td>
                          </tr>
                        </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="" style="width:600px;" width="600" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]-->
    <div style="background:#f3f3f3;background-color:#f3f3f3;Margin:0px auto;max-width:600px;">
      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#f3f3f3;background-color:#f3f3f3;width:100%;">
        <tbody>
          <tr>
            <td style="direction:ltr;font-size:0px;padding:0px 50px 20px 50px;text-align:center;vertical-align:top;">
              <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:500px;" ><![endif]-->
              <div class="mj-column-per-100 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
                <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                  <tbody>
                    <tr>
                      <td style="vertical-align:top;padding:0;">
                        <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                          <tr>
                            <td align="center" style="font-size:0px;padding:0px 20px;word-break:break-word;">
                              <div style="font-family:PaulGroteskSoft, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:12px;font-weight:100;line-height:23px;text-align:center;color:#6e6e6e;"></div>
                            </td>
                          </tr>
                        </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="" style="width:600px;" width="600" ><tr><td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]-->
    <div style="background:#f3f3f3;background-color:#f3f3f3;Margin:0px auto;max-width:600px;">
      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background:#f3f3f3;background-color:#f3f3f3;width:100%;">
        <tbody>
          <tr>
            <td style="direction:ltr;font-size:0px;padding:0px 50px 20px 50px;text-align:center;vertical-align:top;">
              <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:500px;" ><![endif]-->
              <div class="mj-column-per-100 outlook-group-fix" style="font-size:13px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;">
                <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                  <tbody>
                    <tr>
                      <td style="vertical-align:top;padding:0;">
                        <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%">
                          <tr>
                            <td align="center" style="font-size:0px;padding:20px 0;word-break:break-word;">
                              <div style="font-family:PaulGroteskSoft, 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size:12px;font-weight:100;line-height:23px;text-align:center;color:#6e6e6e;">
                                <p style="margin:10px 0 20px 0">Written with <span style="color:#ff6e78"><b>♡</b></span> at Zieglergasse 6/1/11, 1070&nbsp;Vienna, Austria by IdeasOnCanvas GmbH.<br><br>For more information visit our <a style="color: #6e6e6e;" href="https://mindnode.com/about"
                                    target="_blank">imprint</a>.</p>
                              </div>
                            </td>
                          </tr>
                        </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]-->
  </div>
<script data-cfasync="false" src="/cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script></body>

</html>
              
            
!

CSS

              
                
              
            
!

JS

              
                
              
            
!
999px

Console