cssAudio - Activefile-genericCSS - ActiveGeneric - ActiveHTML - ActiveImage - ActiveJS - ActiveSVG - ActiveText - Activefile-genericVideo - Activehtmlicon-personicon-teamoctocatspinnerstartv

Pen Settings

CSS Base

Vendor Prefixing

Add External CSS

These stylesheets will be added in this order and before the code you write in the CSS editor. You can also add another Pen here, and it will pull the CSS from it. Try typing "font" or "ribbon" below.

Quick-add: + add another resource

Add External JavaScript

These scripts will run in this order and before the code in the JavaScript editor. You can also link to another Pen here, and it will run the JavaScript from it. Also try typing the name of any popular library.

Quick-add: + add another resource

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.

            
              <head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <!--[if !mso]><!-->
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <!--<![endif]-->
  <title></title>
  <style type="text/css">
    /* RESET STYLES */
    
    table{border-collapse:collapse;}
    img, a img{border:0; height:auto; outline:none; text-decoration:none;}
    body{height:100% !important; margin:0 auto !important; padding:0; width:100% !important;}
    
    /* CLIENT-SPECIFIC STYLES */
    img{-ms-interpolation-mode: bicubic;} /* Force IE to smoothly render resized images. */
    #outlook a{padding:0;} /* Force Outlook 2007 and up to provide a "view in browser" message. */
    table{mso-table-lspace:0pt; mso-table-rspace:0pt;} /* Remove spacing between tables in Outlook 2007 and up. */
    .ReadMsgBody{width:100%;} .ExternalClass{width:100%;} /* Force Outlook.com to display emails at full width. */
    p, a, td{mso-line-height-rule:exactly;} /* Force Outlook to render line heights as they're originally set. */
    p, a, td, body, table{-ms-text-size-adjust:100%; -webkit-text-size-adjust:100%;} /* Prevent Windows- and Webkit-based mobile platforms from changing declared text sizes. */
    .ExternalClass, .ExternalClass p, .ExternalClass td, .ExternalClass div, .ExternalClass span, .ExternalClass font{line-height:100%;} /* Force Outlook.com to display line heights normally. */
    * [href]:not([style]) { color: inherit !important; text-decoration: none !important; } /* control gmail default link color */
    a[x-apple-data-detectors] {color: inherit !important; text-decoration: none !important; font-size: inherit !important; font-family: inherit !important; font-weight: inherit !important; line-height: inherit !important;} /* attempt to control apple data detection */
    
    /* TEMPLATE STYLES */
    @media screen and (max-width:440px){
        .mw100{max-width:100% !important;}
        .mw98{max-width:98% !important;}
        .w100{width:100% !important;}
        .w90{width:90% !important;}
        .w80{width:75% !important;}
    	}
    @media screen {
    	@font-face{
    		font-family:gotham-bold;
    		src:url("https://www.hoteltonight.com/ht-web/assets/gotham-bold.woff") format("woff");
    		font-weight:normal;
    		font-style:normal;
    		}
    	@font-face{
    		font-family:gotham-book;
    		src:url("https://www.hoteltonight.com/ht-web/assets/gotham-book.woff") format("woff");
    		font-weight:normal;
    		font-style:normal;
    		}
    	@font-face{
    		font-family:gotham-medium;
    		src:url("https://www.hoteltonight.com/ht-web/assets/gotham-medium.woff") format("woff");
    		font-weight:normal;
    		font-style:normal;
    		}
    	}
  </style>
  <!--[if gte mso 9]><xml>
<o:OfficeDocumentSettings>
<o:AllowPNG/>
<o:PixelsPerInch>96</o:PixelsPerInch>
</o:OfficeDocumentSettings>
</xml><![endif]-->
</head>

