Pen Settings

HTML

CSS

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

JavaScript

Babel is required to process package imports. If you need a different preprocessor remove all packages first.

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

Behavior

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.

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 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.

HTML

              
                <head>
  <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <style type="text/css">
    @media screen and (max-width: 480px) {
            table[class="flexible"] {
                width: 100% !important;
            }
            
            *[class].mobileIconResize {
                width: 60% !important;
            }

            *[class].mobileIconPadding {
                padding-left: 6px !important;
                min-width: 25px !important;
            }

            *[class].privateDealsWelcomeHeaderText {
                font-size: 30px !important;
            }

            *[id]#privateDealsConfirmWidth {
                max-width: 240px !important;
            }

            *[class].mobileHeaderPadding {
                padding-right: 6px !important;
            }
        }

        .client-link a {
            color: #000000 !important;
        }

        div, p, a, li, td {
            -ms-text-size-adjust: none;
            -webkit-text-size-adjust: none;
        }

        .gmailfix {
            display:none;
            display:none!important;
        }
  </style>
</head>

<body style="font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;;">
  <table width="100%" cellspacing="0" cellpadding="0" border="0">
    <tbody>
      <tr>
        <td>
          <!--[if mso]>
                    <table class="flexible" width="700px" align="center" cellpadding="0" cellspacing="0" border=0>
                    <![endif]-->
          <!--[if !mso]> <!---->
          <div class="gmailfix" style="white-space:nowrap; font:15px courier; line-height:0; color: white;">
            - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - -&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;
          </div>
          <a href="http://track.kayak-m.sparkpostelite.com/f/a/YVPQ241j40XSPv0qDLfXkA~~/AAAAAQA~/RgRaHyNBP0EIAGwW52kRsa5XBWtheWFrWAQAAAAASBE1NzAyNDkzMi01ODEyNjYxOEIKAAEYojxYcwG3h1ITbWhlbGJpZzA4QGdtYWlsLmNvbQlRBAAAAABEcmh0dHA6Ly90cmFja2luZy5rYXlhay1tLnNwYXJrcG9zdGVsaXRlLmNvbS8_eHVsPXN6ZW82bGM1YTl5cGs4djlycHBlcHM1bXRsczV1bzBkODJ4OXdscTg0JnhpPW1oZWxiaWcwOCU0MGdtYWlsLmNvbUdNeyJvbmdhZ2UtbGlzdC1pZCI6IjMxNDg5IiwiWC1CaW5kaW5nIjoibWFya2V0aW5nIiwib25nYWdlLWFjY291bnQtaWQiOiI1MDM2In0~"
            style="white-space:nowrap; font:15px courier; line-height:0; color: white;" data-id="752809669" target="_blank"></a>
          <table class="flexible" width="100%" style="max-width:700px;" align="center" cellpadding="0" cellspacing="0" border="0">
            <!-- <![endif]-->
            <tbody>
              <tr>
                <td align="center" id="mainColumn">
                  <table width="700" class="flexible" cellspacing="0" cellpadding="0" border="0">
                    <tbody>
                      <tr height="54">
                        <td align="center">
                          <img width="1" height="1" border="0" src="https://www.kayak.com/h/hermes/pixel/email?uid=10992225972&amp;emailId=20161101&amp;a=email_editorial&amp;locale=en_US&amp;campaign=editorial20161101_KAYAK&amp;token=ELKS4GQtqcC67dQ$4vADgK&amp;type=editorial&amp;experiment=&amp;brand=KAYAK"></td>
                      </tr>
                      <tr>
                        <td align="center">
                          <table align="left" class="flexible" width="700" cellspacing="0" cellpadding="0" border="0" style="padding-bottom:5px;">
                            <tbody>
                              <tr>
                                <td style="-webkit-text-size-adjust:none;font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;;font-size:12px!important;color:#a8a8a8;">
                                  2016 Holiday Travel Hacker Guide: Plan your holiday getaway
                                </td>
                              </tr>
                            </tbody>
                          </table>
                        </td>
                      </tr>
                      <tr>
                        <td>
                          <table style="margin:0; padding:0;" class="flexible" cellspacing="0" cellpadding="0" border="0" bgcolor="#231F20">
                            <tbody>
                              <tr>
                                <td height="60" style="margin:0; height: 60px; padding-left:10px;" align="left" valign="middle" width="350">
                                  <a href="https://www.kayak.com/?setlc=en&amp;setlc=en&amp;setlc=en&amp;er=t" target="_blank" valign="middle" style="display:block;" data-id="752809628"><img width="$logoWidth" class="mobileLogoWidth" border="0" style="padding-top:2px; max-height: 33px; min-height: 30px; max-width: $logoMaxWidth;" src="http://www.kayak.com/eimg/coreImages/kayak-logo-dark-orange-small.png"></a>
                                </td>
                                <td class="mobileHeaderPadding" height="60" align="right" style="padding-right:8px; margin:0; height: 60px;" width="350">
                                  <table cellspacing="0" cellpadding="0" border="0">
                                    <tbody>
                                      <tr>
                                        <td class="mobileIconPadding" style="padding-left:12px;">
                                          <a style="text-decoration:none" href="https://www.kayak.com/flights?setlc=en&amp;setlc=en&amp;setlc=en&amp;er=t" data-id="752809629" target="_blank">
                                            <img width="19" class="mobileIconResize" style="border-style: none; max-width: 19px;" src="https://www.kayak.com/eimg/coreImages/EmailHeader-FlightsIcon-V1.png"></a>
                                        </td>
                                        <td class="mobileIconPadding" style="padding-left:12px;">
                                          <a style="text-decoration:none" href="https://www.kayak.com/hotels?setlc=en&amp;setlc=en&amp;setlc=en&amp;er=t" data-id="752809630" target="_blank">
                                            <img width="19" class="mobileIconResize" style="border-style: none; max-width: 19px;" src="https://www.kayak.com/eimg/coreImages/EmailHeader-HotelsIcon-V1.png"></a>
                                        </td>
                                        <td class="mobileIconPadding" style="padding-left:12px;">
                                          <a style="text-decoration:none" href="https://www.kayak.com/cars?setlc=en&amp;setlc=en&amp;setlc=en&amp;er=t" data-id="752809631" target="_blank">
                                            <img width="19" class="mobileIconResize" style="border-style: none; max-width: 19px;" src="https://www.kayak.com/eimg/coreImages/EmailHeader-CarsIcon-V1.png"></a>
                                        </td>
                                        <td class="mobileIconPadding" style="padding-left:13px;">
                                          <a style="text-decoration:none" href="https://www.kayak.com/trips?setlc=en&amp;setlc=en&amp;setlc=en&amp;er=t" data-id="752809632" target="_blank">
                                            <img width="19" class="mobileIconResize" style="border-style: none; max-width: 19px;" src="https://www.kayak.com/eimg/coreImages/EmailHeader-TripsIcon-V1.png"></a>
                                        </td>
                                      </tr>
                                    </tbody>
                                  </table>
                                </td>
                              </tr>
                            </tbody>
                          </table>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </td>
              </tr>
              <tr>
                <td style="padding-bottom: 30px;" align="center">

                  <table class="flexible" cellspacing="0" cellpadding="0" border="0" bgcolor="#231F20">
                    <tbody>
                      <tr>
                        <td width="700" align="center">
                          <a href="https://www.kayak.com/holidaytravelhacker" style="text-decoration:none" data-id="752809633" target="_blank">
                            <img style="margin:0; padding:0;display:block;" width="100%" src="https://www.kayak.com/h/run/api/image?url=%2Feimg%2FcampaignImages%2Feditorial20161101%2F_THG-HERO.png&amp;crop=true&amp;width=700&amp;height=250&amp;xhint=1867&amp;yhint=1227" border="0"></a>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </td>
              </tr>
              <tr>
                <td align="center" style="background-color:white;">
                  <table class="flexible" cellspacing="0" cellpadding="0" border="0">
                    <tbody>
                      <tr>
                        <td colspan="1" height="8" style="font-size:0px!important;line-height:0em;">
                          &nbsp;
                        </td>
                      </tr>
                      <tr>
                        <td width="700" style="font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;;font-size:40px!important;color:#231f21;font-weight:200!important;background-color:white;-webkit-text-size-adjust:none;padding-left:5%;padding-right:5%;padding-bottom: 5px;">
                          Plan to get away this holiday season
                        </td>
                      </tr>
                      <tr>
                        <td colspan="1" height="5" style="font-size:0px!important;line-height:0em;">
                          &nbsp;
                        </td>
                      </tr>
                      <tr>
                        <td width="700" style="font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;;font-size:14px!important;color:#231f21;background-color:white;-webkit-text-size-adjust:none;padding-left:5%;padding-right:5%;padding-bottom: 5px;">
                          Oh, there’s no place like home for the holidays. Which is why you need to be strategic about planning your travel for the rest of the season. Whether you’re looking for a new city to ring in 2017 or taking a beachy escape between ugly sweater parties,
                          we combed through our data to bring you the where, when and how much of seasonal travel in our <a href="https://www.kayak.com/holidaytravelhacker" data-id="752809634" target="_blank" style="font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;color:#3083f0;text-decoration:none;color:#3083f0;font-weight:bold;font-size:14px!important;font-weight:normal!important" border="0">Holiday Travel Hacker Guide</a>.
                          Travel Problem Solved.

                        </td>
                      </tr>
                      <tr>
                        <td colspan="1" height="40" style="font-size:0px!important;line-height:0em;">
                          &nbsp;
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </td>
              </tr>
              <tr>
                <td align="center" style="background-color:white;">
                  <table class="flexible" cellspacing="0" cellpadding="0" border="0">
                    <tbody>
                      <tr>
                        <td colspan="1" height="8" style="font-size:0px!important;line-height:0em;">
                          &nbsp;
                        </td>
                      </tr>
                      <tr>
                        <td width="700" style="font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;;font-size:14px!important;color:#231f21;font-weight:800;background-color:white;-webkit-text-size-adjust:none;padding-left:5%;padding-right:5%;padding-bottom: 5px;">
                          What’s hot for 2016 holiday travel:
                        </td>
                      </tr>
                      <tr>
                        <td colspan="1" height="8" style="font-size:0px!important;line-height:0em;">
                          &nbsp;
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </td>
              </tr>
              <tr>
                <td style="background-color:white;" align="center">
                  <!--[if mso]>
            <table class="flexible" width="620" cellspacing='0' cellpadding='0' border='0' align="center">
            <![endif]-->
                  <!--[if !mso]> <!---->
                  <table class="flexible" width="700" cellspacing="0" cellpadding="0" border="0">
                    <!-- <![endif]-->
                    <tbody>
                      <tr>
                        <!--[if !mso]> <!---->
                        <td align="center">
                          <!-- <![endif]-->
                          <!--[if mso]>
                        <td valign="top" style="padding: 10px 0px">
                            <table valign="top" align="center" cellspacing='0' cellpadding='0' border='0' style="padding-bottom:3px;">
                                <tr valign="top">
                                    <td valign="top" height=130 width=310>
                        <![endif]-->
                          <!--[if !mso]> <!---->
                          <div style="display: inline-block; vertical-align: top; width:310px;height:285px;margin: 10px 3px">
                            <!-- <![endif]-->
                            <table border="0" cellpadding="0" cellspacing="0">
                              <tbody>
                                <tr>
                                  <td>
                                    <table border="0" cellpadding="0" cellspacing="0">
                                      <tbody>
                                        <tr>
                                          <td width="300" align="center">
                                            <a style="text-decoration:none;font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;font-size:14px!important;color:#ff690f;background-color:white;-webkit-text-size-adjust:none;" border="0" href="https://www.kayak.com/holidaytravelhacker/2016/nye"
                                              data-id="752809635" target="_blank">
                                              <img style="margin:0; padding:0;" width="100%" border="0" src="https://www.kayak.com/h/run/api/image?url=%2Feimg%2FcampaignImages%2Feditorial20161101%2Ftrending.png&amp;crop=true&amp;width=300&amp;height=125&amp;xhint=1867&amp;yhint=1227"></a>
                                          </td>
                                        </tr>
                                      </tbody>
                                    </table>
                                  </td>
                                </tr>
                                <tr>
                                  <td>
                                    <table border="0" cellpadding="0" cellspacing="0">
                                      <tbody>
                                        <tr>
                                          <td height="33" width="300" style="font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;font-size:14px!important;color:#231f21;background-color:white;-webkit-text-size-adjust:none;">
                                            <a style="text-decoration:none;font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;font-size:14px!important;color:#231f21;background-color:white;-webkit-text-size-adjust:none;" border="0" href="https://www.kayak.com/holidaytravelhacker/2016/nye"
                                              data-id="752809636" target="_blank">Top New Year’s Eve Destinations</a>
                                          </td>
                                        </tr>
                                        <tr>
                                          <td width="300" height="67" style="font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;font-size:14px!important;color:#888888;background-color:white;-webkit-text-size-adjust:none;">
                                            <a style="text-decoration:none;font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;font-size:14px!important;color:#888888;background-color:white;-webkit-text-size-adjust:none;" border="0" href="https://www.kayak.com/holidaytravelhacker/2016/nye"
                                              data-id="752809637" target="_blank">
                            Start your “travel more” resolution early in one of these hot cities seeing the biggest increase in searches for NYE. Lace up those dancing shoes and maybe pack a parka if you venture to our #1 destination.


                        </a>
                                          </td>
                                        </tr>
                                        <tr>
                                          <td width="300" height="33" style="font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;font-size:14px!important;color:#ff690f;background-color:white;-webkit-text-size-adjust:none;">
                                            <a style="text-decoration:none;font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;font-size:14px!important;color:#ff690f;background-color:white;-webkit-text-size-adjust:none;" border="0" href="https://www.kayak.com/holidaytravelhacker/2016/nye"
                                              data-id="752809638" target="_blank">
                            See who’s #1
                        </a>
                                          </td>
                                        </tr>
                                      </tbody>
                                    </table>
                                  </td>
                                </tr>
                              </tbody>
                            </table>
                            <!--[if !mso]> <!---->
                          </div>
                          <!-- <![endif]-->
                          <!--[if mso]>
                        </td>
                        </tr>
                        </table>
                        </td>
                        <![endif]-->
                          <!--[if mso]>
                        <td valign="top" style="padding: 10px 0px">
                            <table valign="top" align="center" cellspacing='0' cellpadding='0' border='0' style="padding-bottom:3px;">
                                <tr valign="top">
                                    <td valign="top" height=130 width=310>
                        <![endif]-->
                          <!--[if !mso]> <!---->
                          <div style="display: inline-block; vertical-align: top; width:310px;height:285px;margin: 10px 3px">
                            <!-- <![endif]-->
                            <table border="0" cellpadding="0" cellspacing="0">
                              <tbody>
                                <tr>
                                  <td>
                                    <table border="0" cellpadding="0" cellspacing="0">
                                      <tbody>
                                        <tr>
                                          <td width="300" align="center">
                                            <a style="text-decoration:none;font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;font-size:14px!important;color:#ff690f;background-color:white;-webkit-text-size-adjust:none;" border="0" href="https://www.kayak.com/holidaytravelhacker/2016/beach"
                                              data-id="752809639" target="_blank">
                                              <img style="margin:0; padding:0;" width="100%" border="0" src="https://www.kayak.com/h/run/api/image?url=%2Feimg%2FcampaignImages%2Feditorial20161101%2Fbeach.png&amp;crop=true&amp;width=300&amp;height=125&amp;xhint=1867&amp;yhint=1227"></a>
                                          </td>
                                        </tr>
                                      </tbody>
                                    </table>
                                  </td>
                                </tr>
                                <tr>
                                  <td>
                                    <table border="0" cellpadding="0" cellspacing="0">
                                      <tbody>
                                        <tr>
                                          <td height="33" width="300" style="font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;font-size:14px!important;color:#231f21;background-color:white;-webkit-text-size-adjust:none;">
                                            <a style="text-decoration:none;font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;font-size:14px!important;color:#231f21;background-color:white;-webkit-text-size-adjust:none;" border="0" href="https://www.kayak.com/holidaytravelhacker/2016/beach"
                                              data-id="752809640" target="_blank">Top Beach Destinations</a>
                                          </td>
                                        </tr>
                                        <tr>
                                          <td width="300" height="67" style="font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;font-size:14px!important;color:#888888;background-color:white;-webkit-text-size-adjust:none;">
                                            <a style="text-decoration:none;font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;font-size:14px!important;color:#888888;background-color:white;-webkit-text-size-adjust:none;" border="0" href="https://www.kayak.com/holidaytravelhacker/2016/beach"
                                              data-id="752809641" target="_blank">
                            Daydreaming over your co-worker’s vacation photos? These beachy escapes will get you the dose of sand and sun you need. Start by singing “Feliz Navidad” under the palm trees in our top destination.
                        </a>
                                          </td>
                                        </tr>
                                        <tr>
                                          <td width="300" height="33" style="font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;font-size:14px!important;color:#ff690f;background-color:white;-webkit-text-size-adjust:none;">
                                            <a style="text-decoration:none;font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;font-size:14px!important;color:#ff690f;background-color:white;-webkit-text-size-adjust:none;" border="0" href="https://www.kayak.com/holidaytravelhacker/2016/beach"
                                              data-id="752809642" target="_blank">
                            See who’s #1
                        </a>
                                          </td>
                                        </tr>
                                      </tbody>
                                    </table>
                                  </td>
                                </tr>
                              </tbody>
                            </table>
                            <!--[if !mso]> <!---->
                          </div>
                          <!-- <![endif]-->
                          <!--[if mso]>
                        </td>
                        </tr>
                        </table>
                        </td>
                        <![endif]-->
                          <!--[if !mso]> <!---->
                        </td>
                        <!-- <![endif]-->
                      </tr>
                    </tbody>
                  </table>
                </td>
              </tr>
              <tr>
                <td style="background-color:white;" align="center">
                  <!--[if mso]>
            <table class="flexible" width="620" cellspacing='0' cellpadding='0' border='0' align="center">
            <![endif]-->
                  <!--[if !mso]> <!---->
                  <table class="flexible" width="700" cellspacing="0" cellpadding="0" border="0">
                    <!-- <![endif]-->
                    <tbody>
                      <tr>
                        <!--[if !mso]> <!---->
                        <td align="center">
                          <!-- <![endif]-->
                          <!--[if mso]>
                        <td valign="top" style="padding: 10px 0px">
                            <table valign="top" align="center" cellspacing='0' cellpadding='0' border='0' style="padding-bottom:3px;">
                                <tr valign="top">
                                    <td valign="top" height=130 width=310>
                        <![endif]-->
                          <!--[if !mso]> <!---->
                          <div style="display: inline-block; vertical-align: top; width:310px;height:285px;margin: 10px 3px">
                            <!-- <![endif]-->
                            <table border="0" cellpadding="0" cellspacing="0">
                              <tbody>
                                <tr>
                                  <td>
                                    <table border="0" cellpadding="0" cellspacing="0">
                                      <tbody>
                                        <tr>
                                          <td width="300" align="center">
                                            <a style="text-decoration:none;font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;font-size:14px!important;color:#ff690f;background-color:white;-webkit-text-size-adjust:none;" border="0" href="https://www.kayak.com/holidaytravelhacker/2016/wallet_friendly_int"
                                              data-id="752809643" target="_blank">
                                              <img style="margin:0; padding:0;" width="100%" border="0" src="https://www.kayak.com/h/run/api/image?url=%2Feimg%2FcampaignImages%2Feditorial20161101%2Finternational.png&amp;crop=true&amp;width=300&amp;height=125&amp;xhint=1867&amp;yhint=1227"></a>
                                          </td>
                                        </tr>
                                      </tbody>
                                    </table>
                                  </td>
                                </tr>
                                <tr>
                                  <td>
                                    <table border="0" cellpadding="0" cellspacing="0">
                                      <tbody>
                                        <tr>
                                          <td height="33" width="300" style="font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;font-size:14px!important;color:#231f21;background-color:white;-webkit-text-size-adjust:none;">
                                            <a style="text-decoration:none;font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;font-size:14px!important;color:#231f21;background-color:white;-webkit-text-size-adjust:none;" border="0" href="https://www.kayak.com/holidaytravelhacker/2016/wallet_friendly_int"
                                              data-id="752809644" target="_blank">Wallet-Friendly: International</a>
                                          </td>
                                        </tr>
                                        <tr>
                                          <td width="300" height="67" style="font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;font-size:14px!important;color:#888888;background-color:white;-webkit-text-size-adjust:none;">
                                            <a style="text-decoration:none;font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;font-size:14px!important;color:#888888;background-color:white;-webkit-text-size-adjust:none;" border="0" href="https://www.kayak.com/holidaytravelhacker/2016/wallet_friendly_int"
                                              data-id="752809645" target="_blank">
                            Have a holly jolly holiday on your budget. We found the top destinations with the lowest median airfare outside of the US, Canada and Mexico. Our top city is known for its laid-back, surf-culture vibe.
                        </a>
                                          </td>
                                        </tr>
                                        <tr>
                                          <td width="300" height="33" style="font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;font-size:14px!important;color:#ff690f;background-color:white;-webkit-text-size-adjust:none;">
                                            <a style="text-decoration:none;font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;font-size:14px!important;color:#ff690f;background-color:white;-webkit-text-size-adjust:none;" border="0" href="https://www.kayak.com/holidaytravelhacker/2016/wallet_friendly_int"
                                              data-id="752809646" target="_blank">
                            See who’s #1
                        </a>
                                          </td>
                                        </tr>
                                      </tbody>
                                    </table>
                                  </td>
                                </tr>
                              </tbody>
                            </table>
                            <!--[if !mso]> <!---->
                          </div>
                          <!-- <![endif]-->
                          <!--[if mso]>
                        </td>
                        </tr>
                        </table>
                        </td>
                        <![endif]-->
                          <!--[if mso]>
                        <td valign="top" style="padding: 10px 0px">
                            <table valign="top" align="center" cellspacing='0' cellpadding='0' border='0' style="padding-bottom:3px;">
                                <tr valign="top">
                                    <td valign="top" height=130 width=310>
                        <![endif]-->
                          <!--[if !mso]> <!---->
                          <div style="display: inline-block; vertical-align: top; width:310px;height:285px;margin: 10px 3px">
                            <!-- <![endif]-->
                            <table border="0" cellpadding="0" cellspacing="0">
                              <tbody>
                                <tr>
                                  <td>
                                    <table border="0" cellpadding="0" cellspacing="0">
                                      <tbody>
                                        <tr>
                                          <td width="300" align="center">
                                            <a style="text-decoration:none;font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;font-size:14px!important;color:#ff690f;background-color:white;-webkit-text-size-adjust:none;" border="0" href="https://www.kayak.com/holidaytravelhacker/2016/wallet_friendly_us"
                                              data-id="752809647" target="_blank">
                                              <img style="margin:0; padding:0;" width="100%" border="0" src="https://www.kayak.com/h/run/api/image?url=%2Feimg%2FcampaignImages%2Feditorial20161101%2Fpopular.png&amp;crop=true&amp;width=300&amp;height=125&amp;xhint=1867&amp;yhint=1227"></a>
                                          </td>
                                        </tr>
                                      </tbody>
                                    </table>
                                  </td>
                                </tr>
                                <tr>
                                  <td>
                                    <table border="0" cellpadding="0" cellspacing="0">
                                      <tbody>
                                        <tr>
                                          <td height="33" width="300" style="font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;font-size:14px!important;color:#231f21;background-color:white;-webkit-text-size-adjust:none;">
                                            <a style="text-decoration:none;font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;font-size:14px!important;color:#231f21;background-color:white;-webkit-text-size-adjust:none;" border="0" href="https://www.kayak.com/holidaytravelhacker/2016/wallet_friendly_us"
                                              data-id="752809648" target="_blank">Wallet-Friendly: US</a>
                                          </td>
                                        </tr>
                                        <tr>
                                          <td width="300" height="67" style="font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;font-size:14px!important;color:#888888;background-color:white;-webkit-text-size-adjust:none;">
                                            <a style="text-decoration:none;font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;font-size:14px!important;color:#888888;background-color:white;-webkit-text-size-adjust:none;" border="0" href="https://www.kayak.com/holidaytravelhacker/2016/wallet_friendly_us"
                                              data-id="752809649" target="_blank">
                            Need a getaway that doesn’t require a passport (and won’t take all your spending money)? These cities pack in the holiday cheer while going easy on your wallet. At the top of the list is a town known for its holiday sparkle.

                        </a>
                                          </td>
                                        </tr>
                                        <tr>
                                          <td width="300" height="33" style="font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;font-size:14px!important;color:#ff690f;background-color:white;-webkit-text-size-adjust:none;">
                                            <a style="text-decoration:none;font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;font-size:14px!important;color:#ff690f;background-color:white;-webkit-text-size-adjust:none;" border="0" href="https://www.kayak.com/holidaytravelhacker/2016/wallet_friendly_us"
                                              data-id="752809650" target="_blank">
                            See who’s #1
                        </a>
                                          </td>
                                        </tr>
                                      </tbody>
                                    </table>
                                  </td>
                                </tr>
                              </tbody>
                            </table>
                            <!--[if !mso]> <!---->
                          </div>
                          <!-- <![endif]-->
                          <!--[if mso]>
                        </td>
                        </tr>
                        </table>
                        </td>
                        <![endif]-->
                          <!--[if !mso]> <!---->
                        </td>
                        <!-- <![endif]-->
                      </tr>
                    </tbody>
                  </table>
                </td>
              </tr>
              <tr>
                <td align="center" style="background-color:white;">

                  <table class="flexible" cellspacing="0" cellpadding="0" border="0">
                    <tbody>
                      <tr>
                        <td colspan="1" height="3" style="font-size:0px!important;line-height:0em;">
                          &nbsp;
                        </td>
                      </tr>
                      <tr>
                        <td width="700" colspan="1" valign="middle" style="font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;font-size:14px!important;color:#231f21;background-color:white;-webkit-text-size-adjust:none;padding-left:5%;padding-right:5%;padding-bottom: 5px;">
                          <div style="height: 20px; vertical-align: middle">
                            <img style="vertical-align: middle" src="https://www.kayak.com/eimg/coreImages/feedback-separator.png">&nbsp; Looking for more travel insights? Head over to our <a style="font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;color:#3083f0;text-decoration:none;color:#3083f0;font-weight:bold;font-size:14px!important;font-weight:normal!important"
                              border="0" href="https://www.kayak.com/news/" data-id="752809651" target="_blank">
                        Travel Hacker Blog
                    </a> .
                          </div>
                        </td>
                      </tr>
                      <tr>
                        <td colspan="1" height="3" style="font-size:0px;line-height:0em;">
                          &nbsp;
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </td>
              </tr>
              <tr>
                <td colspan="1" height="8" style="font-size:0px!important;line-height:0em;" align="center">
                  &nbsp;
                </td>
              </tr>
              <tr>
                <td style="background-color:white;" align="center">
                  <!--[if mso]>
        <table class="flexible" width="620" cellspacing='0' cellpadding='0' border='0' align="center" style="padding:0px 3%">
        <![endif]-->
                  <!--[if !mso]> <!---->
                  <table class="flexible" width="700" cellspacing="0" cellpadding="0" border="0" style="padding:0px 3%">
                    <!-- <![endif]-->
                    <tbody>
                      <tr>
                        <!--[if !mso]> <!---->
                        <td align="center">
                          <!-- <![endif]-->
                          <!--[if mso]>
                    <td valign="top" style="padding: 10px 0px">
                        <table valign="top" align="center" cellspacing='0' cellpadding='0' border='0' style="background-color:white;border-radius:1px;">
                            <tr valign="top">
                                <td valign="top" height="30" width="200">
                    <![endif]-->
                          <!--[if !mso]> <!---->
                          <div style="display: inline-block; vertical-align: top;width:205px;padding: 10px 0px;background-color:white;border-radius:1px;margin: 0px 3px;">
                            <!-- <![endif]-->
                            <div>
                              <!--[if mso]>
