Pen Settings

CSS Base

Vendor Prefixing

Add External Stylesheets/Pens

Any URL's added here will be added as <link>s in order, and before the CSS in the editor. If you link to another Pen, it will include the CSS from that Pen. If the preprocessor matches, it will attempt to combine them before processing.

+ add another resource

You're using npm packages, so we've auto-selected Babel for you here, which we require to process imports and make it all work. If you need to use a different JavaScript preprocessor, remove the packages in the npm tab.

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

Use npm Packages

We can make npm packages available for you to use in your JavaScript. We use webpack to prepare them and make them available to import. We'll also process your JavaScript with Babel.

⚠️ This feature can only be used by logged in users.

Code Indentation

     

Save Automatically?

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.

HTML Settings

Here you can Sed posuere consectetur est at lobortis. Donec ullamcorper nulla non metus auctor fringilla. Maecenas sed diam eget risus varius blandit sit amet non magna. Donec id elit non mi porta gravida at eget metus. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.

            
              <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!--[if gte mso 15]>
        <xml>
            <o:OfficeDocumentSettings>
            <o:AllowPNG/>
            <o:PixelsPerInch>96</o:PixelsPerInch>
            </o:OfficeDocumentSettings>
        </xml>
        <![endif]-->
    <style type="text/css">
        /* CLIENT-SPECIFIC STYLES */
        body, table, td, a { -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; }
        table, td { mso-table-lspace: 0pt; mso-table-rspace: 0pt; }
        img { -ms-interpolation-mode: bicubic; }

        /* RESET STYLES */
        img { border: 0; height: auto; line-height: 100%; outline: none; text-decoration: none; }
        table { border-collapse: collapse !important; }
        body { height: 100% !important; margin: 0 !important; padding: 0 !important; width: 100% !important; }

        h1,h2,h3 {font-weight:normal;}
    
    @media screen and (max-width:559px) {
      .fwrimg {
        max-width: 600px !important;
        width:100% !important;
        text-align:center !important;
      }
      .textc2fw { 
      width:100% !important;
      max-width:100% !important;
    }
      .left2center {
        text-align:center !important;
      }
      .fw-container {
      max-width: 100% !important;
            width: 100% !important;}
      
      .fw-reset {
        padding:0px 20px 0px 20px !important;
      }
      .extrapadding {
        padding-left:20px !important;
        padding-right:20px !important;
      }
    }

        a[x-apple-data-detectors] {
    color: inherit !important;
    font-size: inherit !important;
    font-family: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
}

