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 CSS

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

Quick-add: + add another resource

Add External JavaScript

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

Quick-add: + add another resource

Code Indentation

     

Save Automatically?

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

Auto-Updating Preview

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

            
              
					<!-- Inliner Build Version 4380b7741bb759d6cb997545f3add21ad48f010b -->
<!DOCTYPE html>
<html lang="en" class="w-grey" style="min-height: 100%; font-family: Helvetica, Arial, sans-serif !important; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; position: relative; box-sizing: border-box; font-size: 12px; width: 100%; background: #fff; margin: 0;">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="description">
<meta name="author">
<title>NEW: Add a start date, avoid the scramble</title>
</head>
<body class="w-grey" style="width: 100% !important; min-width: 100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: left; line-height: 130%; font-size: 16px; position: relative; background-color: #fff !important; margin: 0; padding: 0;" bgcolor="#fff !important">
<style type="text/css">@media only screen and (max-width: 716px) {
  .small-float-center {
    margin: 0 auto !important; float: none !important; text-align: center !important;
  }
  .small-text-center {
    text-align: center !important;
  }
  .small-text-left {
    text-align: left !important;
  }
  .small-text-right {
    text-align: right !important;
  }
  .hide-for-large {
    display: block !important; width: auto !important; overflow: visible !important; max-height: none !important; font-size: inherit !important; line-height: inherit !important;
  }
  table.body table.container .hide-for-large {
    display: table !important; width: 100% !important;
  }
  table.body table.container .row.hide-for-large {
    display: table !important; width: 100% !important;
  }
  table.body table.container .callout-inner.hide-for-large {
    display: table-cell !important; width: 100% !important;
  }
  table.body table.container .show-for-large {p
    display: none !important; width: 0; mso-hide: all; overflow: hidden;
  }
  .menu.small-vertical .menu-item {
    padding-left: 0 !important; padding-right: 0 !important;
  }
  table.body img {
    width: auto; height: auto;
  }
  table.body center {
    min-width: 0 !important;
  }
  table.body .container {
    width: 95% !important;
  }
  table.body .columns {
    height: auto !important; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; padding-left: 16px !important; padding-right: 16px !important;
  }
  table.body .column {
    height: auto !important; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; padding-left: 16px !important; padding-right: 16px !important;
  }
  table.body .columns .column {
    padding-left: 0 !important; padding-right: 0 !important;
  }
  table.body .columns .columns {
    padding-left: 0 !important; padding-right: 0 !important;
  }
  table.body .column .column {
    padding-left: 0 !important; padding-right: 0 !important;
  }
  table.body .column .columns {
    padding-left: 0 !important; padding-right: 0 !important;
  }
  table.body .collapse .columns {
    padding-left: 0 !important; padding-right: 0 !important;
  }
  table.body .collapse .column {
    padding-left: 0 !important; padding-right: 0 !important;
  }
  td.small-1 {
    display: inline-block !important; width: 8.33333% !important;
  }
  th.small-1 {
    display: inline-block !important; width: 8.33333% !important;
  }
  td.small-2 {
    display: inline-block !important; width: 16.66667% !important;
  }
  th.small-2 {
    display: inline-block !important; width: 16.66667% !important;
  }
  td.small-3 {
    display: inline-block !important; width: 25% !important;
  }
  th.small-3 {
    display: inline-block !important; width: 25% !important;
  }
  td.small-4 {
    display: inline-block !important; width: 33.33333% !important;
  }
  th.small-4 {
    display: inline-block !important; width: 33.33333% !important;
  }
  td.small-5 {
    display: inline-block !important; width: 41.66667% !important;
  }
  th.small-5 {
    display: inline-block !important; width: 41.66667% !important;
  }
  td.small-6 {
    display: inline-block !important; width: 50% !important;
  }
  th.small-6 {
    display: inline-block !important; width: 50% !important;
  }
  td.small-7 {
    display: inline-block !important; width: 58.33333% !important;
  }
  th.small-7 {
    display: inline-block !important; width: 58.33333% !important;
  }
  td.small-8 {
    display: inline-block !important; width: 66.66667% !important;
  }
  th.small-8 {
    display: inline-block !important; width: 66.66667% !important;
  }
  td.small-9 {
    display: inline-block !important; width: 75% !important;
  }
  th.small-9 {
    display: inline-block !important; width: 75% !important;
  }
  td.small-10 {
    display: inline-block !important; width: 83.33333% !important;
  }
  th.small-10 {
    display: inline-block !important; width: 83.33333% !important;
  }
  td.small-11 {
    display: inline-block !important; width: 91.66667% !important;
  }
  th.small-11 {
    display: inline-block !important; width: 91.66667% !important;
  }
  td.small-12 {
    display: inline-block !important; width: 100% !important;
  }
  th.small-12 {
    display: inline-block !important; width: 100% !important;
  }
  .columns td.small-12 {
    display: block !important; width: 100% !important;
  }
  .column td.small-12 {
    display: block !important; width: 100% !important;
  }
  .columns th.small-12 {
    display: block !important; width: 100% !important;
  }
  .column th.small-12 {
    display: block !important; width: 100% !important;
  }
  table.body td.small-offset-1 {
    margin-left: 8.33333% !important;
  }
  table.body th.small-offset-1 {
    margin-left: 8.33333% !important;
  }
  table.body td.small-offset-2 {
    margin-left: 16.66667% !important;
  }
  table.body th.small-offset-2 {
    margin-left: 16.66667% !important;
  }
  table.body td.small-offset-3 {
    margin-left: 25% !important;
  }
  table.body th.small-offset-3 {
    margin-left: 25% !important;
  }
  table.body td.small-offset-4 {
    margin-left: 33.33333% !important;
  }
  table.body th.small-offset-4 {
    margin-left: 33.33333% !important;
  }
  table.body td.small-offset-5 {
    margin-left: 41.66667% !important;
  }
  table.body th.small-offset-5 {
    margin-left: 41.66667% !important;
  }
  table.body td.small-offset-6 {
    margin-left: 50% !important;
  }
  table.body th.small-offset-6 {
    margin-left: 50% !important;
  }
  table.body td.small-offset-7 {
    margin-left: 58.33333% !important;
  }
  table.body th.small-offset-7 {
    margin-left: 58.33333% !important;
  }
  table.body td.small-offset-8 {
    margin-left: 66.66667% !important;
  }
  table.body th.small-offset-8 {
    margin-left: 66.66667% !important;
  }
  table.body td.small-offset-9 {
    margin-left: 75% !important;
  }
  table.body th.small-offset-9 {
    margin-left: 75% !important;
  }
  table.body td.small-offset-10 {
    margin-left: 83.33333% !important;
  }
  table.body th.small-offset-10 {
    margin-left: 83.33333% !important;
  }
  table.body td.small-offset-11 {
    margin-left: 91.66667% !important;
  }
  table.body th.small-offset-11 {
    margin-left: 91.66667% !important;
  }
  table.body table.columns td.expander {
    display: none !important;
  }
  table.body table.columns th.expander {
    display: none !important;
  }
  table.body .right-text-pad {
    padding-left: 10px !important;
  }
  table.body .text-pad-right {
    padding-left: 10px !important;
  }
  table.body .left-text-pad {
    padding-right: 10px !important;
  }
  table.body .text-pad-left {
    padding-right: 10px !important;
  }
  table.menu {
    width: 100% !important;
  }
  table.menu td {
    width: auto !important; display: inline-block !important;
  }
  table.menu th {
    width: auto !important; display: inline-block !important;
  }
  table.menu.vertical td {
    display: block !important;
  }
  table.menu.vertical th {
    display: block !important;
  }
  table.menu.small-vertical td {
    display: block !important;
  }
  table.menu.small-vertical th {
    display: block !important;
  }
  table.menu[align="center"] {
    width: auto !important;
  }
  table.button.small-expand {
    width: 100% !important;
  }
  table.button.small-expanded {
    width: 100% !important;
  }
  table.button.small-expand table {
    width: 100%;
  }
  table.button.small-expanded table {
    width: 100%;
  }
  table.button.small-expand table a {
    text-align: center !important; width: 100% !important; padding-left: 0 !important; padding-right: 0 !important;
  }
  table.button.small-expanded table a {
    text-align: center !important; width: 100% !important; padding-left: 0 !important; padding-right: 0 !important;
  }
  table.button.small-expand center {
    min-width: 0;
  }
  table.button.small-expanded center {
    min-width: 0;
  }
  .show-for-large {
    display: none !important; width: 0; mso-hide: all; overflow: hidden;
  }
  .hide-for-large {
    display: block !important; width: auto !important; overflow: visible !important; max-height: none !important; font-size: inherit !important; line-height: inherit !important;
  }
  .margin-auto-small {
    margin: 0 auto;
  }
}
@media (min-width: 600px) {
  html {
    font-size: 13px;
  }
}
@media (min-width: 800px) {
  html {
    font-size: 14px;
  }
}
@media (min-width: 716px) {
  .w-card-block-text-2 {
    padding: 25px 30px 0;
  }
  .w-card:first-of-type {
    padding-right: 30px !important;
  }
  .w-card:nth-of-type(2) {
    padding-left: 30px !important;
  }
}
@media only screen and (min-width: 716px) {
  .w-purple .wrapper-inner {
    padding-left: 30px !important; padding-right: 30px !important;
  }
}
</style>
<!--[if mso]>
<style type="text/css">
body, table, td {font-family: Arial, Helvetica, sans-serif !important;} a {text-decoration: none;}
</style>
<![endif]-->
<table align="center" class="container" style="border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: inherit; max-width: 600px; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; margin: 0 auto; padding: 0;">
	<tbody style="position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important;">
		<tr align="left" style="vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
			<td align="left" style="word-wrap: break-word; -webkit-hyyphens: none; -moz-hyyphens: none; hyyphens: none; border-collapse: collapse !important; vertical-align: top; text-align: left; color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0; padding: 0;" valign="top"><!-- 