<body style="margin:0;padding:0;background-color:#171920;">
  <style type="text/css">
    div.preheader 
    { display: none !important; }
  </style>
  <div class="preheader" style="font-size: 1px; display: none !important;">Look for holiday GeoRates for extra savings off our already-great rates</div>
  <table width="1" height="1" cellpadding="0" cellspacing="0" border="0">
    <tbody>
      <tr>
        <td style="font-size:0px; line-height:0px;"><img src="http://www.movable-ink-2597.com/p/cp/3d9d3191178869d4/o.gif?mi_u=3671043" width="1" height="1"></td>
      </tr>
    </tbody>
  </table>
  <img src="https://click.mailer.hoteltonight.com/open.aspx?ffcb10-fe9915767261047c77-fe5c1d747c61047c7412-fe901372756d027f70-ff6d157175-fe5a1079756c0d797715-ff6516707d" width="1" height="1">
  <table cellpadding="0" cellspacing="0" border="0" style="width:100%;background-color:#171920;">
    <tbody>
      <tr>
        <td style="font-size:0;">&nbsp;</td>
        <td align="center" valign="top" style="width:700px;background-color:#171920;">
          <!--ALL CONTENT STARTS HERE-->
          <!--header logo/nav-->
          <table cellpadding="0" cellspacing="0" border="0" style="width:100%;background-color:#171920;" class="mw100">
            <tbody>
              <tr>
                <td align="center" valign="bottom" style="padding-top:10px;vertical-align:bottom;font-size:0;">
                  <!--[if (gte mso 9)|(IE)]>

        <table border="0" cellspacing="0" cellpadding="0" style="width:700px;">
        <tr>
        <td valign="top" align="center" style="width:250px;">
        <![endif]-->
                  <div style="vertical-align:top;width:100%;max-width:250px;display:inline-block;" class="mw100">
                    <table border="0" cellspacing="0" cellpadding="0" style="width:100%;">
                      <tbody>
                        <tr>
                          <td align="center" style="padding-top:20px;">
                            <a href="https://www.hoteltonight.com" target="_blank"><img src="https://d38whlyjfr4rg3.cloudfront.net/emailtemplate/headerfooter/HT_Logo_Dark_150X20_2x.jpg" alt="Hotel Tonight" title="Hotel Tonight" width="150" border="0" style="display:block;outline:0;border:0;padding:0;width:150px;height:auto;font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:36px;color:#2f3542;"></a>
                          </td>
                        </tr>
                      </tbody>
                    </table>
                  </div>
                  <!--[if (gte mso 9)|(IE)]></td><td align="center" valign="bottom" style="width:450px"><![endif]-->
                  <div style="vertical-align:bottom;width:100%;max-width:450px;display:inline-block;" class="mw100">
                    <table border="0" cellspacing="0" cellpadding="0" style="width:100%;">
                      <tbody>
                        <tr>
                          <td align="center" style="padding-top:20px;">
                            <table border="0" cellspacing="0" cellpadding="0" style="width:100%;">
                              <tbody>
                                <tr>
                                  <td style="line-height:16px;text-align:center;"><a href="https://www.hoteltonight.com" style="font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:14px;color:#ffffff;text-decoration:none;" target="_blank">FAVORITES</a></td>
                                  <td style="line-height:14px;text-align:center;"><a href="https://www.hoteltonight.com" style="font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:14px;color:#ffffff;text-decoration:none;" target="_blank">REFER</a></td>
                                  <td style="line-height:14px;text-align:center;"><a href="https://www.hoteltonight.com" style="font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:14px;color:#ffffff;text-decoration:none;" target="_blank">BOOK NOW</a></td>
                                </tr>
                              </tbody>
                            </table>
                          </td>
                        </tr>
                      </tbody>
                    </table>
                  </div>
                  <!--[if (gte mso 9)|(IE)]>
        </td>
        </tr>
        </table>
        <![endif]-->
                </td>
              </tr>
            </tbody>
          </table>
          <!--/header logo/nav-->
          <!--4.C.3-->
          <table cellpadding="0" cellspacing="0" border="0" style="width:100%;background-color:#171920;" class="mw100">
            <tbody>
              <tr>
                <td align="center" style="padding-top:20px;">
                  <table cellpadding="0" cellspacing="0" border="0" style="width:100%;">
                    <tbody>
                      <tr>
                        <td align="center">
                          <a href="https://www.hoteltonight.com" style="font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:14px;color:#2f3542;text-decoration:none;display:block;" target="_blank"><img src="https://d38whlyjfr4rg3.cloudfront.net/shaw-scott/HT_Granny_Hero_700x280.jpg" alt="VISIT FAMILY. STAY WITH US." title="VISIT FAMILY. STAY WITH US." width="700" border="0" style="display:block;outline:0;border:0;padding:0;width:100%;max-width:700px;height:auto;font-family:'gotham-book',Helvetica,Arial,sans-serif; font-size:14px;color:#2f3542;"></a>
                        </td>
                      </tr>
                      <tr>
                        <td align="center" style="padding:20px 0 0 0;background-color:#ffffff;">
                          <table cellpadding="0" cellspacing="0" border="0" style="width:90%;">
                            <tbody>
                              <tr>
                                <td align="center">
                                  <table cellpadding="0" cellspacing="0" border="0" style="width:90%;" class="w100">
                                    <tbody>
                                      <tr>
                                        <td style="font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:24px;line-height:24px;color:#3b2151;text-align:center;">READY FOR THE HOLIDAY WEEKEND?</td>
                                      </tr>
                                    </tbody>
                                  </table>
                                  <table cellpadding="0" cellspacing="0" border="0" style="width:90%;">
                                    <tbody>
                                      <tr>
                                        <td style="padding-top:20px;font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:14px;line-height:20px;color:#2f3542;text-align:center;">Oh, the holidays. Grandma's inflating your air mattress as we&nbsp;speak.</td>
                                      </tr>
                                    </tbody>
                                  </table>
                                </td>
                              </tr>
                            </tbody>
                          </table>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </td>
              </tr>
            </tbody>
          </table>
          <!--/4.C.3-->
          <!--4.E.1-->
          <table cellpadding="0" cellspacing="0" border="0" style="width:100%;background-color:#ffffff;" class="mw100">
            <tbody>
              <tr>
                <td align="center" valign="top" style="vertical-align:bottom;font-size:0;direction:rtl;">
                  <!--[if (gte mso 9)|(IE)]>
        <table border="0" cellspacing="0" cellpadding="0" style="width:700px;">
        <tr>
        <td align="center" valign="top" style="width:375px;">
        <![endif]-->
                  <div style="display:inline-block;vertical-align:top;width:100%;max-width:375px;direction:ltr;" class="mw100">
                    <table border="0" cellspacing="0" cellpadding="0" style="width:100%;">
                      <tbody>
                        <tr>
                          <td align="center" style="padding-top:20px;">
                            <table border="0" cellspacing="0" cellpadding="0" style="width:80%;">
                              <tbody>
                                <tr>
                                  <td style="padding:5px 0 10px 0;font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:14px;line-height:20px;color:#2f3542;text-align:center;">Cousin Becca's been perfecting her epic eye roll. Uncle Tony's snoring is nearing unprecedented decibels... and he's got the top bunk. Yeah, maybe you wanna get your own hotel&nbsp;room.</td>
                                </tr>
                                <tr>
                                  <td align="center" style="padding-top:15px;padding-bottom:20px;">
                                    <table border="0" cellspacing="0" cellpadding="0">
                                      <tbody>
                                        <tr>
                                          <td style="height:45px;background-color:#3b2151;text-align:center;">
                                            <a href="https://www.hoteltonight.com" style="display:inline-block;padding:10px 40px;font-family:'gotham-medium',Helvetica,Arial,sans-serif;font-size:14px;color:#ffffff;text-decoration:none;" target="_blank"><!--[if mso]>&nbsp;&nbsp;&nbsp;<![endif]-->BOOK NOW<!--[if mso]>&nbsp;&nbsp;&nbsp;<![endif]--></a>
                                          </td>
                                        </tr>
                                      </tbody>
                                    </table>
                                  </td>
                                </tr>
                              </tbody>
                            </table>
                          </td>
                        </tr>
                      </tbody>
                    </table>
                  </div>
                  <!--[if (gte mso 9)|(IE)]></td><td align="center" valign="bottom" style="width:315px"><![endif]-->
                  <div style="display:inline-block;vertical-align:bottom;width:100%;max-width:315px;direction:ltr;" class="mw100">
                    <table border="0" cellspacing="0" cellpadding="0" style="width:100%;">
                      <tbody>
                        <tr>
                          <td align="center" style="padding-top:20px;">
                            <a href="https://www.hoteltonight.com" style="font-family:'gotham-book',Arial,Helvetica,sans-serif;font-size:14px;color:#2f3542;text-decoration:none;" target="_blank"><img src="https://d38whlyjfr4rg3.cloudfront.net/shaw-scott/HTP_GeoRate_Animation_TOP_XMAS.gif" border="0" alt="BOOK NOW" title="BOOK NOW" width="315" style="display:block;outline:0;border:0;padding:0;width:100%;max-width:315px;height:auto;font-family:'gotham-book',Arial,Helvetica,sans-serif;font-size:14px;color:#2f3542;"></a>
                          </td>
                        </tr>
                      </tbody>
                    </table>
                  </div>
                  <!--[if (gte mso 9)|(IE)]>
        </td>
        </tr>
        </table>
        <![endif]-->
                </td>
              </tr>
              <tr>
                <td align="center" valign="top" style="vertical-align:top;font-size:0;background-color:#e5e8f1;">
                  <!--[if (gte mso 9)|(IE)]>
        <table border="0" cellspacing="0" cellpadding="0" style="width:700px;">
        <tr>
        <td align="center" valign="top" style="width:315px;">
        <![endif]-->
                  <div style="display:inline-block;vertical-align:top;width:100%;max-width:315px;" class="mw100">
                    <table border="0" cellspacing="0" cellpadding="0" style="width:100%;">
                      <tbody>
                        <tr>
                          <td align="center">
                            <a href="https://www.hoteltonight.com" style="font-family:'gotham-book',Arial,Helvetica,sans-serif;font-size:14px;color:#2f3542;text-decoration:none;" target="_blank"><img src="https://d38whlyjfr4rg3.cloudfront.net/shaw-scott/HTP_GeoRate_Animation_BOTTOM_HOLIDAY_2.gif" border="0" alt="BOOK NOW" title="BOOK NOW" loop="-1" width="315" style="display:block;outline:0;border:0;padding:0;width:100%;max-width:315px;height:auto;font-family:'gotham-book',Arial,Helvetica,sans-serif;font-size:14px;color:#2f3542;"></a>
                          </td>
                        </tr>
                      </tbody>
                    </table>
                  </div>
                  <!--[if (gte mso 9)|(IE)]></td><td align="center" valign="top" style="width:375px"><![endif]-->
                  <div style="display:inline-block;vertical-align:top;width:100%;max-width:375px;" class="mw100">
                    <table border="0" cellspacing="0" cellpadding="0" style="width:100%;">
                      <tbody>
                        <tr>
                          <td align="center" style="padding-top:20px; padding-bottom:20px;">
                            <table border="0" cellspacing="0" cellpadding="0" style="width:80%;">
                              <tbody>
                                <tr>
                                  <td style="font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:20px;line-height:24px;color:#3b2151;text-align:center;">FIND THE BEST HOLIDAY&nbsp;RATES</td>
                                </tr>
                                <tr>
                                  <td style="font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:14px;line-height:20px;color:#2f3542;text-align:center;">Keep an eye out for our seasonal GeoRates, location-based deals that score you extra savings off our already‑discounted rates from 12/23 through&nbsp;12/26.</td>
                                </tr>
                              </tbody>
                            </table>
                          </td>
                        </tr>
                      </tbody>
                    </table>
                  </div>
                  <!--[if (gte mso 9)|(IE)]>
        </td>
        </tr>
        </table>
        <![endif]-->
                </td>
              </tr>
            </tbody>
          </table>
          <!--/4.E.1-->
          <!--4.E.2-->
          <table cellpadding="0" cellspacing="0" border="0" style="width:100%;" class="mw100">
            <tbody>
              <tr>
                <td align="center" valign="top" style="vertical-align:top;font-size:0;">
                  <!--[if (gte mso 9)|(IE)]>
        <table border="0" cellspacing="0" cellpadding="0" style="width:700px;">
        <tr>
        <td align="center" valign="top" style="width:50%;">
        <![endif]-->
                  <div style="display:inline-block;vertical-align:top;width:100%;max-width:350px;" class="mw100">
                    <table border="0" cellspacing="0" cellpadding="0" style="width:100%;">
                      <tbody>
                        <tr>
                          <td align="center" style="padding:0 0 10px 0;">
                            <a href="https://www.hoteltonight.com" style="font-family:'gotham-book',Arial,Helvetica,sans-serif;font-size:14px;color:#2f3542;text-decoration:none;" target="_blank"><img src="http://www.movable-ink-2597.com/p/rp/54bc28c82bae9ddb.png?mi_metro=&amp;mi_u=3671043&amp;mi_campaign_name=test&amp;mi_zip_default=60622" border="0" alt="Display images to show real-time content" width="350" style="display:block;outline:0;border:0;padding:0;width:100%;max-width:414px;height:auto;font-family:'gotham-book',Arial,Helvetica,sans-serif;font-size:14px;color:#2f3542;"></a>
                          </td>
                        </tr>
                      </tbody>
                    </table>
                  </div>
                  <!--[if (gte mso 9)|(IE)]></td><td align="center" valign="top" style="width:50%"><![endif]-->
                  <div style="display:inline-block;vertical-align:top;width:100%;max-width:350px;" class="mw100">
                    <table border="0" cellspacing="0" cellpadding="0" style="width:100%;">
                      <tbody>
                        <tr>
                          <td align="center" style="padding:0 0 10px 0;">
                            <a href="https://www.hoteltonight.com" style="font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:14px;color:#ffffff;text-decoration:none;" target="_blank"><img src="http://www.movable-ink-2597.com/p/rp/f5aa632f6a4a0364.png?mi_metro=&amp;mi_u=3671043&amp;mi_campaign_name=test&amp;mi_zip_default=60622" border="0" alt="Display images to show real-time content" width="350" style="display:block;outline:0;border:0;padding:0;width:100%;max-width:414px;height:auto;font-family:'gotham-book',Arial,Helvetica,sans-serif;font-size:14px;color:#2f3542;"></a>
                          </td>
                        </tr>
                      </tbody>
                    </table>
                  </div>
                  <!--[if (gte mso 9)|(IE)]>
        </td>
        </tr>
        </table>
        <![endif]-->
                </td>
              </tr>
            </tbody>
          </table>
          <!--/4.E.2-->
          <!--4.E.2-->
          <table cellpadding="0" cellspacing="0" border="0" style="width:100%;" class="mw100">
            <tbody>
              <tr>
                <td align="center" valign="top" style="vertical-align:top;font-size:0;">
                  <!--[if (gte mso 9)|(IE)]>
        <table border="0" cellspacing="0" cellpadding="0" style="width:700px;">
        <tr>
        <td align="center" valign="top" style="width:50%;">
        <![endif]-->
                  <div style="display:inline-block;vertical-align:top;width:100%;max-width:350px;" class="mw100">
                    <table border="0" cellspacing="0" cellpadding="0" style="width:100%;">
                      <tbody>
                        <tr>
                          <td align="center" style="padding:10px 0;">
                            <a href="https://www.hoteltonight.com" style="font-family:'gotham-book',Arial,Helvetica,sans-serif;font-size:14px;color:#2f3542;text-decoration:none;" target="_blank"><img src="http://www.movable-ink-2597.com/p/rp/fa5939280abd01dd.png?mi_metro=&amp;mi_u=3671043&amp;mi_campaign_name=test&amp;mi_zip_default=60622" border="0" alt="Display images to show real-time content" width="350" style="display:block;outline:0;border:0;padding:0;width:100%;max-width:414px;height:auto;font-family:'gotham-book',Arial,Helvetica,sans-serif;font-size:14px;color:#2f3542;"></a>
                          </td>
                        </tr>
                      </tbody>
                    </table>
                  </div>
                  <!--[if (gte mso 9)|(IE)]></td><td align="center" valign="top" style="width:50%"><![endif]-->
                  <div style="display:inline-block;vertical-align:top;width:100%;max-width:350px;" class="mw100">
                    <table border="0" cellspacing="0" cellpadding="0" style="width:100%;">
                      <tbody>
                        <tr>
                          <td align="center" style="padding:10px 0;">
                            <a href="https://www.hoteltonight.com" style="font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:14px;color:#ffffff;text-decoration:none;" target="_blank"><img src="http://www.movable-ink-2597.com/p/rp/d9ac2e2370b33566.png?mi_metro=&amp;mi_u=3671043&amp;mi_campaign_name=test&amp;mi_zip_default=60622" border="0" alt="Display images to show real-time content" width="350" style="display:block;outline:0;border:0;padding:0;width:100%;max-width:414px;height:auto;font-family:'gotham-book',Arial,Helvetica,sans-serif;font-size:14px;color:#2f3542;"></a>
                          </td>
                        </tr>
                      </tbody>
                    </table>
                  </div>
                  <!--[if (gte mso 9)|(IE)]>
        </td>
        </tr>
        </table>
        <![endif]-->
                </td>
              </tr>
            </tbody>
          </table>
          <!--/4.E.2-->
          <!--4.E.2-->
          <table cellpadding="0" cellspacing="0" border="0" style="width:100%;" class="mw100">
            <tbody>
              <tr>
                <td align="center" valign="top" style="vertical-align:top;font-size:0;">
                  <!--[if (gte mso 9)|(IE)]>
        <table border="0" cellspacing="0" cellpadding="0" style="width:700px;">
        <tr>
        <td align="center" valign="top" style="width:50%;">
        <![endif]-->
                  <div style="display:inline-block;vertical-align:top;width:100%;max-width:350px;" class="mw100">
                    <table border="0" cellspacing="0" cellpadding="0" style="width:100%;">
                      <tbody>
                        <tr>
                          <td align="center" style="padding:10px 0;">
                            <a href="https://www.hoteltonight.com" style="font-family:'gotham-book',Arial,Helvetica,sans-serif;font-size:14px;color:#2f3542;text-decoration:none;" target="_blank"><img src="http://www.movable-ink-2597.com/p/rp/bc16114a5c825dd9.png?mi_metro=&amp;mi_u=3671043&amp;mi_campaign_name=test&amp;mi_zip_default=60622" border="0" alt="Display images to show real-time content" width="350" style="display:block;outline:0;border:0;padding:0;width:100%;max-width:414px;height:auto;font-family:'gotham-book',Arial,Helvetica,sans-serif;font-size:14px;color:#2f3542;"></a>
                          </td>
                        </tr>
                      </tbody>
                    </table>
                  </div>
                  <!--[if (gte mso 9)|(IE)]></td><td align="center" valign="top" style="width:50%"><![endif]-->
                  <div style="display:inline-block;vertical-align:top;width:100%;max-width:350px;" class="mw100">
                    <table border="0" cellspacing="0" cellpadding="0" style="width:100%;">
                      <tbody>
                        <tr>
                          <td align="center" style="padding:10px 0;">
                            <a href="https://www.hoteltonight.com" style="font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:14px;color:#ffffff;text-decoration:none;" target="_blank"><img src="http://www.movable-ink-2597.com/p/rp/cb072585840cff8d.png?mi_metro=&amp;mi_u=3671043&amp;mi_campaign_name=test&amp;mi_zip_default=60622" border="0" alt="Display images to show real-time content" width="350" style="display:block;outline:0;border:0;padding:0;width:100%;max-width:414px;height:auto;font-family:'gotham-book',Arial,Helvetica,sans-serif;font-size:14px;color:#2f3542;"></a>
                          </td>
                        </tr>
                      </tbody>
                    </table>
                  </div>
                  <!--[if (gte mso 9)|(IE)]>
        </td>
        </tr>
        </table>
        <![endif]-->
                </td>
              </tr>
            </tbody>
          </table>
          <!--/4.E.2-->
          <!--forward to a friend-->
          <table cellpadding="0" cellspacing="0" border="0" style="width:100%;background-color:#171920;">
            <tbody>
              <tr>
                <td align="center" style="padding-top:20px;">
                  <table border="0" cellspacing="0" cellpadding="0" style="width:100%;background-color:#2f3542;">
                    <tbody>
                      <tr>
                        <td align="center" style="padding:20px 0;">
                          <table border="0" cellspacing="0" cellpadding="0" style="width:80%;" class="w90">
                            <tbody>
                              <tr>
                                <td style="font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:20px;line-height:26px;color:#ffffff;text-align:center;"><a href="https://www.hoteltonight.com" style="font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:20px;color:#ffffff;text-decoration:none;" target="_blank">FRIENDS WITH BENEFITS</a></td>
                              </tr>
                              <!--<tr>
            <td style="padding-top:10px;font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:20px;line-height:26px;color:#ffffff;text-align:center;"><a href="https://349a9c862960132a1d96760b1a1a9e9e.ulink.adjust.com/ulink/invite?adjust_tracker=flc3x6&adjust_campaign=US20161221ChristmasNoOfferRB&adjust_redirect=https%3A%2F%2Fapp.adjust.com%2Fflc3x6_swosgj%3Fcampaign%3DUS20161221ChristmasNoOfferRB%26deep_link%3Dhoteltonight%253A%252F%252Finvite%253Fadjust_tracker%253Dflc3x6%2526adjust_campaign%253DUS20161221ChristmasNoOfferRB%26fallback%3Dhttps%253A%252F%252Fwww.hoteltonight.com" style="font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:20px;color:#ffffff;text-decoration:none;">$25 for them, $25&nbsp;for&nbsp;you</a></td>
            </tr>-->
                              <tr>
                                <td style="padding-top:10px;font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:14px;line-height:20px;color:#ffffff;text-align:center;"><a href="https://www.hoteltonight.com" style="font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:14px;color:#ffffff;text-decoration:none;" target="_blank">Give your friends $25 USD off their first booking with your code. You'll get $25 USD off your next booking after they book (as long as the booking meets a few terms). Full details here.</a></td>
                              </tr>
                              <tr>
                                <td align="center" style="padding-top:20px;">
                                  <table border="0" cellspacing="0" cellpadding="0" style="background-color:#ffffff;width:60%;min-width:180px;" class="w80">
                                    <tbody>
                                      <tr>
                                        <td style="text-align:center;line-height:20px;padding:5px 0;"><a href="https://www.hoteltonight.com" style="display:inline-block;padding:5px 15px;font-family:'gotham-medium',Helvetica,Arial,sans-serif;font-size:14px;color:#3b2151;text-decoration:none;" target="_blank"><!--[if mso]>&nbsp;&nbsp;&nbsp;<![endif]-->Share your code:<br>REALLYGOODEMAILS<!--[if mso]>&nbsp;&nbsp;&nbsp;<![endif]--></a></td>
                                      </tr>
                                    </tbody>
                                  </table>
                                </td>
                              </tr>
                            </tbody>
                          </table>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </td>
              </tr>
              <tr>
                <td align="center">
                  <a href="https://www.hoteltonight.com" style="font-family:Helvetica,Arial,sans-serif;font-size:14px;color:#2f3542;text-decoration:none;" target="_blank"><img src="https://d38whlyjfr4rg3.cloudfront.net/shaw-scott/Update_FTAF_slice_700x230.jpg" alt="FRIENDS WITH BENEFITS" title="FRIENDS WITH BENEFITS" width="700" border="0" style="display:block; outline:0;border:0;padding:0;width:100%;max-width:700px;height:auto;font-family:Helvetica,Arial,sans-serif;font-size:14px;color:#2f3542;"></a>
                </td>
              </tr>
            </tbody>
          </table>
          <!--/forward to a friend-->
          <!--social/download-->
          <table cellpadding="0" cellspacing="0" border="0" style="width:100%; max-width:700px; background-color:#171920;">
            <tbody>
              <tr>
                <td align="center" valign="top" style="padding-top:20px;vertical-align:top;font-size:0;">
                  <!--[if (gte mso 9)|(IE)]>
        <table border="0" cellspacing="0" cellpadding="0" style="width:700px;">
        <tr>
        <td valign="top" align="center" style="width:50%;">
        <![endif]-->
                  <div style="vertical-align:top;width:100%;max-width:350px;display:inline-block;" class="mw100">
                    <table border="0" cellspacing="0" cellpadding="0" style="width:100%;">
                      <tbody>
                        <tr>
                          <td align="center" style="padding-bottom:20px;">
                            <table border="0" cellspacing="0" cellpadding="0" class="w80">
                              <tbody>
                                <tr>
                                  <td align="center" style="padding-top:20px;">
                                    <a href="https://www.hoteltonight.com" style="font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:14px;color:#ffffff;text-decoration:none;" target="_blank"><img src="https://d38whlyjfr4rg3.cloudfront.net/emailtemplate/headerfooter/HT_App_Bagde_Apple_Dark_121x36_2x.png" alt="App Store" title="App Store" width="121" border="0" style="display:block;outline:0;border:0;padding:0;width:121px;height:auto;font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:12px;color:#ffffff;"></a>
                                  </td>
                                  <td style="width:20px;">&nbsp;</td>
                                  <td align="center" style="padding-top:20px;">
                                    <a href="https://www.hoteltonight.com" style="font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:14px;color:#ffffff;text-decoration:none;" target="_blank"><img src="https://d38whlyjfr4rg3.cloudfront.net/emailtemplate/headerfooter/HT_App_Bagde_Google_Dark_121x36_2x.png" alt="Google Play" title="Google Play" width="121" border="0" style="display:block;outline:0;border:0;padding:0;width:121px;height:auto;font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:12px;color:#ffffff;"></a>
                                  </td>
                                </tr>
                              </tbody>
                            </table>
                          </td>
                        </tr>
                      </tbody>
                    </table>
                  </div>
                  <!--[if (gte mso 9)|(IE)]></td><td align="center" valign="bottom" style="width:50%"><![endif]-->
                  <div style="vertical-align:bottom;width:100%;max-width:350px;display:inline-block;" class="mw100">
                    <table border="0" cellspacing="0" cellpadding="0" style="width:100%;">
                      <tbody>
                        <tr>
                          <td align="center" style="padding-bottom:20px;">
                            <table border="0" cellspacing="0" cellpadding="0">
                              <tbody>
                                <tr>
                                  <td align="center">
                                    <a href="https://www.facebook.com/HotelTonight" style="font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:14px;color:#646978;text-decoration:none;" target="_blank"><img src="https://d38whlyjfr4rg3.cloudfront.net/emailtemplate/headerfooter/HT_soc_facebook.png" alt="Facebook" title="Facebook" width="36" border="0" style="display:block;outline:0;border:0;padding:0;width:36px;height:auto;font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:12px;color:#646978;"></a>
                                  </td>
                                  <td style="width:40px;">&nbsp;</td>
                                  <td align="center">
                                    <a href="https://twitter.com/hoteltonight" style="font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:14px;color:#646978;text-decoration:none;" target="_blank"><img src="https://d38whlyjfr4rg3.cloudfront.net/emailtemplate/headerfooter/HT_soc_twitter.png" alt="Twitter" title="Twitter" width="36" border="0" style="display:block;outline:0;border:0;padding:0;width:36px;height:auto;font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:12px;color:#646978;"></a>
                                  </td>
                                  <td style="width:40px;">&nbsp;</td>
                                  <td align="center">
                                    <a href="https://www.instagram.com/hoteltonight/" style="font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:14px;color:#646978;text-decoration:none;" target="_blank"><img src="https://d38whlyjfr4rg3.cloudfront.net/emailtemplate/headerfooter/HT_soc_instagram.png" alt="Instagram" title="Instagram" width="36" border="0" style="display:block;outline:0;border:0;padding:0;width:36px;height:auto;font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:12px;color:#646978;"></a>
                                  </td>
                                  <td style="width:40px;">&nbsp;</td>
                                  <td align="center">
                                    <a href="http://hoteltonight.tumblr.com/" style="font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:14px;color:#646978;text-decoration:none;" target="_blank"><img src="https://d38whlyjfr4rg3.cloudfront.net/emailtemplate/headerfooter/HT_soc_tumblr.png" alt="Tumbler" title="Tumbler" width="36" border="0" style="display:block;outline:0;border:0;padding:0;width:36px;height:auto;font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:12px;color:#646978;"></a>
                                  </td>
                                </tr>
                              </tbody>
                            </table>
                          </td>
                        </tr>
                      </tbody>
                    </table>
                  </div>
                  <!--[if (gte mso 9)|(IE)]>
        </td>
        </tr>
        </table>
        <![endif]-->
                </td>
              </tr>
            </tbody>
          </table>
          <!--/social/download-->
          <!--footer-->
          <table cellpadding="0" cellspacing="0" border="0" style="width:100%; max-width:700px;background-color:#171920;">
            <tbody>
              <tr>
                <td align="center" style="padding:20px 0;">
                  <table cellpadding="0" cellspacing="0" border="0" style="width:90%;">
                    <tbody>
                      <tr>
                        <td style="text-align:center;font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:12px;line-height:18px;color:#646978;">Limited quantity. Offer subject to availability.</td>
                      </tr>
                      <tr>
                        <td style="padding-top:5px;text-align:center;"><a href="https://www.hoteltonight.com/terms-of-use?native=1" style="font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:12px;line-height:18px;color:#646978;text-decoration:underline;" target="_blank">Terms &amp; Conditions</a></td>
                      </tr>
                      <tr>
                        <td style="padding-top:5px;font-family:'gotham-book',Helvetica,Arial,sans-serif;font-size:12px;line-height:18px;color:#646978;text-align:center;">This email was sent by: HotelTonight<br>901 Market St., Suite 310. San Francisco, CA 94103 US.</td>
                      </tr>
                      <tr>
                        <td style="padding-top:5px;text-align:center;"><a href="#" style="font-family:'gotham-bold',Helvetica,Arial,sans-serif;font-size:12px;color:#646978;text-decoration:none;"
                            target="_blank"><b>Unsubscribe here</b></a></td>
                      </tr>
                    </tbody>
                  </table>
                </td>
              </tr>
            </tbody>
          </table>
          <!--/footer-->
          <!--/ALL CONTENT ENDS HERE-->
        </td>
        <td style="font-size:0;">&nbsp;</td>
      </tr>
    </tbody>
  </table>


</body>
            
          
!
999px
Close

Asset uploading is a PRO feature.

As a PRO member, you can drag-and-drop upload files here to use as resources. Images, Libraries, JSON data... anything you want. You can even edit them anytime, like any other code on CodePen.

Go PRO

Loading ..................

Console