123

Pen Settings

CSS Base

Vendor Prefixing

Add External Stylesheets/Pens

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

+ add another resource

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

Add External Scripts/Pens

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

+ add another resource

Use npm Packages

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

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

Code Indentation

     

Save Automatically?

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

Auto-Updating Preview

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

HTML Settings

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

            
              <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><!-- start coded_template: id:5433084235 path:Custom/email/df_templates/df_template.html --><html xmlns="http://www.w3.org/1999/xhtml"><head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
		<meta name="format-detection" content="telephone=no"> 
		<meta name="viewport" content="width=device-width; initial-scale=1.0; maximum-scale=1.0; user-scalable=no;">
		<meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7; IE=EDGE">
        <title>And we're live in 3, 2, 1...⏱️</title>
        
        
        
        
        
            
        
        
        <!-- start coded_template: id:5639637729 path:Custom/page/df_templates/df_css_shared.html -->
<style type="text/css">
	
		/* import method for outlook */
		@font-face {
			font-family:'Whitney';
			font-style:normal;
			font-weight:normal;
			src:local('Whitney'), url(https://cdn2.hubspot.net/hubfs/120237/assets/webfonts/Whitney-Medium-Pro.woff?t=1542047804244) format('woff');
		}
		@font-face {
			font-family:'Whitney';
			font-style:normal;
			font-weight:600;
			src:local('Whitney-Semi600'), url(https://cdn2.hubspot.net/hubfs/120237/assets/webfonts/Whitney-Semi600-Pro.woff?t=1542047804244) format('woff');
		}
</style>
<style type="text/css" id="hs-inline-css">
    
		/* Obligatory CSS resets */
        #outlook a{ padding:0; }
		.ReadMsgBody{ width:100%; }
		.ExternalClass * { line-height:125%!important } 
		.ExternalClass, .ExternalClass p, .ExternalClass span, .ExternalClass font, .ExternalClass td, .ExternalClass div { line-height:125%!important; }
		body,table,td,p,a,li,blockquote{ -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; }
		table,td{ mso-table-lspace:0pt; mso-table-rspace:0pt; }
		body{ margin:0; padding:0; }
		img{ -ms-interpolation-mode:bicubic; border:0; height:auto; line-height:100%; outline:none; text-decoration:none; }
		table{ border-collapse:collapse !important; }
		body, #backgroundTable, #bodyCell{ height:100% !important; width:100% !important; margin:0; padding:0; }
		a:link,a:visited{ text-decoration:none; border-bottom:none; }
		.appleFooter a { color:#999999 !important; text-decoration:none !important; }
    	.appleLink a { color:#ffffff !important; text-decoration:none !important; }
		
		/* Non-obligatory stuff */
		#bodyCell{
			padding:75px 20px 20px;
		}
		#bl #bodyCell {
		    padding: 20px 20px 0;
		}
		body, #backgroundTable {
			background-color:#FFFAF4;
			font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif;
		}
		#bl #backgroundTable {
		    background-color:#ffffff;
		}
		table td{
			font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif;
		}
		table th { 
			margin:0 !important; 
			vertical-align:middle; 
			font-weight:normal; 
		}
		#templateContainer{
			width:600px;
			background-color:#ffffff;
		}
		#templateBody{
			background-color:#ffffff;
		}
		.templateContent{
			color:#444444;
			font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif;
			font-size:16px;
			line-height:20px;
			border-bottom:2px solid #FAA928;
			padding:10px 100px 30px 100px; /* changed 07/26/18 AG */
		}
		.templateContent a:link,.templateContent a:visited,.templateContent a .yshortcuts{
			color:#FAA928;
			text-decoration:none;
			border-bottom:none;
		}
		/* Sectioned Template Type, otherwise 115px */
		.templateContent.sections {
			padding-right:70px;
			padding-left:70px;
		}
		/* Blogletter Template Type */
        #bl .templateContent {
            border-bottom: none;
            padding: 20px 50px 0;
        }
		
		/* font family to all the things */
		body, table, td, p, a, a span, strong {
			font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif;
			text-decoration:none;
			border-bottom:none;
		}
		a {
			color:#FAA928;
		}
		p{
			color:#444444;
			margin:0;
			padding:0;
			line-height:24px;
			mso-line-height-rule:exactly;
		}
		p + p {
			margin-top:20px;
		}
		p a {
			color:#FAA928;
			font-weight:normal;
		}
		strong {
			font-weight:600;
			letter-spacing:.25px;
		}
		span.preheader {
			display:none !important;
		}
		#templatetagline{
			background-color:#ffffff;
		}
		.tagline{
			border-top:2px solid #FAA928;
			padding-top:30px;
		}
		#bl .tagline {
		    border-top:none;
		    padding-top:15px;
		}
		.taglineContent{
			color:#FAA928;
			font-size:11px;
			line-height:16px;
			font-weight:600;
			letter-spacing:.2px;
		}
		.taglineContent a, .taglineContent a:link,.taglineContent a:visited,.taglineContent a .yshortcuts{
			color:#FAA928;
			text-decoration:none;
			border-bottom:none;
		}
		.logo {
			padding-top:20px;
			padding-bottom:20px;
		}
		.footerLogo {
			padding-top:35px;
			padding-bottom:20px;	
		}
		.headerContent {
			color:#FAA928;	
			font-size:32px;
			line-height:43px;
			padding:0 20px 20px 20px;
			font-weight:300;
		}
		#bl .headerContent {
		    color:#161D25;	
		    font-size:20px;
		    line-height:28px;
		    font-weight:600;
		    padding-top:30px;
		}
		.subheaderContent {
			color:#5B6B7F;
			font-size:15px;
			line-height:24px;
			padding:0 20px 40px 20px;
		}
		.subheaderContent a{
			color:#FAA928 !important;
			text-decoration:none !important;
			border-bottom:none !important;
		}
		.ctaContent{
			padding-top:35px;
			padding-bottom:25px;
		}
		#bl .ctaContent {
		    padding-top:25px;
		}
		.footer {
			border-top:1px solid #efefef;
			padding-right:20px;
			padding-left:20px;
		}
		#bl .footer {
		    padding:30px 20px 30px;
		}
		#footerSettings{
			background-color:#FFFAF4;
		}
		#bl #footerSettings {
		    background-color:#F9F9F9;
		}
		.footerContent, .footerSettingsContent {
			color:#9ca8b7;
			font-size:12px;
			line-height:18px;
			text-align:center;
		}
		.footerSettingsContent a:link,.footerSettingsContent a:visited,.footerSettingsContent a .yshortcuts{
			color:#FAA928;
			text-decoration:none;
		}
		#bl .footerSettingsContent a:link,#bl .footerSettingsContent a:visited,#bl .footerSettingsContent a .yshortcuts{
			color:;
			text-decoration:underline;
		}
		.footer a.socialMediaIcon {
		    padding-right:5px;
		}
		/* Call Out Banner styles */
		#calloutBanner {
		   	background-color:#FAA928;
		}
		.templateContent.callout {
			padding-right:70px;
			padding-left:70px;
			border-bottom:2px solid #F98700;
		}
		.calloutHeader, .calloutHeader a {
			color:#ffffff;
			font-size:18px;
			line-height:26px;
			font-weight:600;
			text-transform:uppercase;
			letter-spacing:1px;
		}
		.calloutContent, .calloutContent p {
		    color:#ffffff;
		}
		/* Letter styles */
		.letterContent {
			color:#FAA928;
			font-size:16px;
			line-height:24px;
			padding-top:30px;
		}
		/* Letter styles if no template image */
		.letterContent.no-image {
			padding-top:0px;
		}
		/* Section 123 styles */
		.sectionsWrapper {
			margin-bottom:20px;
		}
		.sectionHeader, .sectionHeader a {
			color:#FAA928;
			font-size:12px;
			line-height:20px;
			font-weight:600;
			text-transform:uppercase;
			letter-spacing:1px;
		}
		.sectionContent {
			color:#5B6B7F;
			font-size:13px;
			line-height:19px;
			font-weight:normal;
			padding:10px 0 5px 0;
		}
		.sectionContent a {
			color:#FAA928;
		}
		.section1 {
			background-color:#FEF6E9;
		}	
		.section2 {
			background-color:#FEEED4;
		}
		.section3 {
			background-color:#FDE5BE;
		}
		.section4 {
			background-color:#FDDDA9;
		}
		.sectionImage {
			padding:35px 0px 30px;
		}
		.sectionBody {
			padding:35px 0 30px 30px;
		}
        /* Indented section contents */
        
		.paddedContent {
		    padding:0 25px;
		    border-top:1px solid #efefef;
		}
		.paddingBottom {
		    padding-bottom: 30px;
		}
		/* Blog post styles */
		.blogpostContent, .featuredPostContent {
            color:;
    	    font-size:14px;
    		line-height:20px;
    		padding-top:30px;
		}
		.blogTopic, .blogAuthor, .blogletterTitle, .featuredPostHeader, .featuredPostHeader a  {
		    font-size:16px;
    		line-height:22px;
		    font-weight:600;
		}
		.blogAuthor {
		    color:;
		}
		.blogletterTitle,.featuredPostHeader, .featuredPostHeader a {
		    color:;
		}
		.blogletterTitle {
		    padding:30px 0 20px;
		}
		.blogletterDescription {
		    padding:0 0 20px;
		    color:;
		}
		
		/* Featured Post Styles */
		.featuredPostsWrapper {
			margin-bottom:20px;
		}
		.featuredPostContent {
			padding:10px 0 5px 0;
		}
		.featuredPostContent p {
    	    color:;
    		font-size:13px;
    		line-height:20px;
    		font-weight:normal;
		}
		.featuredPostContent p + p {
		    margin-top:10px;
		}
		.featuredPostContent a {
			color:#FAA928;
		}
		a.featuredPostReadMore {
		    font-weight:600;
		}
		.featuredPostImage {
			padding:0 0 40px;
		}
		.featuredPostBody {
			padding:0 0 40px 25px;
		}
		
		/* Editors post styles */
		.rectangleBorder {
		    border-collapse:separate;
		    border:1px solid #efefef;
            -moz-border-radius:4px;
		    border-radius:4px;
		    padding:0 25px;
		}
		.editorsPost {
		    border-bottom:1px solid #efefef;
		    padding:25px 0 20px;
		}
		.editorsPostHeader, .editorsPostReadMoreLink {
		    color:;
    	    font-size:14px;
    		line-height:21px;
    		font-weight:600;
		}
	    a.editorsPostReadMoreLink {
		    color:#FAA928;
        }
        .editorsPostSource {
            color:;
            font-size:12px;
            text-transform:uppercase;
            padding-top:5px;
        }
        .editorsPostSource a:-webkit-any-link {
            color:inherit !important;
        }
        
        /* Editor Bios */
        .editor {
            padding-bottom:20px;
        }
        .editorBio {
            color:;
            font-size:14px;
            line-height:21px;
            padding:5px 0 25px;
        }
        .editorImage {
            padding-right:20px;
        }
        .editorContent {
            font-size:12px;
            line-height:16px;
        }
        .editorTitle {
            color:;
        }
        
        /* Modifiers */
        .no-border {
            border-top: none;
            border-bottom:none;
        }