<v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="https://www.kayak.com/flights?setlc=en&setlc=en&setlc=en&er=t" style="height:40px;v-text-anchor:middle;width:200px;padding-bottom:24px;" arcsize="10%" stroke="f" fillcolor="#ff690f">
    <w:anchorlock/>
    <center style="font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;;font-size:14px!important;font-weight:bold;color:#ffffff;">
            Find a flight
    </center>
</v:roundrect>
<![endif]-->
                            </div>
                            <div>
                              <!--[if !mso]> <!---->
                              <a href="https://www.kayak.com/flights?setlc=en&amp;setlc=en&amp;setlc=en&amp;er=t" style="display:block;text-decoration:none;font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;;min-height:0px;font-weight:bold;font-size:14px!important;font-weight:bold;line-height:24x;width:100%;border-radius:1px;-moz-border-radius:1px;-webkit-border-radius:1px;-khtml-border-radius:3px;color:#ffffff;background-color:#ff690f;text-align:center;vertical-align:middle;padding: 8px 0px;"
                                class="buttonStyle" data-id="752809652" target="_blank">Find a flight</a>
                              <!-- <![endif]-->
                            </div>
                            <!--[if !mso]> <!---->
                          </div>
                          <!-- <![endif]-->
                          <!--[if mso]>
                    </td>
                    </tr>
                    </table>
                    </td>
                    <![endif]-->
                          <!--[if mso]>
                    <td valign="top" style="padding: 10px 0px">
                        <table valign="top" align="center" cellspacing='0' cellpadding='0' border='0' style="background-color:white;border-radius:1px;">
                            <tr valign="top">
                                <td valign="top" height="30" width="200">
                    <![endif]-->
                          <!--[if !mso]> <!---->
                          <div style="display: inline-block; vertical-align: top;width:205px;padding: 10px 0px;background-color:white;border-radius:1px;margin: 0px 3px;">
                            <!-- <![endif]-->
                            <div>
                              <!--[if mso]>
