Pen Settings

HTML

About HTML Preprocessors

HTML preprocessors can make writing HTML more powerful or convenient. For instance, Markdown is designed to be easier to write and read for text documents and you could write a loop in Pug.

Learn more · Versions

Adding Classes

In CodePen, whatever you write in the HTML editor is what goes within the <body> tags in a basic HTML5 template. So you don't have access to higher-up elements like the <html> tag. If you want to add classes there that can affect the whole document, this is the place to do it.

About the <head>

In CodePen, whatever you write in the HTML editor is what goes within the <body> tags in a basic HTML5 template. If you need things in the <head> of the document, put that code here.

!
Insecure Resource

The resource you are linking to is using the 'http' protocol, which may not work when the browser is using https.

CSS

About CSS Preprocessors

CSS preprocessors help make authoring CSS easier. All of them offer things like variables and mixins to provide convenient abstractions.

Learn more · Versions

CSS Base

About CSS Base

It's a common practice to apply CSS to a page that styles elements such that they are consistent across all browsers. We offer two of the most popular choices: normalize.css and a reset. Or, choose Neither and nothing will be applied.

Vendor Prefixing

About Vendor Prefixing

To get the best cross-browser support, it is a common practice to apply vendor prefixes to CSS properties and values that require them to work. For instance -webkit- or -moz-.

We offer two popular choices: Autoprefixer (which processes your CSS server-side) and -prefix-free (which applies prefixes via a script, client-side).

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.

Powered by Algolia
About External Resources

You can apply CSS to your Pen from any stylesheet on the web. Just put a URL to it here and we'll apply it, in the order you have them, before the CSS in the Pen itself.

If the stylesheet you link to has the file extension of a preprocessor, we'll attempt to process it before applying.

You can also link to another Pen here, and we'll pull the CSS from that Pen and include it. If it's using a matching preprocessor, we'll combine the code before preprocessing, so you can use the linked Pen as a true dependency.

Learn more

+ add another resource

JavaScript

About JavaScript Preprocessors

JavaScript preprocessors can help make authoring JavaScript easier and more convenient.

Learn more · Versions

Babel includes JSX processing.

Add External Scripts/Pens

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

Powered by Algolia
About External Resources

You can apply a script from anywhere on the web to your Pen. Just put a URL to it here and we'll add it, in the order you have them, before the JavaScript in the Pen itself.

If the script you link to has the file extension of a preprocessor, we'll attempt to process it before applying.

You can also link to another Pen here, and we'll pull the JavaScript from that Pen and include it. If it's using a matching preprocessor, we'll combine the code before preprocessing, so you can use the linked Pen as a true dependency.

Learn more

+ add another resource

Packages

Add Packages

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

Powered by Algolia
About Packages

Using packages here is powered by Skypack, which makes packages from npm not only available on a CDN, but prepares them for native JavaScript ES6 import usage.

All packages are different, so refer to their docs for how they work.

If you're using React / ReactDOM, make sure to turn on Babel for the JSX processing.

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 

              
                <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html lang="en" xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">

<head>
  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  <meta name="viewport" content="width=device-width">
  <title>bna_recipeoftheday_news_newdb_ACTIVE_022119am</title>
  <style type="text/css">
    @media (max-width: 656px) {
      .hero-content>td>table {
        margin-bottom: 10vw !important;
        margin-top: 0 !important;
      }
      .river-item.grid {
        margin-bottom: 10vw !important;
      }
      .ad.padded {
        padding: 0 !important;
      }
      .header-content .item-content.padded.body {
        padding-left: 3vw !important;
        padding-right: 3vw !important;
      }
      .stories .container.stacked .padded {
        padding-bottom: 5vw !important;
        padding-top: 5vw !important;
      }
      .river-item.grid,
      table.river-item,
      table.river-item img.responsive,
      .items-content.stacked .image,
      .items-content.stacked .item-content {
        height: 45vw !important;
        width: 45vw !important;
      }
      .hero-content .item-content .hed {
        padding-left: 2vw !important;
        padding-right: 2vw !important;
      }
      .hero-content .item-content .dek {
        padding-left: 2vw !important;
        padding-right: 2vw !important;
      }
      .hero-content .item-content .cta {
        padding-left: 2vw !important;
        padding-right: 2vw !important;
      }
      header .flexibleContainer .padded.newsletter-date {
        padding: 3vw !important;
      }
      header .padded.body {
        padding: 3vw !important;
      }
      header,
      main,
      footer,
      #bottom-social-share-container,
      #cm-unit-extended,
      #more-from-bonapp,
      #more-from-bonapp .more-from-bonapp,
      #separator-line,
      .subscribe-container {
        max-width: 100vw !important;
      }
      header {
        margin-bottom: 10vw !important;
      }
      footer {
        margin-top: 0 !important;
      }
      #cmunit table {
        margin-left: 0 !important;
        margin-right: 0 !important;
      }
      .footer-content .item-content.cm-unit .signup-header h3 {
        font-size: 30px;
      }
      #bottom-social-share-container .middle-logo-ba {
        width: 55vw !important;
      }
      .boilerplate {
        padding: 0 !important;
      }
      .subscribe-container .full-width {
        width: 100% !important;
      }
      .subscribe-container .cm-subscribe-image {
        margin: 0 auto !important;
      }
      .subscribe-container .subscribe-copy table {
        width: 100% !important;
      }
      .subscribe-container .subscribe-copy .subscribe-button-cell .subscribe-button {
        text-align: center !important;
      }
      .subscribe-container .subscribe-image-cell {
        padding-left: 0 !important;
      }
    }

    @media (max-width: 656px) {
      .containers .flexibleContainer {
        border-top-width: 5vw !important;
      }
      .header-content .flexibleContainer .padded {
        padding: 0 !important;
      }
      .header-content .flexibleContainer .padded.pre-content-wrap {
        padding-bottom: 5vw !important;
        padding-left: 5vw !important;
        padding-right: 5vw !important;
        padding-top: 5vw !important;
      }
      .header-content .item-content.padded.body {
        padding-bottom: 3vw !important;
        padding-top: 3vw !important;
      }
      .section-header td {
        padding-top: 0 !important;
      }
      .items-content.grid .padded,
      .items-content.stacked .padded {
        padding-bottom: 0 !important;
        padding-top: 0 !important;
      }
      .river-item.grid {
        margin-bottom: 5vw !important;
      }
      table.river-item.stacked.text {
        width: 44vw !important;
      }
      .items-content.stacked .padded {
        padding-bottom: 5vw !important;
      }
      .river-item .hed {
        font-size: 18px !important;
        font-weight: normal;
        padding-top: 0 !important;
      }
      .footer-container {
        padding-top: 0 !important;
      }
      .footer-content .flexibleContainer .padded {
        padding: 0 !important;
      }
    }

    @media only screen and (min-width: 480px) {
      .boilerplate .policy-unsubscribe {
        max-width: 30% !important;
      }
    }

    @media (max-width: 320px) {
      .hero-content .hed {
        width: auto !important;
      }
      .river-item.grid {
        width: 100% !important;
      }
      table.river-item,
      table.river-item img.responsive {
        height: auto !important;
        width: 100% !important;
      }
      .river-item .button.cta {
        margin-left: 0 !important;
      }
      .items-content.stacked .image {
        margin-bottom: 10px !important;
      }
      table.river-item.stacked.text {
        width: auto !important;
      }
      .items-content.stacked .image,
      .items-content.stacked .item-content {
        display: table !important;
        float: none !important;
        text-align: center !important;
        width: 100% !important;
      }
      .items-content.stacked .item-content {
        height: auto !important;
        padding-top: 0;
        vertical-align: top !important;
      }
      .items-content.stacked .item-content .hed,
      .items-content.stacked .item-content .dek {
        margin-top: 5px !important;
      }
    }

    @media only screen and (max-width: 656px) {
      body {
        width: 100% !important;
        min-width: 100% !important;
      }
      table[id="emailBody"],
      table[class="flexibleContainer"] {
        width: 100% !important;
      }
      h1,
      h2,
      h3,
      h4,
      h5,
      h6,
      .button-content,
      .container-hed {
        text-align: center;
      }
      .rubric {
        margin: 0 auto;
      }
      .cta {
        margin: 1em auto 0;
      }
      .river-item {
        width: 100%;
      }
      .river-item .item-content {
        padding-top: 10px;
      }
      .river-item.stacked.item-content {
        min-height: 1px;
      }
      .item-content {
        float: inherit;
        min-height: 0 !important;
        text-align: center;
      }
      .padded {
        padding-bottom: 20px;
      }
      .ad {
        padding: 0;
      }
      .cm-unit {
        padding: 20px 0 0 0;
      }
      .containers .container:first-child .section-header td {
        padding-top: 0;
      }
      footer .padded {
        padding-bottom: 0;
      }
      img[class="flexibleImage"] {
        height: auto !important;
        width: 100% !important;
      }
      table[class="emailButton"] {
        width: 100% !important;
      }
    }
  </style>
  <style type="text/css">
    a.msoLink {
      color: #000;
      text-decoration: none;
    }
  </style>
  <!--[if mso 12]>
