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>
<!--
I SEE YOU PEEPIN OUR CODE...NICE! LEARN MORE ABOUT OUR EMAILS http://pages.litmus.com/e/31032/blog/dwd48t/465835992
QUESTIONS? TWEET US @litmusapp
*** GRAPHICS BY @atippins
*** DEVELOPED BY @kevinmandeville
*** STRATEGY + SENDING BY @ultra_k
-->
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Litmus 2017 Year in Review</title>
    <style type="text/css">
      a {
              text-decoration: none;
          }
          .link:hover {
              text-decoration: none !important;
          }
      	u + #body a {
      		color: inherit;
      		text-decoration: none;
      		font-size: inherit;
      		font-family: inherit;
      		font-weight: inherit;
      		line-height: inherit;
      	}
    </style>
    <style type="text/css">
      a[x-apple-data-detectors] {
              color: inherit !important;
              text-decoration: none !important;
              font-size: inherit !important;
              font-family: inherit !important;
              font-weight: inherit !important;
              line-height: inherit !important;
          }
          @media { }
          @media screen {
              @font-face {
                  font-family: 'proxima_nova_rgregular';
                  src: url('https://litmus.com/fonts/Emails/proximanova-regular-webfont.eot');
                  src: url('https://litmus.com/fonts/Emails/proximanova-regular-webfont.eot?#iefix') format('embedded-opentype'),
                       url('https://litmus.com/fonts/Emails/proximanova-regular-webfont.woff') format('woff'),
                       url('https://litmus.com/fonts/Emails/proximanova-regular-webfont.ttf') format('truetype'),
                       url('https://litmus.com/fonts/Emails/proximanova-regular-webfont.svg#proxima_nova_rgregular') format('svg');
                  font-weight: normal;
                  font-style: normal;
              }
              @font-face {
                  font-family: 'proxima_nova_rgbold';
                  src: url('https://litmus.com/fonts/Emails/proximanova-bold-webfont.eot');
                  src: url('https://litmus.com/fonts/Emails/proximanova-bold-webfont.eot?#iefix') format('embedded-opentype'),
                       url('https://litmus.com/fonts/Emails/proximanova-bold-webfont.woff') format('woff'),
                       url('https://litmus.com/fonts/Emails/proximanova-bold-webfont.ttf') format('truetype'),
                       url('https://litmus.com/fonts/Emails/proximanova-bold-webfont.svg#proxima_nova_rgbold') format('svg');
                  font-weight: normal;
                  font-style: normal;
              }
          }
          @media screen and (-webkit-min-device-pixel-ratio: 0), and (min--moz-device-pixel-ratio: 0) {
              #normal {
                  font-weight: normal !important;
              }
          }
    </style>
    <style>
      @media screen and (min-width: 750px) {
      	.td, .tfoot, .thead {
              display: table-cell !important;
          }
          .table {
              display: table;
              width: 100%;
          }
      	.des-show {
              display: block !important;
          }
      	.des-tal {
      		text-align: left !important;
      	}
      	.des-tar {
      		text-align: right !important;
      	}
      }
    </style>
    <style>
      u ~ div .gmail-bg {
      			background-size: contain;
      		}
      		u ~ div .address a {
      			color: #30454E !important;
      		}
      		u ~ div .gmail-mt25 {
      			margin-top: 25px;
      		}
      		.link-gold:hover, .link-blue:hover {
      			text-decoration: none !important;
      		}
      		.cta-gold:hover {
      			text-decoration: underline;
      		}
      		@media screen and (max-width: 600px) {
      			h1 {
      			font-size: 36px !important;
      			}
      		}
      		@media screen and (min-width: 750px) {
      			.w5p {
      				width: 5%;
      			}
      			.w45p {
      				width: 45%;
      			}
      			.des-pt50 {
      				padding-top: 50px !important;
      			}
      			.des-pb50 {
      				padding-bottom: 50px !important;
      			}
      			.des-pr50 {
      				padding-right: 50px !important;
      			}
      			.des-pl50 {
      				padding-left: 50px !important;
      			}
      			.des-pt75 {
      				padding-top: 75px !important;
      			}
      			.des-pb100 {
      				padding-bottom: 100px !important;
      			}
      		}
      		@media screen and (min-width: 1400px) {
      			.img-show {
      				display: block !important;
      			}
      			u ~ div .img-show {
      				display: none !important;
      			}
      		}
    </style>
    <style>
      @media yahoo {
      			.img-show {
      				display: none !important;
      				width:0px !important;
      				height:0px !important;
      				max-width: 0px !important;
      				max-height: 0px !important;
      				overflow: hidden;
      			}
      		}
    </style>
    <style>
      [owa] .w5p {
      			width: 5%;
      		}
      		[owa] .w45p {
      			width: 45%;
      		}
      		[owa] .td, [owa] .tfoot, [owa] .thead {
      			display: table-cell !important;
      		}
      		[owa] .table {
      			display: table;
      			width: 100%;
      		}
      		[owa] .des-show {
      			display: block !important;
      		}
      		[owa] .des-tal {
      			text-align: left !important;
      		}
      		[owa] .des-tar {
      			text-align: right !important;
      		}
      		[owa] .des-pt50 {
      			padding-top: 50px !important;
      		}
      		[owa] .des-pt75 {
      			padding-top: 75px !important;
      		}
      		[owa] .des-pb50 {
      			padding-bottom: 50px !important;
      		}
      		[owa] .des-pr50 {
      			padding-right: 50px !important;
      		}
      		[owa] .des-pl50 {
      			padding-left: 50px !important;
      		}
      		[owa] .des-pb100 {
      			padding-bottom: 100px !important;
      		}
    </style>
    <style>
      @media screen {
      			@font-face {
      				font-family: 'FuturaPT';
      				src: url('https://litmus.com/fonts/Emails/futura_bold_bt-webfont.eot');
      				src: url('https://litmus.com/fonts/Emails/futura_bold_bt-webfont.eot?#iefix') format('embedded-opentype'),
      					 url('https://litmus.com/fonts/Emails/futura_bold_bt-webfont.woff') format('woff'),
      					 url('https://litmus.com/fonts/Emails/futura_bold_bt-webfont.ttf') format('truetype');
      				font-weight: normal;
      				font-style: normal;
              	}
      		}
      		@keyframes MoveRight {
      			0% {
      				transform: translate(0, 0);
      			}
      			50% {
      				transform: translate(200px, 0);
      			}
      			100% {
      				transform: translate(0, 0);
      			}
      		}
      		@keyframes MoveLeft {
      			0% {
      				transform:translate(0, 0);
      			}
      			50% {
      				transform:translate(-200px, 0);
      			}
      			100% {
      				transform:translate(0, 0);
      			}
      		}
      		@media screen and (-webkit-min-device-pixel-ratio: 0) and (min-width: 480px) {
      			.blue-stars {
      				animation: MoveRight 75s ease-in-out infinite;
      				background: url('http://pages.litmus.com/l/31032/2018-01-09/dw9xb1/31032/138000/stars_blue.png');
      				background-position: center bottom;
      				background-repeat: no-repeat;
      				display: block;
      				position: absolute;
      				left: 0;
      				right: 200px;
      				top: 0;
      				z-index: 1;
      				margin: auto;
      				opacity: 0.8;
      			}
      			.gold-stars {
      				animation: MoveLeft 50s ease-in-out infinite;
      				background: url('http://pages.litmus.com/l/31032/2018-01-09/dw9x9y/31032/137998/stars_gold.png');
      				background-position: center bottom;
      				background-repeat: no-repeat;
      				display: block;
      				position: absolute;
      				left: 200px;
      				right: 0;
      				top: 0;
      				z-index: 1;
      				margin: auto;
      				opacity: 0.5;
      			}
      			.blue-stars, .gold-stars {
      				height: 540px;
      				overflow: hidden !important;
      			}
      		}
    </style>
    <!--[if (gte mso 9)|(IE)]>
      <style>
        .border {
        		border: none !important;
        	}
      </style>
    <![endif]-->
    <style type="text/css">
      /***************
      PADDING 0px
      ***************/
      /***************
      PADDING 5px
      ***************/
      /***************
      PADDING 10px
      ***************/
      /***************
      PADDING 15px
      ***************/
      /***************
      PADDING 20px
      ***************/
      /***************
      PADDING 25px
      ***************/
      /***************
      PADDING 30px
      ***************/
      /***************
      PADDING 35px
      ***************/
      /***************
      PADDING 40px
      ***************/
      /***************
      PADDING 45px
      ***************/
      /***************
      PADDING 50px
      ***************/
      /***************
      PADDING 55px
      ***************/
      /***************
      PADDING 60px
      ***************/
      /***************
      PADDING 65px
      ***************/
      /***************
      PADDING 70px
      ***************/
      /***************
      PADDING 75px
      ***************/
      /***************
      PADDING 100px
      ***************/
      /***************
      PADDING 125px
      ***************/
      /***************
      PADDING 150px
      ***************/
          /**********
          FONT SIZES
          ***********/
          /***********
          LINE HEIGHTS
          ***********/
          /***********
          COLORS
          ***********/
          /***********
          ALIGNMENT
          ***********/
      /***************
      DISPLAY
      ***************/
      /***************
      IMAGES
      ***************/
      /***************
      POSITIONING
      ***************/
      /***************
      MAX-WIDTH
      ***************/
    </style>
  </head>
  <body id="body" style="margin:0;padding:0;">
    <div class="preheader" style="display:none;max-height:0;overflow:hidden;">
      Take a look back at the products, events, and people who helped make 2017 an amazing year.
	</div>
    <div style="display: none; width: 0px; height: 0px; max-height: 0px; overflow: hidden;">