<v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="https://www.kayak.com/hotels?setlc=en&setlc=en&setlc=en&er=t" style="height:40px;v-text-anchor:middle;width:200px;padding-bottom:24px;" arcsize="10%" stroke="f" fillcolor="#ff690f">
    <w:anchorlock/>
    <center style="font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;;font-size:14px!important;font-weight:bold;color:#ffffff;">
            Find a hotel
    </center>
</v:roundrect>
<![endif]-->
                            </div>
                            <div>
                              <!--[if !mso]> <!---->
                              <a href="https://www.kayak.com/hotels?setlc=en&amp;setlc=en&amp;setlc=en&amp;er=t" style="display:block;text-decoration:none;font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;;min-height:0px;font-weight:bold;font-size:14px!important;font-weight:bold;line-height:24x;width:100%;border-radius:1px;-moz-border-radius:1px;-webkit-border-radius:1px;-khtml-border-radius:3px;color:#ffffff;background-color:#ff690f;text-align:center;vertical-align:middle;padding: 8px 0px;"
                                class="buttonStyle" data-id="752809653" target="_blank">Find a hotel</a>
                              <!-- <![endif]-->
                            </div>
                            <!--[if !mso]> <!---->
                          </div>
                          <!-- <![endif]-->
                          <!--[if mso]>
                    </td>
                    </tr>
                    </table>
                    </td>
                    <![endif]-->
                          <!--[if mso]>
                    <td valign="top" style="padding: 10px 0px">
                        <table valign="top" align="center" cellspacing='0' cellpadding='0' border='0' style="background-color:white;border-radius:1px;">
                            <tr valign="top">
                                <td valign="top" height="30" width="200">
                    <![endif]-->
                          <!--[if !mso]> <!---->
                          <div style="display: inline-block; vertical-align: top;width:205px;padding: 10px 0px;background-color:white;border-radius:1px;margin: 0px 3px;">
                            <!-- <![endif]-->
                            <div>
                              <!--[if mso]>