<style type="text/css">
.flexibleContainer{display:block !important; width:100% !important;}
</style>
<![endif]-->
  <!--[if mso 14]>
<style type="text/css">
.flexibleContainer{display:block !important; width:100% !important;}
</style>
<![endif]-->
</head>

<body style="margin: 0; padding: 0; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; background-color: #F5F5F5; height: 100%; width: 100%;">
  <center>
    <table border="0" cellpadding="0" cellspacing="0" height="100%" width="100%" id="bodyTable" role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; margin: 0; padding: 0; font-size: 1em; background-color: #F5F5F5; height: 100%; width: 100%;"
      bgcolor="#F5F5F5">
      <tr>
        <td align="center" valign="top" id="bodyCell" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; margin: 0; padding: 0; background-color: #ffffff; height: 100%; width: 100%;" width="100%" height="100%"
          bgcolor="#ffffff">
          <table border="0" cellpadding="0" cellspacing="0" width="591" id="emailBody" role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100%; max-width: 100vw; background-color: #ffffff; width: 591px;"
            bgcolor="#ffffff">
            <tr>
              <td align="center" valign="top" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;">
                <header style="width: 591px;">
                  <table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;">
                    <tr class="container header-content">
                      <td align="center" valign="top" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;">
                        <table border="0" cellpadding="0" cellspacing="0" width="100%" class="flexibleContainer" role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; background-color: #ffffff; width: 100%;"
                          bgcolor="#ffffff">
                          <tr>
                            <td align="center" valign="top" width="100%" class="padded" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; padding-top: 20px; padding: 0; max-width: 100vw; padding-left: 3%; padding-right: 3%;">
                              <table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;">
                                <td valign="top" class="item-content padded pre-content-wrap" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; font-family: 'Lucida Grande', Verdana, sans-serif; line-height: 125%; text-align: center; font-size: .7em; padding: 0; max-width: 100vw; padding-left: 3%; padding-right: 3%; padding-bottom: 20px; padding-top: 10px; color: #9b9b9b;"
                                  align="center">
                                  <p style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; margin: 1em 0 0; margin-top: 0;">
                                    <span class="teaser">New shows. More food. Dig in.</span><br>
                                    <span class="offline-view" style="display: inline-block; margin-top: .3em;">
<a href="#" xt="SPCLICKTOVIEW" name="browser_view" target="_blank" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-decoration: underline; color: #9b9b9b;">
View this email in your browser
</a>
</span>
                                  </p>
                                </td>
                                <tr>
                                  <td valign="top" class="item-content padded logo" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; padding-top: 20px; font-family: 'Lucida Grande', Verdana, sans-serif; color: #222; font-size: 16px; line-height: 125%; text-align: left; max-width: 100vw; padding-left: 3%; padding-right: 3%; padding: 0;"
                                    align="left">
                                    <h1 style="margin: 0; padding: 0; font-family: 'Lucida Grande', Verdana, sans-serif; color: #202020; font-size: 20px; line-height: 125%; text-align: center;">
                                      <a name="header-image" target="_blank" href="http://links.newsletter.bonappetit.com/ctt?kn=4&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; color: #222; text-decoration: none;">