</style>
<style type="text/css">
@media screen and (min-width:600px){
		.desktop-hide {
			display:none !important;
		}
}
@media screen and (max-width:650px){
		#backgroundTable {
			width:100% !important;
			min-width:100% !important;
		}
		#templateContainer {
			max-width:600px !important;
			width:100% !important;
			min-width:100% !important;
		}		
}	@media only screen and (max-width:520px){
		body,table,td,p,a,li,blockquote{
			-webkit-text-size-adjust:none !important;
		}
		body {
			width:100% !important;
			min-width:100% !important;
		}
		#bodyCell {
			padding:0 !important;
		}
		.tagline {
			border-top:0 !important;
			padding-top:20px !important;
		}
		.templateContent {
			padding-left:20px !important;
			padding-right:20px !important;
		}
		.headerContent {
			font-size:28px !important;
			line-height:38px !important;
		}
		#bl .headerContent {
		    font-size:18px !important;	
		    line-height:24px !important;
		    padding-top:10px !important;
		}
		.subheaderContent {
			padding-bottom:25px !important;
		}
		.sectionHeader, .sectionContent {
			text-align:center !important;
		}
		.letterContent {
			padding-left:0 !important;
			padding-right:0 !important;
		}
		.calloutHeader {
		    padding-top:30px !important;
		}
		.ctaContent.callout {
		    padding-bottom:10px !important;
		}
		.footerContent, .footerSettingsContent {
			font-size:12px !important;
		}
		a.mobile-button {
			font-size:14px !important;
		}
		.mob-column{
			float:none !important;
			display:block !important;
			width:100% !important;
		}  
		.featuredPostImage img, .blogpostImage img {
		    width:100% !important;
		    max-height:100% !important;
		}
		.mob-hide{
			display:none !important;
		}
		.mob-center {
		    text-align:center!important;
		}
		.paddedContent {
		    padding: 0 !important;
		}
		.paddedContent.mob-no-border {
		    border-top: none!important;
		}
		.paddedContent.paddingBottom {
		    padding-bottom: 30px !important;
		}
		td.templateContent.sections, .sectionImage, .sectionBody, .featuredPostBody, .featuredPostImage {
			padding-left:0 !important;
			padding-right:0 !important;
		}
		.sectionImage {
			padding-top:30px !important;
			padding-bottom:0 !important;
		}	
		.sectionBody {
		    padding-top:15px !important;
		}
		.featuredPostBody {
		    padding-bottom:30px !important;
		}
		.featuredPostImage {
		    padding-bottom:20px !important;
		}
		.featuredPostContent {
		    padding-top: 5px !important;
		}
		.editorsPostContent {
		    width:90% !important;   
		}
		.editorsPostReadMore {
		    width:10% !important;
		}
		.blogTopic, .blogAuthor, .blogletterTitle, .featuredPostHeader, .featuredPostHeader a  {
		    font-size:14px !important;
    		line-height:20px !important;
		}
		.paddingBottom {
		    padding-bottom: 30px !important;
		}
} @media only screen and (max-width:440px){
		p.smallText {
			font-size:13px !important;
		}
}
</style>
<!--[if mso]>
	<style type="text/css">
		body, table, td, p, a, a span, strong {font-family:Helvetica, Arial, sans-serif !important;}
	</style>