###################################################

      PREHEADER (view online)
      
#################################################    
    -->
			<table align="center" class="wrapper preheader w-no-padding w-no-margin" style="width: 100%; border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; margin: 0; padding: 0;">
				<tbody>
				</tbody>
			</table>
			<!-- 
###################################################

      HEADER 
      
#################################################    
    -->

			<table align="center" class="wrapper header w-outer" style="width: 100%; border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
				<tbody>
					<tr align="left" style="vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
						<td align="left" class="wrapper-inner" style="word-wrap: break-word; -webkit-hyyphens: none; -moz-hyyphens: none; hyyphens: none; border-collapse: collapse !important; vertical-align: top; text-align: left; color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0; padding: 0;" valign="top">
						<table align="center" bgcolor="#fff" class="wrapper header w-mine w-inner w-no-padding w-no-margin w-grey" style="width: 100%; border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; background: #fff; margin: 0; padding: 35px 0 0; border: 0;">
							<tbody>
								<tr align="left" style="vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
									<td align="right" class="wrapper-inner" style="word-wrap: break-word; -webkit-hyyphens: none; -moz-hyyphens: none; hyyphens: none; border-collapse: collapse !important; vertical-align: top; text-align: right; color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0; padding: 20px 0 0;" valign="top"><span style="color:#FFFFFF;"><span style="font-family:arial,helvetica,sans-serif;"><span style="font-size:11px;">Knowing when to start is just as important as when work is due. </span></span></span><a class="text-viewinbrowser" href="#" style="color: #aaa; text-decoration: underline; font-family: Helvetica, Arial, sans-serif !important; font-weight:
normal; text-align: right; line-height: 2; position: relative; box-sizing: border-box; font-size: 11px; padding: 0;">View in browser</a>

									<table class="row" style="border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: left; width: 100%; position: relative; display: table; align-items: center; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
										<tbody style="position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important;">
											<tr align="left" style="vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
											</tr>
										</tbody>
									</table>
									</td>
								</tr>
							</tbody>
						</table>

						<table align="center" bgcolor="#fff" class="wrapper header w-inner w-no-padding w-no-margin w-grey" style="width: 100%; border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; background: #fff; margin: 0; padding: 35px 0 0; border: 0">
							<tbody>
								<tr align="left" style="vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
									<td align="left" class="wrapper-inner" style="word-wrap: break-word; -webkit-hyyphens: none; -moz-hyyphens: none; hyyphens: none; border-collapse: collapse !important; vertical-align: top; text-align: left; color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0; padding: 0;" valign="top">
									<table class="row" style="border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: left; width: 100%; position: relative; display: table; align-items: center; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
										<tbody style="position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important;">
											<tr align="left" style="vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
												<th align="center" class="w-logo text-center small-12 large-12 columns first last" style="width: 684px; text-align: center; color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0 auto; padding: 40px;">
												<table style="border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: left; width: 100%; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
													<tbody>
														<tr align="left" style="vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
															<th align="center" style="color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: center; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0; padding: 0;" class=""><a href="http://connect2.asana.com/e/232142/2017-10-17/hm7k/60601374"><img alt="" border="0" class="img-logo" src="https://luna1.co/f0ff7d.png" style="outline: none; text-decoration: none; max-width: 100%; clear: both; display: inline-block; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; border-width: 0px; border-style: solid;"></a></th>
															<th align="center" class="expander" style="visibility: hidden; width: 0; color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: center; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0; padding: 0;">&nbsp;</th>
														</tr>
													</tbody>
												</table>
												</th>
											</tr>
										</tbody>
									</table>
									</td>
								</tr>
							</tbody>
						</table>
						</td>
					</tr>
				</tbody>
			</table>
			<!-- 