<v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="https://www.kayak.com/cars?setlc=en&setlc=en&setlc=en&er=t" style="height:40px;v-text-anchor:middle;width:200px;padding-bottom:24px;" arcsize="10%" stroke="f" fillcolor="#ff690f">
    <w:anchorlock/>
    <center style="font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;;font-size:14px!important;font-weight:bold;color:#ffffff;">
            Find a car
    </center>
</v:roundrect>
<![endif]-->
                            </div>
                            <div>
                              <!--[if !mso]> <!---->
                              <a href="https://www.kayak.com/cars?setlc=en&amp;setlc=en&amp;setlc=en&amp;er=t" style="display:block;text-decoration:none;font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif;;min-height:0px;font-weight:bold;font-size:14px!important;font-weight:bold;line-height:24x;width:100%;border-radius:1px;-moz-border-radius:1px;-webkit-border-radius:1px;-khtml-border-radius:3px;color:#ffffff;background-color:#ff690f;text-align:center;vertical-align:middle;padding: 8px 0px;"
                                class="buttonStyle" data-id="752809654" target="_blank">Find a car</a>
                              <!-- <![endif]-->
                            </div>
                            <!--[if !mso]> <!---->
                          </div>
                          <!-- <![endif]-->
                          <!--[if mso]>
                    </td>
                    </tr>
                    </table>
                    </td>
                    <![endif]-->
                          <!--[if !mso]> <!---->
                        </td>
                        <!-- <![endif]-->
                      </tr>
                    </tbody>
                  </table>
                </td>
              </tr>
              <tr>
                <td align="center" style="background-color:#FFFFFF;">
                  <table width="700" align="center" class="flexible" cellspacing="0" cellpadding="0" border="0" style="background-color:#FFFFFF;border-bottom:none;margin:0 auto;padding-top:10px;">
                    <tbody>
                      <tr>
                        <td align="center" style="background-color:#FFFFFF;text-decoration:none;padding-left:20px;padding-top:20px;padding-bottom:10px;padding-right:20px;border-bottom:1px solid #e7e7e7;">
                          <table align="center" cellspacing="0" cellpadding="0" border="0" style="background-color:#FFFFFF;">
                            <tbody>
                              <tr>
                                <td width="100%" align="center" style="text-decoration:none;font-size:12px; font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif; color:#a8a8a8;;padding-top:10px;padding-bottom:30px">
                                  <a href="https://www.facebook.com/kayak" style="text-decoration:none;font-size:12px; font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif; color:#a8a8a8;" data-id="752809655" target="_blank">
                                    <img src="https://www.kayak.com/eimg/coreImages/facebookasset-retina.png" style="border:0;height:16px!important;" height="16" border="0"></a>&nbsp;&nbsp;&nbsp;&nbsp;

                                  <a href="https://twitter.com/KAYAK" style="text-decoration:none;font-size:12px; font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif; color:#a8a8a8;" data-id="752809656" target="_blank">
                                    <img src="https://www.kayak.com/eimg/coreImages/twitterasset-retina.png" style="border:0;height:15px!important;" height="15" border="0"></a>&nbsp;&nbsp;&nbsp;&nbsp;

                                  <a href="https://www.instagram.com/KAYAK/" style="text-decoration:none;font-size:12px; font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif; color:#a8a8a8;" data-id="752809657" target="_blank">
                                    <img src="https://www.kayak.com/eimg/coreImages/instagramasset-retina.png" style="border:0;height:15px!important;" height="15" border="0"></a>&nbsp;&nbsp;&nbsp;&nbsp;

                                  <a href="https://www.kayak.com/news/" style="text-decoration:none;font-size:12px; font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif; color:#a8a8a8;" data-id="752809658" target="_blank">
                                    <img src="https://www.kayak.com/eimg/coreImages/blogasset-retina.png" style="border:0;height:15px !important;" height="15" border="0"></a>
                                </td>
                              </tr>
                              <tr>
                                <td style="vertical-align:top;padding-bottom:15px;padding-left:5px;padding-right:5px;text-align: center;" width="width:100%" align="center">
                                  <div width="100%" align="center" style="text-decoration:none;font-size:12px; font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif; color:#a8a8a8;">© 2016 <a style="text-decoration:none;font-size:12px; font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif; color:#a8a8a8;" href="https://www.kayak.com/?setlc=en&amp;setlc=en&amp;setlc=en&amp;er=t"
                                      data-id="752809659" target="_blank">KAYAK</a>
                                  </div>
                                  <div width="100%" align="center" style="text-decoration:none;font-size:12px; font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif; color:#a8a8a8;">7 Market Street&nbsp;&nbsp;Stamford, CT 06902-5810 US</div>
                                </td>
                              </tr>
                              <tr>
                                <td width="100%" align="center" style="text-decoration:none;font-size:12px; font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif; color:#a8a8a8;;">
                                  <table cellspacing="0" cellpadding="0" border="0">
                                    <tbody>
                                      <tr valign="middle">
                                        <td align="center">
                                          <div align="center" style="display:inline">
                                            <a style="text-decoration:none;font-size:12px; font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif; color:#a8a8a8;" href="https://www.kayak.com/hotels?setlc=en&amp;setlc=en&amp;setlc=en&amp;er=t" data-id="752809660" target="_blank">
                                                        Hotels&nbsp;&nbsp;
                                                    </a>
                                            <a style="text-decoration:none;font-size:12px; font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif; color:#a8a8a8;" href="https://www.kayak.com/flights?setlc=en&amp;setlc=en&amp;setlc=en&amp;er=t" data-id="752809661" target="_blank">
                                                        Flights&nbsp;&nbsp;
                                                    </a>
                                            <a style="text-decoration:none;font-size:12px; font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif; color:#a8a8a8;" href="https://www.kayak.com/cars?setlc=en&amp;setlc=en&amp;setlc=en&amp;er=t" data-id="752809662" target="_blank">
                                                        Cars&nbsp;&nbsp;
                                                    </a>
                                            <a style="text-decoration:none;font-size:12px; font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif; color:#a8a8a8;" href="https://www.kayak.com/trips?setlc=en&amp;setlc=en&amp;setlc=en&amp;er=t" data-id="752809663" target="_blank">
                                                        Trips&nbsp;&nbsp;
                                                    </a>
                                            <a style="text-decoration:none;font-size:12px; font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif; color:#a8a8a8;" href="https://www.kayak.com/mobile?setlc=en&amp;setlc=en&amp;setlc=en&amp;er=t" data-id="752809664" target="_blank">
                                                        App&nbsp;
                                                    </a>
                                          </div>
                                        </td>
                                      </tr>
                                    </tbody>
                                  </table>
                                </td>
                              </tr>
                              <tr align="center">
                                <td width="100%" align="center" style="text-decoration:none;font-size:12px; font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif; color:#a8a8a8;;padding-bottom:10px">
                                  <table cellspacing="0" cellpadding="0" border="0" class="flexibleFooterText" align="center">
                                    <tbody>
                                      <tr valign="middle" align="center">
                                        <td align="center">
                                          <div align="center" style="display:inline">
                                            <a style="text-decoration:none;font-size:12px; font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif; color:#a8a8a8;" href="#"
                                              data-id="752809665" target="_blank">
                                                    Unsubscribe&nbsp;&nbsp;
                                                </a>
                                            <a style="text-decoration:none;font-size:12px; font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif; color:#a8a8a8;" href="#" data-id="752809666" target="_blank">
                                                    Email Preferences&nbsp;&nbsp;
                                                </a>
                                            <a style="text-decoration:none;font-size:12px; font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif; color:#a8a8a8;" href="https://www.kayak.com/help?er=t&amp;setlc=en" data-id="752809667" target="_blank">
                                                    Feedback&nbsp;&nbsp;
                                                </a>
                                            <a style="text-decoration:none;font-size:12px; font-family:'Helvetica Neue',Helvetica,Arial,'DejaVuSansBook',sans-serif; color:#a8a8a8;" href="https://www.kayak.com/privacy?setlc=en&amp;setlc=en&amp;setlc=en&amp;er=t" data-id="752809668" target="_blank">
                                                    Privacy Policy&nbsp;
                                                </a>
                                          </div>
                                        </td>
                                      </tr>
                                    </tbody>
                                  </table>
                                </td>
                              </tr>
                            </tbody>
                          </table>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </td>
              </tr>

            </tbody>
          </table>
        </td>
      </tr>
    </tbody>
  </table><img src="http://tracking.kayak-m.sparkpostelite.com/?xol=rbp7prieijyu68gsso&amp;xi=mhelbig08@gmail.com" alt="" width="1" height="1">
  <img border="0" width="1" height="1" alt="" src="http://track.kayak-m.sparkpostelite.com/q/AwWq2i6CbxUZ2JYykHsOIg~~/AAAAAQA~/RgRaHyNBPkEIAGwW52kRsa5XBWtheWFrWAQAAAAASBE1NzAyNDkzMi01ODEyNjYxOEIKAAEYojxYcwG3h1ITbWhlbGJpZzA4QGdtYWlsLmNvbQlRBAAAAABHTXsib25nYWdlLWFjY291bnQtaWQiOiI1MDM2Iiwib25nYWdlLWxpc3QtaWQiOiIzMTQ4OSIsIlgtQmluZGluZyI6Im1hcmtldGluZyJ9">

</body>
              
            
!

CSS

              
                
              
            
!

JS

              
                
              
            
!
999px

Console