<![endif]--><!-- end coded_template: id:5639637729 path:Custom/page/df_templates/df_css_shared.html -->
        
    <meta name="generator" content="HubSpot"><meta property="og:url" content="https://content.wistia.com/-temporary-slug-bf6562cf-73b6-4316-9bae-8b7a3d386cce"><meta name="x-apple-disable-message-reformatting"><meta name="robots" content="noindex,follow"></head> 
    <body leftmargin="0" marginwidth="0" topmargin="0" marginheight="0" offset="0" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; height:100% !important; width:100% !important; margin:0; padding:0; background-color:#fffaf4; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; text-decoration:none; border-bottom:none" height="100%" width="100%" bgcolor="#fffaf4">
		<span class="preheader" style="display:none !important">Does the thought of going live give you the heebie-jeebies? Don't worry! We'll help you get started.</span>
		<!-- Begin backgroundTable -->		
		<table align="center" bgcolor="#fffaf4" border="0" cellpadding="0" cellspacing="0" height="100%" width="100%" id="backgroundTable" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; border-collapse:collapse !important; text-decoration:none; border-bottom:none; height:100% !important; width:100% !important; margin:0; padding:0; background-color:#fffaf4; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif">
			<tbody><tr>
				<td align="center" valign="top" id="bodyCell" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; text-decoration:none; border-bottom:none; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; height:100% !important; width:100% !important; margin:0; padding:75px 20px 20px" height="100%" width="100%">
					<!-- Begin Template Container -->
					<table width="600" border="0" cellpadding="0" cellspacing="0" id="templateContainer" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; border-collapse:collapse !important; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; text-decoration:none; border-bottom:none; width:600px; background-color:#ffffff" bgcolor="#ffffff">
						<tbody><tr>
							<td align="center" valign="top" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; text-decoration:none; border-bottom:none; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif">	
								<!-- Begin Template Wrapper -->
								<table border="0" cellpadding="0" cellspacing="0" width="100%" id="templateWrapper" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; border-collapse:collapse !important; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; text-decoration:none; border-bottom:none">						
									<!-- Begin Tagline Header -->
									    <tbody><tr>
	<td align="center" valign="top" class="tagline" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; text-decoration:none; border-bottom:none; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; border-top:2px solid #faa928; padding-top:30px">
		<table border="0" cellpadding="0" cellspacing="0" width="80%" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; border-collapse:collapse !important; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; text-decoration:none; border-bottom:none">
			<tbody><tr>	
				<td align="center" valign="middle" class="mob-hide" width="30%" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; text-decoration:none; border-bottom:none; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif">
					&nbsp;
				</td>
				<td align="center" valign="middle" class="logo" width="40%" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; text-decoration:none; border-bottom:none; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; padding-top:20px; padding-bottom:20px">
					<a href="https://content.wistia.com/e2t/c/*W7CDT4H1ftp89W7Drc1s6MzkPF0/*VW14_P8sWvdCW93NW--6M_3hW0/5/f18dQhb0Sjv98YXM9FW8HrQ1B5D47MtW243RZm7v4vjJW7wVngj2gLgqWW5q9cPw8yym7NN5yMyHcRB1xYW8y_DL18Bpf2TW8mp2bw8p-Vr0W65kbh08pChcSW1PNhtv8sZ4WSW67b7w67hYCG4W3N1Lh352SLKTW64jzh47-JXPKW5B1dDk3bPyFLW3BscbL7XPXrYW2qzW4w22WLyBW6HBHnD6qG734W22dNbh756bz6W6PwX7X6_7GlFW1jB0R_1fzTTWW1rhxT11Mhg55W2d1vXy80qmj1W7v39YS7jd6msW6gX4wP6FRynwW1klpFX1kt2yJW7H3rxq1T-X8_W1nm-CQ1zBHZPW6X9LZ66dJcVPW1jJ22G778wLqW7Wtm8k85FlhsW7VN2dc71jB2xW7BBpwZ1mrlHtV4ZGsB5dgPrHMrPpMvrJh2DW1Jtz4D50CjRlVYF4RD5DHBT9W5DHR3351RZ5RW7lmMCH30Hpx6W11yKhn5DghHFN5-Gnr6cclBmW2bNsnB7yb5sJW5CsZ_p9lrwvjW5V9WFR3f5_rbW8X7H1733MjNb0" target="_blank" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; text-decoration:none; border-bottom:none; color:#faa928" data-hs-link-id="0"><img src="https://cdn2.hubspot.net/hub/120237/hubfs/assets/images/email/orangeflag@2x.png?noresize&amp;t=1542047804244&amp;width=20&amp;height=15&amp;name=orangeflag@2x.png" alt="Wistia Video Hosting" align="center" width="20" height="auto" style="-ms-interpolation-mode:bicubic; border:0; height:auto; line-height:100%; outline:none; text-decoration:none; max-width:20px; max-height:15px; text-align:center; vertical-align:middle"></a>
				</td>
				<td align="right" valign="middle" class="mob-hide" width="30%" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; text-decoration:none; border-bottom:none; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif">
				     
                    	<a href="https://content.wistia.com/e2t/c/*W7CDT4H1ftp89W7Drc1s6MzkPF0/*W8VdcL57BLLFHW4gsh-S785FD80/5/f18dQhb0SbTH8YXNdxW8HrQ1B5D47MtW243RZm7v4vjJW7wVngj4C_R96W5q9cPw8yyv7RW1pgFH75yKtlsW5sPjVy3GCRYtW8tzLyD5y5jh-W1rfXlz1kRpb7W7YD3Zz66Rvy4N7Ykg3JQJJn6W3Lqnm_8q5FTlW67Tp-x8m7Y9zN5wM1SsnK8dsW5L1yJ85Fxwr5W6CHJ8d7v67dtW2hBQwB1MqhJKW7ldyjx608vBRW776qxc6TtcxqW22XQ4876pstKW78gBHw1Cy6w9W7qgqP47J-Gc7W1wh_4H1gPV_hW1CmQJc1Dc6ZYW1RYCd420Rln8W1V_BTC1CtGcJW2dDzlk773GYDW23Mwkd7HF1qbW7lYq2W1TkgS5W2bMGG67rTSQzW82mZPy673GW4W7w_tF56qY9Y_W6vm6bw5nXlThVZ4s5k9hRBMlVrX3l16Vzw8CW31d16S1mZ1PkN251NT9wY-13W5C9cHN2lJNvcV42cYP3nNLHwW41x8j34sprSpW31ZlHq4mwRkZN6cj7F7gV50hW3v3bNl5_5dj9w3xWwfqbymf4lJMFy02" target="_blank" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; text-decoration:none; border-bottom:none; color:#faa928" data-hs-link-id="0">
                    	    
                    	        <img src="https://cdn2.hubspot.net/hub/120237/hubfs/assets/images/email/user-orange@2x.png?noresize&amp;t=1542047804244&amp;width=8&amp;height=9&amp;name=user-orange@2x.png" alt="" align="center" width="8" height="auto" style="-ms-interpolation-mode:bicubic; border:0; height:auto; line-height:100%; outline:none; text-decoration:none; max-width:8px; max-height:9px; text-align:center; vertical-align:middle">
    				        
    					    &nbsp;
    					    <strong style="font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; text-decoration:none; border-bottom:none; font-weight:600; letter-spacing:0.25px"><span style="font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; text-decoration:none; border-bottom:none; font-size:11px; line-height:16px; font-weight:600; letter-spacing:0.2px; color:#FAA928" class="taglineContent">My account</span></strong>
                        </a>
                     
				</td>
			</tr>
		</tbody></table>
	</td>