<img   src="https://assets.bonappetit.com/photos/5c59b62cfc55372d78631582/master/w_1440%2Cc_limit/Newsletter-Banner-ROD-Pink-NEW.jpg" srcset="https://assets.bonappetit.com/photos/5c59b62cfc55372d78631582/master/w_720%2Cc_limit/Newsletter-Banner-ROD-Pink-NEW.jpg 1x, https://assets.bonappetit.com/photos/5c59b62cfc55372d78631582/master/w_1440%2Cc_limit/Newsletter-Banner-ROD-Pink-NEW.jpg 2x, https://assets.bonappetit.com/photos/5c59b62cfc55372d78631582/master/w_2160%2Cc_limit/Newsletter-Banner-ROD-Pink-NEW.jpg 3x" class="responsive" alt="" style="-ms-interpolation-mode: bicubic; border: 0; outline: none; text-decoration: none; width: 100%; height: auto;">
</a>
                                    </h1>
                                  </td>
                                </tr>
                              </table>
                            </td>
                          </tr>
                        </table>
                      </td>
                    </tr>
                  </table>
                </header>
              </td>
            </tr>
            <tr>
              <td align="center" valign="top" class="containers" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;">
                <main style="width: 591px;">
                  <table class="stories" border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;">
                    <tr class="container hero-content channel-culture first last" style="padding-bottom: 20px;">
                      <td align="center" valign="top" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;">
                        <table border="0" cellpadding="0" cellspacing="0" width="100%" class="flexibleContainer" role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; background-color: #ffffff; width: 100%; margin-bottom: 30px; margin-top: 25px;"
                          bgcolor="#ffffff">
                          <tr>
                            <td align="center" valign="top" width="560" class="padded" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; padding-top: 20px; padding: 0; max-width: 100vw; padding-left: 3%; padding-right: 3%;">
                              <a class="item article" href="http://links.newsletter.bonappetit.com/ctt?kn=9&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" name="container-1-item-1" target="_blank" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-decoration: none; display: block;">
                                <table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;">
                                  <tr>
                                    <td valign="top" class="item-content" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; font-family: 'Lucida Grande', Verdana, sans-serif; color: #222; font-size: 16px; line-height: 125%; text-align: left; max-width: 100vw;"
                                      align="left">
                                      <!--[if gte mso 12]><a   name="container-1-item-1" href="http://links.newsletter.bonappetit.com/ctt?kn=9&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" class="msoLink msoLink-image" target="_blank"><![endif]-->
                                      <img src="https://assets.bonappetit.com/photos/5c6199b40213ca4d2973b5c4/5:4/w_1120%2Cc_limit/Banner%20Image_16x9.jpg" srcset="https://assets.bonappetit.com/photos/5c6199b40213ca4d2973b5c4/5:4/w_560%2Cc_limit/Banner%20Image_16x9.jpg 1x, https://assets.bonappetit.com/photos/5c6199b40213ca4d2973b5c4/5:4/w_1120%2Cc_limit/Banner%20Image_16x9.jpg 2x, https://assets.bonappetit.com/photos/5c6199b40213ca4d2973b5c4/5:4/w_1680%2Cc_limit/Banner%20Image_16x9.jpg 3x"
                                        class="responsive" alt="" role="presentation" style="-ms-interpolation-mode: bicubic; border: 0; outline: none; text-decoration: none; width: 100%; height: auto;">
                                      <!--[if gte mso 12]></a><![endif]-->
                                      <h2 class="hed" style="padding: 0; line-height: 125%; box-sizing: border-box; color: #131313; font-family: Arial; font-size: 22px; font-style: normal; font-weight: bold; letter-spacing: 0em; margin: 0; padding-left: 2%; padding-right: 2%; padding-top: 10px; text-align: center; text-decoration: none; width: 100%;">
                                        <!--[if gte mso 12]><a   name="container-1-item-1" href="http://links.newsletter.bonappetit.com/ctt?kn=9&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" class="msoLink msoLink-hed" target="_blank"><![endif]-->Bon App&#xE9;tit, Now on Your TV
                                        <!--[if gte mso 12]></a><![endif]-->
                                      </h2>
                                      <p class="dek" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; -webkit-box-decoration-break: clone; -o-box-decoration-break: clone; box-decoration-break: clone; color: #666666; display: inline; font-family: Arial; font-size: 14px; font-style: normal; letter-spacing: 0em; margin: 0; padding-left: 2%; padding-right: 2%; padding-top: 3px; text-align: left; text-decoration: none;">
                                        <!--[if gte mso 12]><a   name="container-1-item-1" href="http://links.newsletter.bonappetit.com/ctt?kn=9&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" class="msoLink msoLink-dek" target="_blank"><![endif]-->Already a fan of &#x201C;It's Alive&#x201D;? Can't get enough of &#x201C;Gourmet Makes&#x201D;? We've got EVEN MORE Bon App&#xE9;tit for you, now streaming on your TV. Binge original shows and indulge in more episodes
                                        (all for free!). Available now on Roku, Apple TV, Amazon Fire TV, and Android TV.
                                        <!--[if gte mso 12]></a><![endif]-->
                                      </p>
                                    </td>
                                  </tr>
                                </table>
                              </a>
                            </td>
                          </tr>
                        </table>
                      </td>
                    </tr>
                    <tr class="container hero-content channel-culture first last" style="padding-bottom: 20px;">
                      <td align="center" valign="top" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;">
                        <table border="0" cellpadding="0" cellspacing="0" width="100%" class="flexibleContainer" role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; background-color: #ffffff; width: 100%; margin-bottom: 30px; margin-top: 30px;"
                          bgcolor="#ffffff">
                          <tr>
                            <td align="center" valign="top" width="560" class="padded" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; padding-top: 20px; padding: 0; max-width: 100vw; padding-left: 3%; padding-right: 3%;">
                              <a class="item article" href="http://links.newsletter.bonappetit.com/ctt?kn=10&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" name="container-2-item-1" target="_blank" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-decoration: none; display: block;">
                                <table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;">
                                  <tr>
                                    <td valign="top" class="item-content" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; font-family: 'Lucida Grande', Verdana, sans-serif; color: #222; font-size: 16px; line-height: 125%; text-align: left; max-width: 100vw;"
                                      align="left">
                                      <!--[if gte mso 12]><a   name="container-2-item-1" href="http://links.newsletter.bonappetit.com/ctt?kn=10&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" class="msoLink msoLink-image" target="_blank"><![endif]-->
                                      <img src="https://assets.bonappetit.com/photos/5b685323b93d6367e7cbaa90/5:4/w_1120%2Cc_limit/claire-saffitz-illustration.jpg" srcset="https://assets.bonappetit.com/photos/5b685323b93d6367e7cbaa90/5:4/w_560%2Cc_limit/claire-saffitz-illustration.jpg 1x, https://assets.bonappetit.com/photos/5b685323b93d6367e7cbaa90/5:4/w_1120%2Cc_limit/claire-saffitz-illustration.jpg 2x, https://assets.bonappetit.com/photos/5b685323b93d6367e7cbaa90/5:4/w_1680%2Cc_limit/claire-saffitz-illustration.jpg 3x"
                                        class="responsive" alt="" role="presentation" style="-ms-interpolation-mode: bicubic; border: 0; outline: none; text-decoration: none; width: 100%; height: auto;">
                                      <!--[if gte mso 12]></a><![endif]-->
                                      <h2 class="hed" style="padding: 0; line-height: 125%; box-sizing: border-box; color: #131313; font-family: Arial; font-size: 22px; font-style: normal; font-weight: bold; letter-spacing: 0em; margin: 0; padding-left: 2%; padding-right: 2%; padding-top: 10px; text-align: center; text-decoration: none; width: 100%;">
                                        <!--[if gte mso 12]><a   name="container-2-item-1" href="http://links.newsletter.bonappetit.com/ctt?kn=10&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" class="msoLink msoLink-hed" target="_blank"><![endif]-->Claire Saffitz&#x2019;s &#x2018;Gourmet Makes&#x2019; Series Is Inspiring a Lot of Fan Art
                                        <!--[if gte mso 12]></a><![endif]-->
                                      </h2>
                                      <p class="dek" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; -webkit-box-decoration-break: clone; -o-box-decoration-break: clone; box-decoration-break: clone; color: #666666; display: inline; font-family: Arial; font-size: 14px; font-style: normal; letter-spacing: 0em; margin: 0; padding-left: 2%; padding-right: 2%; padding-top: 3px; text-align: left; text-decoration: none;">
                                        <!--[if gte mso 12]><a   name="container-2-item-1" href="http://links.newsletter.bonappetit.com/ctt?kn=10&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" class="msoLink msoLink-dek" target="_blank"><![endif]-->Claire is a living, breathing human being. She is a phenomenal baker. A runner. An Olympics enthusiast. But to the fans of her <em>Bon App&#xE9;tit</em> video series &#x201C;Gourmet Makes,&#x201D; where senior food
                                        editor Claire Saffitz recreates classic junk foods&#x2014;she&#x2019;s worthy of deep, loyal worship. Here are some recent fan art contributions inspired by Claire and her iconic gray streak, her anguish and triumph
                                        in moments of culinary travail, her everlasting friendship with Test Kitchen manager Brad Leone.
                                        <!--[if gte mso 12]></a><![endif]-->
                                      </p>
                                    </td>
                                  </tr>
                                </table>
                              </a>
                            </td>
                          </tr>
                        </table>
                      </td>
                    </tr>
                    <tr class="container ad outer" style="padding: 0;">
                      <td align="center" valign="top" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;">
                        <table border="0" cellpadding="0" cellspacing="0" width="100%" class="flexibleContainer" role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; background-color: #ffffff; width: 100%;"
                          bgcolor="#ffffff">
                          <tr>
                            <td align="center" valign="top" width="560" class="padded ad ad-marquee" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; padding-top: 20px; padding: 0; max-width: 100vw; padding-left: 3%; padding-right: 3%;">
                              <table class="ad-marquee-container-outer" border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; margin-bottom: 30px;">
                                <tr>
                                  <td class="ad-marquee-container-inner" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; background-color: #efefef; padding: 10px 10px 10px 10px; max-width: 100vw;" bgcolor="#efefef">
                                    <table style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; margin-left: auto; margin-right: auto;">
                                      <tr>
                                        <td class="ad-marquee-container" valign="top" align="center" colspan="2" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; padding: 0; width: 100%; max-width: 100vw;" width="100%">
                                          <a href="http://links.newsletter.bonappetit.com/ctt?kn=2&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" target="_blank" rel="nofollow" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-decoration: none; display: block;"
                                            name="li_bonappetit_com_click_s_139452_li">
