cssAudio - Activefile-genericCSS - ActiveGeneric - ActiveHTML - ActiveImage - ActiveJS - ActiveSVG - ActiveText - Activefile-genericVideo - Activehtmlicon-personicon-teamoctocatpop-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.

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

<head>
  <meta name="twitter:image:src" content="https://gallery.mailchimp.com/8af03e2487d538f972a79316a/images/b84c96d3-0b3b-44c2-b070-a899aa82209c.jpg">
  <meta name="twitter:description" content="A newsletter on business and culture from Collaborative Fund and i am OTHER. This issue features Mike Del Ponte of Soma.">
  <meta name="twitter:title" content="Featuring: Find Your Purpose">
  <meta name="twitter:card" content="summary_large_image">
  <meta property="og:type" content="article">
  <meta property="og:description" content="A newsletter on business and culture from Collaborative Fund and i am OTHER. This issue features Mike Del Ponte of Soma.">
  <meta property="og:image" content="https://gallery.mailchimp.com/8af03e2487d538f972a79316a/images/b84c96d3-0b3b-44c2-b070-a899aa82209c.jpg">
  <meta property="og:title" content="Featuring: Find Your Purpose">
  <meta property="og:url" content="http://eepurl.com/bWhPrD">
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  <meta name="viewport" content="width=device-width">
  <style type="text/css">
    @media screen and (min-width:750px){
      		table[class=body] .u-hidden-lap{
      			display:none !important;
      		}
      
      }	@media screen and (min-width:750px){
      		table[class=body] .u-visible-mobile{
      			display:none !important;
      		}
      
      }	@media screen and (min-width:750px){
      		table[class=body] .u-visible-lap{
      			display:block !important;
      			max-height:100000px !important;
      			width:auto !important;
      			overflow:visible !important;
      		}
      
      }	@media screen and (min-width:750px){
      		table[class=body] .u-hidden-mobile{
      			display:block !important;
      			max-height:100000px !important;
      			width:auto !important;
      			overflow:visible !important;
      		}
      
      }	@media screen and (min-width:750px){
      		table.one{
      			width:55px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		table.two{
      			width:110px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		table.three{
      			width:165px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		table.four{
      			width:220px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		table.five{
      			width:275px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		table.six{
      			width:330px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		table.seven{
      			width:385px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		table.eight{
      			width:440px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		table.nine{
      			width:495px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		table.ten{
      			width:550px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		table.eleven{
      			width:605px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		table.twelve{
      			width:660px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		table.one center{
      			min-width:55px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		table.two center{
      			min-width:110px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		table.three center{
      			min-width:165px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		table.four center{
      			min-width:220px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		table.five center{
      			min-width:275px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		table.six center{
      			min-width:330px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		table.seven center{
      			min-width:385px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		table.eight center{
      			min-width:440px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		table.nine center{
      			min-width:495px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		table.ten center{
      			min-width:550px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		table.eleven center{
      			min-width:605px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		table.twelve center{
      			min-width:660px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		.container{
      			width:660px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		.block-grid{
      			max-width:660px;
      		}
      
      }	@media screen and (min-width:750px){
      		.two-up td{
      			width:330px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		.three-up td{
      			width:220px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		.four-up td{
      			width:165px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		.five-up td{
      			width:132px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		.six-up td{
      			width:110px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		.seven-up td{
      			width:94.28571px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		.eight-up td{
      			width:82.5px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		.flag-image{
      			max-width:270px !important;
      			min-width:270px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		.media{
      			display:table !important;
      			width:100% !important;
      		}
      
      }	@media screen and (min-width:750px){
      		.media-image{
      			display:table-cell !important;
      			width:50% !important;
      		}
      
      }	@media screen and (min-width:750px){
      		.media-body{
      			display:table-cell !important;
      			width:50% !important;
      		}
      
      }	@media screen and (min-width:750px){
      		.s-header .title{
      			background-color:transparent !important;
      		}
      
      }	@media screen and (min-width:750px){
      		.s-interview .media-body .inner{
      			padding:30px 30px 60px 60px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		.s-interview .title{
      			font-size:60px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		.s-interview .text{
      			max-width:300px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		.s-quote-one .author{
      			font-size:25px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		.s-quote-one .split.image{
      			min-width:440px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		.s-quote-two .quote{
      			text-indent:-25px !important;
      			max-width:900px !important;
      			padding-left:30px !important;
      			padding-right:15px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		.s-quote-two .author{
      			padding-left:100px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		.s-quote-two .role{
      			padding-left:100px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		.s-quote-two .role{
      			font-size:18px !important;
      		}
      
      }	@media screen and (min-width:750px){
      		.s-two-col .title{
      			font-size:40px !important;
      			max-width:300px;
      		}
      
      }	@media screen and (min-width:750px){
      		.s-two-col .media-image img{
      			padding:0 60px !important;
      		}
      
      }		body{
      			width:100% !important;
      			min-width:100%;
      			-webkit-text-size-adjust:100%;
      			-ms-text-size-adjust:100%;
      			margin:0;
      			padding:0;
      		}
      		.ExternalClass{
      			width:100%;
      		}
      		.ExternalClass{
      			line-height:100%;
      		}
      		#backgroundTable{
      			margin:0;
      			padding:0;
      			width:100% !important;
      			line-height:100% !important;
      		}
      		img{
      			outline:0;
      			text-decoration:none;
      			-ms-interpolation-mode:bicubic;
      			width:auto;
      		}
      		body.outlook p{
      			display:inline !important;
      		}
      		.mailchimp a:hover{
      			color:white !important;
      		}
      		.mailchimp a:visited{
      			color:white !important;
      		}
      		.mailchimp a:focus{
      			color:white !important;
      		}
      		.mailchimp a:active{
      			color:white !important;
      		}
      		body{
      			font-family:'HelveticaNeue',Helvetica,Helmut,Arial,"Lucida Grande",sans-serif;
      			font-style:normal;
      			font-weight:normal;
      			letter-spacing:0;
      			text-transform:none;
      			color:#000;
      			font-size:18px;
      		}
      		body em{
      			font-family:'HelveticaNeue-Italic',Helvetica,Helmut,Arial,"Lucida Grande",sans-serif;
      			font-style:normal;
      			font-weight:normal;
      			letter-spacing:0;
      			text-transform:none;
      		}
      		body b{
      			font-family:'HelveticaNeue-Bold',Helvetica,Helmut,Arial,"Lucida Grande",sans-serif;
      			font-style:normal;
      			font-weight:normal;
      			letter-spacing:0;
      			text-transform:none;
      		}
      		body strong{
      			font-family:'HelveticaNeue-Bold',Helvetica,Helmut,Arial,"Lucida Grande",sans-serif;
      			font-style:normal;
      			font-weight:normal;
      			letter-spacing:0;
      			text-transform:none;
      		}
      		body b em{
      			font-family:'HelveticaNeue-BoldItalic',Helvetica,Helmut,Arial,"Lucida Grande",sans-serif;
      			font-style:normal;
      			font-weight:normal;
      			letter-spacing:0;
      			text-transform:none;
      		}
      		body strong em{
      			font-family:'HelveticaNeue-BoldItalic',Helvetica,Helmut,Arial,"Lucida Grande",sans-serif;
      			font-style:normal;
      			font-weight:normal;
      			letter-spacing:0;
      			text-transform:none;
      		}
      		a:hover{
      			outline:0;
      			color:#000;
      			text-decoration:none;
      		}
      		a:active{
      			outline:0;
      			color:#000;
      			text-decoration:none;
      		}
      		a:focus{
      			outline:0;
      			color:#000;
      			text-decoration:none;
      		}
      		a:visited{
      			outline:0;
      			color:#000;
      			text-decoration:none;
      		}
      		.s-header a:hover{
      			color:#f30 !important;
      		}
      		.s-header a:visited{
      			color:#f30 !important;
      		}
      		.s-header a:focus{
      			color:#f30 !important;
      		}
      		.s-header a:active{
      			color:#f30 !important;
      		}
      		.s-quote-one a:hover{
      			color:#00f !important;
      		}
      		.s-quote-one a:visited{
      			color:#00f !important;
      		}
      		.s-quote-one a:focus{
      			color:#00f !important;
      		}
      		.s-quote-one a:active{
      			color:#00f !important;
      		}
      		.s-quote-two a:hover{
      			color:#ff9aff !important;
      		}
      		.s-quote-two a:visited{
      			color:#ff9aff !important;
      		}
      		.s-quote-two a:focus{
      			color:#ff9aff !important;
      		}
      		.s-quote-two a:active{
      			color:#ff9aff !important;
      		}
      		.s-two-col .title a:visited{
      			color:#f30;
      			text-decoration:underline;
      		}
      		.s-two-col .title a:hover{
      			color:#f30;
      			text-decoration:underline;
      		}
      		.s-two-col .title a:active{
      			color:#f30;
      			text-decoration:underline;
      		}
      		.s-mailchimp a:hover{
      			color:#aaa !important;
      		}
      		.s-mailchimp a:visited{
      			color:#aaa !important;
      		}
      		.s-mailchimp a:focus{
      			color:#aaa !important;
      		}
      		.s-mailchimp a:active{
      			color:#aaa !important;
      		}
      		body{
      			background-color:#000;
      		}
      	@media screen and (min-width:980px){
      		table.container.wide{
      			width:890px !important;
      		}
      
      }	@media screen and (min-width:980px){
      		.s-interview .text{
      			padding:30px 0 60px !important;
      		}
      
      }	@media screen and (min-width:980px){
      		.s-quote-one .quote{
      			font-size:60px !important;
      		}
      
      }	@media screen and (min-width:980px){
      		.s-two-col .title{
      			font-size:60px !important;
      		}
      
      }	@media screen and (min-width:980px){
      		.s-two-col .media .wrap{
      			padding:100px !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.gutter:first-child{
      			min-width:0 !important;
      			max-width:0 !important;
      			width:0 !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.flag-image{
      			max-width:170px !important;
      			min-width:170px !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.flag-body:first-child{
      			max-width:0 !important;
      			min-width:0 !important;
      			width:auto !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.flag-body:last-child{
      			width:100% !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-header .title{
      			padding:15px 0 !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-toc .title{
      			padding:60px 0 30px !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-toc .text{
      			padding:30px 15px 100px !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-interview .media-body .inner{
      			padding:30px 0 60px 30px !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-interview .content{
      			padding:30px !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-interview .title{
      			font-size:40px !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-interview .text{
      			max-width:100% !important;
      			line-height:1.5;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-quote-one .content{
      			padding:15px 15px 0 !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-quote-one .quote{
      			padding:60px 15px 60px 30px !important;
      			font-size:30px !important;
      			text-align:left !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-quote-one .author{
      			text-align:left !important;
      			padding-left:30px !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-quote-one .role{
      			text-align:left !important;
      			padding-left:30px !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-quote-one .split{
      			width:auto !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-quote-one .split.image{
      			width:150px !important;
      			max-width:150px !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-quote-one .split.image img{
      			max-width:150px !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.t-mobile-left{
      			text-align:left !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-quote-two .quote{
      			font-size:40px !important;
      			padding-left:30px !important;
      			padding-right:15px !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-quote-two .title{
      			font-size:20px !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-quote-two .title span{
      			font-size:15px !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-quote-two .author{
      			font-size:18px !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-quote-two .role{
      			font-size:13px !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-two-col .title{
      			padding:30px 0 15px !important;
      			font-size:40px !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-two-col .text{
      			padding-left:30px !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-two-col .media .wrap{
      			padding:30px 0 15px 30px !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-two-col .media-image .inner{
      			padding-left:0 !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-two-col .media-image img{
      			padding:0 !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-two-col .media-image .text{
      			padding-bottom:30px !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-two-col .media-body .inner{
      			padding-left:0 !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-two-col .media-body .text{
      			padding-right:0 !important;
      			max-width:none !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-more .content{
      			padding:15px 15px 30px !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-more .title{
      			padding:60px 0 30px !important;
      		}
      
      }	@media screen and (max-width:748px){
      		.s-brand .link{
      			display:block !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] center{
      			min-width:0 !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .container{
      			width:100% !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .container.full{
      			width:100% !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .row{
      			width:100% !important;
      			display:block !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .wrapper{
      			display:block !important;
      			padding-right:0 !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .columns{
      			table-layout:fixed !important;
      			float:none !important;
      			width:100% !important;
      			padding-right:0 !important;
      			padding-left:0 !important;
      			display:block !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .column{
      			table-layout:fixed !important;
      			float:none !important;
      			width:100% !important;
      			padding-right:0 !important;
      			padding-left:0 !important;
      			display:block !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .wrapper.first .columns{
      			display:table !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .wrapper.first .column{
      			display:table !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] table.columns td{
      			width:100% !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] table.column td{
      			width:100% !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .columns td.one{
      			width:8.333333% !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .column td.one{
      			width:8.333333% !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .columns td.two{
      			width:16.666666% !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .column td.two{
      			width:16.666666% !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .columns td.three{
      			width:25% !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .column td.three{
      			width:25% !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .columns td.four{
      			width:33.333333% !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .column td.four{
      			width:33.333333% !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .columns td.five{
      			width:41.666666% !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .column td.five{
      			width:41.666666% !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .columns td.six{
      			width:50% !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .column td.six{
      			width:50% !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .columns td.seven{
      			width:58.333333% !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .column td.seven{
      			width:58.333333% !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .columns td.eight{
      			width:66.666666% !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .column td.eight{
      			width:66.666666% !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .columns td.nine{
      			width:75% !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .column td.nine{
      			width:75% !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .columns td.ten{
      			width:83.333333% !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .column td.ten{
      			width:83.333333% !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .columns td.eleven{
      			width:91.666666% !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .column td.eleven{
      			width:91.666666% !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .columns td.twelve{
      			width:100% !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] .column td.twelve{
      			width:100% !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] td.offset-by-one{
      			padding-left:0 !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] td.offset-by-two{
      			padding-left:0 !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] td.offset-by-three{
      			padding-left:0 !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] td.offset-by-four{
      			padding-left:0 !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] td.offset-by-five{
      			padding-left:0 !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] td.offset-by-six{
      			padding-left:0 !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] td.offset-by-seven{
      			padding-left:0 !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] td.offset-by-eight{
      			padding-left:0 !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] td.offset-by-nine{
      			padding-left:0 !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] td.offset-by-ten{
      			padding-left:0 !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] td.offset-by-eleven{
      			padding-left:0 !important;
      		}
      
      }	@media screen and (max-width:689px){
      		table[class=body] table.columns td.expander{
      			width:1px !important;
      		}
      
      }	@media screen and (max-width:689px){
      		.s-share a{
      			font-family:'Futura-CondensedExtraBold','FuturaStd CondensedExtraBd','FuturaStd-CondensedExtraBd',Futura,'Trebuchet MS',sans-serif;
      			font-stretch:condensed !important;
      			font-weight:600 !important;
      			padding:25px !important;
      			text-transform:uppercase !important;
      		}
      
      }	@media screen and (max-width:689px){
      		.s-share a em{
      			font-family:'Futura-CondExtraBoldObl','FuturaStd CondExtraBoldObl','FuturaStd-CondExtraBoldObl',Futura,'Trebuchet MS',sans-serif;
      		}
      
      }	@media screen and (min-width:1px){
      		.s-quote-two{
      			background-image:none;
      			background-size:auto 100% !important;
      			background-repeat:repeat-x !important;
      		}
      
      }	@media screen and (min-width:1px){
      		.s-share .container{
      			background-image:url("https://gallery.mailchimp.com/8af03e2487d538f972a79316a/images/5660aae2-a722-4aa8-9942-8cfe8e10e9d9.jpg") !important;
      			background-size:contain !important;
      		}
      
      }
  </style>
</head>

<body style="-ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; background: #000; color: #000; font-family: 'HelveticaNeue',Helvetica,Helmut,Arial,'Lucida Grande',sans-serif; font-size: 18px; font-style: normal; font-weight: normal; letter-spacing: 0; margin: 0; min-width: 100%; padding: 0; text-transform: none; width: 100% !important"
  bgcolor="#000">
  <div itemscope="" itemtype="http://schema.org/EmailMessage">
    <div itemprop="publisher" itemscope="" itemtype="http://schema.org/Organization">
      <meta itemprop="name" content="Collaborative Fund">
      <link itemprop="url" content="http://collaborativefund.com">
    </div>
    <div itemprop="about" itemscope="" itemtype="http://schema.org/Offer">
      <link itemprop="image" href="https://gallery.mailchimp.com/8af03e2487d538f972a79316a/images/b84c96d3-0b3b-44c2-b070-a899aa82209c.jpg">
    </div>
  </div>
  <table class="body" align="center" style="border-collapse: collapse; border-spacing: 0; height: 100%; padding: 0; text-align: left; vertical-align: top; width: 100%">
    <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
      <td class="center" align="center" valign="top" style="border-collapse: collapse !important; padding: 0; text-align: center; vertical-align: top; width: 100%">
        <center class="s-header" style="background: #00f; min-width: 580px; width: 100%">
          <table class="container full" style="border-collapse: collapse; border-spacing: 0; margin: 0 auto; padding: 0; text-align: inherit; vertical-align: top; width: 100% !important">
            <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
              <td class="t-c" style="border-collapse: collapse !important; padding: 0; text-align: center; text-transform: capitalize; vertical-align: top; width: 100%" align="center" valign="top">
                <div class="title t-title" style="background: #00f; color: #f30; font-family: 'Futura-CondensedExtraBold','FuturaStd CondensedExtraBd','FuturaStd-CondensedExtraBd',Futura,'Trebuchet MS',sans-serif; font-size: 22px; font-stretch: condensed; font-weight: 600; padding: 15px 0 30px; position: relative; z-index: 10">FEATURING — <span class="highlight" style="color: #fff">ISSUE 8</span>
                </div>
                <div class="header-image">
                  <a href="#" target="_blank" style="color: #f30 !important; text-decoration: none">
                    <img src="https://gallery.mailchimp.com/8af03e2487d538f972a79316a/images/b84c96d3-0b3b-44c2-b070-a899aa82209c.jpg" class="u-responsive u-responsive--full" alt="Alt" style="-ms-interpolation-mode: bicubic; border: 0; display: block; height: auto; margin: 0 auto; max-width: 100%; outline: 0; text-decoration: none; width: 100%">
                  </a>
                </div>
              </td>
              <td class="expander" style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; visibility: hidden; width: 0" align="left" valign="top"></td>
            </tr>
          </table>
        </center>
        <center class="s-toc" style="min-width: 580px; text-transform: uppercase; width: 100%">
          <table class="container" align="center" style="background: black; border-collapse: collapse; border-spacing: 0; color: white; margin: 0 auto; padding: 0; text-align: inherit; vertical-align: top; width: 510px" bgcolor="black">
            <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
              <td style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; width: 100%" align="left" valign="top">
                <table class="row" style="border-collapse: collapse; border-spacing: 0; display: block; padding: 0; position: relative; text-align: left; vertical-align: top; width: 100%">
                  <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
                    <td class="wrapper last" style="border-collapse: collapse !important; padding: 0; position: relative; text-align: left; vertical-align: top; width: 100%" align="left" valign="top">
                      <table class="twelve columns" style="border-collapse: collapse; border-spacing: 0; margin: 0 auto; padding: 0; text-align: left; vertical-align: top; width: 555px">
                        <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
                          <td style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; width: 100%" align="left" valign="top">
                            <div class="title t-title-alt" style="font-family: 'Futura-ExtraBold','FuturaStd ExtraBd','FuturaStd-ExtraBd',Futura,'Trebuchet MS',sans-serif; font-size: 13px; font-style: normal; font-weight: normal; letter-spacing: .05em; padding: 100px 0 30px; text-align: center"
                              align="center">in this issue</div>
                            <div class="text t-title" style="color: white; font-family: 'Futura-CondensedExtraBold','FuturaStd CondensedExtraBd','FuturaStd-CondensedExtraBd',Futura,'Trebuchet MS',sans-serif; font-size: 30px; font-stretch: condensed; font-weight: 600; letter-spacing: .05em; line-height: 1.5; padding-bottom: 100px; text-align: center"
                              align="center">Interview with Soma co-founder Mike Del Ponte, quotes from Bia &amp; Seth Godin, and mark your calendar for a Q&amp;A with Craig Shapiro on Product Hunt.</div>
                          </td>
                          <td class="expander" style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; visibility: hidden; width: 0" align="left" valign="top"></td>
                        </tr>
                      </table>
                    </td>
                  </tr>
                </table>
              </td>
            </tr>
          </table>
        </center>
        <center class="s-interview" style="background: #f30; min-width: 580px; width: 100%">
          <table class="container full" style="border-collapse: collapse; border-spacing: 0; margin: 0 auto; padding: 0; text-align: inherit; vertical-align: top; width: 100% !important">
            <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
              <td style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; width: 100%" align="left" valign="top">
                <div class="media">
                  <div class="media-image" style="display: block; width: 100%">
                    <a href="/blog/mike-del-ponte/" class="u-hidden-lap" target="_blank" style="color: #000; display: block; text-decoration: none">
                      <img src="https://gallery.mailchimp.com/8af03e2487d538f972a79316a/images/36343701-445c-4205-91b3-3ed20a795963.jpg" class="u-responsive u-responsive--full" alt="ike Del Ponte sm" style="-ms-interpolation-mode: bicubic; border: 0; display: block; height: auto; margin: 0 auto; max-width: 100%; outline: 0; text-decoration: none; width: 100%">
                    </a>
                    <a href="/blog/mike-del-ponte/" class="u-hidden-mobile" target="_blank" style="color: #000; display: block; max-height: 0; mso-hide: all; overflow: hidden; text-decoration: none; width: 0">
                      <img src="https://gallery.mailchimp.com/8af03e2487d538f972a79316a/images/da81f4a1-d046-44a7-b960-7de7ceb96a53.jpg" class="u-responsive u-responsive--full u-pvmd u-phmd" alt="Mike Del Ponte lg" style="-ms-interpolation-mode: bicubic; border: 0; display: block; height: auto; margin: 0 auto; max-width: 100%; mso-hide: all; outline: 0; padding: 30px; text-decoration: none; width: 100%">
                    </a>
                  </div>
                  <div class="media-body" style="display: block; position: relative; vertical-align: middle; width: 100%">
                    <table style="border-collapse: collapse; border-spacing: 0; padding: 0; text-align: left; vertical-align: top">
                      <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
                        <td style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; width: 100%" align="left" valign="top">
                          <div class="inner" style="padding: 0 60px 60px 30px">
                            <div class="t-title title u-hidden-lap" style="color: #00f; display: block; font-family: 'Futura-CondensedExtraBold','FuturaStd CondensedExtraBd','FuturaStd-CondensedExtraBd',Futura,'Trebuchet MS',sans-serif; font-size: 60px; font-stretch: condensed; font-weight: 600; text-transform: uppercase">Hydrating
                              <br>the World</div>
                            <div class="u-hidden-mobile" style="display: block; max-height: 0; mso-hide: all; overflow: hidden; width: 0">
                              <div class="t-title title" style="color: #00f; font-family: 'Futura-CondensedExtraBold','FuturaStd CondensedExtraBd','FuturaStd-CondensedExtraBd',Futura,'Trebuchet MS',sans-serif; font-size: 60px; font-stretch: condensed; font-weight: 600; mso-hide: all; text-transform: uppercase">Hydrating
                                <br style="mso-hide: all">the World</div>
                            </div>
                            <div class="text u-pbmd u-ptsm u-prlg" style="color: #fff; font-family: 'HelveticaNeue',Helvetica,Helmut,Arial,'Lucida Grande',sans-serif; font-style: normal; font-weight: normal; letter-spacing: .05em; line-height: 1.75; max-width: 250px; padding-bottom: 30px !important; padding-right: 60px !important; padding-top: 15px !important; text-transform: none">Interview with
                              <a href="https://twitter.com/mikedelponte" target="_blank" style="color: #fff; text-decoration: underline">Mike Del Ponte</a>, Co-Founder of
                              <a href="https://www.drinksoma.com/" target="_blank" style="color: #fff; text-decoration: underline">Soma</a>.</div>
                            <div class="button" style="font-family: 'Futura-CondensedExtraBold','FuturaStd CondensedExtraBd','FuturaStd-CondensedExtraBd',Futura,'Trebuchet MS',sans-serif; font-stretch: condensed; font-weight: 600; letter-spacing: .05em; text-align: center; text-transform: uppercase"
                              align="center">
                              <a href="/blog/mike-del-ponte/" target="_blank" style="background-color: #00f !important; color: #fff; display: block; padding: 20px 0; text-decoration: none; width: 170px">Read More</a>
                            </div>
                          </div>
                        </td>
                        <td class="gutter u-am" style="border-collapse: collapse !important; max-width: 45px; min-width: 45px; padding: 0; text-align: left; vertical-align: middle; width: 45px" align="left" valign="middle">
                          <div class="social">
                            <a href="https://twitter.com/intent/tweet?text=Interview%20with%20%40mikedelponte%2C%20Co-Founder%20of%20%40somawater%2C%20in%20%23Featuring%20Issue%208%20%E2%80%94%20from%20%40collabfund%20and%20%40i_am_OTHER.%20%E2%86%92%20http%3A%2F%2Feepurl.com%2FbWhPrD&source=clicktotweet&related=clicktotweet"
                              target="_blank" class="social-button" style="color: #000; text-decoration: none">
                              <img src="https://gallery.mailchimp.com/8af03e2487d538f972a79316a/images/481d36da-cde2-46c4-b9bc-98361c8b7a29.jpg" alt="Tweet" class="u-responsive" style="-ms-interpolation-mode: bicubic; border: 0; display: block; height: auto; margin: 0 auto; max-width: 100%; outline: 0; padding-bottom: 2px; text-decoration: none; width: auto">
                            </a>
                            <a href="https://www.facebook.com/login.php?skip_api_login=1&api_key=134530986736267&signed_next=1&next=https%3A%2F%2Fwww.facebook.com%2Fdialog%2Ffeed%3Fapp_id%3D134530986736267%26description%3DMike%2BDel%2BPonte%252C%2BCo-Founder%2Bof%2BSoma%252C%2Bspeaks%2Bon%2Bfinding%2Bhis%2Bpurpose%2Bin%2Bthe%2Blatest%2Bissue%2Bof%2BFeaturing%252C%2Ba%2Bnewsletter%2Bfrom%2BCollaborative%2BFund%2Band%2Bi%2Bam%2BOTHER.%26link%3Dhttp%253A%252F%252Feepurl.com%252FbWhPrD%26name%3DFeaturing%2BIssue%2B8%253A%2BFind%2BYour%2BPurpose%26picture%3Dhttps%253A%252F%252Fgallery.mailchimp.com%252F8af03e2487d538f972a79316a%252Fimages%252F5ffe015e-af23-4100-ba96-051f46b15828.jpg%26redirect_uri%3Dhttp%253A%252F%252Ffacebook.com%252F&cancel_url=http%3A%2F%2Ffacebook.com%2F%3Ferror_code%3D4201%26error_message%3DUser%2Bcanceled%2Bthe%2BDialog%2Bflow%23_%3D_&display=popup&locale=en_US"
                              target="_blank" class="social-button" style="color: #000; text-decoration: none">
                              <img src="https://gallery.mailchimp.com/8af03e2487d538f972a79316a/images/0a75dc9e-f6e7-4f4c-bbe0-f1a7c16f8e87.jpg" alt="Share" class="u-responsive" style="-ms-interpolation-mode: bicubic; border: 0; display: block; height: auto; margin: 0 auto; max-width: 100%; outline: 0; padding-bottom: 2px; text-decoration: none; width: auto">
                            </a>
                          </div>
                        </td>
                        <td class="expander" style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; visibility: hidden; width: 0" align="left" valign="top"></td>
                      </tr>
                    </table>
                  </div>
                </div>
              </td>
              <td class="expander" style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; visibility: hidden; width: 0" align="left" valign="top"></td>
            </tr>
          </table>
        </center>
        <center class="background-red" style="background-color: #f30 !important; min-width: 580px; width: 100%">
          <table class="container full" style="border-collapse: collapse; border-spacing: 0; margin: 0 auto; padding: 0; text-align: inherit; vertical-align: top; width: 100% !important">
            <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
              <td style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; width: 100%" align="left" valign="top">
                <img src="https://gallery.mailchimp.com/8af03e2487d538f972a79316a/images/ec896475-e9cf-4300-846b-867c8d76d418.jpg" class="u-responsive u-responsive--full" alt="pattern" style="-ms-interpolation-mode: bicubic; display: block; height: auto; margin: 0 auto; max-width: 100%; outline: 0; text-decoration: none; width: 100%">
              </td>
              <td class="expander" style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; visibility: hidden; width: 0" align="left" valign="top"></td>
            </tr>
          </table>
        </center>
        <center class="s-quote-one" style="background: #ff9aff; min-width: 580px; width: 100%">
          <table class="container full" style="background: #ff9aff; border-collapse: collapse; border-spacing: 0; color: #00f; margin: 0 auto; padding: 0; text-align: inherit; vertical-align: top; width: 100% !important" bgcolor="#ff9aff">
            <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
              <td class="t-c" style="border-collapse: collapse !important; padding: 0; text-align: center; text-transform: capitalize; vertical-align: top; width: 100%" align="center" valign="top">
                <div class="header-image">
                  <a href="http://iamother.com/tagged/BIA" target="_blank" style="color: #00f !important; text-decoration: none">
                    <img src="https://gallery.mailchimp.com/8af03e2487d538f972a79316a/images/50c425b5-560a-4052-9285-67f3328e84f9.jpg" class="u-responsive u-responsive-full" alt="Bia" style="-ms-interpolation-mode: bicubic; border: 0; display: block; height: auto; margin: 0 auto; max-width: 100%; outline: 0; text-decoration: none; width: auto">
                  </a>
                </div>
              </td>
              <td class="expander" style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; visibility: hidden; width: 0" align="left" valign="top"></td>
            </tr>
          </table>
          <table style="border-collapse: collapse; border-spacing: 0; padding: 0; text-align: left; vertical-align: top">
            <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
              <td class="gutter" style="border-collapse: collapse !important; max-width: 45px; min-width: 45px; padding: 0; text-align: left; vertical-align: top; width: 45px" align="left" valign="top"> </td>
              <td style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; width: 100%" align="left" valign="top">
                <table class="container full" style="background: #ff9aff; border-collapse: collapse; border-spacing: 0; color: #00f; margin: 0 auto; padding: 0; text-align: inherit; vertical-align: top; width: 100% !important" bgcolor="#ff9aff">
                  <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
                    <td style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; width: 100%" align="left" valign="top">
                      <table class="row" style="border-collapse: collapse; border-spacing: 0; display: block; padding: 0; position: relative; text-align: left; vertical-align: top; width: 100%">
                        <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
                          <td class="t-c content-secondary" style="border-collapse: collapse !important; padding: 0; text-align: center; text-transform: capitalize; vertical-align: top; width: 100%" align="center" valign="top">
                            <div class="quote" style="font-family: 'Futura-MediumCondensed','Futura-CondensedMedium','Futura-Condensed','FuturaStd Condensed','FuturaStd-Condensed',Futura,'Trebuchet MS',sans-serif; font-size: 40px; font-style: normal; font-weight: normal; letter-spacing: .05em; line-height: 1.25; padding: 100px 60px 60px 15px; text-transform: uppercase">“I found my purpose through following my heart and passion. The feeling I get from writing a song and hearing the finished product come to fruition shows me that being a creator is my calling.”</div>
                          </td>
                          <td class="expander" style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; visibility: hidden; width: 0" align="left" valign="top"></td>
                        </tr>
                      </table>
                    </td>
                    <td class="expander" style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; visibility: hidden; width: 0" align="left" valign="top"></td>
                  </tr>
                </table>
              </td>
              <td class="gutter u-am u-ptlg" style="border-collapse: collapse !important; max-width: 45px; min-width: 45px; padding: 60px 0 0; text-align: left; vertical-align: middle; width: 45px" align="left" valign="middle">
                <div class="social">
                  <a href="https://twitter.com/intent/tweet?text=%E2%80%9CI%20found%20my%20purpose%20through%20following%20my%20heart%20and%20passion.%E2%80%9D%20%E2%80%94%20Bia%20%28%40PericoPrincess%29%20quoted%20in%20%23Featuring%2C%20from%20%40collabfund%20and%20%40i_am_OTHER&source=clicktotweet&related=clicktotweet"
                    target="_blank" class="social-button" style="color: #00f !important; text-decoration: none">
                    <img src="https://gallery.mailchimp.com/8af03e2487d538f972a79316a/images/7faa28fa-5d7f-414f-86d6-44d030fd3088.jpg" alt="Tweet" class="u-responsive" style="-ms-interpolation-mode: bicubic; border: 0; display: block; height: auto; margin: 0 auto; max-width: 100%; outline: 0; padding-bottom: 2px; text-decoration: none; width: auto">
                  </a>
                  <a href="https://www.facebook.com/login.php?skip_api_login=1&api_key=134530986736267&signed_next=1&next=https%3A%2F%2Fwww.facebook.com%2Fdialog%2Ffeed%3Fapp_id%3D134530986736267%26description%3D%25E2%2580%259CI%2Bfound%2Bmy%2Bpurpose%2Bthrough%2Bfollowing%2Bmy%2Bheart%2Band%2Bpassion.%2BThe%2Bfeeling%2BI%2Bget%2Bfrom%2Bwriting%2Ba%2Bsong%2Band%2Bhearing%2Bthe%2Bfinished%2Bproduct%2Bcome%2Bto%2Bfruition%2Bshows%2Bme%2Bthat%2Bbeing%2Ba%2Bcreator%2Bis%2Bmy%2Bcalling.%25E2%2580%259D%2B%25E2%2580%2594%2BBianca%2BLandrau%2Baka%2B%2522Bia%2522%26link%3Dhttp%253A%252F%252Feepurl.com%252FbWhPrD%26name%3DFeaturing%2BIssue%2B8%253A%2BFind%2BYour%2BPurpose%26picture%3Dhttps%253A%252F%252Fgallery.mailchimp.com%252F8af03e2487d538f972a79316a%252Fimages%252Fffc77e01-53d4-433e-bdd4-caa9e190475c.jpg%26redirect_uri%3Dhttp%253A%252F%252Ffacebook.com%252F&cancel_url=http%3A%2F%2Ffacebook.com%2F%3Ferror_code%3D4201%26error_message%3DUser%2Bcanceled%2Bthe%2BDialog%2Bflow%23_%3D_&display=popup&locale=en_US"
                    target="_blank" class="social-button" style="color: #00f !important; text-decoration: none">
                    <img src="https://gallery.mailchimp.com/8af03e2487d538f972a79316a/images/696b5eb9-001c-4b27-b282-62f63cf8f683.jpg" alt="Share" class="u-responsive" style="-ms-interpolation-mode: bicubic; border: 0; display: block; height: auto; margin: 0 auto; max-width: 100%; outline: 0; padding-bottom: 2px; text-decoration: none; width: auto">
                  </a>
                </div>
              </td>
              <td class="expander" style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; visibility: hidden; width: 0" align="left" valign="top"></td>
            </tr>
          </table>
          <table class="container" style="background: #ff9aff; border-collapse: collapse; border-spacing: 0; color: #00f; margin: 0 auto; padding: 0; text-align: inherit; vertical-align: top; width: 510px" bgcolor="#ff9aff">
            <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
              <td class="split u-am" style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: middle; width: 50%" align="left" valign="middle">
                <div class="content-tertiary t-center u-pbxl" style="padding-bottom: 100px !important; text-align: center" align="center">
                  <div class="author" style="color: #00f; font-family: 'Futura-CondensedExtraBold','FuturaStd CondensedExtraBd','FuturaStd-CondensedExtraBd',Futura,'Trebuchet MS',sans-serif; font-size: 18px; font-stretch: condensed; font-weight: 600; letter-spacing: .05em; padding-left: 0; padding-right: 15px; text-transform: uppercase">
                    <a href="http://iamother.com/tagged/BIA" target="_blank" style="color: #00f !important; text-decoration: none">Bia</a>
                  </div>
                  <div class="role" style="color: #00f; font-family: 'Futura-Medium','FuturaStd Medium','FuturaStd-Medium',Futura,'Trebuchet MS',sans-serif; font-style: normal; font-weight: normal; padding-left: 0; padding-right: 15px">Rapper,
                    <br>
                    <a href="http://iamother.com/" target="_blank">i am OTHER</a>artist.</div>
                </div>
              </td>
            </tr>
          </table>
        </center>
        <center class="background-pink" style="background-color: #ff9aff !important; min-width: 580px; width: 100%">
          <table class="container full" style="border-collapse: collapse; border-spacing: 0; margin: 0 auto; padding: 0; text-align: inherit; vertical-align: top; width: 100% !important">
            <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
              <td style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; width: 100%" align="left" valign="top">
                <img src="https://gallery.mailchimp.com/8af03e2487d538f972a79316a/images/22dd6cee-070f-44ed-9dde-353e2da63e7c.jpg" class="u-responsive u-responsive--full" alt=" Alt" style="-ms-interpolation-mode: bicubic; display: block; height: auto; margin: 0 auto; max-width: 100%; outline: 0; text-decoration: none; width: 100%">
              </td>
              <td class="expander" style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; visibility: hidden; width: 0" align="left" valign="top"></td>
            </tr>
          </table>
        </center>
        <center class="s-quote-two" style="background: #f30; color: #ff9aff; min-width: 580px; width: 100%">
          <table style="border-collapse: collapse; border-spacing: 0; padding: 0; text-align: left; vertical-align: top">
            <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
              <td class="gutter" style="border-collapse: collapse !important; max-width: 45px; min-width: 45px; padding: 0; text-align: left; vertical-align: top; width: 45px" align="left" valign="top"> </td>
              <td class="center" align="center" valign="middle" style="border-collapse: collapse !important; padding: 0; text-align: center; vertical-align: top; width: 100%">
                <table class="container full" style="border-collapse: collapse; border-spacing: 0; margin: 0 auto; padding: 0; text-align: inherit; vertical-align: top; width: 100% !important">
                  <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
                    <td class="content" style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; width: 100%" align="left" valign="top">
                      <table class="row" style="border-collapse: collapse; border-spacing: 0; display: block; padding: 0; position: relative; text-align: left; vertical-align: top; width: 100%">
                        <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
                          <td class="wrapper last" style="border-collapse: collapse !important; padding: 0; position: relative; text-align: left; vertical-align: top; width: 100%" align="left" valign="top">
                            <table style="border-collapse: collapse; border-spacing: 0; padding: 0; text-align: left; vertical-align: top">
                              <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
                                <td class="t-left" style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; width: 100%" align="left" valign="top">
                                  <div class="u-padding-top-lg u-padding-bottom-sm" style="padding-bottom: 15px !important; padding-top: 60px !important">
                                    <div class="quote" style="color: #ff9aff; font-family: 'HelveticaNeue-Bold',Helvetica,Helmut,Arial,'Lucida Grande',sans-serif; font-size: 60px; font-style: normal; font-weight: normal; letter-spacing: 1px; padding-left: 15px; text-transform: none">“Transferring your passion to your job is far easier than finding a job that happens to match your passion.”</div>
                                  </div>
                                </td>
                                <td class="expander" style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; visibility: hidden; width: 0" align="left" valign="top"></td>
                              </tr>
                            </table>
                          </td>
                        </tr>
                      </table>
                      <table class="row u-ptlg" style="border-collapse: collapse; border-spacing: 0; display: block; padding: 60px 0 0; position: relative; text-align: left; vertical-align: top; width: 100%">
                        <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
                          <td class="split u-at" style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: middle; width: 50%" align="left" valign="middle">
                            <div class="pull-left" style="float: left">
                              <div class="author" style="color: #fff; font-size: 25px; line-height: 1.5; padding-left: 30px">
                                <a href="http://sethgodin.typepad.com/" target="_blank" style="color: #fff !important; text-decoration: none">Seth Godin</a>
                              </div>
                              <div class="role" style="color: #fff; font-size: 18px; line-height: 1.5; max-width: 220px; padding-left: 30px">Author, entrepreneur, marketer, and speaker, from his book
                                <a href="https://www.amazon.com/Linchpin-Are-Indispensable-Seth-Godin/dp/1591844096/ref=as_li_ss_tl?ie=UTF8&linkCode=sl1&linkId=a0561e48ccbe579d0d2aa7c07e27e450&tag=ca020-20" target="_blank" style="font-family: 'HelveticaNeue-Italic',Helvetica,Helmut,Arial,'Lucida Grande',sans-serif; font-style: normal; font-weight: normal; letter-spacing: 0; color: #fff; text-transform: none">Linchpin: Are You Indispensable?</a>
                              </div>
                            </div>
                          </td>
                          <td class="split image" style="border-collapse: collapse !important; line-height: 0; padding: 0; text-align: left; vertical-align: middle; width: 50%" align="left" valign="middle">
                            <div class="pull-right" style="float: right">
                              <div class="u-plsm u-ptmd" style="padding-left: 15px !important; padding-top: 30px !important">
                                <a href="#" target="_blank" class="image-link" style="color: #ff9aff !important; display: block; line-height: .9; overflow: hidden; text-decoration: none">
                                  <img src="https://gallery.mailchimp.com/8af03e2487d538f972a79316a/images/f78cde53-b1cb-4db1-b799-d8ef137fd827.jpg" alt="Seth Godin" class="u-responsive" style="-ms-interpolation-mode: bicubic; border: 0; display: block; height: auto; margin: 0 auto; max-width: 100%; outline: 0; text-decoration: none; width: auto">
                                </a>
                              </div>
                            </div>
                          </td>
                        </tr>
                      </table>
                    </td>
                    <td class="expander" style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; visibility: hidden; width: 0" align="left" valign="top"></td>
                  </tr>
                </table>
              </td>
              <td class="gutter u-am" style="border-collapse: collapse !important; max-width: 45px; min-width: 45px; padding: 0; text-align: left; vertical-align: middle; width: 45px" align="left" valign="middle">
                <div class="social">
                  <a href="https://twitter.com/intent/tweet?text=%E2%80%9CTransferring%20your%20passion%20to%20your%20job%20is%20far%20easier%20than%20finding%20a%20job%20that%20happens%20to%20match%20your%20passion.%E2%80%9D%20%E2%80%94%20Seth%20Godin%20in%20%23Featuring&source=clicktotweet&related=clicktotweet"
                    target="_blank" class="social-button" style="color: #ff9aff !important; text-decoration: none">
                    <img src="https://gallery.mailchimp.com/8af03e2487d538f972a79316a/images/24c6a3fd-ebe9-43e4-acff-d2b2e7f3b357.jpg" alt="Tweet" class="u-responsive" style="-ms-interpolation-mode: bicubic; border: 0; display: block; height: auto; margin: 0 auto; max-width: 100%; outline: 0; padding-bottom: 2px; text-decoration: none; width: auto">
                  </a>
                  <a href="https://www.facebook.com/login.php?skip_api_login=1&api_key=134530986736267&signed_next=1&next=https%3A%2F%2Fwww.facebook.com%2Fdialog%2Ffeed%3Fapp_id%3D134530986736267%26description%3D%25E2%2580%259CTransferring%2Byour%2Bpassion%2Bto%2Byour%2Bjob%2Bis%2Bfar%2Beasier%2Bthan%2Bfinding%2Ba%2Bjob%2Bthat%2Bhappens%2Bto%2Bmatch%2Byour%2Bpassion.%25E2%2580%259D%2B%25E2%2580%2594%25C2%25A0Seth%2BGodin%2Bquoted%2Bin%2Bthe%2Blatest%2Bissue%2Bof%2BFeaturing%252C%2Ba%2Bnewsletter%2Bfrom%2BCollaborative%2BFund%2Band%2Bi%2Bam%2BOTHER%26link%3Dhttp%253A%252F%252Feepurl.com%252FbWhPrD%26name%3DFeaturing%2BIssue%2B8%253A%2BFind%2BYour%2BPurpose%26picture%3Dhttps%253A%252F%252Fgallery.mailchimp.com%252F8af03e2487d538f972a79316a%252Fimages%252Fd21d438d-e72a-479b-8fe3-417a3a931c53.jpg%26redirect_uri%3Dhttp%253A%252F%252Ffacebook.com%252F&cancel_url=http%3A%2F%2Ffacebook.com%2F%3Ferror_code%3D4201%26error_message%3DUser%2Bcanceled%2Bthe%2BDialog%2Bflow%23_%3D_&display=popup&locale=en_US"
                    target="_blank" class="social-button" style="color: #ff9aff !important; text-decoration: none">
                    <img src="https://gallery.mailchimp.com/8af03e2487d538f972a79316a/images/c598e31a-867f-4b0d-8e1c-083c3d8e3c36.jpg" alt="Share" class="u-responsive" style="-ms-interpolation-mode: bicubic; border: 0; display: block; height: auto; margin: 0 auto; max-width: 100%; outline: 0; padding-bottom: 2px; text-decoration: none; width: auto">
                  </a>
                </div>
              </td>
            </tr>
          </table>
        </center>
        <center class="background-red" style="background-color: #f30 !important; min-width: 580px; width: 100%">
          <table class="container full" style="border-collapse: collapse; border-spacing: 0; margin: 0 auto; padding: 0; text-align: inherit; vertical-align: top; width: 100% !important">
            <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
              <td style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; width: 100%" align="left" valign="top">
                <img src="https://gallery.mailchimp.com/8af03e2487d538f972a79316a/images/7ef96df2-4deb-4f1e-8b70-56a068c6085c.jpg" class="u-responsive u-responsive--full" alt="pattern" style="-ms-interpolation-mode: bicubic; display: block; height: auto; margin: 0 auto; max-width: 100%; outline: 0; text-decoration: none; width: 100%">
              </td>
              <td class="expander" style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; visibility: hidden; width: 0" align="left" valign="top"></td>
            </tr>
          </table>
        </center>
        <center class="s-two-col" style="background: #00f; min-width: 580px; width: 100%">
          <table class="container full" style="border-collapse: collapse; border-spacing: 0; margin: 0 auto; padding: 0; text-align: inherit; vertical-align: top; width: 100% !important">
            <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
              <td style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; width: 100%" align="left" valign="top">
                <div class="media">
                  <div class="wrap" style="padding: 60px 0">
                    <div class="media-image" style="display: block; width: 100%">
                      <div class="inner pull-right" style="float: right; padding-left: 30px">
                        <img src="https://gallery.mailchimp.com/8af03e2487d538f972a79316a/images/1d3c3977-5ee7-40db-8ce7-fe9a99464fcf.jpg" class="u-hidden-lap u-responsive u-responsive--full" alt="Craig Shapiro" style="-ms-interpolation-mode: bicubic; display: block; height: auto; margin: 0 auto; max-width: 100%; outline: 0; text-decoration: none; width: 100%">
                        <img src="https://gallery.mailchimp.com/8af03e2487d538f972a79316a/images/8d899704-8897-4140-a461-f2e864a72dbb.jpg" alt="Craig Shapiro" class="u-hidden-mobile" style="-ms-interpolation-mode: bicubic; display: block; max-height: 0; mso-hide: all; outline: 0; overflow: hidden; text-decoration: none; width: 0">
                        <div class="t-title title" style="color: #f30; font-family: 'Futura-CondensedExtraBold','FuturaStd CondensedExtraBd','FuturaStd-CondensedExtraBd',Futura,'Trebuchet MS',sans-serif; font-size: 60px; font-stretch: condensed; font-weight: 600; line-height: 1; padding: 60px 0; text-transform: uppercase">Questions about startups and venture capital?</div>
                      </div>
                    </div>
                    <div class="media-body" style="display: block; vertical-align: middle; width: 100%">
                      <div class="inner" style="padding-left: 30px">
                        <div class="text" style="color: #fff; line-height: 1.5; padding-left: 60px; padding-right: 100px; word-wrap: normal">Mark your calendar!
                          <br>
                          <br>Craig Shapiro, founder and managing partner of
                          <a href="http://www.collaborativefund.com/" target="_blank" style="color: #fff !important; text-decoration: none">Collaborative Fund</a>, will be answering questions live on Product Hunt, April 6th at 10:00 AM PDT.</div>
                        <div class="t-title title" style="color: #f30; font-family: 'Futura-CondensedExtraBold','FuturaStd CondensedExtraBd','FuturaStd-CondensedExtraBd',Futura,'Trebuchet MS',sans-serif; font-size: 60px; font-stretch: condensed; font-weight: 600; line-height: 1; padding: 60px 0; text-transform: uppercase">
                          <a href="https://www.producthunt.com/live/craig-shapiro" style="color: #f30; text-decoration: underline">Find out more</a>.</div>
                      </div>
                    </div>
                  </div>
                </div>
              </td>
              <td class="gutter u-am" style="border-collapse: collapse !important; max-width: 45px; min-width: 45px; padding: 0; text-align: left; vertical-align: middle; width: 45px" align="left" valign="middle">
                <div class="social">
                  <a href="https://twitter.com/intent/tweet?text=Questions%20about%20startups%3F%20%40cshapiro%20will%20be%20answering%20them%20live%20on%20%40ProductHunt.%20%E2%86%92%20https%3A%2F%2Fwww.producthunt.com%2Flive%2Fcraig-shapiro%20%23Featuring&source=clicktotweet&related=clicktotweet"
                    target="_blank" class="social-button" style="color: #000; text-decoration: none">
                    <img src="https://gallery.mailchimp.com/8af03e2487d538f972a79316a/images/9ccf3535-ddfb-4069-929d-43b3aa372697.jpg" alt="Tweet" class="u-responsive" style="-ms-interpolation-mode: bicubic; border: 0; display: block; height: auto; margin: 0 auto; max-width: 100%; outline: 0; padding-bottom: 2px; text-decoration: none; width: auto">
                  </a>
                  <a href="https://www.facebook.com/login.php?skip_api_login=1&api_key=134530986736267&signed_next=1&next=https%3A%2F%2Fwww.facebook.com%2Fdialog%2Ffeed%3Fapp_id%3D134530986736267%26description%3DMark%2Byour%2Bcalendar%2521%2BCraig%2BShapiro%252C%2Bfounder%2Band%2Bmanaging%2Bpartner%2Bof%2BCollaborative%2BFund%2Bwill%2Bbe%2Banswering%2Bquestions%2Blive%2Bon%2BProduct%2BHunt%2BApril%2B6th%2Bat%2B10%253A00%2BAM.%26link%3Dhttps%253A%252F%252Fwww.producthunt.com%252Flive%252Fcraig-shapiro%26name%3DQuestions%2Babout%2Bstartups%2Bor%2Bventure%2Bcapital%253F%26picture%3Dhttps%253A%252F%252Fgallery.mailchimp.com%252F8af03e2487d538f972a79316a%252Fimages%252F4bea22d1-c089-40aa-84e1-0fb232aeb91b.jpg%26redirect_uri%3Dhttp%253A%252F%252Ffacebook.com%252F&cancel_url=http%3A%2F%2Ffacebook.com%2F%3Ferror_code%3D4201%26error_message%3DUser%2Bcanceled%2Bthe%2BDialog%2Bflow%23_%3D_&display=popup&locale=en_US"
                    target="_blank" class="social-button" style="color: #000; text-decoration: none">
                    <img src="https://gallery.mailchimp.com/8af03e2487d538f972a79316a/images/227f6e86-c817-4f9f-85d4-8e9b3be488da.jpg" alt="Share" class="u-responsive" style="-ms-interpolation-mode: bicubic; border: 0; display: block; height: auto; margin: 0 auto; max-width: 100%; outline: 0; padding-bottom: 2px; text-decoration: none; width: auto">
                  </a>
                </div>
              </td>
              <td class="expander" style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; visibility: hidden; width: 0" align="left" valign="top"></td>
            </tr>
          </table>
        </center>
        <center class="background-blue" style="background-olor: #00f !important; min-width: 580px; width: 100%">
          <table class="container full" style="border-collapse: collapse; border-spacing: 0; margin: 0 auto; padding: 0; text-align: inherit; vertical-align: top; width: 100% !important">
            <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
              <td style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; width: 100%" align="left" valign="top">
                <img src="https://gallery.mailchimp.com/8af03e2487d538f972a79316a/images/18085d6d-dfef-4a02-911e-f74e50864525.jpg" class="u-responsive u-responsive--full" alt="pattern" style="-ms-interpolation-mode: bicubic; display: block; height: auto; margin: 0 auto; max-width: 100%; outline: 0; text-decoration: none; width: 100%">
              </td>
              <td class="expander" style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; visibility: hidden; width: 0" align="left" valign="top"></td>
            </tr>
          </table>
        </center>
        <center class="share s-share" style="min-width: 580px; padding-bottom: -1px; width: 100%">
          <table class="container" align="center" style="background: black no-repeat center center; border-collapse: collapse; border-spacing: 0; margin: 0 auto; padding: 0; text-align: inherit; vertical-align: top; width: 510px" bgcolor="black">
            <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
              <td style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; width: 100%" align="left" valign="top">
                <table class="row" style="border-collapse: collapse; border-spacing: 0; display: block; padding: 0; position: relative; text-align: left; vertical-align: top; width: 100%">
                  <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
                    <td class="wrapper" style="border-collapse: collapse !important; padding: 0; position: relative; text-align: left; vertical-align: top; width: 100%" align="left" valign="top">
                      <table class="four columns" style="border-collapse: collapse; border-spacing: 0; margin: 0 auto; padding: 0; text-align: left; vertical-align: top; width: 185px">
                        <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
                          <td class="u-padding-vertical-sm" style="border-collapse: collapse !important; padding: 15px 0; text-align: left; vertical-align: top; width: 100%" align="left" valign="top">
                            <a href="http://us10.forward-to-friend.com/forward?u=8af03e2487d538f972a79316a&id=5ece84f592&e=11d5ac410f" target="_blank" class="text-red" style="color: #f30 !important; display: block; font-family: 'Futura-CondensedExtraBold','FuturaStd CondensedExtraBd','FuturaStd-CondensedExtraBd',Futura,'Trebuchet MS',sans-serif; font-size: 30px; font-stretch: condensed; font-weight: 600; padding: 75px 0; text-align: center; text-decoration: none; text-transform: uppercase !important">Forward to
                                <br>a friend</a>
                          </td>
                          <td class="expander" style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; visibility: hidden; width: 0" align="left" valign="top"></td>
                        </tr>
                      </table>
                    </td>
                    <td class="wrapper" style="border-collapse: collapse !important; padding: 0; position: relative; text-align: left; vertical-align: top; width: 100%" align="left" valign="top">
                      <table class="four columns" style="border-collapse: collapse; border-spacing: 0; margin: 0 auto; padding: 0; text-align: left; vertical-align: top; width: 185px">
                        <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
                          <td class="u-padding-vertical-sm" style="border-collapse: collapse !important; padding: 15px 0; text-align: left; vertical-align: top; width: 100%" align="left" valign="top">
                            <a target="_blank" href="https://twitter.com/intent/tweet?text=Check%20out%20the%20latest%20issue%20of%20%23Featuring%2C%20a%20newsletter%20from%20%40collabfund%20and%20%40i_am_OTHER%2C%20on%20finding%20your%20purpose.%20%E2%86%92%20http%3A%2F%2Feepurl.com%2FbWhPrD&source=clicktotweet&related=clicktotweet"
                              style="color: white; display: block; font-family: 'Futura-CondensedExtraBold','FuturaStd CondensedExtraBd','FuturaStd-CondensedExtraBd',Futura,'Trebuchet MS',sans-serif; font-size: 30px; font-stretch: condensed; font-weight: 600; padding: 75px 0; text-align: center; text-decoration: none; text-transform: uppercase !important">Tweet
                                <br>This</a>
                          </td>
                          <td class="expander" style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; visibility: hidden; width: 0" align="left" valign="top"></td>
                        </tr>
                      </table>
                    </td>
                    <td class="wrapper last" style="border-collapse: collapse !important; padding: 0; position: relative; text-align: left; vertical-align: top; width: 100%" align="left" valign="top">
                      <table class="four columns" style="border-collapse: collapse; border-spacing: 0; margin: 0 auto; padding: 0; text-align: left; vertical-align: top; width: 185px">
                        <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
                          <td class="u-padding-vertical-sm text-pink" style="border-collapse: collapse !important; color: #ff9aff !important; padding: 15px 0; text-align: left; vertical-align: top; width: 100%" align="left" valign="top">
                            <a target="_blank" href="#" class="text-pink" style="color: #ff9aff !important; display: block; font-family: 'Futura-CondensedExtraBold','FuturaStd CondensedExtraBd','FuturaStd-CondensedExtraBd',Futura,'Trebuchet MS',sans-serif; font-size: 30px; font-stretch: condensed; font-weight: 600; padding: 75px 0; text-align: center; text-decoration: none; text-transform: uppercase !important">View in a
                                <br>Browser</a>
                          </td>
                          <td class="expander" style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; visibility: hidden; width: 0" align="left" valign="top"></td>
                        </tr>
                      </table>
                    </td>
                  </tr>
                </table>
              </td>
            </tr>
          </table>
        </center>
        <center class="s-brand u-ptxl" style="min-width: 580px; padding-top: 100px !important; width: 100%">
          <table class="container" style="border-collapse: collapse; border-spacing: 0; margin: 0 auto; padding: 0; text-align: inherit; vertical-align: top; width: 510px">
            <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
              <td style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; width: 100%" align="left" valign="top">
                <table class="row" style="border-collapse: collapse; border-spacing: 0; display: block; padding: 0; position: relative; text-align: left; vertical-align: top; width: 100%">
                  <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
                    <td class="wrapper last" style="border-collapse: collapse !important; padding: 0; position: relative; text-align: left; vertical-align: top; width: 100%" align="left" valign="top">
                      <table class="twelve columns" style="border-collapse: collapse; border-spacing: 0; margin: 0 auto; padding: 0; text-align: left; vertical-align: top; width: 555px">
                        <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
                          <td class="t-c" style="border-collapse: collapse !important; padding: 0; text-align: center; text-transform: capitalize; vertical-align: top; width: 100%" align="center" valign="top">
                            <a target="_blank" href="http://www.collaborativefund.com/" style="color: #000; text-decoration: none">
                              <img src="https://gallery.mailchimp.com/8af03e2487d538f972a79316a/images/f4f00a31-a6d9-4cd5-b42c-b543b677de8c.jpg" alt="Collaborative fund" style="-ms-interpolation-mode: bicubic; border: 0; outline: 0; text-decoration: none; width: auto">
                            </a>
                          </td>
                          <td class="expander" style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; visibility: hidden; width: 0" align="left" valign="top"></td>
                        </tr>
                      </table>
                    </td>
                  </tr>
                </table>
              </td>
            </tr>
          </table>
        </center>
        <center class="s-brand u-padding-top-md u-padding-bottom-xl" style="min-width: 580px; padding-bottom: 100px !important; padding-top: 30px !important; width: 100%">
          <table class="container" align="center" style="border-collapse: collapse; border-spacing: 0; margin: 0 auto; padding: 0; text-align: inherit; vertical-align: top; width: 510px">
            <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
              <td style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; width: 100%" align="left" valign="top">
                <table class="row" style="border-collapse: collapse; border-spacing: 0; display: block; padding: 0; position: relative; text-align: left; vertical-align: top; width: 100%">
                  <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
                    <td class="wrapper last" style="border-collapse: collapse !important; padding: 0; position: relative; text-align: left; vertical-align: top; width: 100%" align="left" valign="top">
                      <table class="twelve columns" style="border-collapse: collapse; border-spacing: 0; margin: 0 auto; padding: 0; text-align: left; vertical-align: top; width: 555px">
                        <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
                          <td class="t-c" style="border-collapse: collapse !important; padding: 0; text-align: center; text-transform: capitalize; vertical-align: top; width: 100%" align="center" valign="top">
                            <a target="_blank" href="https://www.facebook.com/collabfund" class="link" style="color: #fff; font-family: 'Futura-CondensedExtraBold','FuturaStd CondensedExtraBd','FuturaStd-CondensedExtraBd',Futura,'Trebuchet MS',sans-serif; font-size: 30px; font-stretch: condensed; font-weight: 600; text-decoration: none; text-transform: uppercase">Facebook</a>
                            <a target="_blank" href="https://twitter.com/collabfund" class="link u-phlg" style="color: #fff; font-family: 'Futura-CondensedExtraBold','FuturaStd CondensedExtraBd','FuturaStd-CondensedExtraBd',Futura,'Trebuchet MS',sans-serif; font-size: 30px; font-stretch: condensed; font-weight: 600; padding-left: 60px !important; padding-right: 60px !important; text-decoration: none; text-transform: uppercase">Twitter</a>
                            <a target="_blank" href="https://www.instagram.com/collabfund/" class="link" style="color: #fff; font-family: 'Futura-CondensedExtraBold','FuturaStd CondensedExtraBd','FuturaStd-CondensedExtraBd',Futura,'Trebuchet MS',sans-serif; font-size: 30px; font-stretch: condensed; font-weight: 600; text-decoration: none; text-transform: uppercase">Instagram</a>
                          </td>
                          <td class="expander" style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; visibility: hidden; width: 0" align="left" valign="top"></td>
                        </tr>
                      </table>
                    </td>
                  </tr>
                </table>
              </td>
            </tr>
          </table>
        </center>
        <center class="s-mailchimp u-padding-top-sm u-padding-bottom-md" style="background: black; color: #aaa; min-width: 580px; padding-bottom: 30px !important; padding-top: 15px !important; width: 100%">
          <table class="container" style="border-collapse: collapse; border-spacing: 0; margin: 0 auto; padding: 0; text-align: inherit; vertical-align: top; width: 510px">
            <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
              <td style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; width: 100%" align="left" valign="top">
                <table class="row" style="border-collapse: collapse; border-spacing: 0; display: block; padding: 0; position: relative; text-align: left; vertical-align: top; width: 100%">
                  <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
                    <td class="wrapper last" style="border-collapse: collapse !important; padding: 0; position: relative; text-align: left; vertical-align: top; width: 100%" align="left" valign="top">
                      <table class="twelve columns" style="border-collapse: collapse; border-spacing: 0; margin: 0 auto; padding: 0; text-align: left; vertical-align: top; width: 555px">
                        <tr style="padding: 0; text-align: left; vertical-align: top" align="left">
                          <td class="t-c" style="border-collapse: collapse !important; padding: 0; text-align: center; text-transform: capitalize; vertical-align: top; width: 100%" align="center" valign="top">
                            <p class="t-xs t-c" style="font-family: 'HelveticaNeue-Bold',Helvetica,Helmut,Arial,'Lucida Grande',sans-serif; font-size: 20px; font-style: normal; font-weight: normal; letter-spacing: 0; line-height: 1.25; margin: 0; padding: 0 0 10px; text-align: center; text-transform: none; word-break: normal"
                              align="center">Copyright © 2015</p>
                            <p class="t-xs t-c" style="font-family: 'HelveticaNeue-Bold',Helvetica,Helmut,Arial,'Lucida Grande',sans-serif; font-size: 20px; font-style: normal; font-weight: normal; letter-spacing: 0; line-height: 1.25; margin: 0; padding: 0 0 10px; text-align: center; text-transform: none; word-break: normal"
                              align="center">Collaborative Fund.</p>
                            <p class="t-xs t-c" style="font-family: 'HelveticaNeue-Bold',Helvetica,Helmut,Arial,'Lucida Grande',sans-serif; font-size: 20px; font-style: normal; font-weight: normal; letter-spacing: 0; line-height: 1.25; margin: 0; padding: 0 0 10px; text-align: center; text-transform: none; word-break: normal"
                              align="center">All rights reserved.</p>
                            <p class="t-xs t-c u-ptmd" style="font-family: 'HelveticaNeue-Bold',Helvetica,Helmut,Arial,'Lucida Grande',sans-serif; font-size: 20px; font-style: normal; font-weight: normal; letter-spacing: 0; line-height: 1.25; margin: 0; padding: 30px 0 10px; text-align: center; text-transform: none; word-break: normal"
                              align="center">
                              <a href="http://collaborativefund.us10.list-manage.com/unsubscribe?u=8af03e2487d538f972a79316a&id=ad26275772&e=11d5ac410f&c=5ece84f592" style="color: #aaa !important; text-decoration: none">Unsubscribe?</a>
                            </p>
                            <p class="t-xs t-c u-ptmd" style="font-family: 'HelveticaNeue-Bold',Helvetica,Helmut,Arial,'Lucida Grande',sans-serif; font-size: 20px; font-style: normal; font-weight: normal; letter-spacing: 0; line-height: 1.25; margin: 0; padding: 30px 0 10px; text-align: center; text-transform: none; word-break: normal"
                              align="center">Design and build by
                              <a href="http://www.xxix.co" style="color: #aaa !important; text-decoration: none">XXIX</a>.</p>
                          </td>
                          <td class="expander" style="border-collapse: collapse !important; padding: 0; text-align: left; vertical-align: top; visibility: hidden; width: 0" align="left" valign="top"></td>
                        </tr>
                      </table>
                    </td>
                  </tr>
                </table>
              </td>
            </tr>
          </table>
        </center>
      </td>
    </tr>
  </table>

</body>

</html>
            
          
!
999px
Close

Asset uploading is a PRO feature.

As a PRO member, you can drag-and-drop upload files here to use as resources. Images, Libraries, JSON data... anything you want. You can even edit them anytime, like any other code on CodePen.

Go PRO

Loading ..................

Console