</tr>
									<!-- End Tagline Header -->
									<!-- Begin Main Body -->
									<tr>									
                                    
                                        <td align="center" valign="top" class="templateContent" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; text-decoration:none; color:#444444; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; font-size:16px; line-height:20px; border-bottom:2px solid #faa928; padding:10px 100px 30px 100px">
                                          
                                    		 
	
 
		<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 !important; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; text-decoration:none; border-bottom:none">
			<!-- Template Header -->
			<tbody><tr>
				<td align="center" valign="middle" class="headerContent" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; text-decoration:none; border-bottom:none; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; color:#faa928; font-size:32px; line-height:43px; padding:0 20px 20px 20px; font-weight:300">
					Set yourself up for livestreaming success!
				</td>
			</tr>
			<!-- End Template Header -->
                                    		
												
<!-- Template Image -->
<tr>
	<td align="left" valign="top" class="" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; text-decoration:none; border-bottom:none; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif">
		<a href="https://content.wistia.com/e2t/c/*W7CDT4H1ftp89W7Drc1s6MzkPF0/*W68268v4s4RqSW3gdYmM9fqGmd0/5/f18dQhb0S65P2dYTssMWnCwcL-mj6MLwTWXDXXh0W1jqWv47SXNpZW36xV6v1mKSW7W8m7ZVc1RBQlfW9ff_V81g8nxYW1kjbHV45VXzkW2y0XvD4585TJW82b2PZ72l8hZW9fPXjz229LMSW8WWYns709__bW1nb1Hv4T6bBSVcCm1L2HT1FTV8qXY61m3b5kN5sjsfyWpW2KVRdP2d2wgmmgW3xqtPD31YX_yW6hNm9v7k5snCW3DTvk75j8m6XW25bJxH8yMCVHW1gmYZn121VplVmCzsp6j3BsmVLCnt92-xCwVW37HPcr3p0fy6W14N3Vz2bSr4_W3kNHzv8BcVhfW4xhQDc6l1hKpW6CjXMy7pQbxbW7pg0R67ZSKJfW5FcZ1M1zX_xxW2Br_yC5Dxp1LW1sQ74n1zDQ7xW326x603k-lhvW7rcdVQ7qbDP7W7_3Zn56H0XMqW124qCd48j0q9W8W-xPP7sHyVSW6vrKYL4mQW-2W3bG2r47Bmq2rW3F3kP35Gcv5bN7vBSYc817z8W6yNlGF59njv4W8NkTty3z7zrPW3xKPxD97fLNnN8hMwPdMrt0jW4y58vq95TyjvW6pNMHz644s-kW3yJ9VZ70bldWf2Jc-Yd03" target="_blank" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; border-bottom:none; color:#222222; text-decoration:none" data-hs-link-id="0">
            <img src="https://cdn2.hubspot.net/hub/120237/hubfs/Goforit.jpg?noresize&amp;t=1542047804244&amp;width=400&amp;height=275&amp;name=Goforit.jpg" width="400" height="auto" alt="livestream" style="height:auto; line-height:100%; outline:none; text-decoration:none; -ms-interpolation-mode:bicubic; width:400px; max-width:100%; max-height:275px; clear:both; display:block; border:none" align="center">
		</a>
	</td>