u + #body a {
    color: inherit;
    font-size: inherit;
    font-family: inherit;
    font-weight: inherit;
    line-height: inherit;
}
.contact a {color:#0074EE!important; text-decoration:underline!important;}

    
      /* FONT IMPORTS */
       @font-face {
            font-family: 'MarkOffcPro-Book';
              src:  url("https://img.clearme.com/fonts/MarkOffcPro-Book.woff") format("woff"),
                 url("https://img.clearme.com/fonts/MarkOffcPro-Book.ttf") format("truetype");
            font-weight: 400;
            font-style: normal;
        }
    
    @font-face {
            font-family: 'MarkOffcPro-Book-lt';
              src:  url("https://img.clearme.com/fonts/MarkOffcPro-Light.woff") format("woff"),
                 url("https://img.clearme.com/fonts/MarkOffcPro-Light.ttf") format("truetype");
            font-weight: 300;
            font-style: normal;
        }
      @media screen {
  .MarkOffcPro-Book-lt {
    font-family: 'MarkOffcPro-Book-lt', Arial, Helvetica, sans-serif !important;
  }
    .MarkOffcPro-Book {
      font-family: 'MarkOffcPro-Book', Arial, Helvetica, sans-serif !important;
    }
  }

    </style>
</head>
  <body style="margin: 0 !important; padding: 0 !important;" bgcolor="#E5F1FC" id="body">
    <!-- begin preheader -->
  <div style="display: none; font-size: 0px; line-height: 0px; max-height: 0px; max-width: 0px; width: 0px; opacity: 0; overflow: hidden;">Get 2 months FREE - perfect for life's many adventures, discover why loving CLEAR is just so easy.</div>

<div style="display: none; width: 0px; height: 0px; max-height: 0px; overflow:
 hidden;">&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;
‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;‌&nbsp;</div>
<!-- PREHEADER CLOSE -->
<center>
  <table align="center" bgcolor="#E5F1FC" border="0" cellpadding="0" cellspacing="0" style="background-color:#E5F1FC;" width="100%">
  <tbody><tr>
    <td align="center" valign="top">
      <table align="center" border="0" cellpadding="0" cellspacing="0" style="max-width:600px;" width="100%">
        <!--[if (gte mso 9)|(IE)]>
<tr>
  <td align="center" valign="top">
    <table align="center" bgcolor="#E5F1FC" border="0" cellpadding="0" cellspacing="0" width="600">
<![endif]-->
        <tbody><tr>
          <td align="center" valign="top">
            <table align="center" border="0" cellpadding="0" cellspacing="0" width="100%" bgcolor="#E5F1FC">
              <tbody><tr>
              <td style="font-size: 1px; line-height: 10px; mso-line-height-rule: exactly!">&nbsp;</td>
            </tr>
            <tr>
              <td align="center" valign="top">
                <a href="https://www.clearme.com?utm_source=prosp&amp;utm_campaign=vday&amp;utm_medium=email" target="_blank"><img src="https://image.e.clearme.com/lib/fe9313727667027a75/m/1/ClearLogo_Horizontal_RGB.png" alt="CLEAR" title="CLEAR" width="149" border="0" style="font-family: Arial; color: #0075EE; font-size: 14px; display: block;"></a>
              </td>
            </tr>
            <tr>
              <td style="font-size: 1px; line-height: 40px; mso-line-height-rule: exactly!">&nbsp;</td>
            </tr>
            <tr>
              <td align="center" valign="top">
                <h1 style="margin:0; padding:0; color:#0075ee; font-size:26px; line-height:35px; font-family: Arial, Helvetica, sans-serif;" class="MarkOffcPro-Book">A little something<br>to show our love...</h1>
              </td>
            </tr>
             <tr>
              <td style="font-size: 1px; line-height: 40px; mso-line-height-rule: exactly!">&nbsp;</td>
            </tr>
            </tbody></table>
            <table align="center" border="0" cellpadding="0" cellspacing="0" width="100%" style="max-width:600px;">
              <tbody><tr>
                <td background="https://image.e.clearme.com/lib/fe9313727667027a75/m/1/clouds-v2.gif" bgcolor="#e5f1fc" width="600" height="89" valign="top">
  <!--[if gte mso 9]>
  <v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:600px;height:89px;">
    <v:fill type="tile" src="clouds-v2.gif" color="#e5f1fc" />
    <v:textbox inset="0,0,0,0">
  <![endif]-->
  <div><span style="font-size:0px; line-height:0px; font-family:Arial, Helvetica, sans-serif;"></span>
  </div>
  <!--[if gte mso 9]>
    </v:textbox>
  </v:rect>
  <![endif]-->
</td>

              </tr>
                <tr>
                <td align="center" valign="top">
                  <!--[if (gte mso 9)|(IE)]>
    <table align="center" bgcolor="#0075ee" border="0" cellpadding="0" cellspacing="0" width="600">
      <tr>
  <td align="center" valign="top">
<![endif]-->
                  <table align="center" border="0" cellpadding="0" cellspacing="0" width="100%" bgcolor="#0075ee" style="background-color:#0075ee;">
                    <tbody><tr>
                      <td align="center">
                        <table align="center" border="0" cellpadding="0" cellspacing="0" width="100%">
                          <tbody><tr>
              <td style="font-size: 1px; line-height: 40px; mso-line-height-rule: exactly!">&nbsp;</td>
            </tr>
            <tr>
              <td align="center" valign="top">
                <h2 style="margin:0; padding:0; color:#FFFFFF; font-size:32px; line-height:40px; font-family: Arial, Helvetica, sans-serif;" class="MarkOffcPro-Book-lt">2 months FREE</h2>
              </td>
            </tr>
            <tr>
              <td style="font-size: 1px; line-height: 40px; mso-line-height-rule: exactly!">&nbsp;</td>
            </tr>
            <tr>
              <td align="center" valign="top" style="padding-left:30px; padding-right:30px;">
              <p style="margin:0; padding:0; color:#CDE5FE; font-size:24px; line-height:34px; font-family: Arial, Helvetica, sans-serif;" class="MarkOffcPro-Book-lt">Perfect for life's many adventures, discover why loving CLEAR is just so easy.</p>
            </td>
            </tr>
            <tr>
              <td style="font-size: 1px; line-height: 40px; mso-line-height-rule: exactly!">&nbsp;</td>
            </tr>
            <tr>
              <td align="center" valign="top">
                 <table width="280" cellpadding="0" cellspacing="0" border="0" align="center">
                        <tbody><tr>
                        <td align="center" style="-webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px;" bgcolor="#FD73B8"><a href="https://www.clearme.com/enroll/p/valentines?utm_source=prosp&amp;utm_campaign=vday&amp;utm_medium=email" class="MarkOffcPro-Book" target="_blank" style="font-size: 16px; font-family: Arial, Helvetica, sans-serif; color: #ffffff; text-decoration: none; text-decoration: none; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; padding: 12px 22px; border: 1px solid #FD73B8; display: inline-block;"><span style="font-family: Arial, Helvetica, sans-serif; color: #FFFFFF; font-size: 20px; line-height: 32px;" class="MarkOffcPro-Book"><strong>START YOUR TRIAL</strong></span></a></td>
                        </tr>
                        </tbody></table>
              </td>
            </tr>
            <tr>
              <td style="font-size: 1px; line-height: 20px; mso-line-height-rule: exactly!">&nbsp;</td>
            </tr>
            <tr>
              <td align="center" valign="top" style="padding-left:30px; padding-right:30px;">
              <p style="margin:0; padding:0; color:#CDE5FE; font-size:15px; line-height:24px; font-family: Arial, Helvetica, sans-serif;" class="MarkOffcPro-Book-lt">Or use code VALENTINES at <a href="https://www.clearme.com/enroll/p/valentines?utm_source=prosp&amp;utm_campaign=vday&amp;utm_medium=email" style="text-decoration: none; color:#CDE5FE" target="_blank">clearme.com</a></p>
            </td>
            </tr>
            <tr>
              <td style="font-size: 1px; line-height: 40px; mso-line-height-rule: exactly!">&nbsp;</td>
            </tr>

                        </tbody></table>
                      </td>
                    </tr>
                  </tbody></table>
                  <!--[if (gte mso 9)|(IE)]>
</td>
</tr>
</table>
<![endif]-->
                </td>
              </tr>
            </tbody></table>
           <table align="center" border="0" cellpadding="0" cellspacing="0" width="100%" style="max-width:600px;">
              <tbody><tr>
                <td align="center" valign="top">
                  <!--[if (gte mso 9)|(IE)]>
    <table bgcolor="#0075ee" align="center" border="0" cellpadding="0" cellspacing="0" width="600">
      <tr>
  <td align="center" valign="top">
<![endif]-->
<table bgcolor="#0075ee" align="center" border="0" cellpadding="0" cellspacing="0" width="100%">
  <tbody><tr>
    <td align="center" valign="top" style="padding-left:20px; padding-right:20px;">
      <!--[if (gte mso 9)|(IE)]>
    <table align="center" bgcolor="#ffffff" border="0" cellpadding="0" cellspacing="0" width="520">
      <tr>
  <td align="center" valign="top">
<![endif]-->
      <table align="center" border="0" cellspacing="0" cellpadding="0" width="100%" style="max-width:520px; background-color:#ffffff;" bgcolor="#ffffff">
          <tbody><tr>
                <td>
                  <p style="padding:0; margin:0; font-size:1px;line-height:40px;">&nbsp;</p>
                </td>
              </tr>
               <tr>
          <td align="center" valign="top">
              <table border="0" cellpadding="0" cellspacing="0" style="max-width:520px;" width="100%">
              <!--[if (gte mso 9)|(IE)]>
                <tr>
                  <td align="center">
                    <table border="0" cellpadding="0" cellspacing="0" width="520">
                    <![endif]-->

                    <tbody><tr>
                      <td align="center" valign="top" style="text-align:center; font-size:0px;">
                <table align="right" border="0" cellspacing="0" cellpadding="0" width="250" style="max-width:260px;border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;-ms-text-size-adjust: 100%;-webkit-text-size-adjust: 100%;" class="fw-container">
                                <tbody><tr>
                                  <td style="padding-left:20px; padding-right:20px; padding-top:0px;" align="center">
                                      <table border="0" cellspacing="0" cellpadding="0" width="100%" style="border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;-ms-text-size-adjust: 100%;-webkit-text-size-adjust: 100%;">
                                        <tbody><tr>
                                          <td align="center">
                        <a href="https://www.clearme.com/how-it-works?utm_source=prosp&amp;utm_campaign=vday&amp;utm_medium=email" target="_blank">
                                      <img src="https://image.e.clearme.com/lib/fe9313727667027a75/m/1/CupidsBow-v2.gif" width="180" alt="" style="width:180px; max-width:180px; text-align:center;">
                                    </a>
                                  </td>
                                </tr>
                              </tbody></table>
                            </td>
                          </tr>
                        </tbody></table>
                        <div class="fwrimg">
                          <table align="left" border="0" cellspacing="0" cellpadding="0" style="max-width:260px;" width="255" class="fw-container">
                                  <tbody><tr>
                                    <td style="padding-left:40px; padding-right: 10px; padding-top:10px;" align="center" class="fw-reset">
                                      <table align="center" border="0" cellspacing="0" cellpadding="0" width="100%">
                                        <tbody><tr>
                                          <td align="left" class="left2center">
                                              <h2 style="color:#1377EB; font-family:Arial, Helvetica, sans-serif;font-size:24px; line-height:30px; padding:0px 0px 10px 0px; margin:0;" class="MarkOffcPro-Book">Quicker than Cupid's arrow</h2>

                                          </td>
                                        </tr>
                                        <tr>
                                          <td align="left" class="left2center">
                                            <p style="color:#154578; font-family:Arial, Helvetica, sans-serif;font-size:22px; line-height:26px; padding:0px 0px 10px 0px; margin:0;" class="MarkOffcPro-Book-lt">Speed through long airport security lines in record time.
                                            </p>
                                          </td>
                                        </tr>
                                      </tbody></table>
                                    </td>
                                  </tr>
                          </tbody></table>
                        </div>
                      </td>
                    </tr>
                     <tr>
                <td>
                  <p style="padding:0; margin:0; font-size:1px;line-height:20px;">&nbsp;</p>
                </td>
              </tr>
                    <!-- seperate -->
              <tr>
                      <td align="center" valign="top" style="padding-top:20px; padding-left:20px; padding-right:20px;">
                        <!--[if (gte mso 9)|(IE)]>
                                <table align="center" border="0" cellpadding="0" cellspacing="0" width="460">
                                  <tr>
                                    <td align="center" valign="top">
                          <![endif]-->
                        <table align="center" border="0" cellpadding="0" cellspacing="0" width="100%" style="max-width:460px;">
                    <tbody><tr>
                      <td style="border:none; border-bottom: 2px solid #CDE5FE; font-size: 1px; line-height:0px;">&nbsp;</td>
                    </tr>
              </tbody></table>
              <!--[if (gte mso 9)|(IE)]>
                </td>
                </tr>
                </table>
                          <![endif]-->
                      </td>
                    </tr>
          <!-- seperate -->
                    <!--[if (gte mso 9)|(IE)]>
                    </table>
                  </td>
                </tr>
              <![endif]-->
            </tbody></table>
          </td>
        </tr>
      </tbody></table>
      <!--[if (gte mso 9)|(IE)]>
        </td>
        </tr>
        </table>
<![endif]-->
</td>
</tr>
</tbody></table>
<!--[if (gte mso 9)|(IE)]>
</td>
</tr>
</table>
<![endif]-->
</td>
</tr>
</tbody></table>
            <!-- end left text under right img -->
            <!-- begin two column -->
            <table align="center" border="0" cellpadding="0" cellspacing="0" width="100%" style="max-width:600px;">
              <tbody><tr>
                <td align="center" valign="top">
                  <!--[if (gte mso 9)|(IE)]>
    <table bgcolor="#0075ee" align="center" border="0" cellpadding="0" cellspacing="0" width="600">
      <tr>
  <td align="center" valign="top">
<![endif]-->
<table bgcolor="#0075ee" align="center" border="0" cellpadding="0" cellspacing="0" width="100%">
  <tbody><tr>
    <td align="center" valign="top" style="padding-left:20px; padding-right:20px;">
      <!--[if (gte mso 9)|(IE)]>
    <table align="center" bgcolor="#ffffff" border="0" cellpadding="0" cellspacing="0" width="520">
      <tr>
  <td align="center" valign="top">
<![endif]-->
            <table align="center" border="0" cellpadding="0" cellspacing="0" style="max-width:520px; " width="100%">
              <!--[if (gte mso 9)|(IE)]>
                <tr>
                  <td align="center">
                    <table align="center" border="0" cellpadding="0" cellspacing="0" width="520" bgcolor="#ffffff">
                    <![endif]-->
                  
              <tbody><tr>
                      <td align="center" valign="top" style="text-align:center; font-size:0px;">
                        <table align="center" border="0" bgcolor="#ffffff" cellpadding="0" cellspacing="0" width="100%">
                            <tbody><tr>
                <td>
                  <p style="padding:0; margin:0; font-size:1px;line-height:40px;">&nbsp;</p>
                </td>
              </tr>
              <tr>
                            <td align="center" valign="top">
                        <table class="fw-container" align="left" border="0" cellpadding="0" cellspacing="0" style="max-width:260px;" width="250">
                          <!--[if (gte mso 9)|(IE)]>
                            <tr>
                              <td align="center">
                                <table border="0" cellpadding="0" cellspacing="0" width="250" align="left">
                                <![endif]-->
                                <tbody><tr>
                                  <td align="center" valign="top">
                                    <table border="0" cellpadding="0" cellspacing="0" width="100%">
                                      <tbody><tr>
                                        <td align="center" style="padding:0px 0px 0px 0px;">
                                          <a href="https://www.clearme.com/how-it-works?utm_source=prosp&amp;utm_campaign=vday&amp;utm_medium=email" target="_blank">
                                            <img src="https://image.e.clearme.com/lib/fe9313727667027a75/m/1/Union-v2.gif" alt="" width="180" style="width:180px; max-width:180px;">
                                          </a>
                                        </td>
                                      </tr>
                                    </tbody></table>
                                  </td>
                                </tr>
                                <!--[if (gte mso 9)|(IE)]>
                                </table>
                              </td>
                            </tr>
                          <![endif]-->
                        </tbody></table>
                        <!-- right side -->
                          <table align="right" border="0" cellpadding="0" cellspacing="0" class="textc2fw" style="max-width:260px; " width="250">
                            <!--[if (gte mso 9)|(IE)]>
                              <tr>
                                <td align="center">
                                  <table border="0" cellpadding="0" cellspacing="0" width="250" align="right">
                                  <![endif]-->
                                  <tbody><tr>
                                    <td align="center" valign="top">
                                      <table align="right" border="0" cellpadding="0" cellspacing="0" width="100%">
                                        <tbody><tr>
                                          <td style="padding-left:20px; padding-right:20px; padding-top:0px;" align="left" class="left2center">
                                            <h2 style="color:#1377EB; font-family:Arial, Helvetica, sans-serif;font-size:24px; line-height:30px; padding:0px 0px 10px 0px; margin:0;" class="MarkOffcPro-Book">Your new BFF</h2>

                                          </td>
                                        </tr>
                                        <tr>
                                          <td align="å" style="padding-left:20px; padding-right:20px;" class="left2center">
                                             <p style="color:#154578; font-family:Arial, Helvetica, sans-serif;font-size:20px; line-height:26px; padding:0px 0px 10px 0px; margin:0;" class="MarkOffcPro-Book-lt">A friendly CLEAR Ambassador will greet you with speed and a smile.
                                            </p>
                                          </td>
                                        </tr>
                                      </tbody></table>
                                    </td>
                                  </tr>
                                  <tr>
                <td>
                  <p style="padding:0; margin:0; font-size:1px;line-height:40px;">&nbsp;</p>
                </td>
              </tr>
                                  <!--[if (gte mso 9)|(IE)]>
                                  </table>
                                </td>
                              </tr>
                            <![endif]-->
                          </tbody></table>
                      </td>
                    </tr>
                  </tbody></table>
                </td>
              </tr>
        <!-- seperate -->
          <tr>
                      <td bgcolor="#ffffff" align="center" valign="top" style="padding-left :20px; padding-right:20px; padding-top:0px;">
                        <!--[if (gte mso 9)|(IE)]>
                                <table align="center" border="0" cellpadding="0" cellspacing="0" width="460">
                                  <tr>
                                    <td align="center" valign="top">
                          <![endif]-->
                        <table align="center" border="0" cellpadding="0" cellspacing="0" width="100%" style="max-width:460px;">
                    <tbody><tr>
                      <td style="border:none; border-bottom: 2px solid #CDE5FE; font-size: 1px; line-height:0px;">&nbsp;</td>
                    </tr>
              </tbody></table>
              <!--[if (gte mso 9)|(IE)]>
                </td>
                </tr>
                </table>
                          <![endif]-->
                      </td>
                    </tr>
          <!-- seperate -->
        
                    <!--[if (gte mso 9)|(IE)]>
                    </table>
                  </td>
                </tr>
              <![endif]-->
            </tbody></table>
            <!--[if (gte mso 9)|(IE)]>
    </td>
    </tr>
    </table>
<![endif]-->
          </td>
        </tr>
      </tbody></table>
      <!--[if (gte mso 9)|(IE)]>
    </td>
    </tr>
    </table>
<![endif]-->
    </td>
  </tr>
</tbody></table>
            <!--- end two column -->
            <!-- left text under right img -->
             <table align="center" border="0" cellpadding="0" cellspacing="0" width="100%" style="max-width:600px;">
              <tbody><tr>
                <td align="center" valign="top">
                  <!--[if (gte mso 9)|(IE)]>
    <table bgcolor="#0075ee" align="center" border="0" cellpadding="0" cellspacing="0" width="600">
      <tr>
  <td align="center" valign="top">
<![endif]-->
<table bgcolor="#0075ee" align="center" border="0" cellpadding="0" cellspacing="0" width="100%">
  <tbody><tr>
    <td align="center" valign="top" style="padding-left:20px; padding-right:20px;">
      <!--[if (gte mso 9)|(IE)]>
    <table align="center" bgcolor="#ffffff" border="0" cellpadding="0" cellspacing="0" width="520">
      <tr>
  <td align="center" valign="top">
<![endif]-->
      <table align="center" border="0" cellspacing="0" cellpadding="0" width="100%" style="max-width:520px; background-color:#ffffff;" bgcolor="#ffffff">
          <tbody><tr>
                <td>
                  <p style="padding:0; margin:0; font-size:1px;line-height:40px;">&nbsp;</p>
                </td>
              </tr>
               <tr>
          <td align="center" valign="top">
              <table border="0" cellpadding="0" cellspacing="0" style="max-width:520px;" width="100%">
              <!--[if (gte mso 9)|(IE)]>
                <tr>
                  <td align="center">
                    <table border="0" cellpadding="0" cellspacing="0" width="520">
                    <![endif]-->

                    <tbody><tr>
                      <td align="center" valign="top" style="text-align:center; font-size:0px;">
                <table align="right" border="0" cellspacing="0" cellpadding="0" width="250" style="max-width:260px;" class="fw-container">
                                <tbody><tr>
                                  <td style="padding-left:20px; padding-right:20px; padding-top:0px;" align="center">
                                      <table align="center" border="0" cellspacing="0" cellpadding="0" width="100%">
                                        <tbody><tr>
                                          <td align="center" valign="top">
                                    <a href="https://www.clearme.com/how-it-works?utm_source=prosp&amp;utm_campaign=vday&amp;utm_medium=email" target="_blank">
                                      <img src="https://image.e.clearme.com/lib/fe9313727667027a75/m/1/HeartPrint-v2.gif" alt="" width="180" style="width:180px; max-width:180px; text-align:center;" border="0">
                                    </a>
                                  </td>
                                </tr>
                              </tbody></table>
                            </td>
                          </tr>
                        </tbody></table>
                          <table align="left" border="0" cellspacing="0" cellpadding="0" style="max-width:260px;" width="250" class="fw-container">
                                  <tbody><tr>
                                    <td style="padding-left:40px; padding-right: 10px; padding-top:0px;" align="center" valign="top" class="fw-reset">
                                      <table align="center" border="0" cellspacing="0" cellpadding="0" width="100%">
                                        <tbody><tr>
                                          <td align="left" class="left2center">
                                              <h2 style="color:#1377EB; font-family:Arial, Helvetica, sans-serif;font-size:24px; line-height:30px; padding:0px 0px 10px 0px; margin:0;" class="MarkOffcPro-Book">You're a perfect match!</h2>

                                          </td>
                                        </tr>
                                        <tr>
                                          <td align="left" class="left2center">
                                            <p style="color:#154578; font-family:Arial, Helvetica, sans-serif;font-size:22px; line-height:26px; padding:0px 0px 10px 0px; margin:0;" class="MarkOffcPro-Book-lt">Once you're enrolled, forget the ID, your fingerprint is all that you need.
                                            </p>
                                          </td>
                                        </tr>
                                      </tbody></table>
                                    </td>
                                  </tr>
                          </tbody></table>
                      </td>
                    </tr>

                    <!--[if (gte mso 9)|(IE)]>
                    </table>
                  </td>
                </tr>
              <![endif]-->
            </tbody></table>
          </td>
        </tr>
        <tr>
                <td>
                  <p style="padding:0; margin:0; font-size:1px;line-height:40px;">&nbsp;</p>
                </td>
              </tr>
      </tbody></table>
      <!--[if (gte mso 9)|(IE)]>
        </td>
        </tr>
        </table>
<![endif]-->
</td>
</tr>
</tbody></table>
<!--[if (gte mso 9)|(IE)]>
</td>
</tr>
</table>
<![endif]-->
</td>
</tr>
</tbody></table>
            <!-- end left text under right img -->
               <table align="center" border="0" cellpadding="0" cellspacing="0" width="100%" style="max-width:600px;">
              <tbody><tr>
                <td align="center" valign="top">
                  <!--[if (gte mso 9)|(IE)]>
    <table bgcolor="#003771" align="center" border="0" cellpadding="0" cellspacing="0" width="600">
      <tr>
  <td align="center" valign="top">
<![endif]-->
<table bgcolor="#003771" align="center" border="0" cellpadding="0" cellspacing="0" width="100%">
  <tbody><tr>
    <td align="center" valign="top" style="padding-left:20px; padding-right:20px;">
      <!--[if (gte mso 9)|(IE)]>
    <table align="center" bgcolor="#ffffff" border="0" cellpadding="0" cellspacing="0" width="520">
      <tr>
  <td align="center" valign="top">
<![endif]-->
            <table align="center" border="0" cellpadding="0" cellspacing="0" style="max-width:520px;" width="100%">
              <!--[if (gte mso 9)|(IE)]>
                <tr>
                  <td align="center">
                    <table align="center" border="0" cellpadding="0" cellspacing="0" width="520" bgcolor="#ffffff">
                    <![endif]-->
                    <tbody><tr>
                      <td align="center" valign="top" style="text-align:center; font-size:0px;">
              <table bgcolor="#ffffff" width="100%" align="center" border="0" cellpadding="0" cellspacing="0">
              <tbody><tr>
                      <td align="center" valign="top" style="padding-bottom:20px; padding-left:0px; padding-right:0px;" class="extrapadding">
                        <!--[if (gte mso 9)|(IE)]>
                                <table align="center" border="0" cellpadding="0" cellspacing="0" width="460">
                                  <tr>
                                    <td align="center" valign="top">
                          <![endif]-->
                        <table align="center" border="0" cellpadding="0" cellspacing="0" width="100%" style="max-width:460px;">
                    <tbody><tr>
                      <td style="border:none; border-bottom: 2px solid #CDE5FE; font-size: 1px; line-height:0px;">&nbsp;</td>
                    </tr>
              </tbody></table>
              <!--[if (gte mso 9)|(IE)]>
                </td>
                </tr>
                </table>
                          <![endif]-->
                      </td>
                    </tr>
          <!-- seperate -->
                 <tr>
                <td>
                  <p style="padding:0; margin:0; font-size:1px;line-height:20px;">&nbsp;</p>
                </td>
              </tr>
                <tr>
                  <td align="center" valign="top">
                        <table class="fw-container" align="left" border="0" cellpadding="0" cellspacing="0" style="max-width:260px;" width="250">
                                <tbody><tr>
                                  <td align="center" valign="top">
                                    <table border="0" cellpadding="0" cellspacing="0" width="100%">
                                      <tbody><tr>
                                        <td align="center" style="padding:0px 0px 0px 0px;">
                                          <a href="https://www.clearme.com/how-it-works?utm_source=prosp&amp;utm_campaign=vday&amp;utm_medium=email" target="_blank">
                                            <img src="https://image.e.clearme.com/lib/fe9313727667027a75/m/1/Share-v2.gif" alt="" width="200" style="width:180px; max-width:180px;">
                                          </a>
                                        </td>
                                      </tr>
                                    </tbody></table>
                                  </td>
                                </tr>
                        </tbody></table>
                        <!-- right side -->
                         <div style="display:inline-block; vertical-align: top;">
                          <table align="right" border="0" cellpadding="0" cellspacing="0" class="textc2fw" style="max-width:260px; " width="250">
                                  <tbody><tr>
                                    <td align="center" valign="top">
                                      <table align="right" border="0" cellpadding="0" cellspacing="0" width="100%">
                                        <tbody><tr>
                                          <td style="padding-left:20px; padding-right:20px; padding-top:0px;" align="left" class="left2center">
                                            <h2 style="color:#1377EB; font-family:Arial, Helvetica, sans-serif;font-size:24px; line-height:30px; padding:0px 0px 10px 0px; margin:0;" class="MarkOffcPro-Book">Share the love</h2>

                                          </td>
                                        </tr>
                                        <tr>
                                          <td align="left" style="padding-left:20px; padding-right:20px;" class="left2center">
                                             <p style="color:#154578; font-family:Arial, Helvetica, sans-serif;font-size:20px; line-height:26px; padding:0px 0px 10px 0px; margin:0;" class="MarkOffcPro-Book-lt">You can add up to 3 adult family members to your free 2 month trial.
                                            </p>
                                          </td>
                                        </tr>
                                      </tbody></table>
                                    </td>
                                  </tr>
                          </tbody></table>
                        </div>
                      </td>
                    </tr>
                     <tr>
                <td>
                  <p style="padding:0; margin:0; font-size:1px;line-height:20px;">&nbsp;</p>
                </td>
              </tr>
                <tr>
              <td align="center" valign="top" style="padding-top:30px; padding-bottom:30px;">
                 <table width="280" cellpadding="0" cellspacing="0" border="0" align="center">
                        <tbody><tr>
                        <td align="center" style="-webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px;" bgcolor="#FD73B8"><a href="https://www.clearme.com/enroll/p/valentines?utm_source=prosp&amp;utm_campaign=vday&amp;utm_medium=email" class="MarkOffcPro-Book" target="_blank" style="font-size: 16px; font-family: Arial, Helvetica, sans-serif; color: #ffffff; text-decoration: none; text-decoration: none; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; padding: 12px 22px; border: 1px solid #FD73B8; display: inline-block;"><span style="font-family: Arial, Helvetica, sans-serif; color: #FFFFFF; font-size: 20px; line-height: 32px;" class="MarkOffcPro-Book"><strong>TRY US FOR FREE</strong></span></a></td>
                        </tr>
                        </tbody></table>
              </td>
    </tr>
            <tr>
                <td>
                  <p style="padding:0; margin:0; font-size:1px;line-height:20px;">&nbsp;</p>
                </td>
              </tr>
            </tbody></table>
            </td>
        </tr>
            <!--[if (gte mso 9)|(IE)]>
</table>
</td>
</tr>
<![endif]-->
    </tbody></table>
          <!-- begin footer -->
        <!-- end footer -->
       <!--[if (gte mso 9)|(IE)]>
</td>
</tr>
</table>
<![endif]-->    
    </td>
        </tr>
      </tbody></table>
      <!--[if (gte mso 9)|(IE)]>
              </td>
              </tr>
              </table>
<![endif]-->
    </td>
  </tr>
</tbody></table>

          </td>
        </tr>
<!--[if (gte mso 9)|(IE)]>
</table>
</td>
</tr>
<![endif]-->
      </tbody></table>
          <table align="center" width="100%" border="0" cellspacing="0" cellpadding="0" style="max-width:600px;">
        <!--[if (gte mso 9)|(IE)]>
<tr>
  <td>
    <table border="0" cellspacing="0" align="center" cellspacing="0" width="600" bgcolor="#003771">
<![endif]-->
        <!-- begin social icons -->
         <tbody><tr>
      <td align="center" valign="top">
        <table align="center" width="100%" border="0" cellspacing="0" cellpadding="0" style="max-width:600px;" bgcolor="#003771">
          <tbody><tr>
          <td align="center" valign="top" style="padding-top:20px; padding-bottom:10px;">
           <table align="center" border="0" cellpadding="10" cellspacing="0" width="180">
                <tbody><tr>
                <td><a href="https://twitter.com/clear" target="_blank"><img src="http://image.S7.exacttarget.com/lib/fe9313727667027a75/m/1/twitter-lgt-blue.png" alt="Twitter" style="font-family: Arial; color: #0075ee; font-size: 14px;display: block;" width="38"></a></td>
                <td><a href="https://www.facebook.com/Clearme/" target="_blank"><img src="http://image.S7.exacttarget.com/lib/fe9313727667027a75/m/1/facebook-lgt-blue.png" alt="Facebook" style="font-family: Arial; color: #0075ee; font-size: 14px;display: block;" width="38"></a></td>
                <td><a href="https://www.instagram.com/clear/" target="_blank"><img src="http://image.S7.exacttarget.com/lib/fe9313727667027a75/m/1/insta-lgt-blue.png" alt="Instagram" style="font-family: Arial; color: #0075ee; font-size: 14px;display: block;" width="38"></a></td>
                </tr>
                </tbody></table>
                  </td>
                </tr>
        
        <!-- end social icons -->
        <tr>
          <td valign="top" align="center" style="padding-bottom:10px; padding-top:10px;">
            <p style="margin:0; padding:0; font-size: 13px; line-height: 18px; font-family: Arial, Helvetica, sans-serif; color:#C7E0FA;" class="MarkOffcPro-Book-lt"><a href="https://www.clearme.com/where-we-are" style="color:#C7E0FA;" target="_blank">CLEAR locations</a> &nbsp;|&nbsp; <a href="https://www.clearme.com/how-it-works" style="color:#C7E0FA;" target="_blank">How CLEAR works</a></p>
            </td>
          </tr>
          <tr>
            <td valign="top" align="center" style="padding-bottom:10px; padding-top:10px;">
              <table align="center" border="0" cellpadding="0" cellspacing="0" width="100%" style="max-width:300px;">
                <!--[if (gte mso 9)|(IE)]>
<tr>
  <td>
    <table border="0" cellspacing="0" align="center" cellspacing="0" width="300">
<![endif]-->
                <tbody><tr>
                  <td align="center" valign="top" style="padding-left:20px; padding-right:20px;">
            <p style="margin:0; padding:0; font-size: 12px; line-height: 18px;font-family: Arial, Helvetica, sans-serif; color:#C7E0FA;" class="MarkOffcPro-Book-lt">*Offer must be redeemed by 02/28/18. Valid for new members only and renews at $179 for 12 months after initial trial term. You can cancel anytime during trial.
</p>
            </td>
          </tr>
          <!--[if (gte mso 9)|(IE)]>
</table>
</td>
</tr>
<![endif]-->

        </tbody></table>
            </td>
          </tr>
          <tr>
            <td valign="top" align="center" style="padding-bottom:10px; padding-top:10px;">
              <table align="center" border="0" cellpadding="0" cellspacing="0" width="100%" style="max-width:300px;">
                <!--[if (gte mso 9)|(IE)]>
<tr>
  <td>
    <table border="0" cellspacing="0" align="center" cellspacing="0" width="300">
<![endif]-->
                <tbody><tr>
                  <td align="center" valign="top" style="padding-left:20px; padding-right:20px;">
            <p style="margin:0; padding:0; font-size: 12px; line-height: 18px;font-family: Arial, Helvetica, sans-serif; color:#C7E0FA;" class="MarkOffcPro-Book-lt">Questions? Email us at <a href="mailto:memberservices@clearme.com" target="_blank" style="color: #C7E0FA;">memberservices@clearme.com</a>.<br><br>
Questions relating to privacy and the protection of your personal information should be sent to <a href="mailto:privacy@clearme.com" target="_blank" style="color: #C7E0FA;">privacy@clearme.com</a>.
</p>
            </td>
          </tr>
          <!--[if (gte mso 9)|(IE)]>
</table>
</td>
</tr>
<![endif]-->

        </tbody></table>
            </td>
          </tr>
           <tr>
          <td valign="top" align="center" style="padding-bottom:10px; padding-top:10px;">
            <p style="margin:0; padding:0; font-size: 13px; line-height: 18px; font-family: Arial, Helvetica, sans-serif; color:#0074EE;" class="MarkOffcPro-Book-lt"><a href="#" style="color:#C7E0FA;" target="_blank">Unsubscribe</a></p>
            </td>
          </tr>
          <tr>
            <td valign="top" align="center" style="padding-bottom:10px; padding-left:20px; padding-right:20px; padding-top:10px;">
              <p style="margin:0; padding:0; font-size: 10px; line-height: 15px; font-family: Arial, Helvetica, sans-serif; color:#C7E0FA;" class="MarkOffcPro-Book-lt">CLEAR &nbsp;|&nbsp; 650 Fifth Avenue, 12th Floor &nbsp;|&nbsp; New York, NY 10019
              </p>
            </td>
          </tr>
          <tr>
            <td><img height="20" src="http://image.e.clearme.com/lib/fe9313727667027a75/m/1/spacer.gif" alt="" style="display: block;" width="1"></td>
            </tr>
          </tbody></table>
       </td>
      </tr>
                    <!--[if (gte mso 9)|(IE)]>
</table>
</td>
</tr>
<![endif]-->
        </tbody></table>
    </td>
  </tr>
    </tbody></table>
</center>
  


</body>
            
          
!
999px
🕑 One or more of the npm packages you are using needs to be built. You're the first person to ever need it! We're building it right now and your preview will start updating again when it's ready.

Console