cssAudio - Activefile-genericCSS - ActiveGeneric - ActiveHTML - ActiveImage - ActiveJS - ActiveSVG - ActiveText - Activefile-genericVideo - ActiveLovehtmlicon-new-collectionicon-personicon-teamlog-outoctocatpop-outspinnerstartv

Pen Settings

CSS Base

Vendor Prefixing

Add External Stylesheets/Pens

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

+ add another resource

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

Add External Scripts/Pens

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

+ add another resource

Use npm Packages

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

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

Code Indentation

     

Save Automatically?

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

Auto-Updating Preview

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

            
              <head>
  <meta content="text/html; charset=utf-8" http-equiv="Content-Type">
  <meta content="width=device-width, initial-scale=1.0" name="viewport">

  <title></title>
  <meta charset="utf-8">

  <style type="text/css">
    #outlook a{
    			padding:0;
    		}
    		.ReadMsgBody{
    			width:100%;
    		}
    		.ExternalClass{
    			width:100%;
    		}
    		.ExternalClass,.ExternalClass p,.ExternalClass span,.ExternalClass font,.ExternalClass td,.ExternalClass div{
    			line-height:100%;
    		}
    		body,table,td,a{
    			-webkit-text-size-adjust:100%;
    			-ms-text-size-adjust:100%;
    		}
    		table,td{
    			mso-table-lspace:0pt;
    			mso-table-rspace:0pt;
    		}
    		img{
    			-ms-interpolation-mode:bicubic;
    		}
    		body{
    			margin:0;
    			padding:0;
    		}
    		img{
    			border:0;
    			height:auto;
    			line-height:100%;
    			outline:none;
    			text-decoration:none;
    		}
    		table{
    			border-collapse:collapse !important;
    		}
    		body{
    			height:100% !important;
    			margin:0;
    			padding:0;
    			width:100% !important;
    		}
    		table{
    			border-collapse:collapse;
    			margin:0px auto;
    		}
    		.container{
    			min-width:0 !important;
    		}
    	@font-face {font-family: 'Museo Sans';src: url('http://cdn.harrys.com/email/webfonts/2D9B47_0_0.eot');src: url('http://cdn.harrys.com/email/webfonts/2D9B47_0_0.eot?#iefix') format('embedded-opentype'),url('http://cdn.harrys.com/email/webfonts/2D9B47_0_0.woff2') format('woff2'),url('http://cdn.harrys.com/email/webfonts/2D9B47_0_0.woff') format('woff'),url('http://cdn.harrys.com/email/webfonts/2D9B47_0_0.ttf') format('truetype');font-weight: bold;font-style: normal;}
    	@font-face {font-family: 'Museo Sans';src: url('http://cdn.harrys.com/email/webfonts/2D9B47_1_0.eot');src: url('http://cdn.harrys.com/email/webfonts/2D9B47_1_0.eot?#iefix') format('embedded-opentype'),url('http://cdn.harrys.com/email/webfonts/2D9B47_1_0.woff2') format('woff2'),url('http://cdn.harrys.com/email/webfonts/2D9B47_1_0.woff') format('woff'),url('http://cdn.harrys.com/email/webfonts/2D9B47_1_0.ttf') format('truetype');font-weight: normal;font-style: normal;}
    	@font-face {font-family: 'Museo Sans';src: url('http://cdn.harrys.com/email/webfonts/2D9B47_2_0.eot');src: url('http://cdn.harrys.com/email/webfonts/2D9B47_2_0.eot?#iefix') format('embedded-opentype'),url('http://cdn.harrys.com/email/webfonts/2D9B47_2_0.woff2') format('woff2'),url('http://cdn.harrys.com/email/webfonts/2D9B47_2_0.woff') format('woff'),url('http://cdn.harrys.com/email/webfonts/2D9B47_2_0.ttf') format('truetype');font-weight: bold;font-style: italic;}
    	@font-face {font-family: 'Museo Sans';src: url('http://cdn.harrys.com/email/webfonts/2D9B47_3_0.eot');src: url('http://cdn.harrys.com/email/webfonts/2D9B47_3_0.eot?#iefix') format('embedded-opentype'),url('http://cdn.harrys.com/email/webfonts/2D9B47_3_0.woff2') format('woff2'),url('http://cdn.harrys.com/email/webfonts/2D9B47_3_0.woff') format('woff'),url('http://cdn.harrys.com/email/webfonts/2D9B47_3_0.ttf') format('truetype');font-weight: normal;font-style: italic;}
    	@font-face {font-family: 'Brandon Grotesque';src: url('http://cdn.harrys.com/email/webfonts/3083F9_2_0.eot');src: url('http://cdn.harrys.com/email/webfonts/3083F9_2_0.eot?#iefix') format('embedded-opentype'),url('http://cdn.harrys.com/email/webfonts/3083F9_2_0.woff2') format('woff2'),url('http://cdn.harrys.com/email/webfonts/3083F9_2_0.woff') format('woff'),url('http://cdn.harrys.com/email/webfonts/3083F9_2_0.ttf') format('truetype');font-weight: normal;font-style: normal;}
    	@font-face {font-family: 'Brandon Grotesque';src: url('http://cdn.harrys.com/email/webfonts/2D9B47_6_0.eot');src: url('http://cdn.harrys.com/email/webfonts/2D9B47_6_0.eot?#iefix') format('embedded-opentype'),url('http://cdn.harrys.com/email/webfonts/2D9B47_6_0.woff2') format('woff2'),url('http://cdn.harrys.com/email/webfonts/2D9B47_6_0.woff') format('woff'),url('http://cdn.harrys.com/email/webfonts/2D9B47_6_0.ttf') format('truetype'); font-weight: bold;font-style: normal;}
    		div[style*=margin: 16px 0]{
    			margin:0 !important;
    		}
    	@media screen and (-webkit-min-device-pixel-ratio: 0){
    		.h1,.h1 a{
    			font-family:'Brandon Grotesque', Futura, Trebuchet MS, Arial, sans-serif !important;
    			font-size:36px !important;
    			line-height:52px !important;
    			letter-spacing:1.25px !important;
    			font-weight:normal !important;
    		}
    
    }	@media screen and (-webkit-min-device-pixel-ratio: 0){
    		.h2,.h2 a{
    			font-family:'Brandon Grotesque', Futura, Trebuchet MS, Arial, sans-serif !important;
    			font-size:28px !important;
    			line-height:42px !important;
    			letter-spacing:1px !important;
    			font-weight:normal !important;
    		}
    
    }	@media screen and (-webkit-min-device-pixel-ratio: 0){
    		.h3,.h3 a{
    			font-family:'Brandon Grotesque', Futura, Trebuchet MS, Arial, sans-serif !important;
    			font-size:24px !important;
    			line-height:36px !important;
    			letter-spacing:1.25px !important;
    			font-weight:normal !important;
    		}
    
    }	@media screen and (-webkit-min-device-pixel-ratio: 0){
    		.subheader,.subheader a{
    			font-family:'Brandon Grotesque', Futura, Trebuchet MS, Arial, sans-serif !important;
    			font-size:12px !important;
    			line-height:24px !important;
    			letter-spacing:2.3px !important;
    			font-weight:bold !important;
    		}
    
    }	@media screen and (-webkit-min-device-pixel-ratio: 0){
    		.body,.body a{
    			font-family:'Museo Sans', Verdana, Geneva, sans-serif !important;
    			font-size:15px !important;
    			line-height:28px !important;
    			letter-spacing:0.75px !important;
    		}
    
    }	@media screen and (-webkit-min-device-pixel-ratio: 0){
    		.note,.note a{
    			font-family:'Museo Sans', Verdana, Geneva, sans-serif !important;
    			letter-spacing:0.4px !important;
    		}
    
    }	@media screen and (-webkit-min-device-pixel-ratio: 0){
    		.large-cta,.large-cta a{
    			font-family:'Brandon Grotesque', Futura, Trebuchet MS, Arial, sans-serif !important;
    			font-size:14px !important;
    			letter-spacing:2px !important;
    			border-top-width:14px !important;
    			border-bottom-width:10px !important;
    			border-right-width:30px !important;
    			border-left-width:30px !important;
    			font-weight:bold !important;
    		}
    
    }		.smart-666666 a{
    			color:#666666 !important;
    			text-decoration:none !important;
    		}
    		.smart-868686 a{
    			color:#868686 !important;
    			text-decoration:none !important;
    		}
    		.smart-BFBFBF a{
    			color:#BFBFBF !important;
    			text-decoration:none !important;
    		}
    		.smart-185674 a{
    			color:#185674 !important;
    			text-decoration:none !important;
    		}
    		.smart-263645 a{
    			color:#263645 !important;
    			text-decoration:none !important;
    		}
    		.smart-FFFFFF a{
    			color:#FFFFFF !important;
    			text-decoration:none !important;
    		}
    		.smart-000000 a{
    			color:#000000 !important;
    			text-decoration:none !important;
    		}
    	@media screen and (max-width: 579px), screen and (max-device-width: 579px){
    		table[class=full-table],td[class=full-table] img{
    			width:100%!important;
    			min-width:0 !important;
    			height:auto !important;
    		}
    
    }	@media screen and (max-width: 579px), screen and (max-device-width: 579px){
    		table[class=full-table-color]{
    			width:100%!important;
    			min-width:0 !important;
    			height:auto !important;
    			background-color:#E7E7E7 !important;
    		}
    
    }	@media screen and (max-width: 579px), screen and (max-device-width: 579px){
    		td[class=one-col]{
    			width:100% !important;
    			display:block !important;
    			text-align:center !important;
    		}
    
    }	@media screen and (max-width: 579px), screen and (max-device-width: 579px){
    		td[class=one-col] td{
    			text-align:center !important;
    			padding:0 40px !important;
    		}
    
    }	@media screen and (max-width: 579px), screen and (max-device-width: 579px){
    		td[class=one-col] img{
    			text-align:center !important;
    		}
    
    }	@media screen and (max-width: 579px), screen and (max-device-width: 579px){
    		td[class=one-col-shelf]{
    			width:100% !important;
    			display:block !important;
    			background-image:url(http://cdn.harrys.com/email/161025_5OC-Newsletter/mobile-bg.jpg) !important;
    			background-repeat:repeat-y !important;
    			background-position:center !important;
    		}
    
    }	@media screen and (max-width: 579px), screen and (max-device-width: 579px){
    		td[class=one-col-shelf-text]{
    			width:100% !important;
    			display:block !important;
    			padding:0px !important;
    		}
    
    }	@media screen and (max-width: 579px), screen and (max-device-width: 579px){
    		td[class=mobile-hide],table[class=mobile-hide]{
    			height:1px !important;
    			display:none !important;
    			min-width:inherit !important;
    		}
    
    }	@media screen and (max-width: 579px), screen and (max-device-width: 579px){
    		td[class=hero] img,td[class=hero-padding] img{
    			width:100% !important;
    			height:auto !important;
    		}
    
    }	@media screen and (max-width: 579px), screen and (max-device-width: 579px){
    		td[class=hero-padding],td[class=gutter]{
    			padding:0 20px !important;
    		}
    
    }	@media screen and (max-width: 579px), screen and (max-device-width: 579px){
    		table[class=gutter-extra]{
    			margin:0 40px !important;
    		}
    
    }	@media screen and (max-width: 579px), screen and (max-device-width: 579px){
    		table[class=gutter-extra2]{
    			width:100% !important;
    			margin:0 40px !important;
    		}
    
    }	@media screen and (max-width: 579px), screen and (max-device-width: 579px){
    		td[class=mobile-column]{
    			height:auto !important;
    			padding:0 !important;
    		}
    
    }	@media screen and (max-width: 579px), screen and (max-device-width: 579px){
    		td[class=mobile-column] td{
    			padding:0 20px !important;
    		}
    
    }	@media screen and (max-width: 579px), screen and (max-device-width: 579px){
    		table[class=bg-text]{
    			width:100%!important;
    			display:block !important;
    			padding-top:400px !important;
    		}
    
    }	@media screen and (max-width: 579px), screen and (max-device-width: 579px){
    		td[class=full-bg-right]{
    			display:block !important;
    			background-position:26% center !important;
    		}
    
    }	@media screen and (max-width: 579px), screen and (max-device-width: 579px){
    		td[class=full-bg-left]{
    			display:block !important;
    			background-position:74% center !important;
    		}
    
    }	@media screen and (max-width: 579px), screen and (max-device-width: 579px){
    		td[class=half-bg-right]{
    			display:block !important;
    			background-size:cover !important;
    			background-position:left bottom !important;
    		}
    
    }	@media screen and (max-width: 579px), screen and (max-device-width: 579px){
    		td[class=half-bg-left]{
    			display:block !important;
    			background-size:cover !important;
    			background-position:right bottom !important;
    		}
    
    }	@media screen and (max-width: 579px), screen and (max-device-width: 579px){
    		td[class=2-col-inline]{
    			background:none !important;
    		}
    
    }	@media screen and (max-width: 579px), screen and (max-device-width: 579px){
    		*[class=head]{
    			display:table-header-group!important;
    			width:100%!important;
    		}
    
    }	@media screen and (max-width: 579px), screen and (max-device-width: 579px){
    		*[class=foot]{
    			display:table-footer-group!important;
    			width:100%!important;
    		}
    
    }	@media screen and (max-width: 579px), screen and (max-device-width: 579px){
    		.head:after{
    			content:'---------------------------------------------------------------------------------------------------------------------';
    			max-height:0;
    			overflow:hidden;
    			display:block;
    		}
    
    }
  </style>
</head>


<body bgcolor="#F7F7F7" style="-webkit-font-smoothing: antialiased;width: 100% !important;background: #F7F7F7;-webkit-text-size-adjust: none;margin: 0;padding: 0;min-width: 100%;-ms-text-size-adjust: 100%;height: 100% !important;">

  <!-- PREHEADER TEXT -->
  <span style="display: none !important; color: #FFFFFF; margin:0; padding:0; font-size:1px; line-height:1px;"></span>

  <!-- CONTAINER TABLE -->
  <table class="container" border="0" cellpadding="0" cellspacing="0" width="100%" style="min-width: 580px;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">
    <tbody>
      <tr>
        <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">

          <!-- HEADER -->
          <table cellspacing="0" cellpadding="0" border="0" width="100%" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">
            <tbody>
              <tr>
                <td bgcolor="#FFFFFF" align="center" style="padding: 20px;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                  <a href="https://www.harrys.com?utm_source=Five+O%27Clock+Newsletter+Subscribe&amp;utm_campaign=b44f0feff5-EMAIL_CAMPAIGN_2017_02_03&amp;utm_medium=email&amp;utm_term=0_99a4f97875-b44f0feff5-443062605" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;"
                    target="_blank">
                  </a>
                  <a href="https://www.harrys.com/?utm_campaign=b44f0feff5-EMAIL_CAMPAIGN_2017_02_03&amp;utm_medium=email&amp;utm_medium-email=&amp;utm_source=Five+O%27Clock+Newsletter+Subscribe&amp;utm_term=0_99a4f97875-b44f0feff5-443062605" target="_blank"
                    style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;"><img src="http://cdn.harrys.com/email/shared/logo.png" alt="" border="0" style="margin: 0;padding: 0;font-size: 13px;font-family: 'Trebuchet MS', Helvetica, Arial, sans-serif;color: #065778;width: 115px;height: 20px;max-width: 115px;max-height: 20px;display: block;-ms-interpolation-mode: bicubic;border: 0;line-height: 100%;outline: none;text-decoration: none;"></a>

                </td>
              </tr>
              <tr>
                <td bgcolor="#FFFFFF" width="100%" height="1" style="font-size: 1px;line-height: 1px;mso-line-height-rule: exactly;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">&nbsp;</td>
              </tr>
            </tbody>
          </table>
          <!-- HEADER END -->

          <!-- INTRO -->
          <table align="center" cellpadding="0" cellspacing="0" width="100%" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">
            <tbody>
              <tr>
                <!-- Change background color -->
                <td bgcolor="#F7F7F7" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                  <table align="center" border="0" cellpadding="0" cellspacing="0" class="full-table" width="580" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">
                    <tbody>
                      <tr>
                        <td align="center" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                          <!-- Adjust width of text container (580px MAX) -->
                          <table width="500" align="center" cellpadding="0" cellspacing="0" class="full-table" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">
                            <tbody>
                              <tr>
                                <td align="center" style="padding: 0 20px;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                                  <table border="0" cellpadding="0" cellspacing="0" width="100%" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">

                                    <tbody>
                                      <tr>
                                        <td width="100%" height="50" style="font-size: 1px;line-height: 1px;mso-line-height-rule: exactly;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">&nbsp;</td>
                                      </tr>
                                      <!-- FOC HEADER -->
                                      <tr>
                                        <td class="hero" align="center" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                                          <a href="https://fiveoclock.harrys.com/?utm_campaign=b44f0feff5-EMAIL_CAMPAIGN_2017_02_03&amp;utm_medium=email&amp;utm_source=Five%20O%27Clock%20Newsletter%20Subscribe&amp;utm_term=0_99a4f97875-b44f0feff5-443062605" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;"
                                            target="_blank">
                                          </a>
                                          <a href="https://fiveoclock.harrys.com/?utm_campaign=b44f0feff5-EMAIL_CAMPAIGN_2017_02_03&amp;utm_medium=email&amp;utm_medium-email&amp;utm_source=Five%20O%27Clock%20Newsletter%20Subscribe&amp;utm_term=0_99a4f97875-b44f0feff5-443062605"
                                            target="_blank" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;"><img src="http://cdn.harrys.com/email/161025_5OC-Newsletter/5oc-logo.jpg" alt="" border="0" style="margin: 0;padding: 0;font-size: 20px;font-family: 'Trebuchet MS', Helvetica, Arial, sans-serif;color: #000000;font-weight: bold;width: 378px;height: 101px;max-width: 378px;max-height: 101px;display: block;-ms-interpolation-mode: bicubic;border: 0;line-height: 100%;outline: none;text-decoration: none;"></a>

                                        </td>
                                      </tr>
                                      <!-- FOC HEADER END -->

                                      <tr>
                                        <td width="100%" height="20" style="font-size: 1px;line-height: 1px;mso-line-height-rule: exactly;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">&nbsp;</td>
                                      </tr>

                                      <!-- BODY -->
                                      <tr>
                                        <td align="center" class="body" style="font-size: 14px;line-height: 30px;letter-spacing: 0px;font-family: Verdana, Geneva, sans-serif;color: #000000;font-weight: normal;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">Lather up with grooming basics, sage advice from a titan of publishing and the soundtrack for&nbsp;February.</td>
                                      </tr>
                                      <!-- BODY END -->

                                      <tr>
                                        <td width="100%" height="60" style="font-size: 1px;line-height: 1px;mso-line-height-rule: exactly;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">&nbsp;</td>
                                      </tr>

                                    </tbody>
                                  </table>
                                </td>
                              </tr>
                            </tbody>
                          </table>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </td>
              </tr>
            </tbody>
          </table>
          <!-- INTRO END -->

          <!-- LANDSCAPE -->
          <table align="center" cellpadding="0" cellspacing="0" width="100%" mc:repeatable="repeat_1" mc:variant="landscape" mc:repeatindex="0" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">
            <tbody>
              <tr>
                <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">

                  <table border="0" cellpadding="0" cellspacing="0" align="center" width="100%" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">
                    <tbody>
                      <tr>
                        <!-- Change background color -->
                        <td class="gutter" bgcolor="#F7F7F7" align="center" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">

                          <table class="full-table" cellpadding="0" cellspacing="0" border="0" width="580" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">
                            <tbody>
                              <tr>
                                <!-- Change image in TWO places -->
                                <td background="http://cdn.harrys.com/email/161025_5OC-Newsletter/lanscape-bg.jpg" align="center" style="background-position: center;background-repeat: repeat-x;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                                  <!--[if gte mso 9]>
									<v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width: 580px;height:250px;">
									<v:fill type="tile" src="http://cdn.harrys.com/email/161025_5OC-Newsletter/lanscape-bg.jpg" />
									<v:textbox inset="0,0,0,0">
									<![endif]-->
                                  <div>

                                    <!-- CONTENT -->
                                    <table class="full-table" cellspacing="0" cellpadding="0" align="center" width="580" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">
                                      <tbody>
                                        <tr>
                                          <td class="hero-padding" align="center" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                                            <a href="https://fiveoclock.harrys.com/?utm_campaign=b44f0feff5-EMAIL_CAMPAIGN_2017_02_03&amp;utm_medium=email&amp;utm_source=Five%20O%27Clock%20Newsletter%20Subscribe&amp;utm_term=0_99a4f97875-b44f0feff5-443062605" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;"
                                              target="_blank">
                                            </a>
                                            <a href="https://fiveoclock.harrys.com/2017/02/03/lather-up/?utm_campaign=b44f0feff5-EMAIL_CAMPAIGN_2017_02_03&amp;utm_medium=email&amp;utm_medium-email=&amp;utm_source=Five+O%27Clock+Newsletter+Subscribe&amp;utm_term=0_99a4f97875-b44f0feff5-443062605"
                                              target="_blank" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;"><img src="https://gallery.mailchimp.com/9bd51aa93793f2e01258b18d5/images/e21412a7-1f26-410c-b761-1265da6bf802.gif" alt="" border="0" style="margin: 0;padding: 0;width: 530px;height: 250px;max-width: 530px;max-height: 250px;line-height: 250px;display: block;font-size: 14px;letter-spacing: 0px;font-family: Verdana, Geneva, sans-serif;color: #666666;font-weight: normal;-ms-interpolation-mode: bicubic;border: 0;outline: none;text-decoration: none;"></a>

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

                                  </div>
                                  <!--[if gte mso 9]>
									</v:textbox>
									</v:rect>
									<![endif]-->
                                </td>
                              </tr>
                            </tbody>
                          </table>
                        </td>
                      </tr>
                    </tbody>
                  </table>

                  <table align="center" cellpadding="0" cellspacing="0" width="100%" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">
                    <tbody>
                      <tr>
                        <!-- Change background color -->
                        <td class="gutter" bgcolor="#F7F7F7" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                          <table align="center" border="0" cellpadding="0" cellspacing="0" class="full-table" width="580" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">
                            <tbody>
                              <tr>
                                <td align="center" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                                  <!-- Adjust width of text container (580px MAX) -->
                                  <table width="580" align="center" cellpadding="0" cellspacing="0" class="full-table" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">
                                    <tbody>
                                      <tr>
                                        <td bgcolor="#E7E7E7" align="center" width="100%" style="padding: 0 20px;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                                          <table class="full-table" border="0" cellpadding="0" cellspacing="0" width="92%" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">

                                            <tbody>
                                              <tr>
                                                <td width="100%" height="50" style="font-size: 1px;line-height: 1px;mso-line-height-rule: exactly;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">&nbsp;</td>
                                              </tr>

                                              <!-- SUBHEADER-->
                                              <tr>
                                                <td align="center" class="subheader" style="font-size: 11px;line-height: 24px;letter-spacing: 2.6px;font-family: Futura, Trebuchet MS, Arial, sans-serif;color: #000000;font-weight: normal;text-transform: uppercase;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">GROOMING BASICS</td>
                                              </tr>
                                              <!-- SUBHEADER END -->

                                              <tr>
                                                <td width="100%" height="20" style="font-size: 1px;line-height: 1px;mso-line-height-rule: exactly;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">&nbsp;</td>
                                              </tr>

                                              <!-- BODY -->
                                              <tr>
                                                <td align="center" class="body" style="font-size: 14px;line-height: 30px;letter-spacing: 0px;font-family: Verdana, Geneva, sans-serif;color: #000000;font-weight: normal;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">If you’re pulling a sharp blade across your skin, it needs to be protected. Sure. But, shave cream? Foaming shave gel? What protects <em>best?</em> Turns out, there are benefits to both...</td>
                                              </tr>

                                              <tr>
                                                <td width="100%" height="20" style="font-size: 1px;line-height: 1px;mso-line-height-rule: exactly;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">&nbsp;</td>
                                              </tr>
                                              <!-- BODY END -->

                                              <!-- LINK -->
                                              <tr>
                                                <td align="center" class="subheader" style="font-size: 11px;line-height: 24px;letter-spacing: 2.6px;font-family: Futura, Trebuchet MS, Arial, sans-serif;color: #000000;font-weight: normal;text-transform: uppercase;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;"><a href="https://fiveoclock.harrys.com/2017/02/03/lather-up/?utm_campaign=b44f0feff5-EMAIL_CAMPAIGN_2017_02_03&amp;utm_medium=email&amp;utm_medium-email=&amp;utm_source=Five+O%27Clock+Newsletter+Subscribe&amp;utm_term=0_99a4f97875-b44f0feff5-443062605"
                                                    style="color: #000000;border-bottom: 1px solid;border-bottom-color: #000000;padding-bottom: 4px;text-decoration: none;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;" target="_blank">READ MORE</a></td>
                                              </tr>
                                              <!-- LINK END -->

                                              <tr>
                                                <td width="100%" height="50" style="font-size: 1px;line-height: 1px;mso-line-height-rule: exactly;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">&nbsp;</td>
                                              </tr>

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

                </td>
              </tr>
            </tbody>
          </table>
          <table border="0" cellpadding="0" cellspacing="0" width="100%" mc:repeatable="repeat_1" mc:variant="spacer" mc:repeatindex="1" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">
            <!-- Change height -->
            <tbody>
              <tr>
                <td height="70" bgcolor="#F7F7F7" width="100%" style="font-size: 1px;line-height: 1px;mso-line-height-rule: exactly;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">&nbsp;</td>
              </tr>
            </tbody>
          </table>
          <table border="0" cellpadding="0" cellspacing="0" width="100%" mc:repeatable="repeat_1" mc:variant="portrait" mc:repeatindex="2" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">
            <tbody>
              <tr>
                <!-- Change background color -->
                <td bgcolor="#F7F7F7" align="center" valign="top" width="100%" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                  <table align="center" cellspacing="0" cellpadding="0" border="0" width="100%" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">
                    <tbody>
                      <tr>
                        <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                          <!-- CONTENT -->
                          <table class="full-table" width="580" height="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">
                            <tbody>
                              <tr>
                                <!-- COLUMN 01 -->
                                <!-- Change image in TWO places -->
                                <td class="one-col-shelf" width="290" background="http://cdn.harrys.com/email/161025_5OC-Newsletter/portrait-bg.jpg" align="center" style="background-position: center;background-repeat: repeat-y;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                                  <!--[if gte mso 9]>
								<v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="width:290px;mso-height-percent:1000;">
								<v:fill type="tile" src="http://cdn.harrys.com/email/161025_5OC-Newsletter/lanscape-bg.jpg" />
								<v:textbox inset="0,0,0,0">
								<![endif]-->
                                  <div>
                                    <a href="https://fiveoclock.harrys.com/?utm_campaign=b44f0feff5-EMAIL_CAMPAIGN_2017_02_03&amp;utm_medium=email&amp;utm_source=Five%20O%27Clock%20Newsletter%20Subscribe&amp;utm_term=0_99a4f97875-b44f0feff5-443062605" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;"
                                      target="_blank">
                                    </a>
                                    <a href="https://fiveoclock.harrys.com/2017/02/03/from-one-man-to-another-ron-king/?utm_campaign=b44f0feff5-EMAIL_CAMPAIGN_2017_02_03&amp;utm_medium=email&amp;utm_medium-email=&amp;utm_source=Five+O%27Clock+Newsletter+Subscribe&amp;utm_term=0_99a4f97875-b44f0feff5-443062605"
                                      target="_blank" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;"><img src="https://gallery.mailchimp.com/9bd51aa93793f2e01258b18d5/images/26311c77-74ae-43ff-832f-5ed549633de3.jpg" alt="" border="0" style="margin: 0;padding: 30px 0;width: 250px;height: 375px;max-width: 250px;max-height: 375px;line-height: 375px;display: block;font-size: 14px;letter-spacing: 0px;font-family: Verdana, Geneva, sans-serif;color: #666666;font-weight: normal;-ms-interpolation-mode: bicubic;border: 0;outline: none;text-decoration: none;"></a>

                                  </div>
                                </td>
                                <!-- COLUMN 01 END -->

                                <!-- COLUMN 02 -->
                                <!-- Change this height to match the image height -->
                                <td class="one-col-shelf-text" width="290" bgcolor="#E7E7E7" valign="middle" style="padding: 0 20px;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                                  <table class="gutter-extra" cellpadding="0" cellspacing="0" border="0" align="left" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">

                                    <tbody>
                                      <tr>
                                        <td width="100%" height="50" style="font-size: 1px;line-height: 1px;mso-line-height-rule: exactly;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">&nbsp;</td>
                                      </tr>
                                      <!-- SUBHEADER-->
                                      <tr>
                                        <td align="left" class="subheader" style="font-size: 11px;line-height: 24px;letter-spacing: 2.6px;font-family: Futura, Trebuchet MS, Arial, sans-serif;color: #000000;font-weight: normal;text-transform: uppercase;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">FROM ONE MAN TO<br> ANOTHER, RON KING</td>
                                      </tr>
                                      <!-- SUBHEADER END -->

                                      <tr>
                                        <td width="100%" height="20" style="font-size: 1px;line-height: 1px;mso-line-height-rule: exactly;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">&nbsp;</td>
                                      </tr>

                                      <!-- NOTE -->
                                      <tr>
                                        <td align="left" class="note" style="font-size: 13px;line-height: 20px;letter-spacing: 0.4px;font-family: Verdana, Geneva, sans-serif;color: #000000;font-weight: normal;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                                          <ol>
                                            <li style="margin-bottom: 20px; margin-left: -20px;">Embrace change, take lots of risks and spend some time out of your comfort zone.</li>
                                            <li style="margin-bottom: 20px; margin-left: -20px;">We're all so busy—doing more, doing it faster—remember to&nbsp;take a step back&nbsp;and ask yourself if what you're doing makes common sense.</li>
                                            <li style="margin-bottom: 20px; margin-left: -20px;">Being the best that you can be, one day at a time, will very likely take you beyond your wildest dreams.</li>
                                          </ol>
                                        </td>
                                      </tr>

                                      <tr>
                                        <td width="100%" height="20" style="font-size: 1px;line-height: 1px;mso-line-height-rule: exactly;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">&nbsp;</td>
                                      </tr>
                                      <!-- NOTE END -->

                                      <!-- LINK -->
                                      <tr>
                                        <td align="left" class="subheader" style="font-size: 11px;line-height: 24px;letter-spacing: 2.6px;font-family: Futura, Trebuchet MS, Arial, sans-serif;color: #000000;font-weight: normal;text-transform: uppercase;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;"><a href="https://fiveoclock.harrys.com/2017/02/03/from-one-man-to-another-ron-king/?utm_campaign=b44f0feff5-EMAIL_CAMPAIGN_2017_02_03&amp;utm_medium=email&amp;utm_medium-email=&amp;utm_source=Five+O%27Clock+Newsletter+Subscribe&amp;utm_term=0_99a4f97875-b44f0feff5-443062605"
                                            style="color: #000000;border-bottom: 1px solid;border-bottom-color: #000000;padding-bottom: 4px;text-decoration: none;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;" target="_blank">READ MORE</a></td>
                                      </tr>
                                      <!-- LINK END -->

                                      <tr>
                                        <td width="100%" height="50" style="font-size: 1px;line-height: 1px;mso-line-height-rule: exactly;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">&nbsp;</td>
                                      </tr>

                                    </tbody>
                                  </table>
                                </td>
                                <!-- COLUMN 02 END -->

                              </tr>
                            </tbody>
                          </table>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </td>
              </tr>
            </tbody>
          </table>
          <table border="0" cellpadding="0" cellspacing="0" width="100%" mc:repeatable="repeat_1" mc:variant="spacer" mc:repeatindex="3" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">
            <!-- Change height -->
            <tbody>
              <tr>
                <td height="70" bgcolor="#F7F7F7" width="100%" style="font-size: 1px;line-height: 1px;mso-line-height-rule: exactly;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">&nbsp;</td>
              </tr>
            </tbody>
          </table>
          <table border="0" cellpadding="0" cellspacing="0" width="100%" mc:repeatable="repeat_1" mc:variant="shower-sessions" mc:repeatindex="4" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">
            <tbody>
              <tr>
                <!-- Change background color -->
                <td class="gutter" bgcolor="#F7F7F7" align="center" valign="top" width="100%" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                  <table align="center" cellspacing="0" cellpadding="0" border="0" width="100%" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">
                    <tbody>
                      <tr>
                        <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                          <!-- Content -->
                          <table class="full-table" width="580" height="100%" cellpadding="0" cellspacing="0" border="0" align="center" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">
                            <tbody>
                              <tr>
                                <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                                  <!-- COLUMN 01 -->
                                  <div class="foot">
                                    <table class="full-table-color" width="300" align="left" border="0" cellpadding="0" cellspacing="0" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">
                                      <tbody>
                                        <tr>
                                          <!-- Change this height to match the image height -->
                                          <td class="one-col" valign="middle" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                                            <table cellpadding="0" cellspacing="0" border="0" align="left" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">

                                              <tbody>
                                                <tr>
                                                  <td class="mobile-hide" width="100%" height="50" style="font-size: 1px;line-height: 1px;mso-line-height-rule: exactly;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">&nbsp;</td>
                                                </tr>

                                                <!-- SUBHEADER-->
                                                <tr>
                                                  <td align="left" class="subheader" style="font-size: 11px;line-height: 24px;letter-spacing: 2.6px;font-family: Futura, Trebuchet MS, Arial, sans-serif;color: #000000;font-weight: normal;text-transform: uppercase;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">February Shower Sessions</td>
                                                </tr>
                                                <!-- SUBHEADER END -->

                                                <tr>
                                                  <td width="100%" height="20" style="font-size: 1px;line-height: 1px;mso-line-height-rule: exactly;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">&nbsp;</td>
                                                </tr>

                                                <!-- H3 -->
                                                <tr>
                                                  <td align="left" class="h3" style="font-size: 23px;line-height: 36px;letter-spacing: 0.25px;font-family: Futura, Trebuchet MS, Arial, sans-serif;color: #000000;font-weight: normal;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                                                    A well-groomed monthly playlist to start your morning right.
                                                  </td>
                                                </tr>

                                                <tr>
                                                  <td width="100%" height="25" style="font-size: 1px;line-height: 1px;mso-line-height-rule: exactly;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">&nbsp;</td>
                                                </tr>
                                                <!-- H3 END -->

                                                <!-- LINK -->
                                                <tr>
                                                  <td align="left" class="subheader" style="font-size: 11px;line-height: 24px;letter-spacing: 2.6px;font-family: Futura, Trebuchet MS, Arial, sans-serif;color: #000000;font-weight: normal;text-transform: uppercase;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;"><a href="https://open.spotify.com/user/fiveoclockmagazine?utm_source=Five+O%27Clock+Newsletter+Subscribe&amp;utm_campaign=b44f0feff5-EMAIL_CAMPAIGN_2017_02_03&amp;utm_medium=email&amp;utm_term=0_99a4f97875-b44f0feff5-443062605"
                                                      style="color: #000000;border-bottom: 1px solid;border-bottom-color: #000000;padding-bottom: 4px;text-decoration: none;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;" target="_blank">LISTEN ON SPOTIFY</a></td>
                                                </tr>
                                                <!-- LINK END -->

                                                <tr>
                                                  <td width="100%" height="50" style="font-size: 1px;line-height: 1px;mso-line-height-rule: exactly;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">&nbsp;</td>
                                                </tr>

                                              </tbody>
                                            </table>
                                          </td>
                                        </tr>
                                      </tbody>
                                    </table>
                                  </div>
                                  <!-- COLUMN 01 END-->

                                  <!-- COLUMN 02 -->
                                  <!-- Change image in TWO places -->
                                  <div class="head">
                                    <table class="full-table" width="280" align="left" border="0" cellpadding="0" cellspacing="0" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">
                                      <tbody>
                                        <tr>
                                          <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">

                                            <table width="100%" cellpadding="0" cellspacing="0" border="0" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">
                                              <tbody>
                                                <tr>
                                                  <td background="http://cdn.harrys.com/email/161025_5OC-Newsletter/shower-sessions-bg.jpg" align="center" style="background-position: center;background-repeat: repeat-x;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                                                    <!--[if gte mso 9]>
														<v:rect xmlns:v="urn:schemas-microsoft-com:vml" fill="true" stroke="false" style="mso-width-percent:1000;height:155;">
														<v:fill type="tile" src="http://cdn.harrys.com/email/161025_5OC-Newsletter/shower-sessions-bg.jpg" />
														<v:textbox inset="0,0,0,0">
														<![endif]-->
                                                    <div>
                                                      <a href="https://open.spotify.com/user/fiveoclockmagazine/playlist?utm_source=Five+O%27Clock+Newsletter+Subscribe&amp;utm_campaign=b44f0feff5-EMAIL_CAMPAIGN_2017_02_03&amp;utm_medium=email&amp;utm_term=0_99a4f97875-b44f0feff5-443062605" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;"
                                                        target="_blank">
                                                      </a>
                                                      <a href="https://open.spotify.com/user/fiveoclockmagazine?utm_source=Five+O%27Clock+Newsletter+Subscribe&amp;utm_campaign=b44f0feff5-EMAIL_CAMPAIGN_2017_02_03&amp;utm_medium=email&amp;utm_term=0_99a4f97875-b44f0feff5-443062605"
                                                        target="_blank" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;"><img src="https://gallery.mailchimp.com/9bd51aa93793f2e01258b18d5/images/35a83606-a031-4fa0-96ec-fee1a8ce22ad.jpg" alt="" border="0" style="margin: 0;padding: 0;width: 155px;height: 155px;line-height: 155px;max-width: 155px;max-height: 155px;display: block;-ms-interpolation-mode: bicubic;border: 0;outline: none;text-decoration: none;"></a>

                                                    </div>
                                                  </td>
                                                </tr>
                                              </tbody>
                                            </table>

                                            <table width="100%" cellpadding="0" cellspacing="0" border="0" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">
                                              <tbody>
                                                <tr>
                                                  <td bgcolor="#E7E7E7" align="center" width="100%" style="padding: 0 20px;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                                                    <table border="0" cellpadding="0" cellspacing="0" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">

                                                      <tbody>
                                                        <tr>
                                                          <td width="100%" height="30" style="font-size: 1px;line-height: 1px;mso-line-height-rule: exactly;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">&nbsp;</td>
                                                        </tr>

                                                        <!-- SUBHEADER-->
                                                        <tr>
                                                          <td align="center" class="subheader" style="font-size: 11px;line-height: 24px;letter-spacing: 2.6px;font-family: Futura, Trebuchet MS, Arial, sans-serif;color: #000000;font-weight: normal;text-transform: uppercase;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">Ain't no rest for<br> the wicked</td>
                                                        </tr>
                                                        <!-- SUBHEADER END -->

                                                        <tr>
                                                          <td width="100%" height="8" style="font-size: 1px;line-height: 1px;mso-line-height-rule: exactly;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">&nbsp;</td>
                                                        </tr>

                                                        <!-- NOTE -->
                                                        <tr>
                                                          <td align="center" class="note" style="font-size: 13px;line-height: 20px;letter-spacing: 0.4px;font-family: Verdana, Geneva, sans-serif;color: #000000;font-weight: normal;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">Cage The Elephant</td>
                                                        </tr>
                                                        <!-- NOTE END -->

                                                        <tr>
                                                          <td width="100%" height="20" style="font-size: 1px;line-height: 1px;mso-line-height-rule: exactly;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">&nbsp;</td>
                                                        </tr>

                                                        <!-- WAVEFORM -->
                                                        <tr>
                                                          <td align="center" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                                                            <img src="http://cdn.harrys.com/email/161025_5OC-Newsletter/wave.gif" width="81" height="18" border="0" style="width: 81px;height: 18px;display: block;-ms-interpolation-mode: bicubic;border: 0;line-height: 100%;outline: none;text-decoration: none;">
                                                          </td>
                                                        </tr>
                                                        <!-- WAVEFORM END -->

                                                        <tr>
                                                          <td width="100%" height="40" style="font-size: 1px;line-height: 1px;mso-line-height-rule: exactly;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">&nbsp;</td>
                                                        </tr>

                                                      </tbody>
                                                    </table>
                                                  </td>
                                                </tr>
                                              </tbody>
                                            </table>
                                          </td>
                                        </tr>
                                      </tbody>
                                    </table>
                                  </div>
                                  <!-- COLUMN 02 END -->

                                </td>
                              </tr>
                            </tbody>
                          </table>
                          <!-- CONTENT END -->
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </td>
              </tr>
            </tbody>
          </table>
          <table align="center" cellpadding="0" cellspacing="0" width="100%" mc:repeatable="repeat_1" mc:variant="bye" mc:repeatindex="5" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">
            <tbody>
              <tr>
                <!-- Change background color -->
                <td bgcolor="#F7F7F7" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                  <table align="center" border="0" cellpadding="0" cellspacing="0" class="full-table" width="580" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">
                    <tbody>
                      <tr>
                        <td align="center" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                          <!-- Adjust width of text container (580px MAX) -->
                          <table width="440" align="center" cellpadding="0" cellspacing="0" class="full-table" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">
                            <tbody>
                              <tr>
                                <td align="center" style="padding: 0 30px;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                                  <table border="0" cellpadding="0" cellspacing="0" width="100%" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">

                                    <tbody>
                                      <tr>
                                        <td width="100%" height="70" style="font-size: 1px;line-height: 1px;mso-line-height-rule: exactly;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">&nbsp;</td>
                                      </tr>

                                      <!-- H3 -->
                                      <tr>
                                        <td align="center" class="h3" style="font-size: 23px;line-height: 36px;letter-spacing: 0.25px;font-family: Futura, Trebuchet MS, Arial, sans-serif;color: #000000;font-weight: normal;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;"><span class="smart-000000">Better Grooming, Better Mornings, Better Life—find a&nbsp;better read over at Five O’Clock.</span></td>
                                      </tr>
                                      <!-- H3 END -->

                                      <tr>
                                        <td height="30" style="font-size: 1px;line-height: 1px;mso-line-height-rule: exactly;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;" width="100%">&nbsp;</td>
                                      </tr>

                                      <!-- BLUE CTA -->
                                      <tr>
                                        <td align="center" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                                          <!--[if mso]>
												<v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" style="height:48px;v-text-anchor:middle;width:280px;" arcsize="5%" strokecolor="#185674" fillcolor="#185674">
												<w:anchorlock/>
												<center>
												<![endif]--><a class="large-cta" href="https://fiveoclock.harrys.com/?utm_campaign=b44f0feff5-EMAIL_CAMPAIGN_2017_02_03&amp;utm_medium=email&amp;utm_medium-email&amp;utm_source=Five%20O%27Clock%20Newsletter%20Subscribe&amp;utm_term=0_99a4f97875-b44f0feff5-443062605"
                                            style="font-size: 13px;letter-spacing: 0.16em;line-height: 20px;font-family: Futura, Trebuchet MS, Arial, sans-serif;color: #FFFFFF;font-weight: normal;text-decoration: none;border-radius: 4px;-webkit-border-radius: 4px;-moz-border-radius: 4px;background-color: #185674;border-top: 12px solid #185674;border-bottom: 12px solid #185674;border-right: 29px solid #185674;border-left: 29px solid #185674;display: inline-block;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;"
                                            target="_blank">EXPLORE</a>
                                          <!--[if mso]>
												</center>
												</v:roundrect>
												<![endif]-->
                                        </td>
                                      </tr>
                                      <!-- BLUE CTA END -->

                                      <tr>
                                        <td width="100%" height="40" style="font-size: 1px;line-height: 1px;mso-line-height-rule: exactly;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">&nbsp;</td>
                                      </tr>

                                    </tbody>
                                  </table>
                                </td>
                              </tr>
                            </tbody>
                          </table>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </td>
              </tr>
            </tbody>
          </table>
          <!-- LANDSCAPE END -->

          <!-- PORTRAIT -->

          <!-- PORTRAIT END -->

          <!-- SHOWER SESSIONS -->

          <!-- SHOWER SESSIONS END -->

          <!-- BYE -->

          <!-- BYE END -->

          <!-- SPACER -->

          <!-- SPACER END -->

          <!-- FOOTER -->
          <table align="center" cellpadding="0" cellspacing="0" width="100%" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">
            <tbody>
              <tr>
                <!-- Change background color -->
                <td bgcolor="F7F7F7" align="center" style="padding: 0 20px;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                  <table border="0" cellpadding="0" cellspacing="0" width="100%" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-collapse: collapse;margin: 0px auto;">

                    <tbody>
                      <tr>
                        <td width="100%" height="50" style="font-size: 1px;line-height: 1px;mso-line-height-rule: exactly;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">&nbsp;</td>
                      </tr>

                      <!-- MAMMOTH -->
                      <tr>
                        <td align="center" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">
                          <a href="https://www.harrys.com/?utm_campaign=b44f0feff5-EMAIL_CAMPAIGN_2017_02_03&amp;utm_medium=email&amp;utm_source=Five+O%27Clock+Newsletter+Subscribe&amp;utm_term=0_99a4f97875-b44f0feff5-443062605" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;"
                            target="_blank"><img border="0" height="36" src="http://cdn.harrys.com/email/global/mammoth.png" style="display: block;-ms-interpolation-mode: bicubic;border: 0;height: auto;line-height: 100%;outline: none;text-decoration: none;" width="47">                            </a>
                        </td>
                      </tr>
                      <!-- MAMMOTH END -->

                      <tr>
                        <td width="100%" height="30" style="font-size: 1px;line-height: 1px;mso-line-height-rule: exactly;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">&nbsp;</td>
                      </tr>

                      <!-- NOTE -->
                      <tr>
                        <td align="center" class="note" style="font-size: 13px;line-height: 24px;letter-spacing: 0.4px;font-family: Verdana, Geneva, sans-serif;color: #666666;font-weight: normal;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;"><a href="mailto:FiveOClock@harrys.com" style="color: #666666;text-decoration: none;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;" target="_blank">fiveoclock@harrys.com</a><br>
                          <span class="smart-666666" style="text-decoration:none">PO Box 566, <span style="white-space:nowrap">New York, NY, 10014</span></span><br>
                          <a href="https://www.harrys.com/?utm_campaign=b44f0feff5-EMAIL_CAMPAIGN_2017_02_03&amp;utm_medium=email&amp;utm_medium-email=&amp;utm_source=Five+O%27Clock+Newsletter+Subscribe&amp;utm_term=0_99a4f97875-b44f0feff5-443062605" style="color: #666666;text-decoration: underline;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;"
                            target="_blank">Shop Harry’s</a> | <a href="#" style="color: #666666;text-decoration: underline;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;"
                            target="_blank">Unsubscribe</a></td>
                      </tr>

                      <!-- NOTE END -->

                      <tr>
                        <td width="100%" height="50" style="font-size: 1px;line-height: 1px;mso-line-height-rule: exactly;-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;">&nbsp;</td>
                      </tr>

                    </tbody>
                  </table>
                </td>
              </tr>
            </tbody>
          </table>
          <!-- FOOTER END -->

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

Console