###################################################

      HERO BLOCK 01 
      
#################################################    
    -->

			<table align="center" class="wrapper hero-block-1 w-outer" style="width: 100%; border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
				<tbody>
					<tr align="left" style="vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
						<td align="left" class="wrapper-inner" style="word-wrap: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; border-collapse: collapse !important; vertical-align: top; text-align: left; color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0; padding: 0;" valign="top">
						<table align="center" bgcolor="#fff" class="wrapper hero-block-1 w-inner text-center" style="width: 100%; border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: center; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; background: #fff; padding: 35px 0 0; border: 1px solid #eff0f1;">
							<tbody>
								<tr align="left" style="vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
									<td align="left" class="wrapper-inner" style="word-wrap: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; border-collapse: collapse !important; vertical-align: top; text-align: left; color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0; padding: 35px 0 36px;" valign="top">
									<table class="row" style="border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: left; width: 100%; position: relative; display: table; align-items: center; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
										<tbody style="position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important;">
											<tr align="left" style="vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
												<th align="left" class="w-text-spacing small-12 large-12 columns first last" style="width: 684px; color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: left; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0 auto; padding: 0 33px;" text-center="">
												<table style="border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: left; width: 100%; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
													<tbody>
														<tr align="left" style="vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
															<th align="left" style="color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: left; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0; padding: 0;" class="">
															<h1 align="center" class="hl" style="color: inherit; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: center; line-height: 130%; word-wrap: normal; font-size: 30px; position: relative; box-sizing: border-box; margin: 0; padding: 0;">Avoid the last-minute scramble</h1>

															<p align="center" class="text-regular text-light-grey spacing-xlarge" style="color: #676D76; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: center; line-height: 1.38; font-size: 18px; position: relative; box-sizing: border-box; margin: 0 0 35px; padding: 0;">Start work at the right time, every time.</p>
															</th>
															<th align="left" class="expander" style="visibility: hidden; width: 0; color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: left; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0; padding: 0;">&nbsp;</th>
														</tr>
													</tbody>
												</table>
												</th>
											</tr>
										</tbody>
									</table>

									<table class="row" style="border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: left; width: 100%; position: relative; display: table; align-items: center; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
										<tbody style="position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important;">
											<tr align="left" style="vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
												<td align="center" class=""><a href="http://connect2.asana.com/e/232142/ampaign-StartDates-active-hero/hm7m/60601374"><img align="center" alt="" border="0" class="img-hero-block-1 float-center" src="http://connect2.asana.com/l/232142/2017-09-29/f8rl/232142/809/Start_dates_email_2x_optimized.gif" style="outline: none; text-decoration: none; width: 600px; max-width: 600px; clear: both; display: inline-block; text-align: center; position: relative; box-sizing: border-box; margin: 0px auto; border-width: 0px; border-style: solid; font-family: Helvetica, Arial, sans-serif !important;" width="600"></a></td>
											</tr>
										</tbody>
									</table>
									&nbsp;

									<table class="row" style="border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: left; width: 100%; position: relative; display: table; align-items: center; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
										<tbody style="position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important;">
											<tr align="left" style="vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
												<th align="left" class="w-text-spacing small-12 large-12 columns first last" style="width: 684px; color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: left; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0 auto; padding: 0 33px;">
												<table style="border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: left; width: 100%; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
													<tbody>
														<tr align="left" style="vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
															<th align="left" style="color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: left; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0; padding: 0;" class="">
															<p align="center" class="text-light-grey spacing-xlarge" style="color: #676D76; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: center; line-height: 1.38; font-size: 18px; position: relative; box-sizing: border-box; margin: 0 0 35px; padding: 0;">Timing is everything. With <a href="http://connect2.asana.com/e/232142/ign-StartDates-active-textlink/hm7f/60601374" style="text-decoration:none;"><span style="color:#1aafd0;"><strong>start dates</strong></span></a>, you know when to get started&nbsp;so you can hit deadlines with ease—and get results.<br>
															<br>
															<strong><a href="http://connect2.asana.com/e/232142/m-campaign-startdates-textlink/hm7h/60601374" style="text-decoration:none;color:#1aafd0;">Upgrade to Asana Premium</a>&nbsp;</strong>to add start dates to your tasks.</p>
															</th>
															<th align="left" class="expander" style="visibility: hidden; width: 0; color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: left; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0; padding: 0;">&nbsp;</th>
														</tr>
													</tbody>
												</table>
												</th>
											</tr>
										</tbody>
									</table>

									<table class="row" style="border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: left; width: 100%; position: relative; display: table; align-items: center; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
										<tbody style="position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important;">
											<tr align="left" style="vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
												<th align="left" class="small-12 large-12 columns first last" style="width: 684px; color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: left; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0 auto; padding: 0 16px 16px;">
												<table style="border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: left; width: 100%; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
													<tbody>
														<tr align="left" style="vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
															<th align="left" style="color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: left; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0; padding: 0;" class="">
															<div align="center" class="text-center" style="position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; text-align: center;"><!--[if mso]>
                    <v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="https://blog.asana.com/2017/10/add-start-dates-tasks-projects/?utm_source=asana_email&utm_medium=organic_email&utm_campaign=StartDates_active_button" style="height:48px;v-text-anchor:middle;width:226px;" arcsize="7%" stroke="f" fillcolor="#7968FF">
                      <w:anchorlock></w:anchorlock>
                      <center>
                    <![endif]--><a class="text-center" href="http://connect2.asana.com/e/232142/paign-StartDates-active-button/hm7p/60601374" style="border-radius: 3px; color: #ffffff; display: inline-block; font-size: 18px; font-weight: bold; line-height: 48px; text-align: center; text-decoration: none; width: 226px; -webkit-text-size-adjust: none; font-family: Helvetica, Arial, sans-serif !important; position: relative; box-sizing: border-box; background: #7968FF; padding: 0;">Learn More</a> <!--[if mso]>
                      </center>
                    </v:roundrect>
                  <![endif]--></div>
															</th>
															<th align="left" class="expander" style="visibility: hidden; width: 0; color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: left; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0; padding: 0;">&nbsp;</th>
														</tr>
													</tbody>
												</table>
												</th>
											</tr>
										</tbody>
									</table>
									</td>
								</tr>
							</tbody>
						</table>
						</td>
					</tr>
				</tbody>
			</table>
			&nbsp;

			<table align="center" class="wrapper footer w-outer" style="width: 100%; border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
				<tbody>
					<tr align="left" style="vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
						<td align="left" class="wrapper-inner" style="word-wrap: break-word; -webkit-hyyphens: none; -moz-hyyphens: none; hyyphens: none; border-collapse: collapse !important; vertical-align: top; text-align: left; color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0; padding: 0;" valign="top">
						<table align="center" bgcolor="#fff" border="0" class="wrapper footer w-inner w-grey" style="width: 100%; border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; background: #fff; padding: 35px 0 0; border: 0 hidden #eff0f1;">
							<tbody>
								<tr align="left" style="vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
									<td align="left" class="wrapper-inner" style="word-wrap: break-word; -webkit-hyyphens: none; -moz-hyyphens: none; hyyphens: none; border-collapse: collapse !important; vertical-align: top; text-align: left; color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0; padding: 35px 0 36px;" valign="top">
									<table class="row w-80" style="border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: left; width: 80% !important; position: relative; display: table; align-items: center; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; margin: 0 auto; padding: 0;">
										<tbody style="position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important;">
											<tr align="left" style="vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
												<th align="left" class="small-12 large-12 columns first last" style="width: 684px; color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: left; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0 auto; padding: 0 16px 16px;">
												<table style="border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: left; width: 100%; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
													<tbody>
														<tr align="left" style="vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
															<th align="left" style="color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: left; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0; padding: 0;" class="">
															<p align="center" class="text-footer spacing-large" style="color: #A1A4AA; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: center; line-height: 16px; font-size: 11px; position: relative; box-sizing: border-box; margin: 0 0 20px; padding: 0;">You are signed up for this email as <a href="#" style="color:#1aafd0;">hello@SmilesDavis.yeah</a>. <a href="#" style="text-decoration:underline;color: #1aafd0;">Manage email preferences</a>.</p>

															<p align="center" class="text-footer spacing-large" style="color: #A1A4AA; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: center; line-height: 16px; font-size: 11px; position: relative; box-sizing: border-box; margin: 0 0 20px; padding: 0;">1550 Bryant Street, San Francisco, CA 94103</p>
															</th>
															<th align="left" class="expander" style="visibility: hidden; width: 0; color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: left; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0; padding: 0;">&nbsp;</th>
														</tr>
													</tbody>
												</table>
												</th>
											</tr>
										</tbody>
									</table>

									<table class="row" style="border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: left; width: 100%; position: relative; display: table; align-items: center; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
										<tbody style="position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important;">
											<tr align="left" style="vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
												<th align="left" class="small-4 large-4 columns first" style="width: 217.33333px; color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: left; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0 auto; padding: 0 8px 16px 16px;">
												<table style="border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: left; width: 100%; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
													<tbody>
														<tr align="left" style="vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
															<th align="left" style="color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: left; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0; padding: 0;" class="">&nbsp;</th>
														</tr>
													</tbody>
												</table>
												</th>
												<th align="left" class="center-img small-2 large-2 columns" style="width: 100.66667px; color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: left; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0 auto; padding: 0 8px 16px;">
												<table style="border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: left; width: 100%; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
													<tbody>
														<tr align="left" style="vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
															<th align="center" style="color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: center; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0; padding: 0;" class=""><a href="http://connect2.asana.com/e/232142/sharer-sharer-php-u-asana-com/hm7r/60601374" style="color: #2199e8; text-decoration: none; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: left; line-height: 130%; position: relative; box-sizing: border-box; padding: 0; margin: 0px auto;"><img align="none" alt="" border="0" class="img-footer float-center" src="https://luna1.co/e6a544.png" style="outline: none; text-decoration: none; clear: both; display: inline-block; text-align: center; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important;