</tr>	
<!-- End Template Image -->	
<!-- Template text -->
<tr>
	<td align="left" valign="top" class="letterContent" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; text-decoration:none; border-bottom:none; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; color:#faa928; font-size:16px; line-height:24px; padding-top:30px">
		<p style="margin-bottom: 1em; -webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; text-decoration:none; border-bottom:none; color:#444444; margin:0; padding:0; line-height:24px; mso-line-height-rule:exactly"> From getting your tech in order to repurposing your content, these tips will make going live a breeze.
</p>
	</td>
</tr>
<!-- End template text -->
																							
									
									
<!-- -- if callout ---->
									 
	
<!-- CTA Content -->
<tr>
	<td align="center" valign="top" class="ctaContent" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; text-decoration:none; border-bottom:none; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; padding-top:35px; padding-bottom:25px">
		<table width="100%" border="0" cellspacing="0" cellpadding="0" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; border-collapse:collapse !important; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; text-decoration:none; border-bottom:none">
			<tbody><tr>
			    
				<td align="center" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; text-decoration:none; border-bottom:none; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; padding:5px 0 10px 0">
					<table border="0" cellspacing="0" cellpadding="0" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; border-collapse:collapse !important; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; text-decoration:none; border-bottom:none">
						<tbody><tr>	
							<td align="center" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; text-decoration:none; border-bottom:none; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif">
                
								<div>
								<font face="'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif;">
								<!--[if mso]>
								  <v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" href="https://wistia.com/learn/marketing/how-to-set-yourself-up-for-livestreaming-success" style="height:35px;v-text-anchor:middle;width:120px;" arcsize="10%" strokecolor="#FAA928" fillcolor="#FAA928">
									<w:anchorlock/>
									<center style="color:#ffffff;font-family:Helvetica, Arial, sans-serif;font-size:14px;font-weight:normal;">Read the guide</center>
								  </v:roundrect>
								<![endif]--><a href="https://content.wistia.com/e2t/c/*W7CDT4H1ftp89W7Drc1s6MzkPF0/*W7ZLJvF85Vr_kVhlNv09jyTk50/5/f18dQhb0S65P2dYTssMWnvVQL-mj6N2F6h4yDXP_SW5HwmLb3X-4_8N1yzJm0mqQ0PW6NRZGW7ttFL_W4DD8HG4_C1xzW50nBLk3nLKSlW2_w-h23mzvJ1W6KBsR98PpTWcW6_w3ds8rffbsW9cRbqS37l-DxN1p6Fg8D0ZHzV2YfR37rrXQmW5T0KYS7ZHDljN3HnhgbfBv8FW7xhqTx514hGdW1CX6Qn6g1YpyW35VKzP25Z5hdW5724gH8S6kF1W8rTSrF77hb4hW7bC5pl7rTPngW8fNS_B1ZNwHdW1gS2JG52Dm5lN7-DpXrhtLmLW8H2W6V7v4BX7W204Bzt96H1L4W2hKSRL1LVqvBW59v1Jv3JWCpdW2xD9dG5L0VByW7xDBJW1B95tXW3jWXLQ8yn3XdW6hcMdW1Fzwr4W3mflcK6GkQ4dW5vj4Kq5N6ftnW6K8qrb3W-c0tW3R2_cT8_dh_NW8Qsts27qldX_W6vzpdX8WZRt-W2D4jmx7BdPLDW3F3kP16RmdfNN7zlcBG56FScW6Sw_-j4V5j4jN44Q6G1DQ6nRW2271xx9dbkk_W8SqfQx2Bl1tpW18ggBR4Df9YhW39WCBJ5pyPG6W22SLzv1KZJmYf4g3tBb03" style="-ms-text-size-adjust:100%; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; border-bottom:none; background-color:#FAA928; border:1px solid #FAA928; border-radius:4px; color:#ffffff; display:inline-block; font-size:14px; font-weight:normal; line-height:35px; text-align:center; text-decoration:none; width:120px; -webkit-text-size-adjust:none; mso-hide:all" class="mobile-button" bgcolor="#FAA928" align="center" width="120" data-hs-link-id="1" target="_blank">Read the guide</a>
								</font>
								</div>
							</td>
							
						</tr>
					</tbody></table>
				</td>
			</tr>
		</tbody></table>
	</td>