<img class="ad-marquee-img" alt="Advertisement"   src="http://li.bonappetit.com/imp?s=139452&li=ba_daily_recipe&e=campmonsales@gmail.com&p=nl_20170512153201_Daily" style="-ms-interpolation-mode: bicubic; border: 0; outline: none; text-decoration: none; height: auto; display: block; max-width: 100%; margin: 0 auto; width: 591px;" width="591">
</a>
                                        </td>
                                      </tr>
                                      <tr class="pixel-trackers" style="display:block; height:1px; line-height:1px;">
                                        <td style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw;">
                                          <img alt="" src="http://li.bonappetit.com/imp?s=139453&li=ba_daily_recipe&e=campmonsales@gmail.com&p=nl_20170512153201_Daily" height="1" width="10" style="border: 0; outline: none; text-decoration: none; -ms-interpolation-mode: bicubic;">
                                        </td>
                                        <td style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw;">
                                          <img alt="" src="http://li.bonappetit.com/imp?s=139454&li=ba_daily_recipe&e=campmonsales@gmail.com&p=nl_20170512153201_Daily" height="1" width="10" style="border: 0; outline: none; text-decoration: none; -ms-interpolation-mode: bicubic;">
                                        </td>
                                      </tr>
                                      <tr class="powered-by" style="padding: 0;">
                                        <td align="left" class="live-intent-container" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; padding: 0;">
                                          <a href="http://links.newsletter.bonappetit.com/ctt?kn=19&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" target="_blank" rel="nofollow" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-decoration: none; display: block;"
                                            name="li_bonappetit_com_click_s_139455_li">
<img alt="Powered by LiveIntent"   src="http://li.bonappetit.com/imp?s=139455&li=ba_daily_recipe&e=campmonsales@gmail.com&p=nl_20170512153201_Daily" style="-ms-interpolation-mode: bicubic; border: 0; outline: none; text-decoration: none; display: inherit; margin: 0 auto 0 0; max-width: 116px; height: auto; max-height: 15px; width: auto;">
</a>
                                        </td>
                                        <td align="right" class="ad-choices-container" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; padding: 0;">
                                          <a href="http://links.newsletter.bonappetit.com/ctt?kn=20&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" target="_blank" rel="nofollow" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-decoration: none; display: block;"
                                            name="li_bonappetit_com_click_s_632386_li">
