css Audio - Active file-generic CSS - Active Generic - Active HTML - Active JS - Active SVG - Active Text - Active file-generic Video - Active header Love html icon-new-collection icon-person icon-team numbered-list123 pop-out spinner split-screen star tv

Pen Settings

CSS Base

Vendor Prefixing

Add External Stylesheets/Pens

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

+ add another resource

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

Add External Scripts/Pens

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

+ add another resource

Use npm Packages

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

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

Code Indentation

     

Save Automatically?

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

Auto-Updating Preview

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

HTML Settings

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

            
              <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" style="min-height:100%;background:#f3f3f3">

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
</head>

<body style="font-size:16px;min-width:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;margin:0;line-height:1.3;color:#0a0a0a;text-align:left;width:100% !important">
  <div class="preheader" style="mso-hide:all;visibility:hidden;opacity:0;color:transparent;font-size:0px;width:0;height:0;display:none !important"></div>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <meta name="viewport" content="width=device-width">
  <style data-roadie-ignore data-immutable="true" type="text/css">
    @font-face {
      font-family: "Circular Black";
      src: url("https://a1.muscache.com/airbnb/nabelove/locations/assets-pretzel/o2.0-pretzel/build/fonts/circular-black-eacab50a0d48e0117b4a8aa27f29b1a3.eot?");
      src: url("https://a1.muscache.com/airbnb/nabelove/locations/assets-pretzel/o2.0-pretzel/build/fonts/circular-black-eacab50a0d48e0117b4a8aa27f29b1a3.eot?#")
          format("eot"),
        url("https://a2.muscache.com/airbnb/help/public/fonts/Circular_Air-Black-cacc9d2e8a3e8edf28df2da2234f4166.woff")
          format("woff"),
        url("https://a2.muscache.com/airbnb/help/public/fonts/Circular_Air-Black-a4242b3d7631cb897b76e3e4da25869c.ttf")
          format("truetype"),
        url("https://a2.muscache.com/airbnb/help/public/fonts/Circular_Air-Black-9e02c8497a070745e139c0b1f2bd8a18.svg")
          format("svg");
      letter-spacing: -1px !important;
    }
    
    @font-face {
      font-family: "Circular Light";
      src: url("https://a1.muscache.com/airbnb/static/airbnb-o2/fonts/Circular_Air-Light-199f6f9d92c4f5f0cabe9ce7765467a9.woff2")
        format("woff2");
      font-weight: 200;
      font-style: normal;
    }
    
    @font-face {
      font-family: Circular;
      src: url("https://a0.muscache.com/airbnb/static/airbnb-o2/fonts/Circular_Air-Book-a952ee2c4bd292728a2439f767e3a260.eot");
      src: url("https://a0.muscache.com/airbnb/static/airbnb-o2/fonts/Circular_Air-Book-1f5a0275bdd69dbbeadffab401c698a2.woff2")
          format("woff2"),
        url("https://a0.muscache.com/airbnb/static/airbnb-o2/fonts/Circular_Air-Book-7f15c543c7006815105f5df71824836d.woff")
          format("woff"),
        url("https://a0.muscache.com/airbnb/static/airbnb-o2/fonts/Circular_Air-Book-98e37c7514bb7096658cabbf6d43e783.svg")
          format("svg");
      font-weight: normal;
      font-style: normal;
    }
    
    @font-face {
      font-family: Circular;
      src: url("https://a0.muscache.com/airbnb/static/airbnb-o2/fonts/Circular_Air-Book_Italic-35e1cf57d93dc4eb3db11cc2448cb91f.eot");
      src: url("https://a0.muscache.com/airbnb/static/airbnb-o2/fonts/Circular_Air-Book_Italic-4909b413294f9048153d6dee23438b24.woff2")
          format("woff2"),
        url("https://a0.muscache.com/airbnb/static/airbnb-o2/fonts/Circular_Air-Book_Italic-1db902f5b85bbb0964e2994434edbe16.woff")
          format("woff"),
        url("https://a0.muscache.com/airbnb/static/airbnb-o2/fonts/Circular_Air-Book_Italic-0d9eb203b260869dc2470ae35162fc1e.svg")
          format("svg");
      font-weight: normal;
      font-style: italic;
    }
    
    @font-face {
      font-family: Circular;
      src: url("https://a0.muscache.com/airbnb/static/airbnb-o2/fonts/Circular_Air-Bold-c4da182b004982220ffd5caf5555cf2d.eot");
      src: url("https://a0.muscache.com/airbnb/static/airbnb-o2/fonts/Circular_Air-Bold-7ceb09864a7ed03b9c10cfa2f7281315.woff2")
          format("woff2"),
        url("https://a0.muscache.com/airbnb/static/airbnb-o2/fonts/Circular_Air-Bold-eacfa7beaa999351b4f89935e0126b19.woff")
          format("woff"),
        url("https://a0.muscache.com/airbnb/static/airbnb-o2/fonts/Circular_Air-Bold-190e0f26359cdc7d8d093e1a04983ed3.svg")
          format("svg");
      font-weight: 700;
      font-style: normal;
    }
    
    @font-face {
      font-family: Circular;
      src: url("https://a0.muscache.com/airbnb/static/airbnb-o2/fonts/Circular_Air-Light-3d9fa9ce4a6feb3bb7eab142470dd7d3.eot");
      src: url("https://a0.muscache.com/airbnb/static/airbnb-o2/fonts/Circular_Air-Light-42f300daf805956564cdf1fcb56d2c6f.woff2")
          format("woff2"),
        url("https://a0.muscache.com/airbnb/static/airbnb-o2/fonts/Circular_Air-Light-1cf016706a26eb4bf820dca2dca82c9f.woff")
          format("woff"),
        url("https://a0.muscache.com/airbnb/static/airbnb-o2/fonts/Circular_Air-Light-ea56415eb35466568fd22e41c7352796.svg")
          format("svg");
      font-weight: 300;
      font-style: normal;
    }
    
    @font-face {
      font-family: Circular;
      src: url("https://a0.muscache.com/airbnb/static/airbnb-o2/fonts/Circular_Air-Light-3d9fa9ce4a6feb3bb7eab142470dd7d3.eot");
      src: url("https://a0.muscache.com/airbnb/static/airbnb-o2/fonts/Circular_Air-Light-42f300daf805956564cdf1fcb56d2c6f.woff2")
          format("woff2"),
        url("https://a0.muscache.com/airbnb/static/airbnb-o2/fonts/Circular_Air-Light-1cf016706a26eb4bf820dca2dca82c9f.woff")
          format("woff"),
        url("https://a0.muscache.com/airbnb/static/airbnb-o2/fonts/Circular_Air-Light-ea56415eb35466568fd22e41c7352796.svg")
          format("svg");
      font-weight: 200;
      font-style: normal;
    }
  </style>
  <style data-roadie-ignore data-immutable="true">
    @media only screen and (max-width: 596px) {
      .small-float-center {
        margin: 0 auto !important;
        float: none !important;
        text-align: center !important;
      }
      .small-text-center {
        text-align: center !important;
      }
      .small-text-left {
        text-align: left !important;
      }
      .small-text-right {
        text-align: right !important;
      }
    }
    
    @media only screen and (max-width: 596px) {
      table.body table.container .hide-for-large {
        display: block !important;
        width: auto !important;
        overflow: visible !important;
        max-height: none !important;
      }
    }
    
    @media only screen and (max-width: 596px) {
      table.body table.container .row.hide-for-large,
      table.body table.container .row.hide-for-large {
        display: table !important;
        width: 100% !important;
      }
    }
    
    @media only screen and (max-width: 596px) {
      table.body table.container .show-for-large {
        display: none !important;
        width: 0;
        mso-hide: all;
        overflow: hidden;
      }
    }
    
    @media only screen and (max-width: 596px) {
      table.body img {
        width: auto !important;
        height: auto !important;
      }
      table.body center {
        min-width: 0 !important;
      }
      table.body .container {
        width: 95% !important;
      }
      table.body .columns,
      table.body .column {
        height: auto !important;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        padding-left: 16px !important;
        padding-right: 16px !important;
      }
      table.body .columns .column,
      table.body .columns .columns,
      table.body .column .column,
      table.body .column .columns {
        padding-left: 0 !important;
        padding-right: 0 !important;
      }
      table.body .collapse .columns,
      table.body .collapse .column {
        padding-left: 0 !important;
        padding-right: 0 !important;
      }
      td.small-1,
      th.small-1 {
        display: inline-block !important;
        width: 8.33333% !important;
      }
      td.small-2,
      th.small-2 {
        display: inline-block !important;
        width: 16.66667% !important;
      }
      td.small-3,
      th.small-3 {
        display: inline-block !important;
        width: 25% !important;
      }
      td.small-4,
      th.small-4 {
        display: inline-block !important;
        width: 33.33333% !important;
      }
      td.small-5,
      th.small-5 {
        display: inline-block !important;
        width: 41.66667% !important;
      }
      td.small-6,
      th.small-6 {
        display: inline-block !important;
        width: 50% !important;
      }
      td.small-7,
      th.small-7 {
        display: inline-block !important;
        width: 58.33333% !important;
      }
      td.small-8,
      th.small-8 {
        display: inline-block !important;
        width: 66.66667% !important;
      }
      td.small-9,
      th.small-9 {
        display: inline-block !important;
        width: 75% !important;
      }
      td.small-10,
      th.small-10 {
        display: inline-block !important;
        width: 83.33333% !important;
      }
      td.small-11,
      th.small-11 {
        display: inline-block !important;
        width: 91.66667% !important;
      }
      td.small-12,
      th.small-12 {
        display: inline-block !important;
        width: 100% !important;
      }
      .columns td.small-12,
      .column td.small-12,
      .columns th.small-12,
      .column th.small-12 {
        display: block !important;
        width: 100% !important;
      }
      .body .columns td.small-1,
      .body .column td.small-1,
      td.small-1 center,
      .body .columns th.small-1,
      .body .column th.small-1,
      th.small-1 center {
        display: inline-block !important;
        width: 8.33333% !important;
      }
      .body .columns td.small-2,
      .body .column td.small-2,
      td.small-2 center,
      .body .columns th.small-2,
      .body .column th.small-2,
      th.small-2 center {
        display: inline-block !important;
        width: 16.66667% !important;
      }
      .body .columns td.small-3,
      .body .column td.small-3,
      td.small-3 center,
      .body .columns th.small-3,
      .body .column th.small-3,
      th.small-3 center {
        display: inline-block !important;
        width: 25% !important;
      }
      .body .columns td.small-4,
      .body .column td.small-4,
      td.small-4 center,
      .body .columns th.small-4,
      .body .column th.small-4,
      th.small-4 center {
        display: inline-block !important;
        width: 33.33333% !important;
      }
      .body .columns td.small-5,
      .body .column td.small-5,
      td.small-5 center,
      .body .columns th.small-5,
      .body .column th.small-5,
      th.small-5 center {
        display: inline-block !important;
        width: 41.66667% !important;
      }
      .body .columns td.small-6,
      .body .column td.small-6,
      td.small-6 center,
      .body .columns th.small-6,
      .body .column th.small-6,
      th.small-6 center {
        display: inline-block !important;
        width: 50% !important;
      }
      .body .columns td.small-7,
      .body .column td.small-7,
      td.small-7 center,
      .body .columns th.small-7,
      .body .column th.small-7,
      th.small-7 center {
        display: inline-block !important;
        width: 58.33333% !important;
      }
      .body .columns td.small-8,
      .body .column td.small-8,
      td.small-8 center,
      .body .columns th.small-8,
      .body .column th.small-8,
      th.small-8 center {
        display: inline-block !important;
        width: 66.66667% !important;
      }
      .body .columns td.small-9,
      .body .column td.small-9,
      td.small-9 center,
      .body .columns th.small-9,
      .body .column th.small-9,
      th.small-9 center {
        display: inline-block !important;
        width: 75% !important;
      }
      .body .columns td.small-10,
      .body .column td.small-10,
      td.small-10 center,
      .body .columns th.small-10,
      .body .column th.small-10,
      th.small-10 center {
        display: inline-block !important;
        width: 83.33333% !important;
      }
      .body .columns td.small-11,
      .body .column td.small-11,
      td.small-11 center,
      .body .columns th.small-11,
      .body .column th.small-11,
      th.small-11 center {
        display: inline-block !important;
        width: 91.66667% !important;
      }
      table.body td.small-offset-1,
      table.body th.small-offset-1 {
        margin-left: 8.33333% !important;
        margin-left: 8.33333% !important;
      }
      table.body td.small-offset-2,
      table.body th.small-offset-2 {
        margin-left: 16.66667% !important;
        margin-left: 16.66667% !important;
      }
      table.body td.small-offset-3,
      table.body th.small-offset-3 {
        margin-left: 25% !important;
        margin-left: 25% !important;
      }
      table.body td.small-offset-4,
      table.body th.small-offset-4 {
        margin-left: 33.33333% !important;
        margin-left: 33.33333% !important;
      }
      table.body td.small-offset-5,
      table.body th.small-offset-5 {
        margin-left: 41.66667% !important;
        margin-left: 41.66667% !important;
      }
      table.body td.small-offset-6,
      table.body th.small-offset-6 {
        margin-left: 50% !important;
        margin-left: 50% !important;
      }
      table.body td.small-offset-7,
      table.body th.small-offset-7 {
        margin-left: 58.33333% !important;
        margin-left: 58.33333% !important;
      }
      table.body td.small-offset-8,
      table.body th.small-offset-8 {
        margin-left: 66.66667% !important;
        margin-left: 66.66667% !important;
      }
      table.body td.small-offset-9,
      table.body th.small-offset-9 {
        margin-left: 75% !important;
        margin-left: 75% !important;
      }
      table.body td.small-offset-10,
      table.body th.small-offset-10 {
        margin-left: 83.33333% !important;
        margin-left: 83.33333% !important;
      }
      table.body td.small-offset-11,
      table.body th.small-offset-11 {
        margin-left: 91.66667% !important;
        margin-left: 91.66667% !important;
      }
      table.body table.columns td.expander,
      table.body table.columns th.expander {
        display: none !important;
      }
      table.body .right-text-pad,
      table.body .text-pad-right {
        padding-left: 10px !important;
      }
      table.body .left-text-pad,
      table.body .text-pad-left {
        padding-right: 10px !important;
      }
      table.menu {
        width: 100% !important;
      }
      table.menu td,
      table.menu th {
        width: auto !important;
        display: inline-block !important;
      }
      table.menu.vertical td,
      table.menu.vertical th,
      table.menu.small-vertical td,
      table.menu.small-vertical th {
        display: block !important;
      }
      table.menu[align="center"] {
        width: auto !important;
      }
      table.button.expand {
        width: 100% !important;
      }
    }
    
    @media only screen and (max-width: 596px) {
      .calendar-content {
        padding: 0px !important;
        width: 288px !important;
      }
    
      .not-available-day,
      .calendar-today,
      .available-day {
        height: 40px !important;
        width: 40px !important;
      }
    
      .day-label {
        margin-left: 10% !important;
        margin-top: 0% !important;
        font-size: 15px;
      }
    }
  </style>
  <meta name="filler" content="        _      _           _      ">
  <meta name="filler" content="       (_)    | |         | |     ">
  <meta name="filler" content="   __ _ _ _ __| |__  _ __ | |__   ">
  <meta name="filler" content="  / _' | | '__| '_ \| '_ \| '_ \  ">
  <meta name="filler" content=" | (_| | | |  | |_) | | | | |_) | ">
  <meta name="filler" content="  \__,_|_|_|  |_.__/|_| |_|_.__/  ">
  <meta name="filler" content="                                  ">
  
  <table class="body" style="border-spacing:0;border-collapse:collapse;vertical-align:top;-webkit-hyphens:none;-moz-hyphens:none;hyphens:none;-ms-hyphens:none;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;margin:0;text-align:left;font-size:16px;line-height:19px;background:#f3f3f3;padding:0;width:100%;height:100%;color:#0a0a0a;margin-bottom:0px !important;background-color: white">
    <tr style="padding:0;vertical-align:top;text-align:left">
      <td class="center" align="center" valign="top" style="font-size:16px;word-wrap:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;hyphens:auto;vertical-align:top;text-align:left;line-height:1.3;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;padding:0;margin:0;font-weight:normal;border-collapse:collapse !important">
        <center style="width:100%;min-width:580px">
          <!--[if mso]>
              <table class="container" width="580">
              <![endif]-->
          <!--[if !mso]>
                <!-- -->
          <table class="container" style="border-spacing:0;border-collapse:collapse;padding:0;vertical-align:top;background:#fefefe;width:580px;margin:0 auto;text-align:inherit;max-width:580px;">
            <!-- <![endif]-->
            <tr style="padding:0;vertical-align:top;text-align:left">
              <td style="font-size:16px;word-wrap:break-word;-webkit-hyphens:auto;-moz-hyphens:auto;hyphens:auto;vertical-align:top;text-align:left;line-height:1.3;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;padding:0;margin:0;font-weight:normal;border-collapse:collapse !important">
                <div>
                  <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                    <tr class="" style="padding:0;vertical-align:top;text-align:left">
                      <th class="small-12 large-12 columns first last" style="font-size:16px;padding:0;text-align:left;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;line-height:1.3;margin:0 auto;padding-bottom:16px;width:564px;padding-left:16px;padding-right:16px">
                        <a href="https://www.airbnb.com" style="font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;margin:0;text-align:left;line-height:1.3;color:#2199e8;text-decoration:none">
                          <img align="center" alt="" class="center standard-header" height="30" src="https://a1.muscache.com/airbnb/rookery/dls/logo_standard_2x-c0ed1450d18490825bc37dd6cb23e5c5.png" style="display:block;outline:none;text-decoration:none;-ms-interpolation-mode:bicubic;width:auto;max-width:100%;clear:both;border:none;padding-top:48px;padding-bottom:16px;max-height:30px">
                        </a>
                      </th>
                    </tr>
                  </table>
                </div>
                <div>
                  <div class="headline-body" style="padding-bottom:24px">
                    <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                      <tr class="" style="padding:0;vertical-align:top;text-align:left">
                        <th class="small-12 large-12 columns first last" style="font-size:16px;text-align:left;line-height:1.3;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;width:564px;margin:0 auto;padding-left:16px;padding-right:16px;padding-bottom:0px !important">
                          <p class="headline headline-lg heavy max-width-485" style='padding:0;margin:0;text-align:left;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;max-width:485px;font-weight:700;color:#484848;line-height:1.3;word-break:keep-all;hyphens:none;-moz-hyphens:none;-webkit-hyphens:none;font-size:32px;-ms-hyphens:none;padding-bottom:8px;margin-bottom:0 !important;'>Your reservation is confirmed</p>
                        </th>
                      </tr>
                    </table>
                    <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                      <tr class="" style="padding:0;vertical-align:top;text-align:left">
                        <th class="small-12 large-12 columns first last" style="font-size:16px;text-align:left;line-height:1.3;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;width:564px;margin:0 auto;padding-left:16px;padding-right:16px;padding-bottom:0px !important">
                          <p class="body  body-lg body-link-rausch light text-left   " style="font-family:'Circular', Helvetica, Arial, sans-serif;padding:0;margin:0;line-height:1.4;font-weight:300;color:#484848;font-size:18px;hyphens:none;-ms-hyphens:none;-webkit-hyphens:none;-moz-hyphens:none;text-align:left;margin-bottom:0px !important;">You’re going to San Francisco.</p>
                        </th>
                      </tr>
                    </table>
                  </div>
                </div>
                <div>
                  <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                    <tr class="" style="padding:0;vertical-align:top;text-align:left">
                      <th class="small-12 large-12 columns first last" style="font-size:16px;padding:0;text-align:left;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;line-height:1.3;margin:0 auto;padding-bottom:16px;width:564px;padding-left:16px;padding-right:16px">
                        <a href="https://www.airbnb.com/" style="font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;margin:0;text-align:left;line-height:1.3;color:#2199e8;text-decoration:none">
                          <img src="https://a0.muscache.com/im/pictures/3a4e6241-7bd2-47e0-8f67-5c3c6e21d20a.jpg?aki_policy=large" class="row-pad-bot-1" style="display:block;outline:none;text-decoration:none;-ms-interpolation-mode:bicubic;width:auto;clear:both;max-width:100%;border:none;padding-bottom:8px !important">
                        </a>
                      </th>
                    </tr>
                  </table>
                  <table class="row guest-listing-card" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                    <tr style="padding:0;vertical-align:top;text-align:left">
                      <th class="small-10 large-10 columns first guest-listing-card-text row-pad-bot-3 valign-mid" style="font-size:16px;text-align:left;line-height:1.3;color:#0a0a0a;font-weight:normal;padding:0;font-family:'Circular', Helvetica, Arial, sans-serif;vertical-align:middle;padding-right:8px;margin:0 auto;padding-bottom:16px;width:467.33333px;padding-left:16px">
                        <a href="https://www.airbnb.com" class="subheadline" style="font-weight:normal;padding:0;margin:0;text-align:left;color:#2199e8;text-decoration:none;font-family:'Circular', Helvetica, Arial, sans-serif;font-size:18px;line-height:1.4">
                          <p class="headline" style='padding:0;text-align:left;margin:0;-ms-hyphens:none;word-break:keep-all;hyphens:none;-moz-hyphens:none;-webkit-hyphens:none;color:#484848;font-weight:300;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;font-size:24px;line-height:1.3;margin-bottom:0 !important'>Superhosted Castro Studio. Easy Parking. No Keys.</p>
                          <p class="midheadline" style='padding:0;margin:0;text-align:left;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;font-weight:300;color:#484848;line-height:1.4;font-size:18px;margin-bottom:0 !important'>Entire home/apt hosted by Christian</p>
                        </a>
                      </th>
                      <th class="small-2 large-2 columns last" style="font-size:16px;text-align:left;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;line-height:1.3;width:80.66667px;padding-left:16px;margin:0 auto;padding-bottom:16px;padding-right:16px">
                        <a href="https://www.airbnb.com" class="text-right" style="font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;margin:0;text-align:left;line-height:1.3;color:#2199e8;text-decoration:none">
                          <img src="https://a0.muscache.com/im/pictures/2dcf3c71-aa22-4fbe-8a7f-2f4ee519e393.jpg?aki_policy=profile_x_medium" class="profile-img-sm float-right" style="outline:none;text-decoration:none;-ms-interpolation-mode:bicubic;display:block;clear:both;border:none;max-height:64px;max-width:64px;height:64px;width:64px;border-radius:50%;float:right;text-align:right">
                        </a>
                      </th>
                    </tr>
                  </table>
                </div>
                <div>
                  <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                    <tr class="" style="padding:0;vertical-align:top;text-align:left">
                      <th class="small-12 large-12 columns first last" style="font-size:16px;padding:0;text-align:left;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;line-height:1.3;margin:0 auto;padding-bottom:16px;width:564px;padding-left:16px;padding-right:16px">
                        <hr class="full-divider" style="clear:both;max-width:580px;border-right:0;border-top:0;border-left:0;margin:20px auto;border-bottom:1px solid #cacaca;background-color:#dbdbdb;height:1px;border:none;width:100%;margin-top:0;margin-bottom:0">
                      </th>
                    </tr>
                  </table>
                </div>
                <div>
                  <div class="row-pad-bot-1" style="padding-bottom:8px !important"></div>
                  <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                    <tr style="padding:0;vertical-align:top;text-align:left">
                      <th class="small-5 large-5 columns first" style="font-size:16px;text-align:left;line-height:1.3;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;color:#0a0a0a;padding-right:8px;margin:0 auto;padding-bottom:16px;width:225.66667px;padding-left:16px">
                        <p class="body-text-lg light" style='margin:0;text-align:left;padding:0;font-weight:300;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;color:#484848;word-break:normal;line-height:1.2;font-size:24px;margin-bottom:0px !important'>Tuesday,</p>
                        <p class="body-text-lg light" style='margin:0;text-align:left;padding:0;font-weight:300;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;color:#484848;word-break:normal;line-height:1.2;font-size:24px;margin-bottom:0px !important'>‌Oct ‌24,‌ ‌2‌0‌1‌7‌</p>
                        <p class="body-text light" style='margin:0;text-align:left;padding:0;font-weight:300;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;color:#484848;word-break:normal;line-height:1.4;font-size:18px;margin-bottom:0px !important'>‌C‌h‌e‌c‌k‌ ‌i‌n‌ ‌A‌n‌y‌t‌i‌m‌e‌ ‌a‌f‌t‌e‌r‌ ‌3‌P‌M‌</p>
                      </th>
                      <th class="small-2 large-2 columns" style="font-size:16px;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;text-align:left;line-height:1.3;padding-right:8px;width:80.66667px;padding-bottom:16px;padding-left:16px;margin:0 auto">
                        <img alt="" class="slash text-center" src="https://a1.muscache.com/airbnb/rookery/dls/slash-7e6cd0c69def410f055ffd703c08e140.png" style="outline:none;text-decoration:none;-ms-interpolation-mode:bicubic;display:block;clear:both;max-width:40px;width:40px;text-align:center;float:none;margin:0 auto">
                      </th>
                      <th class="small-5 large-5 columns last" style="font-size:16px;text-align:left;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;line-height:1.3;width:225.66667px;padding-left:16px;margin:0 auto;padding-bottom:16px;padding-right:16px">
                        <p class="body-text-lg light text-right" style='padding:0;margin:0;font-size:24px;font-weight:300;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;color:#484848;word-break:normal;line-height:1.2;text-align:right;margin-bottom:0px !important'>Friday,</p>
                        <p class="body-text-lg light text-right" style='padding:0;margin:0;font-size:24px;font-weight:300;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;color:#484848;word-break:normal;line-height:1.2;text-align:right;margin-bottom:0px !important'>‌OCT ‌27‌,‌ ‌2‌0‌1‌7‌</p>
                        <p class="body-text light text-right" style='padding:0;margin:0;font-size:18px;font-weight:300;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;color:#484848;word-break:normal;line-height:1.4;text-align:right;margin-bottom:0px !important'>‌C‌h‌e‌c‌k‌ ‌o‌u‌t‌ ‌1‌1‌A‌M‌</p>
                      </th>
                    </tr>
                  </table>
                  <div class="row-pad-bot-1" style="padding-bottom:8px !important"></div>
                </div>
                <div>
                  <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                    <tr class="" style="padding:0;vertical-align:top;text-align:left">
                      <th class="small-12 large-12 columns first last" style="font-size:16px;padding:0;text-align:left;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;line-height:1.3;margin:0 auto;padding-bottom:16px;width:564px;padding-left:16px;padding-right:16px">
                        <hr class="full-divider" style="clear:both;max-width:580px;border-right:0;border-top:0;border-left:0;margin:20px auto;border-bottom:1px solid #cacaca;background-color:#dbdbdb;height:1px;border:none;width:100%;margin-top:0;margin-bottom:0">
                      </th>
                    </tr>
                  </table>
                </div>
                <div style="padding-top:16px;padding-bottom:32px">
                  <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                    <tr style="padding:0;vertical-align:top;text-align:left">
                      <th class="col-pad-left-2 col-pad-right-2" style="color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;margin:0;text-align:left;font-size:16px;line-height:1.3;padding-left:16px;padding-right:16px">
                        <a href="https://www.airbnb.com"
                          class="btn-primary btn-lg btn-rausch" style="font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;margin:0;text-align:left;line-height:1.3;color:#2199e8;text-decoration:none;background-color:#ff5a5f;-webkit-border-radius:3px;border-radius:4px;padding:19px 24px 19px 24px;display:block">
                          <p class="text-center" style='font-weight:normal;padding:0;margin:0;text-align:center;color:white;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;font-size:24px;line-height:32px;margin-bottom:0px !important'>View Full Itinerary</p>
                        </a>
                      </th>
                    </tr>
                  </table>
                </div>
                <div>
                  <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                    <tr class="" style="padding:0;vertical-align:top;text-align:left">
                      <th class="small-12 large-12 columns first last" style="font-size:16px;padding:0;text-align:left;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;line-height:1.3;margin:0 auto;padding-bottom:16px;width:564px;padding-left:16px;padding-right:16px">
                        <hr class="full-divider" style="clear:both;max-width:580px;border-right:0;border-top:0;border-left:0;margin:20px auto;border-bottom:1px solid #cacaca;background-color:#dbdbdb;height:1px;border:none;width:100%;margin-top:0;margin-bottom:0">
                      </th>
                    </tr>
                  </table>
                </div>
                <div style="padding-top:8px;padding-bottom:8px">
                  <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                    <th class="small-7 large-7 columns first" style="font-size:16px;text-align:left;line-height:1.3;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;color:#0a0a0a;padding-right:8px;margin:0 auto;padding-bottom:16px;width:322.33333px;padding-left:16px">
                      <p class=" body-text-lg light row-pad-bot-1" style='padding:0;margin:0;text-align:left;font-size:24px;font-weight:300;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;color:#484848;word-break:normal;line-height:1.2;padding-bottom:8px !important;margin-bottom:0px !important'>Address</p>
                      <p class="body-text light" style='margin:0;text-align:left;padding:0;font-weight:300;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;color:#484848;word-break:normal;line-height:1.4;font-size:18px;margin-bottom:0px !important'>650 Street, San Francisco, CA 94114, United States</p>
                    </th>
                    <th class="small-5 large-5 columns last valign-top" style="font-size:16px;text-align:left;line-height:1.3;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;vertical-align:top;width:225.66667px;padding-left:16px;margin:0 auto;padding-bottom:16px;padding-right:16px">
                      <a href="#" style="font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;margin:0;text-align:left;line-height:1.3;color:#2199e8;text-decoration:none">
                        <p class="body-text-lg light color-rausch text-right" style='padding:0;margin:0;word-break:normal;font-weight:300;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;line-height:1.2;font-size:24px;text-align:right;color:#ff5a5f !important;margin-bottom:0px !important'>Get Directions</p>
                      </a>
                    </th>
                  </table>
                </div>
                <div>
                  <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                    <tr class="" style="padding:0;vertical-align:top;text-align:left">
                      <th class="small-12 large-12 columns first last" style="font-size:16px;padding:0;text-align:left;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;line-height:1.3;margin:0 auto;padding-bottom:16px;width:564px;padding-left:16px;padding-right:16px">
                        <hr class="full-divider" style="clear:both;max-width:580px;border-right:0;border-top:0;border-left:0;margin:20px auto;border-bottom:1px solid #cacaca;background-color:#dbdbdb;height:1px;border:none;width:100%;margin-top:0;margin-bottom:0">
                      </th>
                    </tr>
                  </table>
                </div>
                <div style="padding-top:8px;padding-bottom:8px">
                  <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                    <th class="small-12 large-12 columns first" style="font-size:16px;text-align:left;line-height:1.3;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;color:#0a0a0a;padding-right:8px;margin:0 auto;padding-bottom:16px;width:564px;padding-left:16px">
                      <p class=" body-text-lg light row-pad-bot-1" style='padding:0;margin:0;text-align:left;font-size:24px;font-weight:300;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;color:#484848;word-break:normal;line-height:1.2;padding-bottom:8px !important;margin-bottom:0px !important'>Guests</p>
                      <p class="body-text light" style='margin:0;text-align:left;padding:0;font-weight:300;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;color:#484848;word-break:normal;line-height:1.4;font-size:18px;margin-bottom:0px !important'>1</p>
                    </th>
                  </table>
                </div>
                <div>
                  <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                    <tr class="" style="padding:0;vertical-align:top;text-align:left">
                      <th class="small-12 large-12 columns first last" style="font-size:16px;padding:0;text-align:left;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;line-height:1.3;margin:0 auto;padding-bottom:16px;width:564px;padding-left:16px;padding-right:16px">
                        <hr class="full-divider" style="clear:both;max-width:580px;border-right:0;border-top:0;border-left:0;margin:20px auto;border-bottom:1px solid #cacaca;background-color:#dbdbdb;height:1px;border:none;width:100%;margin-top:0;margin-bottom:0">
                      </th>
                    </tr>
                  </table>
                </div>
                <div style="padding-top:8px;padding-bottom:8px">
                  <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                    <th class="small-7 large-7 columns first" style="font-size:16px;text-align:left;line-height:1.3;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;color:#0a0a0a;padding-right:8px;margin:0 auto;padding-bottom:16px;width:322.33333px;padding-left:16px">
                      <p class=" body-text-lg light row-pad-bot-1" style='padding:0;margin:0;text-align:left;font-size:24px;font-weight:300;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;color:#484848;word-break:normal;line-height:1.2;padding-bottom:8px !important;margin-bottom:0px !important'>Amount</p>
                      <p class="body-text light" style='margin:0;text-align:left;padding:0;font-weight:300;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;color:#484848;word-break:normal;line-height:1.4;font-size:18px;margin-bottom:0px !important'>$650.65</p>
                    </th>
                    <th class="small-5 large-5 columns last valign-top" style="font-size:16px;text-align:left;line-height:1.3;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;vertical-align:top;width:225.66667px;padding-left:16px;margin:0 auto;padding-bottom:16px;padding-right:16px">
                      <a href="https://www.airbnb.com" style="font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;margin:0;text-align:left;line-height:1.3;color:#2199e8;text-decoration:none">
                        <p class="body-text-lg light color-rausch text-right" style='padding:0;margin:0;word-break:normal;font-weight:300;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;line-height:1.2;font-size:24px;text-align:right;color:#ff5a5f !important;margin-bottom:0px !important'>View Receipt</p>
                      </a>
                    </th>
                  </table>
                </div>
                <div>
                  <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                    <tr class="" style="padding:0;vertical-align:top;text-align:left">
                      <th class="small-12 large-12 columns first last" style="font-size:16px;padding:0;text-align:left;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;line-height:1.3;margin:0 auto;padding-bottom:16px;width:564px;padding-left:16px;padding-right:16px">
                        <hr class="full-divider" style="clear:both;max-width:580px;border-right:0;border-top:0;border-left:0;margin:20px auto;border-bottom:1px solid #cacaca;background-color:#dbdbdb;height:1px;border:none;width:100%;margin-top:0;margin-bottom:0">
                      </th>
                    </tr>
                  </table>
                </div>
                <div style="padding-top:8px;padding-bottom:8px">
                  <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                    <th class="small-7 large-7 columns first" style="font-size:16px;text-align:left;line-height:1.3;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;color:#0a0a0a;padding-right:8px;margin:0 auto;padding-bottom:16px;width:322.33333px;padding-left:16px">
                      <p class=" body-text-lg light " style='margin:0;text-align:left;padding:0;font-weight:300;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;color:#484848;word-break:normal;line-height:1.2;font-size:24px;margin-bottom:0px !important'>Reservation Code</p>
                    </th>
                    <th class="small-5 large-5 columns last valign-top" style="font-size:16px;text-align:left;line-height:1.3;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;vertical-align:top;width:225.66667px;padding-left:16px;margin:0 auto;padding-bottom:16px;padding-right:16px">
                      <p class=" body-text-lg light text-right" style='padding:0;margin:0;font-size:24px;font-weight:300;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;color:#484848;word-break:normal;line-height:1.2;text-align:right;margin-bottom:0px !important'>SMLSDVS</p>
                    </th>
                  </table>
                </div>
                <div>
                  <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                    <tr class="" style="padding:0;vertical-align:top;text-align:left">
                      <th class="small-12 large-12 columns first last" style="font-size:16px;padding:0;text-align:left;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;line-height:1.3;margin:0 auto;padding-bottom:16px;width:564px;padding-left:16px;padding-right:16px">
                        <hr class="full-divider" style="clear:both;max-width:580px;border-right:0;border-top:0;border-left:0;margin:20px auto;border-bottom:1px solid #cacaca;background-color:#dbdbdb;height:1px;border:none;width:100%;margin-top:0;margin-bottom:0">
                      </th>
                    </tr>
                  </table>
                </div>
                <div style="padding-top:16px;padding-bottom:32px">
                  <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                    <tr style="padding:0;vertical-align:top;text-align:left">
                      <th class="col-pad-left-2 col-pad-right-2" style="color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;margin:0;text-align:left;font-size:16px;line-height:1.3;padding-left:16px;padding-right:16px">
                        <a href="https://www.airbnb.com"
                          class="btn-secondary btn-lg" style="font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;margin:0;text-align:left;line-height:1.3;color:#2199e8;text-decoration:none;border:2px solid #dbdbdb;-webkit-border-radius:3px;border-radius:4px;padding:19px 24px 19px 24px;display:block;width:auto !important">
                          <p class="text-center" style='font-weight:normal;padding:0;margin:0;text-align:center;color:#484848;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;font-size:24px;line-height:32px;margin-bottom:0px !important'>Change Your Reservation</p>
                        </a>
                      </th>
                    </tr>
                  </table>
                </div>
                <div style="padding-top:24px;padding-bottom:24px">
                  <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                    <th class="small-10 large-10 columns first" style="font-size:16px;text-align:left;line-height:1.3;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;color:#0a0a0a;padding-right:8px;margin:0 auto;padding-bottom:16px;width:467.33333px;padding-left:16px">
                      <p class="body-text-lg heavy row-pad-bot-1" style='padding:0;margin:0;text-align:left;font-size:24px;font-weight:700;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;color:#484848;word-break:normal;line-height:1.2;padding-bottom:8px !important;margin-bottom:0px !important'>Christian is your host</p>
                      <p class="body-text light row-pad-bot-4" style='padding:0;margin:0;text-align:left;padding-bottom:32px;font-weight:300;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;color:#484848;word-break:normal;line-height:1.4;font-size:18px;margin-bottom:0px !important'>Contact Christian to coordinate arrival time and key exchange.</p>
                      <p class="body-text light" style='margin:0;text-align:left;padding:0;font-weight:300;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;color:#484848;word-break:normal;line-height:1.4;font-size:18px;margin-bottom:0px !important'> <span>
        <a href="https://www.airbnb.com" class="color-rausch light" style="font-family:'Circular', Helvetica, Arial, sans-serif;padding:0;margin:0;text-align:left;line-height:1.3;text-decoration:none;font-weight:300;color:#ff5a5f !important">
          Message Host
        </a>
      </span>
                        <span class="dot" style="font-size:8px;vertical-align:middle;padding-left:8px;padding-right:8px">
         • 
      </span>
                        <span>
        <a href="tel:" class="color-rausch light" style="font-family:'Circular', Helvetica, Arial, sans-serif;padding:0;margin:0;text-align:left;line-height:1.3;text-decoration:none;font-weight:300;color:#ff5a5f !important">
          +1 (234) 567-8910
        </a>
      </span>

                      </p>
                    </th>
                    <th class="small-2 large-2 columns last" style="font-size:16px;text-align:left;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;line-height:1.3;width:80.66667px;padding-left:16px;margin:0 auto;padding-bottom:16px;padding-right:16px">
                      <a href="https://www.airbnb.com" style="font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;margin:0;text-align:left;line-height:1.3;color:#2199e8;text-decoration:none">
                        <img src="https://a0.muscache.com/im/pictures/2dcf3c71-aa22-4fbe-8a7f-2f4ee519e393.jpg?aki_policy=profile_x_medium" class="profile-img" style="display:block;outline:none;text-decoration:none;-ms-interpolation-mode:bicubic;width:auto;clear:both;border:none;max-width:77px;border-radius:50%;max-height:77px">
                        <img alt="" class="width-77 row-pad-top-2" src="https://a1.muscache.com/airbnb/rookery/dls/5.0_stars-8b3a9b9fe0d1aa014b1f97859cd599b1.png" style="display:block;outline:none;text-decoration:none;-ms-interpolation-mode:bicubic;clear:both;border:none;width:77px;padding-top:16px;max-width:77px">
                      </a>
                    </th>
                  </table>
                </div>
                <div style="padding-bottom:24px">
                  <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                    <tr class="" style="padding:0;vertical-align:top;text-align:left">
                      <th class="small-12 large-12 columns first last" style="font-size:16px;padding:0;text-align:left;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;line-height:1.3;margin:0 auto;padding-bottom:16px;width:564px;padding-left:16px;padding-right:16px">
                        <hr class="partial-divider" style="max-width:580px;clear:both;border-top:0;border-bottom:1px solid #cacaca;border-left:0;margin:20px auto;border-right:0;background-color:#dbdbdb;height:1px;border:none;width:50px;margin-top:0;margin-bottom:0;float:left">
                      </th>
                    </tr>
                  </table>
                </div>
                <div style="padding-bottom:24px">
                  <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                    <tr class="" style="padding:0;vertical-align:top;text-align:left">
                      <th class="small-12 large-12 columns first last" style="font-size:16px;padding:0;text-align:left;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;line-height:1.3;margin:0 auto;padding-bottom:16px;width:564px;padding-left:16px;padding-right:16px">
                        <p class="body-text-lg heavy row-pad-bot-1" style='padding:0;margin:0;text-align:left;font-size:24px;font-weight:700;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;color:#484848;word-break:normal;line-height:1.2;padding-bottom:8px !important;margin-bottom:0px !important'>Know what to expect</p>
                        <p class="body-text light row-pad-bot-4" style='padding:0;margin:0;text-align:left;padding-bottom:32px;font-weight:300;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;color:#484848;word-break:normal;line-height:1.4;font-size:18px;margin-bottom:0px !important'>Make sure to review the house rules and amenities.</p>
                        <p class="body-text light" style='margin:0;text-align:left;padding:0;font-weight:300;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;color:#484848;word-break:normal;line-height:1.4;font-size:18px;margin-bottom:0px !important'>
                          <a href="https://www.airbnb.com/" class="color-rausch light"
                            style="font-family:'Circular', Helvetica, Arial, sans-serif;padding:0;margin:0;text-align:left;line-height:1.3;text-decoration:none;font-weight:300;color:#ff5a5f !important">View House Rules &amp; Manual</a>
                        </p>
                      </th>
                    </tr>
                  </table>
                </div>
                <div style="padding-bottom:24px">
                  <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                    <tr class="" style="padding:0;vertical-align:top;text-align:left">
                      <th class="small-12 large-12 columns first last" style="font-size:16px;padding:0;text-align:left;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;line-height:1.3;margin:0 auto;padding-bottom:16px;width:564px;padding-left:16px;padding-right:16px">
                        <hr class="partial-divider" style="max-width:580px;clear:both;border-top:0;border-bottom:1px solid #cacaca;border-left:0;margin:20px auto;border-right:0;background-color:#dbdbdb;height:1px;border:none;width:50px;margin-top:0;margin-bottom:0;float:left">
                      </th>
                    </tr>
                  </table>
                </div>
                <div>
                  <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                    <tr class="" style="padding:0;vertical-align:top;text-align:left">
                      <th class="small-12 large-12 columns first last" style="font-size:16px;padding:0;text-align:left;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;line-height:1.3;margin:0 auto;padding-bottom:16px;width:564px;padding-left:16px;padding-right:16px">
                        <p class="body-text-lg heavy row-pad-bot-1" style='padding:0;margin:0;text-align:left;font-size:24px;font-weight:700;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;color:#484848;word-break:normal;line-height:1.2;padding-bottom:8px !important;margin-bottom:0px !important'>Customer support</p>
                        <p class="body-text light" style='margin:0;text-align:left;padding:0;font-weight:300;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;color:#484848;word-break:normal;line-height:1.4;font-size:18px;margin-bottom:0px !important'> <span>
          <a href="https://www.airbnb.com" class="color-rausch" style="font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;margin:0;text-align:left;text-decoration:none;line-height:1.3;color:#ff5a5f !important">
            Visit Help Center
          </a>
        </span>
                          <span class="dot" style="font-size:8px;vertical-align:middle;padding-left:8px;padding-right:8px">
           • 
        </span>
                          <span>
          <a href="https://www.airbnb.com" class="color-rausch" style="font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;margin:0;text-align:left;text-decoration:none;line-height:1.3;color:#ff5a5f !important">
            Contact Airbnb
          </a>
        </span>

                        </p>
                      </th>
                    </tr>
                  </table>
                </div>
                <div style="padding-top:32px;padding-bottom:32px">
                  <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                    <tr class="" style="padding:0;vertical-align:top;text-align:left">
                      <th class="small-12 large-12 columns first last" style="font-size:16px;padding:0;text-align:left;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;line-height:1.3;margin:0 auto;padding-bottom:16px;width:564px;padding-left:16px;padding-right:16px">
                        <hr class="full-divider" style="clear:both;max-width:580px;border-right:0;border-top:0;border-left:0;margin:20px auto;border-bottom:1px solid #cacaca;background-color:#dbdbdb;height:1px;border:none;width:100%;margin-top:0;margin-bottom:0">
                      </th>
                    </tr>
                  </table>
                </div>
                <div>
                  <div class="feature body-link-rausch">
                    <table class="" style="border-spacing:0;border-collapse:collapse;padding:0;vertical-align:top;text-align:left">
                      <tr style="padding:0;vertical-align:top;text-align:left">
                        <th style="color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;margin:0;text-align:left;font-size:16px;line-height:19px">
                          <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                            <th class="columns first valign-top small-12 large-2" style="font-size:16px;line-height:1.3;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;text-align:left;vertical-align:top;padding-right:8px;margin:0 auto;padding-bottom:16px;width:80.66667px;padding-left:16px">
                              <img alt="" class="" src="https://a1.muscache.com/airbnb/rookery/email/icons/dollar_sign_small-1b3b20b329165157d970e14352f53ab5.png" style="outline:none;text-decoration:none;-ms-interpolation-mode:bicubic;width:auto;max-width:100%;clear:both;display:block">
                            </th>
                            <th class="columns last valign-top small-12 large-10" style="font-size:16px;text-align:left;line-height:1.3;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;vertical-align:top;width:467.33333px;padding-left:16px;margin:0 auto;padding-bottom:16px;padding-right:16px">
                              <p class="body-text-lg heavy row-pad-bot-1" style='padding:0;margin:0;text-align:left;font-size:24px;font-weight:700;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;color:#484848;word-break:normal;line-height:1.2;padding-bottom:8px !important;margin-bottom:0px !important'>Earn up to $95</p>
                              <p class="body-text light " style='margin:0;text-align:left;padding:0;font-weight:300;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;color:#484848;word-break:normal;line-height:1.4;font-size:18px;margin-bottom:0px !important'>Share your personal invite link to give friends $40 off their first trip! You’ll get $20 when they travel and $75 when they host.
                                <br>
                                <br>
                                <a href="https://www.airbnb.com/" style="font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;margin:0;text-align:left;text-decoration:none;line-height:1.3;color:#ff5a5f;font-weight: bold;">Invite Friends</a>
                              </p>
                            </th>
                          </table>
                        </th>
                      </tr>
                    </table>
                  </div>
                </div>
                <div style="padding-top:32px;padding-bottom:32px">
                  <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                    <tr class="" style="padding:0;vertical-align:top;text-align:left">
                      <th class="small-12 large-12 columns first last" style="font-size:16px;padding:0;text-align:left;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;line-height:1.3;margin:0 auto;padding-bottom:16px;width:564px;padding-left:16px;padding-right:16px">
                        <hr class="full-divider" style="clear:both;max-width:580px;border-right:0;border-top:0;border-left:0;margin:20px auto;border-bottom:1px solid #cacaca;background-color:#dbdbdb;height:1px;border:none;width:100%;margin-top:0;margin-bottom:0">
                      </th>
                    </tr>
                  </table>
                </div>
                <div>
                  <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                    <tr class="" style="padding:0;vertical-align:top;text-align:left">
                      <th class="small-12 large-12 columns first last" style="font-size:16px;padding:0;text-align:left;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;line-height:1.3;margin:0 auto;padding-bottom:16px;width:564px;padding-left:16px;padding-right:16px">
                        <p class="headline headline-lg heavy max-width-485" style='padding:0;margin:0;text-align:left;font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;max-width:485px;font-weight:700;color:#484848;line-height:1.3;word-break:keep-all;font-size:32px;-moz-hyphens:none;-webkit-hyphens:none;-ms-hyphens:none;hyphens:none;margin-bottom:0 !important;'>Find unique things to do in San Francisco</p>
                      </th>
                    </tr>
                  </table>
                </div>
                <div style="padding-bottom:32px">
                  <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                    <tr class="" style="padding:0;vertical-align:top;text-align:left">
                      <th class="small-12 large-12 columns first last" style="font-size:16px;padding:0;text-align:left;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;line-height:1.3;margin:0 auto;padding-bottom:16px;width:564px;padding-left:16px;padding-right:16px">
                        <p class="body  body-lg body-link-rausch light text-left   " style="font-family:'Circular', Helvetica, Arial, sans-serif;padding:0;margin:0;line-height:1.4;font-weight:300;color:#484848;font-size:18px;hyphens:none;-ms-hyphens:none;-webkit-hyphens:none;-moz-hyphens:none;text-align:left;margin-bottom:0px !important;">Experiences are activities led by local experts. Book everything from short lessons to week-long excursions. You’ll get to meet other travelers and do things you can’t find on your own.</p>
                      </th>
                    </tr>
                  </table>
                </div>
                <div style="padding-bottom:8px">
                  <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                    <tr style="padding:0;vertical-align:top;text-align:left">
                      <th class="columns large-6  first small-12" style="font-size:16px;text-align:left;line-height:1.3;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;color:#0a0a0a;padding-right:8px;margin:0 auto;padding-bottom:16px;width:274px;padding-left:16px">
                        <table class="table_layout_fixed" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%">
                          <tr class="" style="padding:0;vertical-align:top;text-align:left">
                            <th class="" style="color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;margin:0;text-align:left;font-size:16px;line-height:19px">
                              <a href="https://www.airbnb.com/experiences/75951" style="font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;margin:0;text-align:left;line-height:1.3;color:#2199e8;text-decoration:none">
                                <img alt="D5a3c8df-7dd4-4048-b3f9-79bb6fefe42d" src="https://a0.muscache.com/im/pictures/d5a3c8df-7dd4-4048-b3f9-79bb6fefe42d.jpg?aki_policy=poster" style="display:block;outline:none;text-decoration:none;-ms-interpolation-mode:bicubic;width:auto;clear:both;max-width:100%;border:none">
                              </a>
                              <table class="" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%">
                                <tr class="" style="padding:0;vertical-align:top;text-align:left">
                                  <th class="row-pad-top-2" style="color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;margin:0;text-align:left;font-size:16px;line-height:1.3;padding-top:16px">
                                    <div class="body body-lg normal row-pad-bot-1" style="line-height:1.4;font-weight:400;color:#484848;font-size:18px;hyphens:none;-ms-hyphens:none;-webkit-hyphens:none;-moz-hyphens:none;margin-bottom:0px !important;padding-bottom:8px !important">A food meets bike tour of SF's culinary capital</div>
                                    <div class="body body-md light" style="font-weight:300;color:#484848;line-height:22px;hyphens:none;font-size:15px;-webkit-hyphens:none;-ms-hyphens:none;-moz-hyphens:none;margin-bottom:0px !important">4-hour experience</div>
                                    <div class="row-pad-top-1" style="padding-top:8px">
                                      <a class="body body-md heavy" href="https://www.airbnb.com/experiences/75951"
                                        style="font-family:'Circular', Helvetica, Arial, sans-serif;padding:0;text-align:left;text-decoration:none;margin:0;font-weight:700;color:#484848;line-height:22px;hyphens:none;font-size:15px;-webkit-hyphens:none;-ms-hyphens:none;-moz-hyphens:none;margin-bottom:0px !important">See details ›</a>
                                    </div>
                                  </th>
                                </tr>
                              </table>
                            </th>
                          </tr>
                        </table>
                      </th>
                      <th class="columns large-6 last  small-12" style="font-size:16px;text-align:left;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;line-height:1.3;width:274px;padding-left:16px;margin:0 auto;padding-bottom:16px;padding-right:16px">
                        <table class="table_layout_fixed" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%">
                          <tr class="" style="padding:0;vertical-align:top;text-align:left">
                            <th class="" style="color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;margin:0;text-align:left;font-size:16px;line-height:19px">
                              <a href="https://www.airbnb.com/experiences/40564" style="font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;margin:0;text-align:left;line-height:1.3;color:#2199e8;text-decoration:none">
                                <img alt="E86c7a92-e541-4b6b-90e3-739e9f423d5f" src="https://a0.muscache.com/im/pictures/e86c7a92-e541-4b6b-90e3-739e9f423d5f.jpg?aki_policy=poster" style="display:block;outline:none;text-decoration:none;-ms-interpolation-mode:bicubic;width:auto;clear:both;max-width:100%;border:none">
                              </a>
                              <table class="" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%">
                                <tr class="" style="padding:0;vertical-align:top;text-align:left">
                                  <th class="row-pad-top-2" style="color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;margin:0;text-align:left;font-size:16px;line-height:1.3;padding-top:16px">
                                    <div class="body body-lg normal row-pad-bot-1" style="line-height:1.4;font-weight:400;color:#484848;font-size:18px;hyphens:none;-ms-hyphens:none;-webkit-hyphens:none;-moz-hyphens:none;margin-bottom:0px !important;padding-bottom:8px !important">Taste sake in a brewery paired with pickles and chocolate</div>
                                    <div class="body body-md light" style="font-weight:300;color:#484848;line-height:22px;hyphens:none;font-size:15px;-webkit-hyphens:none;-ms-hyphens:none;-moz-hyphens:none;margin-bottom:0px !important">2-hour experience</div>
                                    <div class="row-pad-top-1" style="padding-top:8px">
                                      <a class="body body-md heavy" href="https://www.airbnb.com/experiences/40564"
                                        style="font-family:'Circular', Helvetica, Arial, sans-serif;padding:0;text-align:left;text-decoration:none;margin:0;font-weight:700;color:#484848;line-height:22px;hyphens:none;font-size:15px;-webkit-hyphens:none;-ms-hyphens:none;-moz-hyphens:none;margin-bottom:0px !important">See details ›</a>
                                    </div>
                                  </th>
                                </tr>
                              </table>
                            </th>
                          </tr>
                        </table>
                      </th>
                    </tr>
                  </table>
                </div>
                <div style="padding-top:56px">
                  <table class="row" style="border-spacing:0;border-collapse:collapse;text-align:left;vertical-align:top;padding:0;width:100%;position:relative;display:table">
                    <tr class="" style="padding:0;vertical-align:top;text-align:left">
                      <th class="small-12 large-12 columns first last standard-footer-padding" style="font-size:16px;text-align:left;line-height:1.3;color:#0a0a0a;font-family:'Circular', Helvetica, Arial, sans-serif;font-weight:normal;padding:0;margin:0 auto;padding-bottom:16px;width:564px;padding-left:16px;padding-right:16px">
                        <hr class="standard-footer-hr" style="clear:both;max-width:580px;border-right:0;border-bottom:1px solid #cacaca;border-left:0;border-top:0;background-color:#dbdbdb;height:2px;width:100%;border:none;margin:auto">
                        <div class="row-pad-bot-4" style="padding-bottom:32px"></div>
                        <p class="standard-footer-text center " style='font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;padding:0;margin:0;text-align:left;margin-bottom:10px;color:#9ca299;font-size:14px;text-shadow:0 1px #fff;font-weight:300;line-height:1.4'>Sent with ♥ from Airbnb</p>
                        <p class="standard-footer-text " style='font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;padding:0;margin:0;text-align:left;margin-bottom:10px;color:#9ca299;font-size:14px;text-shadow:0 1px #fff;font-weight:300;line-height:1.4'>‌A‌i‌r‌b‌n‌b‌,‌ ‌I‌n‌c‌.‌,‌ ‌8‌8‌8‌ ‌B‌r‌a‌n‌n‌a‌n‌ ‌S‌t‌,‌ ‌S‌a‌n‌ ‌F‌r‌a‌n‌c‌i‌s‌c‌o‌,‌ ‌C‌A‌ ‌9‌4‌1‌0‌3‌</p>
                        <p class="standard-footer-text " style='font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;padding:0;margin:0;text-align:left;margin-bottom:10px;color:#9ca299;font-size:14px;text-shadow:0 1px #fff;font-weight:300;line-height:1.4'>
                          <a class="muted" href="https://www.airbnb.com" style="font-weight:normal;padding:0;margin:0;text-align:left;line-height:1.3;font-family:'Circular', Helvetica, Arial, sans-serif;color:#9ca299;text-decoration:underline">Earn travel credit</a>
                        </p>
                        <p class="standard-footer-text " style='font-family:"Circular", "Helvetica", Helvetica, Arial, sans-serif;padding:0;margin:0;text-align:left;margin-bottom:10px;color:#9ca299;font-size:14px;text-shadow:0 1px #fff;font-weight:300;line-height:1.4'></p>
                      </th>
                    </tr>
                  </table>
                </div>
              </td>
            </tr>
          </table>
        </center>
      </td>
    </tr>
  </table>

</body>

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

Console