border-width: 0px; border-style: solid;"></a></th>
														</tr>
													</tbody>
												</table>
												</th>
												<th align="left" class="center-img small-2 large-2 columns" style="width: 100.66667px; color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: left; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0 auto; padding: 0 8px 16px;">
												<table style="border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: left; width: 100%; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
													<tbody>
														<tr align="left" style="vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
															<th align="center" style="color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: center; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0; padding: 0;" class=""><a href="http://connect2.asana.com/e/232142/ve20work20forward20with20Asana/hm7t/60601374" style="  font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: left; line-height: 130%; position: relative; box-sizing: border-box; padding: 0;color: #2199e8;"><img align="none" alt="" border="0" class="img-footer float-center" src="https://luna1.co/58de78.png" style="outline: none; text-decoration: none; clear: both; display: inline-block; text-align: center; position: relative; box-sizing: border-box; margin: 0px auto; font-family: Helvetica, Arial, sans-serif !important; border-width: 0px; border-style:
solid;"></a><a style="color: #2199e8; text-decoration: none; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: left; line-height: 130%; position: relative; box-sizing: border-box; padding: 0;"> </a></th>
														</tr>
													</tbody>
												</table>
												</th>
												<th align="left" class="small-4 large-4 columns last" style="width: 217.33333px; color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: left; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0 auto; padding: 0 16px 16px 8px;">
												<table style="border-spacing: 0; border-collapse: collapse; vertical-align: top; text-align: left; width: 100%; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
													<tbody>
														<tr align="left" style="vertical-align: top; text-align: left; position: relative; box-sizing: border-box; font-family: Helvetica, Arial, sans-serif !important; padding: 0;">
															<th align="left" style="color: #0a0a0a; font-family: Helvetica, Arial, sans-serif !important; font-weight: normal; text-align: left; line-height: 130%; font-size: 16px; position: relative; box-sizing: border-box; margin: 0; padding: 0;" class="">&nbsp;</th>
														</tr>
													</tbody>
												</table>
												</th>
											</tr>
										</tbody>
									</table>
									</td>
								</tr>
							</tbody>
						</table>
						</td>
					</tr>
				</tbody>
			</table>
			</td>
		</tr>
	</tbody>
</table>
</body>
</html>		

            
          
!
999px
Loading ..................

Console