<img alt="AdChoices"   src="http://li.bonappetit.com/imp?s=632386&li=ba_daily_recipe&e=campmonsales@gmail.com&p=nl_20170512153201_Daily" style="-ms-interpolation-mode: bicubic; border: 0; outline: none; text-decoration: none; display: inherit; margin: 0 0 0 auto; height: auto; max-height: 15px; width: auto;">
</a>
                                        </td>
                                      </tr>
                                    </table>
                                  </td>
                                </tr>
                              </table>
                            </td>
                          </tr>
                        </table>
                      </td>
                    </tr>
                    <tr class="container items-hed">
                      <td align="center" valign="top" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;">
                        <table border="0" cellpadding="0" cellspacing="0" width="100%" class="flexibleContainer" role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; background-color: #ffffff; width: 100%;"
                          bgcolor="#ffffff">
                          <tr>
                            <td align="center" valign="top" width="560" class="padded" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; padding-top: 20px; padding: 0; max-width: 100vw; padding-left: 3%; padding-right: 3%;">
                              <table border="0" cellpadding="0" cellspacing="0" width="100%" class="section-header river" role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;">
                                <tr>
                                  <td align="center" valign="middle" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; padding: 20px 0 0;">
                                    <h2 style="margin: 0; padding: 0; color: #202020; line-height: 125%; text-align: center; font-weight: 700; display: block; padding-bottom: 20px; font-family: Arial, sans-serif; font-size: 22px; text-transform: none; text-decoration: none;">Recipes From Recent Videos:</h2>
                                  </td>
                                </tr>
                              </table>
                            </td>
                          </tr>
                        </table>
                      </td>
                    </tr>
                    <tr class="container items-content grid channel- first">
                      <td align="center" valign="top" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;">
                        <table border="0" cellpadding="0" cellspacing="0" width="100%" class="flexibleContainer" role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; background-color: #ffffff; width: 100%; border: none;"
                          bgcolor="#ffffff">
                          <tr>
                            <td valign="top" width="560" class="padded" role="list" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; padding-top: 20px; padding: 0; max-width: 100vw; padding-left: 3%; padding-right: 3%;">
                              <a class="item recipe" href="http://links.newsletter.bonappetit.com/ctt?kn=3&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" name="container-3-item-1" target="_blank" role="listitem" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-decoration: none; display: block;">
                                <table align="left" border="0" cellpadding="0" cellspacing="0" width="265" class="flexibleContainer river-item grid even" role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; background-color: #ffffff; margin-bottom: 35px; height: auto; width: 265px; border: none; margin-right: 10px;"
                                  bgcolor="#ffffff">
                                  <tr>
                                    <td valign="top" class="text-content item-content" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; font-family: 'Lucida Grande', Verdana, sans-serif; color: #222; font-size: 16px; line-height: 125%; text-align: left; max-width: 100vw;"
                                      align="left">
                                      <!--[if gte mso 12]><a   name="container-3-item-1" href="http://links.newsletter.bonappetit.com/ctt?kn=3&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" class="msoLink msoLink-image" target="_blank"><![endif]-->
                                      <img src="https://assets.bonappetit.com/photos/5ac27cd53b54622a98dae653/1:1/w_500%2Cc_limit/chocolate-sheet-pan-birthday-cake.jpg" srcset="https://assets.bonappetit.com/photos/5ac27cd53b54622a98dae653/1:1/w_250%2Cc_limit/chocolate-sheet-pan-birthday-cake.jpg 1x, https://assets.bonappetit.com/photos/5ac27cd53b54622a98dae653/1:1/w_500%2Cc_limit/chocolate-sheet-pan-birthday-cake.jpg 2x, https://assets.bonappetit.com/photos/5ac27cd53b54622a98dae653/1:1/w_750%2Cc_limit/chocolate-sheet-pan-birthday-cake.jpg 3x"
                                        class="responsive" alt="" role="presentation" style="-ms-interpolation-mode: bicubic; border: 0; outline: none; text-decoration: none; height: auto; " width="265">
                                      <!--[if gte mso 12]></a><![endif]-->
                                      <h3 class="hed" style="margin: 0; padding: 0; color: #131313; font-family: arial, helvetica, sans-serif; font-size: 18px; font-style: normal; font-weight: bold; letter-spacing: 0em; line-height: 1.07em; text-align: center; text-decoration: none; padding-top: 10px;">
                                        <!--[if gte mso 12]><a   name="container-3-item-1" href="http://links.newsletter.bonappetit.com/ctt?kn=3&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" class="msoLink msoLink-hed" target="_blank"><![endif]-->Easy Sheet Cake with Chocolate-Cream Cheese Frosting
                                        <!--[if gte mso 12]></a><![endif]-->
                                      </h3>
                                    </td>
                                  </tr>
                                </table>
                              </a>
                              <a class="item recipe" href="http://links.newsletter.bonappetit.com/ctt?kn=7&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" name="container-3-item-2" target="_blank" role="listitem" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-decoration: none; display: block;">
                                <table align="right" border="0" cellpadding="0" cellspacing="0" width="265" class="flexibleContainer river-item grid odd" role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; background-color: #ffffff; margin-bottom: 35px; height: auto; width: 265px; border: none;"
                                  bgcolor="#ffffff">
                                  <tr>
                                    <td valign="top" class="text-content item-content" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; font-family: 'Lucida Grande', Verdana, sans-serif; color: #222; font-size: 16px; line-height: 125%; text-align: left; max-width: 100vw;"
                                      align="left">
                                      <!--[if gte mso 12]><a   name="container-3-item-2" href="http://links.newsletter.bonappetit.com/ctt?kn=7&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" class="msoLink msoLink-image" target="_blank"><![endif]-->
                                      <img src="https://assets.bonappetit.com/photos/5bedeeec81037b6cb7f6aa58/1:1/w_500%2Cc_limit/carla-Pasta-e-Fagioli.jpg" srcset="https://assets.bonappetit.com/photos/5bedeeec81037b6cb7f6aa58/1:1/w_250%2Cc_limit/carla-Pasta-e-Fagioli.jpg 1x, https://assets.bonappetit.com/photos/5bedeeec81037b6cb7f6aa58/1:1/w_500%2Cc_limit/carla-Pasta-e-Fagioli.jpg 2x, https://assets.bonappetit.com/photos/5bedeeec81037b6cb7f6aa58/1:1/w_750%2Cc_limit/carla-Pasta-e-Fagioli.jpg 3x"
                                        class="responsive" alt="" role="presentation" style="-ms-interpolation-mode: bicubic; border: 0; outline: none; text-decoration: none; height: auto; " width="265">
                                      <!--[if gte mso 12]></a><![endif]-->
                                      <h3 class="hed" style="margin: 0; padding: 0; color: #131313; font-family: arial, helvetica, sans-serif; font-size: 18px; font-style: normal; font-weight: bold; letter-spacing: 0em; line-height: 1.07em; text-align: center; text-decoration: none; padding-top: 10px;">
                                        <!--[if gte mso 12]><a   name="container-3-item-2" href="http://links.newsletter.bonappetit.com/ctt?kn=7&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" class="msoLink msoLink-hed" target="_blank"><![endif]-->Pasta e Fagioli
                                        <!--[if gte mso 12]></a><![endif]-->
                                      </h3>
                                    </td>
                                  </tr>
                                </table>
                              </a>
                            </td>
                          </tr>
                        </table>
                      </td>
                    </tr>
                    <tr class="container items-content grid channel-">
                      <td align="center" valign="top" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; padding-top: 0;">
                        <table border="0" cellpadding="0" cellspacing="0" width="100%" class="flexibleContainer" role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; background-color: #ffffff; width: 100%; border: none;"
                          bgcolor="#ffffff">
                          <tr>
                            <td valign="top" width="560" class="padded" role="list" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; padding-top: 20px; padding: 0; max-width: 100vw; padding-left: 3%; padding-right: 3%;">
                              <a class="item recipe" href="http://links.newsletter.bonappetit.com/ctt?kn=6&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" name="container-3-item-3" target="_blank" role="listitem" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-decoration: none; display: block;">
                                <table align="left" border="0" cellpadding="0" cellspacing="0" width="265" class="flexibleContainer river-item grid even" role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; background-color: #ffffff; margin-bottom: 35px; height: auto; width: 265px; border: none; margin-right: 10px;"
                                  bgcolor="#ffffff">
                                  <tr>
                                    <td valign="top" class="text-content item-content" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; font-family: 'Lucida Grande', Verdana, sans-serif; color: #222; font-size: 16px; line-height: 125%; text-align: left; max-width: 100vw;"
                                      align="left">
                                      <!--[if gte mso 12]><a   name="container-3-item-3" href="http://links.newsletter.bonappetit.com/ctt?kn=6&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" class="msoLink msoLink-image" target="_blank"><![endif]-->
                                      <img src="https://assets.bonappetit.com/photos/5c1a6e3c7b8a892ce36043b0/1:1/w_500%2Cc_limit/FGFP-Mushroom-Larb-Horizontal.jpg" srcset="https://assets.bonappetit.com/photos/5c1a6e3c7b8a892ce36043b0/1:1/w_250%2Cc_limit/FGFP-Mushroom-Larb-Horizontal.jpg 1x, https://assets.bonappetit.com/photos/5c1a6e3c7b8a892ce36043b0/1:1/w_500%2Cc_limit/FGFP-Mushroom-Larb-Horizontal.jpg 2x, https://assets.bonappetit.com/photos/5c1a6e3c7b8a892ce36043b0/1:1/w_750%2Cc_limit/FGFP-Mushroom-Larb-Horizontal.jpg 3x"
                                        class="responsive" alt="" role="presentation" style="-ms-interpolation-mode: bicubic; border: 0; outline: none; text-decoration: none; height: auto; " width="265">
                                      <!--[if gte mso 12]></a><![endif]-->
                                      <h3 class="hed" style="margin: 0; padding: 0; color: #131313; font-family: arial, helvetica, sans-serif; font-size: 18px; font-style: normal; font-weight: bold; letter-spacing: 0em; line-height: 1.07em; text-align: center; text-decoration: none; padding-top: 10px;">
                                        <!--[if gte mso 12]><a   name="container-3-item-3" href="http://links.newsletter.bonappetit.com/ctt?kn=6&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" class="msoLink msoLink-hed" target="_blank"><![endif]-->Spicy Mushroom Larb
                                        <!--[if gte mso 12]></a><![endif]-->
                                      </h3>
                                    </td>
                                  </tr>
                                </table>
                              </a>
                              <a class="item recipe" href="http://links.newsletter.bonappetit.com/ctt?kn=24&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" name="container-3-item-4" target="_blank" role="listitem" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-decoration: none; display: block;">
                                <table align="right" border="0" cellpadding="0" cellspacing="0" width="265" class="flexibleContainer river-item grid odd" role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; background-color: #ffffff; margin-bottom: 35px; height: auto; width: 265px; border: none;"
                                  bgcolor="#ffffff">
                                  <tr>
                                    <td valign="top" class="text-content item-content" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; font-family: 'Lucida Grande', Verdana, sans-serif; color: #222; font-size: 16px; line-height: 125%; text-align: left; max-width: 100vw;"
                                      align="left">
                                      <!--[if gte mso 12]><a   name="container-3-item-4" href="http://links.newsletter.bonappetit.com/ctt?kn=24&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" class="msoLink msoLink-image" target="_blank"><![endif]-->
                                      <img src="https://assets.bonappetit.com/photos/58e2844b65366d7ba90812ea/1:1/w_500%2Cc_limit/0417-Brown-Butter-Toffee-ChocolateChip%20Cookie-group.jpg" srcset="https://assets.bonappetit.com/photos/58e2844b65366d7ba90812ea/1:1/w_250%2Cc_limit/0417-Brown-Butter-Toffee-ChocolateChip%20Cookie-group.jpg 1x, https://assets.bonappetit.com/photos/58e2844b65366d7ba90812ea/1:1/w_500%2Cc_limit/0417-Brown-Butter-Toffee-ChocolateChip%20Cookie-group.jpg 2x, https://assets.bonappetit.com/photos/58e2844b65366d7ba90812ea/1:1/w_750%2Cc_limit/0417-Brown-Butter-Toffee-ChocolateChip%20Cookie-group.jpg 3x"
                                        class="responsive" alt="" role="presentation" style="-ms-interpolation-mode: bicubic; border: 0; outline: none; text-decoration: none; height: auto; " width="265">
                                      <!--[if gte mso 12]></a><![endif]-->
                                      <h3 class="hed" style="margin: 0; padding: 0; color: #131313; font-family: arial, helvetica, sans-serif; font-size: 18px; font-style: normal; font-weight: bold; letter-spacing: 0em; line-height: 1.07em; text-align: center; text-decoration: none; padding-top: 10px;">
                                        <!--[if gte mso 12]><a   name="container-3-item-4" href="http://links.newsletter.bonappetit.com/ctt?kn=24&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" class="msoLink msoLink-hed" target="_blank"><![endif]-->Brown Butter and Toffee Chocolate Chip Cookies
                                        <!--[if gte mso 12]></a><![endif]-->
                                      </h3>
                                    </td>
                                  </tr>
                                </table>
                              </a>
                            </td>
                          </tr>
                        </table>
                      </td>
                    </tr>
                    <tr class="container items-content grid channel-">
                      <td align="center" valign="top" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; padding-top: 0;">
                        <table border="0" cellpadding="0" cellspacing="0" width="100%" class="flexibleContainer" role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; background-color: #ffffff; width: 100%; border: none;"
                          bgcolor="#ffffff">
                          <tr>
                            <td valign="top" width="560" class="padded" role="list" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; padding-top: 20px; padding: 0; max-width: 100vw; padding-left: 3%; padding-right: 3%;">
                              <a class="item recipe" href="http://links.newsletter.bonappetit.com/ctt?kn=23&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" name="container-3-item-5" target="_blank" role="listitem" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-decoration: none; display: block;">
                                <table align="left" border="0" cellpadding="0" cellspacing="0" width="265" class="flexibleContainer river-item grid even" role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; background-color: #ffffff; margin-bottom: 35px; height: auto; width: 265px; border: none; margin-right: 10px;"
                                  bgcolor="#ffffff">
                                  <tr>
                                    <td valign="top" class="text-content item-content" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; font-family: 'Lucida Grande', Verdana, sans-serif; color: #222; font-size: 16px; line-height: 125%; text-align: left; max-width: 100vw;"
                                      align="left">
                                      <!--[if gte mso 12]><a   name="container-3-item-5" href="http://links.newsletter.bonappetit.com/ctt?kn=23&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" class="msoLink msoLink-image" target="_blank"><![endif]-->
                                      <img src="https://assets.bonappetit.com/photos/5c36451c0952c62cd717a604/1:1/w_500%2Cc_limit/Basically-Mac-n-Cheese-01-.jpg" srcset="https://assets.bonappetit.com/photos/5c36451c0952c62cd717a604/1:1/w_250%2Cc_limit/Basically-Mac-n-Cheese-01-.jpg 1x, https://assets.bonappetit.com/photos/5c36451c0952c62cd717a604/1:1/w_500%2Cc_limit/Basically-Mac-n-Cheese-01-.jpg 2x, https://assets.bonappetit.com/photos/5c36451c0952c62cd717a604/1:1/w_750%2Cc_limit/Basically-Mac-n-Cheese-01-.jpg 3x"
                                        class="responsive" alt="" role="presentation" style="-ms-interpolation-mode: bicubic; border: 0; outline: none; text-decoration: none; height: auto; " width="265">
                                      <!--[if gte mso 12]></a><![endif]-->
                                      <h3 class="hed" style="margin: 0; padding: 0; color: #131313; font-family: arial, helvetica, sans-serif; font-size: 18px; font-style: normal; font-weight: bold; letter-spacing: 0em; line-height: 1.07em; text-align: center; text-decoration: none; padding-top: 10px;">
                                        <!--[if gte mso 12]><a   name="container-3-item-5" href="http://links.newsletter.bonappetit.com/ctt?kn=23&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" class="msoLink msoLink-hed" target="_blank"><![endif]-->Adult Mac and Cheese
                                        <!--[if gte mso 12]></a><![endif]-->
                                      </h3>
                                    </td>
                                  </tr>
                                </table>
                              </a>
                              <a class="item recipe" href="http://links.newsletter.bonappetit.com/ctt?kn=25&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" name="container-3-item-6" target="_blank" role="listitem" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-decoration: none; display: block;">
                                <table align="right" border="0" cellpadding="0" cellspacing="0" width="265" class="flexibleContainer river-item grid odd" role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; background-color: #ffffff; margin-bottom: 35px; height: auto; width: 265px; border: none;"
                                  bgcolor="#ffffff">
                                  <tr>
                                    <td valign="top" class="text-content item-content" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; font-family: 'Lucida Grande', Verdana, sans-serif; color: #222; font-size: 16px; line-height: 125%; text-align: left; max-width: 100vw;"
                                      align="left">
                                      <!--[if gte mso 12]><a   name="container-3-item-6" href="http://links.newsletter.bonappetit.com/ctt?kn=25&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" class="msoLink msoLink-image" target="_blank"><![endif]-->
                                      <img src="https://assets.bonappetit.com/photos/5beb34e9e8a90b6a6737c936/1:1/w_500%2Cc_limit/apple-tart-1.jpg" srcset="https://assets.bonappetit.com/photos/5beb34e9e8a90b6a6737c936/1:1/w_250%2Cc_limit/apple-tart-1.jpg 1x, https://assets.bonappetit.com/photos/5beb34e9e8a90b6a6737c936/1:1/w_500%2Cc_limit/apple-tart-1.jpg 2x, https://assets.bonappetit.com/photos/5beb34e9e8a90b6a6737c936/1:1/w_750%2Cc_limit/apple-tart-1.jpg 3x"
                                        class="responsive" alt="" role="presentation" style="-ms-interpolation-mode: bicubic; border: 0; outline: none; text-decoration: none; height: auto; " width="265">
                                      <!--[if gte mso 12]></a><![endif]-->
                                      <h3 class="hed" style="margin: 0; padding: 0; color: #131313; font-family: arial, helvetica, sans-serif; font-size: 18px; font-style: normal; font-weight: bold; letter-spacing: 0em; line-height: 1.07em; text-align: center; text-decoration: none; padding-top: 10px;">
                                        <!--[if gte mso 12]><a   name="container-3-item-6" href="http://links.newsletter.bonappetit.com/ctt?kn=25&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" class="msoLink msoLink-hed" target="_blank"><![endif]-->Naked Apple Tart
                                        <!--[if gte mso 12]></a><![endif]-->
                                      </h3>
                                    </td>
                                  </tr>
                                </table>
                              </a>
                            </td>
                          </tr>
                        </table>
                      </td>
                    </tr>
                    <tr class="container ad outer" style="padding: 0;">
                      <td align="center" valign="top" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;">
                        <table border="0" cellpadding="0" cellspacing="0" width="100%" class="flexibleContainer" role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; background-color: #ffffff; width: 100%;"
                          bgcolor="#ffffff">
                          <tr>
                            <td align="center" valign="top" width="560" class="padded ad ad-300x250" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; padding-top: 20px; padding: 0; max-width: 100vw; padding-left: 3%; padding-right: 3%;">
                              <table class="ad-300x250-container-outer" border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; margin-bottom: 30px;">
                                <tr>
                                  <td class="ad-300x250-container-inner" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; background-color: #fff;" bgcolor="#fff">
                                    <table style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;">
                                      <tr>
                                        <td class="ad-300x250-container" valign="top" align="center" colspan="2" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; background-color: #fff;" bgcolor="#fff">
                                          <a href="http://links.newsletter.bonappetit.com/ctt?kn=11&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" target="_blank" rel="nofollow" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-decoration: none; display: block;"
                                            name="li_bonappetit_com_click_s_130329_li">