</tr>
<!-- End CTA Content -->
                                    <!-- Footer Content -->
												<tr>
													<td align="center" valign="top" class="footer" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; text-decoration:none; border-bottom:none; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; border-top:1px solid #efefef; padding-right:20px; padding-left:20px">
														<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 !important; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; text-decoration:none; border-bottom:none">
															<tbody><tr>
																<td align="center" valign="middle" class="footerLogo" width="100%" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; text-decoration:none; border-bottom:none; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; padding-top:35px; padding-bottom:20px">
																	<a href="https://content.wistia.com/e2t/c/*W7CDT4H1ftp89W7Drc1s6MzkPF0/*W5BY-V-23SjR6W5RxsHb1RFd3G0/5/f18dQhb0Sjv98YXM9FW8HrQ1B5D47MtW243RZm7v4vjJW7wVngj2gLgqWW5q9cPw8yym7NN5yMyHcRB1xYW8y_DL18Bpf2TW8mp2bw8p-Vr0W65kbh08pChcSW1PNhtv8sZ4WSW67b7w67hYCG4W3N1Lh352SLKTW64jzh47-JXPKW5B1dDk3bPyFLW3BscbL7XPXrYW2qzW4w22WLyBW6HBHnD6qG734W22dNbh756bz6W6PwX7X6_7GlFW1jB0R_1fzTTWW1rhxT11Mhg55W2d1vXy80qmj1W7v39YS7jd6msW6gX4wP6FRynwW1klpFX1kt2yJW7H3rxq1T-X8_W1nm-CQ1zBHZPW6X9LZ66dJcVPW1jJ22G778wLqW7Wtm8k85FlhsW7VN2dc71jB2xW7BBpwZ1mrlHtV4ZGsB5dgPrHMrPpMvrJh2DW1Jtz4D50CjRlVYF4RD5DHBT9W5DHR3351RZ5RW7lmMCH30Hpx6W11yKhn5DghHFN5-Gnr6cclBmW2bNsnB7yb5sJW5CsZ_p9lrwvjW5V9WFR3f5_rbW8X7H1733MjNb0" target="_blank" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; text-decoration:none; border-bottom:none; color:#faa928" data-hs-link-id="0"><img src="https://cdn2.hubspot.net/hub/120237/hubfs/assets/images/email/orangelogo@2x.png?noresize&amp;t=1542047804244&amp;width=110&amp;height=18&amp;name=orangelogo@2x.png" alt="Wistia Video Hosting" align="center" width="110" height="auto" style="-ms-interpolation-mode:bicubic; border:0; height:auto; line-height:100%; outline:none; text-decoration:none; max-width:110px; max-height:18px; text-align:center; vertical-align:middle"></a>
																</td>
															</tr>
															<tr>
																<td align="center" valign="top" class="footerContent" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; text-decoration:none; border-bottom:none; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; color:#9ca8b7; font-size:12px; line-height:18px; text-align:center">
																	<strong style="font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; text-decoration:none; border-bottom:none; font-weight:600; letter-spacing:0.25px">Sent with love from Wistia HQ</strong>
																	<br>
																	<a href="#" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; text-decoration:none; border-bottom:none; color:#9CA8B7; font-weight:normal; cursor:text" data-hs-link-id="0" target="_blank">17 Tudor St, Cambridge, MA 02139</a>
																	<br>
																	<br>
																</td>
															</tr>
														</tbody></table>
													</td>
												</tr>
												<!-- End Footer Content -->
											</tbody></table>
										</td>
									</tr>
									<!-- End Main Body -->
									
									<tr>	
										<td align="center" valign="top" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; text-decoration:none; border-bottom:none; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif">
											<!-- Begin Template Footer -->
											<table bgcolor="#fffaf4" border="0" cellpadding="0" cellspacing="0" width="100%" id="footerSettings" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; border-collapse:collapse !important; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; text-decoration:none; border-bottom:none; background-color:#fffaf4">
												<tbody><tr>
													<td align="center" valign="top" class="footerSettingsContent" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; text-decoration:none; border-bottom:none; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; color:#9ca8b7; font-size:12px; line-height:18px; text-align:center; padding:20px 20px 100px 20px">
														This message is an automated alert from Wistia.
														<span class="desktop-hide">
															<br>
														</span>
														<a href="#" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; text-decoration:none; border-bottom:none; color:#FAA928" data-hs-link-id="0" target="_blank">Click here to edit your alert settings.</a>
													</td>
												</tr>
												<tr>
													<td class="mob-hide" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; text-decoration:none; border-bottom:none; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif">
														<table bgcolor="#F5FBFE" align="center" cellpadding="0" cellspacing="0" border="0" class="" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; border-collapse:collapse !important; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; text-decoration:none; border-bottom:none; margin-left:auto; margin-right:auto; mso-table-lspace:0; mso-table-rspace:0">
															<tbody><tr>
																<td style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; text-decoration:none; border-bottom:none; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif">
																	<table width="600px" cellpadding="0" cellspacing="0" class="" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; border-collapse:collapse !important; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif; text-decoration:none; border-bottom:none">
																		<tbody><tr>
																			<td class="gmail" style="-webkit-text-size-adjust:100%; -ms-text-size-adjust:100%; mso-table-lspace:0pt; mso-table-rspace:0pt; text-decoration:none; border-bottom:none; font-family:'Whitney', system, -apple-system, BlinkMacSystemFont, Helvetica, Arial, sans-serif">
																				<img alt="" width="550" height="auto" border="0" style="-ms-interpolation-mode:bicubic; border:0; height:auto; line-height:100%; outline:none; text-decoration:none; display:block; min-height:1px; max-height:1px; width:550px; min-width:600px" src="https://cdn2.hubspot.net/hub/120237/hubfs/images/space.gif?t=1542047804244&amp;width=600&amp;height=1&amp;name=space.gif" srcset="https://cdn2.hubspot.net/hub/120237/hubfs/images/space.gif?t=1542047804244&amp;width=600&amp;height=1&amp;name=space.gif 600w, https://cdn2.hubspot.net/hub/120237/hubfs/images/space.gif?t=1542047804244&amp;width=1200&amp;height=2&amp;name=space.gif 1200w" sizes="(max-width: 600px) 100vw, 600px">
																			</td>
																		</tr>
																	</tbody></table>
																</td>
															</tr>
														</tbody></table>
													</td>
												</tr>
											</tbody></table>
											<!-- End Template Footer -->
										</td>
									</tr>
										
								</tbody></table>
								<!-- End Template Wrapper -->
							</td>
						</tr>		
					</tbody></table>
					<!-- End Template Container -->
				</td>
			</tr>
		</tbody></table>
		<!-- End backgroundTable -->
	
            <!-- end coded_template: id:5433084235 path:Custom/email/df_templates/df_template.html -->

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

Console