&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;&nbsp;&zwnj;
    </div>
    <div class="frame" style="background-color: #F3F2ED;">
      <!--[if (gte mso 9)|(IE)]>
        <table width="100%" bgcolor="#F3F2ED">
          <tr>
            <td align="center">
      <![endif]-->
      <div style="background: #44545B url('http://pages.litmus.com/l/31032/2018-01-10/dwb7th/31032/138076/stars2.png') bottom no-repeat; overflow: hidden; position: relative;" class="gmail-bg">
        <!--[if (gte mso 9)|(IE)]>
          <table width="100%" bgcolor="#44545B">
            <tr>
              <td align="center">
        <![endif]-->
        <div class="max1200 center pt20 pb50 des-pb100 pl25 pr25" style="padding-top:20px;padding-right:25px;padding-left:25px;padding-bottom:50px;margin:0 auto;max-width:1200px;">
          <!--[if (gte mso 9)|(IE)]>
            <table width="800" style="mso-padding-alt: 25px;">
              <tr>
                <td align="center" style="mso-padding-bottom-alt: 50px;">
          <![endif]-->
          <div class="table" style="position: relative; z-index: 11;">
            <!--[if (gte mso 9)|(IE)]>
              <table width="100%">
                <tr>
                  <td align="left">
            <![endif]-->
            <div class="td pt35 tac des-tal" style="padding-top:35px;text-align:center;">
              <a href="http://pages.litmus.com/e/31032/2018-01-11/dwd48p/465835992" target="_blank" style="font-family:'proxima_nova_rgregular', Proxima Nova, Helvetica, Arial, sans-serif;">
                <img src="http://pages.litmus.com/l/31032/2018-01-10/dwb7ty/31032/138078/litmus_logo_gold.png" alt="Litmus Logo" style="display:block;border:0;display:inline-block;color: #FEE4C0; font-family: sans-serif;" width="150" class="dib"/>
						</a>
            </div>
            <!--[if (gte mso 9)|(IE)]>
            </td>
            <td align="right">
            <![endif]-->
            <div class="td pt25 tac des-tar vam" style="padding-top:25px;text-align:center;vertical-align:middle;">
              <p style="margin:0;font-size:16px;color:#30454E;font-family:'Space Mono', Monospace, Courier New, serif;font-weight:400;-webkit-font-smoothing:antialiased;">
                <a href="#" class="link-gold" style="font-family:'proxima_nova_rgregular', Proxima Nova, Helvetica, Arial, sans-serif;color:#FEE4C0;text-decoration:underline;font-family:'FuturaPT', sans-serif;">View Online</a>
                &nbsp; <span style="color: #FEE4C0;">/</span> &nbsp;
							<a href="http://pages.litmus.com/e/31032/l-20https3A2F2Fctt-ec2FuGKnc2B/dwd48w/465835992" class="link-gold" style="font-family:'proxima_nova_rgregular', Proxima Nova, Helvetica, Arial, sans-serif;color:#FEE4C0;text-decoration:underline;font-family:'FuturaPT', sans-serif;">Share on Twitter</a>
              </p>
            </div>
            <!--[if (gte mso 9)|(IE)]>
            </td>
          </tr>
        </table>
            <![endif]-->
          </div>
          <br>
          <br>
          <br>
          <a href="http://pages.litmus.com/e/31032/m-source-email-utm-medium-news/dwd48m/465835992" target="_blank" style="font-family:'proxima_nova_rgregular', Proxima Nova, Helvetica, Arial, sans-serif;">
            <img src="http://pages.litmus.com/l/31032/2018-01-10/dwb8q7/31032/138126/2017.png" alt="+ 2017 +" width="1000" style="display:block;border:0;text-align:center;margin:0 auto;max-width: 100%; width: 100%; position: relative; z-index: 12; font-size: 200px; margin: 0; color: #deb479; font-family: Impact, sans-serif;" class="center tac">
          </a>
          <!--[if (gte mso 9)|(IE)]>
          </td>
        </tr>
      </table>
          <![endif]-->
        </div>
        <div class="blue-stars"></div>
        <div class="gold-stars"></div>
        <!--[if (gte mso 9)|(IE)]>
        </td>
      </tr>
    </table>
        <![endif]-->
      </div>
      <div class="section center pl25 pr25 des-pl50 des-pr50 pt50" style="padding-right:25px;padding-left:25px;padding-top:50px;margin:0 auto;">
        <!--[if (gte mso 9)|(IE)]>
          <table width="100%">
            <tr>
              <td align="center">
        <![endif]-->
        <div class="border" style="border:4px #DEB47A solid;border-bottom: 0;">
          <div class="max1000 center pl25 pr25 des-pl50 des-pr50 pt50 des-pt75 pb50 tac" style="padding-right:25px;padding-left:25px;padding-top:50px;padding-bottom:50px;text-align:center;margin:0 auto;max-width:1000px;">
            <!--[if (gte mso 9)|(IE)]>
              <table width="800">
                <tr>
                  <td align="center" style="mso-padding-top-alt: 50px;">
            <![endif]-->
            <h1 class="fsz48 pb50" style="margin:0;font-family:'FuturaPT', FuturaPT, Helvetica, Arial, sans-serif;color:#263840;padding-bottom:50px;font-size:48px;">The Litmus 2017 Year in Review</h1>
            <!--[if (gte mso 9)|(IE)]><!-->
					<img src="http://pages.litmus.com/l/31032/2018-01-10/dwb89c/31032/138098/syncing_shapes.png" alt="Shapes" style="display:block;border:0;position: absolute; right: 0; z-index: 0; display: none;" class="img-show"/>
					<!--<![endif]-->
              <div class="table" style="position: relative;">
                <!--[if (gte mso 9)|(IE)]>
                  <br>
                  <table>
                    <tr>
                      <td align="left" valign="middle" bgcolor="#ffffff" width="390" style="mso-padding-alt: 20px;">
                <![endif]-->
                <div class="td bg-white tal w45p" style="text-align:left;background-color:#ffffff;box-shadow:0px 3px 10px rgba(0,0,0,0.05);padding:25px;">
                  <h2 class="fsz36 pb10" style="margin:0;font-family:'FuturaPT', FuturaPT, Helvetica, Arial, sans-serif;color:#263840;padding-bottom:10px;font-size:36px;">3,000,000+</h2>
                  <div style="border: 3px solid #D5DADF; width: 50px;height: 0px;"></div>
                  <p class="pt25" style="margin:0;font-size:16px;color:#30454E;font-family:'Space Mono', Monospace, Courier New, serif;font-weight:400;-webkit-font-smoothing:antialiased;padding-top:25px;">Email campaigns tested</p>
                </div>
                <!--[if (gte mso 9)|(IE)]>
                </td>
                <td width="20">
                <![endif]-->
                <div class="td pt25 w5p" style="padding-top:25px;"></div>
                <!--[if (gte mso 9)|(IE)]>
                </td>
                <td align="left" valign="middle" bgcolor="#ffffff" width="390" style="mso-padding-alt: 20px;">
                <![endif]-->
                <div class="td bg-white tal w45p" style="text-align:left;background-color:#ffffff;box-shadow:0px 3px 10px rgba(0,0,0,0.05);padding:25px;">
                  <h2 class="fsz36 pb10" style="margin:0;font-family:'FuturaPT', FuturaPT, Helvetica, Arial, sans-serif;color:#263840;padding-bottom:10px;font-size:36px;">3,600</h2>
                  <div style="border: 3px solid #D5DADF; width: 50px;height: 0px;"></div>
                  <p class="pt25" style="margin:0;font-size:16px;color:#30454E;font-family:'Space Mono', Monospace, Courier New, serif;font-weight:400;-webkit-font-smoothing:antialiased;padding-top:25px;">Litmus conference t-shirts given away</p>
                </div>
                <!--[if (gte mso 9)|(IE)]>
                </td>
              </tr>
            </table>
            <br>
                <![endif]-->
              </div>
              <div class="table pt25 gmail-mt25" style="padding-top:25px;position: relative;">
                <!--[if (gte mso 9)|(IE)]>
                  <table>
                    <tr>
                      <td align="left" valign="middle" bgcolor="#ffffff" width="390" style="mso-padding-alt: 20px;">
                <![endif]-->
                <div class="td bg-white tal w45p" style="text-align:left;background-color:#ffffff;box-shadow:0px 3px 10px rgba(0,0,0,0.05);padding:25px;">
                  <h2 class="fsz36 pb10" style="margin:0;font-family:'FuturaPT', FuturaPT, Helvetica, Arial, sans-serif;color:#263840;padding-bottom:10px;font-size:36px;">49,000</h2>
                  <div style="border: 3px solid #D5DADF; width: 50px;height: 0px;"></div>
                  <p class="pt25" style="margin:0;font-size:16px;color:#30454E;font-family:'Space Mono', Monospace, Courier New, serif;font-weight:400;-webkit-font-smoothing:antialiased;padding-top:25px;">Report downloads</p>
                </div>
                <!--[if (gte mso 9)|(IE)]>
                </td>
                <td width="20">
                <![endif]-->
                <div class="td pt25 w5p" style="padding-top:25px;"></div>
                <!--[if (gte mso 9)|(IE)]>
                </td>
                <td align="left" valign="middle" bgcolor="#ffffff" width="390" style="mso-padding-alt: 20px;">
                <![endif]-->
                <div class="td bg-white tal w45p" style="text-align:left;background-color:#ffffff;box-shadow:0px 3px 10px rgba(0,0,0,0.05);padding:25px;">
                  <h2 class="fsz36 pb10" style="margin:0;font-family:'FuturaPT', FuturaPT, Helvetica, Arial, sans-serif;color:#263840;padding-bottom:10px;font-size:36px;">$54 billion</h2>
                  <div style="border: 3px solid #D5DADF; width: 50px;height: 0px;"></div>
                  <p class="pt25" style="margin:0;font-size:16px;color:#30454E;font-family:'Space Mono', Monospace, Courier New, serif;font-weight:400;-webkit-font-smoothing:antialiased;padding-top:25px;">Potential ROI saved</p>
                </div>
                <!--[if (gte mso 9)|(IE)]>
                </td>
              </tr>
            </table>
            <br>
            <br>
                <![endif]-->
              </div>
              <p class="pt50 pb25 fsz18 lh28" style="margin:0;font-size:16px;color:#30454E;font-family:'Space Mono', Monospace, Courier New, serif;font-weight:400;-webkit-font-smoothing:antialiased;padding-bottom:25px;padding-top:50px;font-size:18px;line-height:28px;">
                And that&rsquo;s just the tip of the iceberg!
						<br>
                <br>
                Litmus helps top brands, from one-person teams to agencies to global companies, streamline their workflows and send error-free campaigns that perform. See which email clients caused the most headaches, our most popular emails, and more in our 2017 round-up.
					</p>
              <!--[if (gte mso 9)|(IE)]><br>
              <![endif]-->
              <p class="fsz18 lh28" style="margin:0;font-size:16px;color:#30454E;font-family:'Space Mono', Monospace, Courier New, serif;font-weight:400;-webkit-font-smoothing:antialiased;font-size:18px;line-height:28px;mso-padding-top-alt: 15px;">
                <a href="http://pages.litmus.com/e/31032/m-source-email-utm-medium-news/dwd48m/465835992" class="fsz20 cta-gold" style="font-family:'proxima_nova_rgregular', Proxima Nova, Helvetica, Arial, sans-serif;font-size:20px;background-color: #DEB47A; border: 1px solid #DEB47A; mso-border-alt: 8px solid #DEB47A; mso-padding-alt: 0px; color: #ffffff; border-radius: 5px; font-weight: bold; font-family: monospace; display: inline-block; padding: 15px 25px;">The year at Litmus &rarr;</a>
              </p>
              <!--[if (gte mso 9)|(IE)]><br>
                <br>
                <br>
              <![endif]-->
            </div>
          </div>
          <!--[if (gte mso 9)|(IE)]>
          </td>
        </tr>
      </table>
          <![endif]-->
        </div>
        <a href="http://pages.litmus.com/e/31032/m-source-email-utm-medium-news/dwd48m/465835992" target="_blank" style="font-family:'proxima_nova_rgregular', Proxima Nova, Helvetica, Arial, sans-serif;">
          <img src="https://svtesting.com/images/year-in-review/2017/litmus-team.jpg?1515468154" alt="The photogenic Litmus Team" width="1000" style="display:block;border:0;text-align:center;margin:0 auto;max-width: 100%; width:100%; font-size: 60px; line-height: 120px; margin: 0; background-color: #44545B; color: #ffffff; font-family: monospace, sans-serif;" class="center tac"/>
		</a>
        <div class="section center pl25 pr25 des-pl50 des-pr50 pb50" style="padding-right:25px;padding-left:25px;padding-bottom:50px;margin:0 auto;">
          <div class="border" style="border:4px #DEB47A solid;border-top: 0;">
            <!--[if (gte mso 9)|(IE)]>
              <table width="600" align="center">
                <tr>
                  <td align="center" style="mso-padding-alt: 50px;">
            <![endif]-->
            <div class="max600 center tac pt50 pb50 pl15 pr15" style="padding-right:15px;padding-left:15px;padding-top:50px;padding-bottom:50px;text-align:center;margin:0 auto;max-width:600px;">
              <a href="http://pages.litmus.com/e/31032/2018-01-11/dwd48p/465835992" target="_blank" style="font-family:'proxima_nova_rgregular', Proxima Nova, Helvetica, Arial, sans-serif;">
                <img src="http://pages.litmus.com/l/31032/2018-01-10/dwb7v7/31032/138080/litmus_wheel_gold.png" width="40" border="0" alt="" class="dib center" style="display:block;border:0;display:inline-block;margin:0 auto;">
              </a>
              <!--[if (gte mso 9)|(IE)]><br>
                <br>
              <![endif]-->
              <p class="pt15 fsz16 lh24" style="margin:0;color:#30454E;font-family:'Space Mono', Monospace, Courier New, serif;font-weight:400;-webkit-font-smoothing:antialiased;padding-top:15px;font-size:16px;line-height:24px;">
                <span class="address">675 Massachusetts Ave.<br>
                  Cambridge, MA 02139, USA</span><br>
                <a href="#" class="link-blue" target="_blank" style="font-family:'proxima_nova_rgregular', Proxima Nova, Helvetica, Arial, sans-serif;color:#44545B;font-weight:bold;text-decoration:underline;font-family:'FuturaPT', sans-serif;">View online</a>
                <br>
                <br>
                You&rsquo;re receiving this email because you&rsquo;ve signed up to receive updates from Litmus. If you&rsquo;d prefer not to receive updates, you can <a href="#" style="font-family:'proxima_nova_rgregular', Proxima Nova, Helvetica, Arial, sans-serif;color:#44545B;font-weight:bold;text-decoration:underline;font-family:'FuturaPT', sans-serif;">manage your preferences</a> or <a href="#" class="link-blue" style="font-family:'proxima_nova_rgregular', Proxima Nova, Helvetica, Arial, sans-serif;color:#44545B;font-weight:bold;text-decoration:underline;font-family:'FuturaPT', sans-serif;">unsubscribe from all</a>.
						<br>
                <br>
                With the Litmus Email Creative Platform, get access to the most advanced email tools to enable you and your team to do their best work and drive innovation.
						<br>
                <br>
                <a href="http://pages.litmus.com/e/31032/m-source-email-utm-medium-news/dwd48r/465835992" class="link-blue" style="font-family:'proxima_nova_rgregular', Proxima Nova, Helvetica, Arial, sans-serif;color:#44545B;font-weight:bold;text-decoration:underline;font-family:'FuturaPT', sans-serif;">Learn how Litmus can help you send better email&nbsp;today.</a>
              </p>
            </div>
            <!--[if (gte mso 9)|(IE)]>
            </td>
          </tr>
        </table>
            <![endif]-->
          </div>
        </div>
        <!--[if (gte mso 9)|(IE)]>
        </td>
      </tr>
    </table>
        <![endif]-->
      </div>
     
  </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