<img class="ad-300x250-img" alt="Advertisement"   src="http://li.bonappetit.com/imp?s=130329&li=ba_daily_recipe&e=campmonsales@gmail.com&p=nl_20170512153201_Daily" style="-ms-interpolation-mode: bicubic; border: 0; outline: none; text-decoration: none; width: 100%; display: block; max-width: 100%; margin: 0 auto;">
</a>
                                        </td>
                                      </tr>
                                      <tr class="pixel-trackers" style="display:block; height:1px; line-height:1px;">
                                        <td style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; background-color: #fff;" bgcolor="#fff">
                                          <img alt="" src="http://li.bonappetit.com/imp?s=130330&li=ba_daily_recipe&e=campmonsales@gmail.com&p=nl_20170512153201_Daily" height="1" width="10" style="border: 0; outline: none; text-decoration: none; -ms-interpolation-mode: bicubic;">
                                        </td>
                                        <td style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; background-color: #fff;" bgcolor="#fff">
                                          <img alt="" src="http://li.bonappetit.com/imp?s=130331&li=ba_daily_recipe&e=campmonsales@gmail.com&p=nl_20170512153201_Daily" height="1" width="10" style="border: 0; outline: none; text-decoration: none; -ms-interpolation-mode: bicubic;">
                                        </td>
                                      </tr>
                                      <tr class="powered-by" style="padding: 0;">
                                        <td align="left" class="live-intent-container" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; background-color: #fff; padding: 0;" bgcolor="#fff">
                                          <a href="http://links.newsletter.bonappetit.com/ctt?kn=22&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" target="_blank" rel="nofollow" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-decoration: none; display: block;"
                                            name="li_bonappetit_com_click_s_440314_li">
<img alt="Powered by LiveIntent"   src="http://li.bonappetit.com/imp?s=440314&li=ba_daily_recipe&e=campmonsales@gmail.com&p=nl_20170512153201_Daily" style="-ms-interpolation-mode: bicubic; border: 0; outline: none; text-decoration: none; display: inherit; margin: 0 auto 0 0; max-width: 116px; height: auto; max-height: 15px; width: auto;">
</a>
                                        </td>
                                        <td align="right" class="ad-choices-container" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; background-color: #fff; padding: 0;" bgcolor="#fff">
                                          <a href="http://links.newsletter.bonappetit.com/ctt?kn=12&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" target="_blank" rel="nofollow" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-decoration: none; display: block;"
                                            name="li_bonappetit_com_click_s_571384_li">
<img alt="AdChoices"   src="http://li.bonappetit.com/imp?s=571384&li=ba_daily_recipe&e=campmonsales@gmail.com&p=nl_20170512153201_Daily" style="-ms-interpolation-mode: bicubic; border: 0; outline: none; text-decoration: none; display: inherit; margin: 0 0 0 auto; height: auto; max-height: 15px; width: auto;">
</a>
                                        </td>
                                      </tr>
                                    </table>
                                  </td>
                                </tr>
                              </table>
                            </td>
                          </tr>
                        </table>
                      </td>
                    </tr>
                  </table>
                </main>
              </td>
            </tr>
            <tr>
              <td align="center" valign="top" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;">
                <footer style="margin-top: 25px; width: 591px;">
                  <table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;">
                    <tr class="container footer-content">
                      <td align="center" valign="top" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;">
                        <table border="0" cellpadding="0" cellspacing="0" width="100%" class="flexibleContainer" role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; background-color: #ffffff; width: 100%;"
                          bgcolor="#ffffff">
                          <tr>
                            <td align="center" valign="top" width="100%" class="footer-container" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; padding-top: 20px; max-width: 100vw;">
                              <table border="0" cellpadding="0" cellspacing="0" width="100%" role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;">
                                <tr id="cmunit">
                                  <td valign="top" class="item-content cm-unit" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; font-family: 'Lucida Grande', Verdana, sans-serif; font-size: 16px; line-height: 125%; text-align: left; border-bottom: 1px solid #cccccc; padding: 0px 0px 42px 0px; width: 591px; max-width: 100vw; color: #9b9b9b;"
                                    width="591" align="left">
                                    <table role="presentation" align="center" border="0" cellpadding="0" cellspacing="0" class="full-width" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;">

                                      <tr>
                                        <td style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw;">
                                          <table role="presentation" align="center" border="0" cellpadding="0" cellspacing="0" class="full-width" id="morefrom" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; width: 100%;"
                                            width="100%">

                                            <tr>
                                              <td class="more-from-bonapp-cell" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; padding-left: 3%; padding-right: 3%; max-width: 100vw;">
                                                <table role="presentation" id="more-from-bonapp" class="full-width" align="center" border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 591px; width: 100%;"
                                                  width="100%">

                                                  <tr align="center" style="width: 591px;">
                                                    <td bgcolor="#0099FF" class="more-from-bonapp" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; height: 43px; max-width: 591px;" height="43">
                                                      <a href="http://links.newsletter.bonappetit.com/ctt?kn=5&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" target="_blank" name="preheader_cta" aria-label="More from Bon App&#xE9;tit" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; color: #ffffff; font-family: arial, helvetica, sans-serif; font-size: 0.69em; font-style: normal; letter-spacing: 0.04em; line-height: 2.32em; text-align: left; text-decoration: none;">
<span class="morefrom-bonnap-button" style="text-transform: uppercase;">More From Bon App&eacutetit</span>
</a>
                                                    </td>
                                                  </tr>

                                                </table>
                                              </td>
                                            </tr>

                                          </table>
                                        </td>
                                      </tr>
                                      <tr>
                                        <td style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw;">
                                          <table role="presentation" align="center" border="0" cellpadding="0" cellspacing="0" class="full-width" id="separator-line" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; width: 591px;"
                                            width="591">

                                            <tr>
                                              <td style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; padding-bottom: 30px; padding-top: 30px;">
                                                <img src="https://www.bonappetit.com/static/images/newsletter/border_top_header.png" alt="" style="border: 0; outline: none; text-decoration: none; -ms-interpolation-mode: bicubic; width: 100%;">
                                              </td>
                                            </tr>

                                          </table>
                                        </td>
                                      </tr>
                                      <tr>
                                        <td style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw;">
                                          <table role="presentation" align="center" border="0" cellpadding="0" cellspacing="0" class="subscribe-container full-width" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; border-collapse: initial; margin: 0 auto; width: 591px;"
                                            width="591">
                                            <tr>
                                              <td align="center" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw;">
                                                <table role="presentation" align="center" border="0" class="subscribe-copy" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; border-collapse: initial; width: 100%;" width="100%">
                                                  <tr>
                                                    <td align="center" class="subscribe-container-cell" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; background-color: #E8E8E8; padding: 70px 40px; text-align: center; width: 100%; max-width: 100vw;"
                                                      width="100%" bgcolor="#E8E8E8">
                                                      <table role="presentation" align="left" border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; margin: 0 auto; padding: 0; width: 100%;"
                                                        width="100%">

                                                        <tr>
                                                          <td class="subscribe-title" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; color: #000000; font-family: Georgia; font-size: 2.2em; letter-spacing: 0; line-height: 1; padding-bottom: 20px; text-align: center; max-width: 100vw;"
                                                            align="center">Subscribe Now!</td>
                                                        </tr>
                                                        <tr>
                                                          <td class="subscribe-description" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; color: #333333; font-family: Georgia; font-size: 1em; letter-spacing: 0; padding-bottom: 10px; text-align: center; max-width: 100vw;"
                                                            align="center">Get it while it&#x2019;s hot &#x2013; Enjoy 1 year of Bon App&#xE9;tit for only $15</td>
                                                        </tr>
                                                        <tr>
                                                          <td align="center" class="subscribe-button-cell" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; margin: 0 auto; padding: 20px 0 0 0; text-align: center; width: 100%; max-width: 100vw;"
                                                            width="100%">
                                                            <table role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-align: center; margin: 0 auto; width: 50%;" width="50%" align="center">
                                                              <tr>
                                                                <td bgcolor="#d62129" class="subscribe-button" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; background-color: #d62129; padding: 15px 40px; max-width: 100vw;">
                                                                  <a target="_blank" href="http://links.newsletter.bonappetit.com/ctt?kn=15&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-decoration: none; font-family: Arial; font-size: 11px; font-style: normal; letter-spacing: 1px; color: #fff;"
                                                                    name="subscribe_bonappetit_com_subscribe_">
<span class="subscribe-button-text">SUBSCRIBE</span>
</a>
                                                                </td>
                                                              </tr>
                                                            </table>
                                                          </td>
                                                        </tr>

                                                      </table>
                                                    </td>
                                                  </tr>
                                                </table>
                                              </td>
                                            </tr>
                                          </table>
                                        </td>
                                      </tr>

                                    </table>
                                  </td>
                                </tr>
                                <tr class="social-follows" style="text-align: center; padding: 0;" align="center">
                                  <td align="center" valign="top" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; padding: 30px 0;">
                                    <table border="0" cellpadding="0" cellspacing="0" width="100%" class="flexibleContainer" role="presentation" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; background-color: #ffffff; border: none; width: 100%;"
                                      bgcolor="#ffffff">
                                      <tr>
                                        <td align="center" valign="top" width="560" class="padded" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; padding-top: 20px; padding: 0; max-width: 100vw; padding-left: 0; padding-right: 0;">
                                          <table role="presentation" align="center" id="bottom-social-share-container" border="0" cellpadding="0" cellspacing="0" class="full-width" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; padding: 27px 0px 44px 0px; width: 591px;"
                                            width="591">

                                            <tr>
                                              <td class="signup-header" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; padding-bottom: 20px; padding-top: 25px;">
                                                <h3 style="margin: 0; padding: 0; color: #d62129; font-family: 'Century Gothic', 'CenturyGothic', 'AppleGothic', 'sans-serif'; font-size: 36px; font-weight: 100; line-height: 1.35; text-align: center;">SIGN UP FOR OUR NEWSLETTER</h3>
                                              </td>
                                            </tr>
                                            <tr>
                                              <td class="footer-logo-cell" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; text-align: center;" align="center">
                                                <a href="http://links.newsletter.bonappetit.com/ctt?kn=26&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" target="_blank" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-decoration: none;" name="secure_bonappetit_com_services_news">
<img width="180" class="middle-logo-ba"   src="https://www.bonappetit.com/static/images/newsletter/ba_logo.png" alt="Bon App&#xE9;tit" style="-ms-interpolation-mode: bicubic; border: 0; outline: none; text-decoration: none; max-width: 175px; width: 30%;">
</a>
                                              </td>
                                            </tr>
                                            <tr align="center">
                                              <td id="follow-us-text" class="article-description" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw; font-family: Georgia; font-size: 1em; font-style: italic; font-weight: bold; letter-spacing: 0.04em; line-height: 0.85em; padding: 15px 0px 15px 0px;">Follow Us</td>
                                            </tr>
                                            <tr align="center">
                                              <td style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 100vw;">
                                                <table role="presentation" align="center" border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%;">

                                                  <tr role="list">
                                                    <td class="social-share-cell" role="listitem" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; padding-right: 18px; max-width: 100vw;">
                                                      <a href="http://links.newsletter.bonappetit.com/ctt?kn=17&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" title="social-facebook" target="_blank" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-decoration: none; outline: none;"
                                                        name="www_facebook_com_bonappetitmag_">
<img class="social-share"   src="https://www.bonappetit.com/static/images/newsletter/social-01-2x.png" alt="Facebook" style="-ms-interpolation-mode: bicubic; text-decoration: none; border: none; height: 35px; outline: #fff; " width="35" height="35">
</a>
                                                    </td>
                                                    <td class="social-share-cell" role="listitem" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; padding-right: 18px; max-width: 100vw;">
                                                      <a href="http://links.newsletter.bonappetit.com/ctt?kn=27&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" title="social-pinterest" target="_blank" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-decoration: none; outline: none;"
                                                        name="www_pinterest_com_bonappetitmag_">
<img class="social-share"   src="https://www.bonappetit.com/static/images/newsletter/social-03-2x.png" alt="Pinterest" style="-ms-interpolation-mode: bicubic; text-decoration: none; border: none; height: 35px; outline: #fff; " width="35" height="35">
</a>
                                                    </td>
                                                    <td class="social-share-cell" role="listitem" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; padding-right: 18px; max-width: 100vw;">
                                                      <a href="http://links.newsletter.bonappetit.com/ctt?kn=16&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" title="social-instagram" target="_blank" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-decoration: none; outline: none;"
                                                        name="instagram_com_bonappetitmag_">
<img class="social-share"   src="https://www.bonappetit.com/static/images/newsletter/instagram.png" alt="Instagram" style="-ms-interpolation-mode: bicubic; text-decoration: none; border: none; height: 35px; outline: #fff; " width="35" height="35">
</a>
                                                    </td>
                                                    <td class="social-share-cell" role="listitem" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; padding-right: 18px; max-width: 100vw;">
                                                      <a href="http://links.newsletter.bonappetit.com/ctt?kn=1&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" title="social-twitter" target="_blank" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-decoration: none; outline: none;"
                                                        name="twitter_com____bonappetit_">
<img class="social-share"   src="https://www.bonappetit.com/static/images/newsletter/social-02-2x.png" alt="Twitter" style="-ms-interpolation-mode: bicubic; text-decoration: none; border: none; height: 35px; outline: #fff; " width="35" height="35">
</a>
                                                    </td>
                                                    <td class="social-share-cell" role="listitem" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; padding-right: 18px; max-width: 100vw;">
                                                      <a href="http://links.newsletter.bonappetit.com/ctt?kn=18&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" title="social-flipboard" target="_blank" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-decoration: none; outline: none;"
                                                        name="flipboard_com__bonappetit_">
<img class="social-share"   src="https://www.bonappetit.com/static/images/newsletter/slip_board.png" alt="Flipboard" style="-ms-interpolation-mode: bicubic; text-decoration: none; border: none; height: 35px; outline: #fff; " width="35" height="35">
</a>
                                                    </td>
                                                  </tr>

                                                </table>
                                              </td>
                                            </tr>

                                          </table>
                                        </td>
                                      </tr>
                                    </table>
                                  </td>
                                </tr>
                                <tr>
                                  <td valign="top" class="item-content boilerplate" style="mso-table-lspace: 0pt; mso-table-rspace: 0pt; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; font-family: 'Lucida Grande', Verdana, sans-serif; line-height: 125%; text-align: center; padding: 0 20px 20px; max-width: 100vw; font-size: 14px; color: #9b9b9b;"
                                    align="center">
                                    <p style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 450px; margin: 1em auto 0; margin-top: 0;">This e-mail was sent to you by <span class="sender-name" style="text-decoration: none; color: #222;">Bon Appetit</span>. To ensure delivery to your inbox (not bulk or junk folders), please add our e-mail address,
                                      <a
                                        href="http://links.newsletter.bonappetit.com/ctt?kn=14&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" class="sender-email" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-decoration: underline; color: #9b9b9b;"
                                        name="mailto_bonappetit_newsletters_bonap">bonappetit@newsletters.bonappetit.com</a>, to your address book.</p>
                                    <p class="policy-unsubscribe" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; margin: 1em auto 0; max-width: 60%;">
                                      View our <a class="privacy-policy" target="_blank" name="privacy-policy" href="http://links.newsletter.bonappetit.com/ctt?kn=8&ms=MjUwODA5NDQS1&r=MTkxMTEyNDc1MzcwS0&b=3&j=MTQwNDA3NjMxMQS2&mt=1&rt=0" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-decoration: underline; color: #9b9b9b;">Privacy Policy</a>
                                      <a href="#" name="unsubscribe" target="_blank" style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; text-decoration: underline; color: #9b9b9b;">Unsubscribe</a>
                                    </p>
                                    <p style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; max-width: 450px; margin: 1em auto 0;">
                                      Copyright &#xA9; Cond&#xE9; Nast 2019. <span class="address" style="text-decoration: none; color: #222;">One World Trade Center, New York, NY 10007</span>. All rights reserved.
                                    </p>
                                  </td>
                                </tr>
                              </table>
                            </td>
                          </tr>
                        </table>
                      </td>
                    </tr>
                  </table>
                </footer>
              </td>
            </tr>
          </table>
        </td>
      </tr>
    </table>
  </center>
  
</body>

</html>
!

CSS
!

JS
!
999px

Console