11 Replies Latest reply on Sep 22, 2017 6:42 AM by Akshay Pant

    Responsive design not showing responsive in email - outlook and gmail so far

    Dante Murphy

      I was just about to spend an email and as a test I sent it to myself in outlook for review (desktop). It appears the email is staying in desktop display and not going responsive as I shrink the screen. Also, I forwarded the email to my gmail account and opened it on my cell phone - it shows the same...any ideas to why this I happening?

        • Re: Responsive design not showing responsive in email - outlook and gmail so far
          Dave Roberts

          Another vote for Litmus here! I'd be lost without it, and they keep adding new stuff to make life easier than ever. Their builder tool is great for making code changes and previewing those immediately (skip the send).

           

          Could you post your code so we could have a look thru it?

           

          It's hard to tell what might be causing that, but b/c you're seeing an issue in gMail and Outlook, it makes me think that it's something in your inline HTML that's wonky. Those two are the most 'literal' readers of HTML in my experience, and they'll usually get thrown by something inline that you think is getting re-styled by the <style> in the <head> or some parent element or something.

            • Re: Responsive design not showing responsive in email - outlook and gmail so far
              Dante Murphy

              Well I tried Inbox Inspector and created some free email accounts and it appears to be working on my phone, but it doesn't seem to be responsive on the computer here...I'm thinking it may be an IT security thing here...? Take a glance and let me know if anything jumps out to you.

               

              Here's the code:

               

              <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

              <html xmlns="http://www.w3.org/1999/xhtml" style="width: 100%;">

                <head>

                  <!-- Marketo Variable Definitions -->

                  <meta class="mktoColor" id="emailBackgroundColor" mktoname="Email Background Color" default="#f2f2f5" mktomodulescope="false" />

                  <meta class="mktoColor" id="blankSpaceBackgroundColor" mktoname="Module Background" default="#f2f2f5" mktomodulescope="true" />

                  <meta class="mktoNumber" id="blankSpaceSpacer" mktoname="Top Spacer" default="40" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoColor" id="headerBackgroundColor" mktoname="Module Background" default="#ffffff" mktomodulescope="true" />

                  <meta class="mktoNumber" id="headerSpacer" mktoname="Top Spacer" default="20" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="headerSpacer2" mktoname="Spacer Below Right Image" default="8" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="headerSpacer3" mktoname="Bottom Spacer" default="20" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoImg" id="heroBackgroundImage" mktoname="Background Image" default="http://templates.marketo.net/newsletter8/bg-hero.jpg" mktomodulescope="true" />

                  <meta class="mktoColor" id="heroBackgroundColor" mktoname="Module Background" default="#333333" mktomodulescope="true" />

                  <meta class="mktoColor" id="heroButtonBackgroundColor" mktoname="Button Background Color" default="#47c097" mktomodulescope="true" />

                  <meta class="mktoColor" id="heroBorderColor" mktoname="Button Border Color" default="#33ac83" mktomodulescope="true" />

                  <meta class="mktoNumber" id="heroBorderSize" mktoname="Button Border Width" default="1" min="0" max="20" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoString" id="heroLinkText" mktoname="Button Text" default="DISCOVER" mktomodulescope="true" />

                  <meta class="mktoString" id="heroLink" mktoname="Button Link" default="http://mylink" mktomodulescope="true" />

                  <meta class="mktoColor" id="threeArticlesBackgroundColor" mktoname="Module Background" default="#efeef4" mktomodulescope="true" />

                  <meta class="mktoNumber" id="threeArticlesSpacer" mktoname="Top Spacer" default="30" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoColor" id="threeArticlesBorderColor" mktoname="Left Box Border Border Color" default="#ffffff" mktomodulescope="true" />

                  <meta class="mktoNumber" id="threeArticlesBorderSize" mktoname="Left Box Border Border Width" default="1" min="0" max="20" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoColor" id="threeArticlesBackgroundColor2" mktoname="Left Box Background" default="#FFFFFF" mktomodulescope="true" />

                  <meta class="mktoNumber" id="threeArticlesSpacer2" mktoname="Spacer Below Left Image" default="20" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="threeArticlesSpacer3" mktoname="Spacer Below Left Date" default="20" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="threeArticlesSpacer4" mktoname="Spacer Below Left Title" default="25" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="threeArticlesSpacer5" mktoname="Spacer Below Left Text" default="30" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoColor" id="threeArticlesButtonBackgroundColor" mktoname="Left Button Background Color" default="#47c097" mktomodulescope="true" />

                  <meta class="mktoColor" id="threeArticlesBorderColor2" mktoname="Left Button Border Color" default="#47c097" mktomodulescope="true" />

                  <meta class="mktoNumber" id="threeArticlesBorderSize2" mktoname="Left Button Border Width" default="1" min="0" max="20" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="threeArticlesSpacer6" mktoname="Spacer Below Left Button" default="30" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoColor" id="threeArticlesBorderColor3" mktoname="Center Box Border Border Color" default="#e4e4e4" mktomodulescope="true" />

                  <meta class="mktoNumber" id="threeArticlesBorderSize3" mktoname="Center Box Border Border Width" default="1" min="0" max="20" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoColor" id="threeArticlesBackgroundColor4" mktoname="Center Box Background" default="#FFFFFF" mktomodulescope="true" />

                  <meta class="mktoNumber" id="threeArticlesSpacer7" mktoname="Spacer Below Center Image" default="20" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="threeArticlesSpacer8" mktoname="Spacer Below Center Date" default="20" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="threeArticlesSpacer9" mktoname="Spacer Below Center Title" default="25" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="threeArticlesSpacer10" mktoname="Spacer Below Center Text" default="30" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoColor" id="threeArticlesButtonBackgroundColor2" mktoname="Center Button Background Color" default="#47c097" mktomodulescope="true" />

                  <meta class="mktoColor" id="threeArticlesBorderColor4" mktoname="Center Button Border Color" default="#47c097" mktomodulescope="true" />

                  <meta class="mktoNumber" id="threeArticlesBorderSize4" mktoname="Center Button Border Width" default="1" min="0" max="20" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="threeArticlesSpacer11" mktoname="Spacer Below Center Button" default="30" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoColor" id="threeArticlesBorderColor5" mktoname="Right Box Border Border Color" default="#e4e4e4" mktomodulescope="true" />

                  <meta class="mktoNumber" id="threeArticlesBorderSize5" mktoname="Right Box Border Border Width" default="1" min="0" max="20" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoColor" id="threeArticlesBackgroundColor6" mktoname="Right Box Background" default="#FFFFFF" mktomodulescope="true" />

                  <meta class="mktoNumber" id="threeArticlesSpacer12" mktoname="Spacer Below Right Image" default="20" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="threeArticlesSpacer13" mktoname="Spacer Below Right Date" default="20" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="threeArticlesSpacer14" mktoname="Spacer Below Right Title" default="25" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="threeArticlesSpacer15" mktoname="Spacer Below Right Text" default="30" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoColor" id="threeArticlesButtonBackgroundColor3" mktoname="Right Button Background Color" default="#47c097" mktomodulescope="true" />

                  <meta class="mktoColor" id="threeArticlesBorderColor6" mktoname="Right Button Border Color" default="#47c097" mktomodulescope="true" />

                  <meta class="mktoNumber" id="threeArticlesBorderSize6" mktoname="Right Button Border Width" default="1" min="0" max="20" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="threeArticlesSpacer16" mktoname="Spacer Below Right Button" default="30" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="threeArticlesSpacer17" mktoname="Bottom Spacer" default="30" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoString" id="threeArticlesLinkText" mktoname="Left Button Text" default="READ MORE" mktomodulescope="true" />

                  <meta class="mktoString" id="threeArticlesLink" mktoname="Left Button Link" default="http://mylink" mktomodulescope="true" />

                  <meta class="mktoString" id="threeArticlesLinkText2" mktoname="Center Button Text" default="READ MORE" mktomodulescope="true" />

                  <meta class="mktoString" id="threeArticlesLink2" mktoname="Center Button Link" default="http://mylink" mktomodulescope="true" />

                  <meta class="mktoString" id="threeArticlesLinkText3" mktoname="Right Button Text" default="READ MORE" mktomodulescope="true" />

                  <meta class="mktoString" id="threeArticlesLink3" mktoname="Right Button Link" default="http://mylink" mktomodulescope="true" />

                  <meta class="mktoColor" id="titleBackgroundColor" mktoname="Module Background" default="#efeef4" mktomodulescope="true" />

                  <meta class="mktoNumber" id="titleSpacer" mktoname="Top Spacer" default="40" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="titleSpacer2" mktoname="Bottom Spacer" default="40" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoColor" id="freeImageBackgroundColor" mktoname="Module Background" default="#efeef4" mktomodulescope="true" />

                  <meta class="mktoNumber" id="freeImageSpacer" mktoname="Top Spacer" default="20" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="freeImageSpacer2" mktoname="Bottom Spacer" default="20" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoColor" id="freeTextBackgroundColor" mktoname="Module Background" default="#efeef4" mktomodulescope="true" />

                  <meta class="mktoNumber" id="freeTextSpacer" mktoname="Top Spacer" default="25" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="freeTextSpacer2" mktoname="Bottom Spacer" default="25" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoColor" id="callToActionBackgroundColor" mktoname="Module Background" default="#efeef4" mktomodulescope="true" />

                  <meta class="mktoNumber" id="callToActionSpacer" mktoname="Top Spacer" default="15" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoColor" id="callToActionButtonBackgroundColor" mktoname="Button Background Color" default="#47c097" mktomodulescope="true" />

                  <meta class="mktoColor" id="callToActionBorderColor" mktoname="Button Border Color" default="#32ad84" mktomodulescope="true" />

                  <meta class="mktoNumber" id="callToActionBorderSize" mktoname="Button Border Width" default="1" min="0" max="20" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="callToActionSpacer2" mktoname="Bottom Spacer" default="25" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoString" id="callToActionLinkText" mktoname="Button Text" default="VIEW DETAILS" mktomodulescope="true" />

                  <meta class="mktoString" id="callToActionLink" mktoname="Button Link" default="http://mylink" mktomodulescope="true" />

                  <meta class="mktoColor" id="separatorBackgroundColor" mktoname="Module Background" default="#efeef4" mktomodulescope="true" />

                  <meta class="mktoNumber" id="separatorSpacer" mktoname="Top Spacer" default="15" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoColor" id="separatorColor" mktoname="Separator Color" default="#b2b2b2" mktomodulescope="true" />

                  <meta class="mktoNumber" id="separatorSize" mktoname="Separator Width" default="1" min="0" max="20" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="separatorSpacer2" mktoname="Top Spacer" default="15" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoColor" id="horizontalBackgroundColor" mktoname="Module Background" default="#efeef4" mktomodulescope="true" />

                  <meta class="mktoNumber" id="horizontalSpacer" mktoname="Top Spacer" default="20" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoColor" id="horizontalBorderColor" mktoname="Left Box Border Border Color" default="#e4e4e4" mktomodulescope="true" />

                  <meta class="mktoNumber" id="horizontalBorderSize" mktoname="Left Box Border Border Width" default="1" min="0" max="20" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoColor" id="horizontalBackgroundColor2" mktoname="Left Box Background" default="#FFFFFF" mktomodulescope="true" />

                  <meta class="mktoNumber" id="horizontalSpacer2" mktoname="Top Spacer" default="20" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="horizontalSpacer3" mktoname="Spacer Below Left Date" default="10" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="horizontalSpacer4" mktoname="Spacer Below Left Title" default="10" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="horizontalSpacer5" mktoname="Spacer Below Left Text" default="20" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoColor" id="horizontalButtonBackgroundColor" mktoname="Left Button Background Color" default="#47c097" mktomodulescope="true" />

                  <meta class="mktoColor" id="horizontalBorderColor2" mktoname="Left Button Border Color" default="#47c097" mktomodulescope="true" />

                  <meta class="mktoNumber" id="horizontalBorderSize2" mktoname="Left Button Border Width" default="1" min="0" max="20" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="horizontalSpacer6" mktoname="Spacer Below Left Button" default="20" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="horizontalSpacer7" mktoname="Bottom Spacer" default="20" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoString" id="horizontalLinkText" mktoname="Left Button Text" default="READ MORE" mktomodulescope="true" />

                  <meta class="mktoString" id="horizontalLink" mktoname="Left Button Link" default="http://mylink" mktomodulescope="true" />

                  <meta class="mktoColor" id="overlayImageBackgroundColor" mktoname="Module Background" default="#efeef4" mktomodulescope="true" />

                  <meta class="mktoNumber" id="overlayImageSpacer" mktoname="Top Spacer" default="20" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoImg" id="overlayImageBackgroundImage" mktoname="Background Image" default="http://templates.marketo.net/newsletter8/big-hero2.jpg" mktomodulescope="true" />

                  <meta class="mktoColor" id="overlayImageBackgroundColor2" mktoname="Box Background" default="#efeef4" mktomodulescope="true" />

                  <meta class="mktoColor" id="overlayImageBackgroundColor3" mktoname="Box" default="#FFFFFF" mktomodulescope="true" />

                  <meta class="mktoColor" id="featuresBackgroundColor" mktoname="Module Background" default="#efeef4" mktomodulescope="true" />

                  <meta class="mktoNumber" id="featuresSpacer" mktoname="Top Spacer" default="20" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoColor" id="featuresBorderColor" mktoname="Box border Border Color" default="#e4e4e4" mktomodulescope="true" />

                  <meta class="mktoNumber" id="featuresBorderSize" mktoname="Box border Border Width" default="1" min="0" max="20" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoColor" id="featuresBackgroundColor2" mktoname="Left Box background" default="#FFFFFF" mktomodulescope="true" />

                  <meta class="mktoNumber" id="featuresSpacer2" mktoname="Top Spacer" default="20" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="featuresSpacer3" mktoname="Spacer Below Left Image" default="20" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="featuresSpacer4" mktoname="Spacer Below Left Data Title" default="10" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="featuresSpacer5" mktoname="Spacer Below Left Links" default="20" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoColor" id="featuresBorderColor2" mktoname="Left Box border Border Color" default="#e4e4e4" mktomodulescope="true" />

                  <meta class="mktoNumber" id="featuresBorderSize2" mktoname="Left Box border Border Width" default="1" min="0" max="20" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoColor" id="featuresBackgroundColor3" mktoname="Center Box background" default="#FFFFFF" mktomodulescope="true" />

                  <meta class="mktoNumber" id="featuresSpacer6" mktoname="Spacer Below Center Links" default="20" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="featuresSpacer7" mktoname="Spacer Below Center Image" default="20" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="featuresSpacer8" mktoname="Spacer Below Center Data Title" default="10" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="featuresSpacer9" mktoname="Spacer Below Center Links" default="20" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoColor" id="featuresBorderColor3" mktoname="Center Box border Border Color" default="#e4e4e4" mktomodulescope="true" />

                  <meta class="mktoNumber" id="featuresBorderSize3" mktoname="Center Box border Border Width" default="1" min="0" max="20" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoColor" id="featuresBackgroundColor4" mktoname="Right Box background" default="#FFFFFF" mktomodulescope="true" />

                  <meta class="mktoNumber" id="featuresSpacer10" mktoname="Spacer Below Right Links" default="20" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="featuresSpacer11" mktoname="Spacer Below Right Image" default="20" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="featuresSpacer12" mktoname="Spacer Below Right Data Title" default="10" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="featuresSpacer13" mktoname="Spacer Below Right Links" default="20" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="featuresSpacer14" mktoname="Bottom Spacer" default="20" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoColor" id="footerBackgroundColor" mktoname="Module Background" default="#efeef4" mktomodulescope="true" />

                  <meta class="mktoNumber" id="footerSpacer" mktoname="Top Spacer" default="25" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="footerSpacer2" mktoname="Spacer Below Text" default="20" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoNumber" id="footerSpacer3" mktoname="Bottom Spacer" default="25" min="1" max="300" units="px" step="1" mktomodulescope="true" />

                  <meta class="mktoString" id="footerLink" mktoname="Facebook Icon Link" default="http://mylink" mktomodulescope="true" />

                  <meta class="mktoString" id="footerLink2" mktoname="Twitter Icon Link" default="http://mylink" mktomodulescope="true" />

                  <!-- Other Meta Tags -->

                  <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />

                  <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1" />

                  <meta name="robots" content="noindex,nofollow" />

                  <meta http-equiv="X-UA-Compatible" content="IE=edge" />

                  <link href="https://fonts.googleapis.com/css?family=Montserrat:300,400,700" rel="stylesheet" type="text/css" />

                  <link href="https://fonts.googleapis.com/css?family=Questrial:300,400,700" rel="stylesheet" type="text/css" />

                  <!--[if mso]>

              <style type='text/css'>

              .primary-font {

              font-family: Arial, sans-serif !important;

              }

              </style>

              <![endif]-->

                  <!--[if mso]>

              <style type='text/css'>

              .secondary-font {

              font-family: Arial, sans-serif !important;

              }

              </style>

              <![endif]-->

                  <style>

              /*startcommon*/

              @media only screen and (max-width: 640px) {

              table.m_boxing{

              width: 100% !important;

              }

              }

              /*endcommon*/

              </style>

                  <style media="all">

              /* CLIENT-SPECIFIC STYLES */

              #outlook a {

                padding: 0;

              }

              /* Force Outlook to provide a "view in browser" message */

              .ReadMsgBody {

                width: 100%;

              }

              .ExternalClass {

                width: 100%;

              }

              /* Force Hotmail to display emails at full width */

              .ExternalClass,

              .ExternalClass p,

              .ExternalClass span,

              .ExternalClass font,

              .ExternalClass td,

              .ExternalClass div {

                line-height: 100%;

              }

              /* Force Hotmail to display normal line spacing */

              /* iOS BLUE LINKS */

              .appleBody a {

                color: .m_000;

                text-decoration: none;

              }

              .appleFooter a {

                color: .m_000;

                text-decoration: none;

              }

              @-ms-viewport {

                  width: device-width;

              }

                  </style>

                  <style media="all">

              @media only screen and (max-width: 640px) {

              /*starttablet*/

              body {

              width: auto !important;

              }

              table.table600{

              width: 500px !important;

              }

              table.table-inner{

              width: 86% !important;

              }

              table.table1-2{

              width: 47% !important;

              clear: both;

              }

              table.table1-3{

              width: 29.4% !important;

              }

              table.table1-4{

              width: 100% !important;

              text-align: left !important;

              }

              table.table2-3{

              width: 64% !important;

              text-align: center !important;

              }

              table.table3-3{

              width: 100% !important;

              text-align: center !important;

              clear: both;

              }

              table.footer-logo{

              width: 10% !important;

              text-align: right !important;

              }

              td.outer{

              min-width: 0 !important;

              }

              td.stack{

              padding-bottom: 40px !important;

              }

              .stack-tablet {

              padding-bottom: 20px !important;

              overflow: visible !important;

              float: none !important;

              mso-hide: none !important;

              display: block !important;

              }

              img.mobile-img{

              width: 100% !important;

              height: auto !important;

              }

              td.center-tablet{

              text-align: center !important;

              }

              td.hide-tablet{

              display: none !important;

              }

              table.footer-column{

              width: 47% !important;

              text-align: left !important;

              }

              .m_header td {

              text-align: center !important;

              }

              .m_hero .background {

              background-size: cover !important;

              }

              .m_overlay-image .background {

              background-size: cover !important;

              }

              .mktoVideoThumbnail{

              width: 100% !important;

              height: auto!important;

              max-height:inherit!important;

              min-height:inherit!important;

              }

              .m_menu {

              padding-top: 10px !important;

              padding-right: 0 !important;

              padding-bottom: 10px !important;

              padding-left: 0 !important;

              }

              .m_menu p {

              display: block !important;

              padding-top: 0 !important;

              padding-right: 0 !important;

              padding-bottom: 10px !important;

              padding-left: 0 !important;

              }

              .m_horizontal img {

              display: inline-block;

              margin-top: 0;

              margin-right: auto;

              margin-bottom: 30px;

              margin-left: auto;

              }

              .m_article .table1-2 {

              width: 100% !important;

              clear: both;

              }

              .m_article .cta table {

              margin-top: 0 !important;

              margin-right: auto !important;

              margin-bottom: 0 !important;

              margin-left: auto !important;

              }

              .m_overlay-image .box {

              float: none !important;

              width: 220px;

              margin-top: 0 !important;

              margin-right: auto !important;

              margin-bottom: 0 !important;

              margin-left: auto !important;

              }

              .m_contacts .table1-2 {

              width: 100% !important;

              clear: both;

              text-align: center !important;

              }

              .m_free-image img {

              width: 450px !important;

              height: auto;

              }

              .m_team .spacer,

              .m_three-articles .spacer {

              width: 28px !important;

              }

              .m_features .spacer {

              width: 26px;

              }

              /*endtablet*/

              }

              @media only screen and (max-width: 479px) {

              /*startmobile*/

              body {

              width: auto !important;

              }

              table.table600{

              width: 350px !important;

              }

              table.table-inner{

              width: 80% !important;

              float: none !important;

              }

              table.table1-2{

              width: 100% !important;

              clear: both;

              }

              table.table1-3{

              width: 100% !important;

              clear: both;

              }

              table.table1-4{

              width: 100% !important;

              text-align: center !important;

              }

              table.table2-3{

              width: 100% !important;

              text-align: center !important;

              }

              table.table3-3{

              width: 100% !important;

              text-align: center !important;

              clear: both;

              }

              table.footer-logo{

              width: 60% !important;

              text-align: center !important;

              }

              td.outer{

              min-width: 0 !important;

              }

              td.td3-1{

              width: 60% !important;

              text-align: center !important;

              }

              .stack-smartphone {

              padding-bottom: 20px !important;

              overflow: visible !important;

              float: none !important;

              display: block !important;

              mso-hide: none !important;

              }

              td.center-smartphone{

              text-align: center !important;

              }

              img.mobile-img{

              width: 100% !important;

              }

              td.center-tablet{

              text-align: center !important;

              }

              td.hide-smartphone{

              display: none !important;

              }

              table.footer-column{

              width: 100% !important;

              text-align: center !important;

              }

              .m_free-image img {

              width: 480px !important;

              height: auto;

              }

              .m_horizontal img {

              margin-top: 0 !important;

              margin-right: auto !important;

              margin-bottom: 0 !important;

              margin-left: auto !important;

              }

              .m_hero .background {

              background-size: cover !important;

              }

              .m_overlay-image .background {

              background-size: cover !important;

              }

              /*endmobile*/

              }

              table.table3-3 { width: 100% !important;

              text-align: center !important;

              clear: both;

              }

              table.table3-3 { width: 100% !important;

              text-align: center !important;

              clear: both;

              }

                  </style>

                </head>

                <body style="margin-bottom: 0; -webkit-text-size-adjust: 100%; padding-bottom: 0; min-width: 100%; margin-top: 0; margin-right: 0; -ms-text-size-adjust: 100%; margin-left: 0; padding-top: 0; padding-right: 0; padding-left: 0; width: 100%;">

                  <div style="display:none; white-space:nowrap; font:15px courier; line-height:0;">

                                                                                

                  </div>

                  <!-- Outer table START -->

                  <table border="0" cellpadding="0" cellspacing="0" width="100%" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;">

                    <tbody>

                      <tr>

                        <td class="outer" valign="top" style="-webkit-hyphens: none;-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-ms-text-size-adjust: 100%;-moz-hyphens: none;hyphens: none;font-family: 'Montserrat', Arial, sans-serif;min-width: 600px;border-collapse: collapse;background-color:${emailBackgroundColor};">

                          <table width="640" align="center" id="boxing" border="0" cellpadding="0" cellspacing="0" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse; margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto;" class="m_boxing">

                            <tbody>

                              <tr>

                                <td class="mktoContainer boxedbackground" id="template-wrapper" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; font-family: 'Montserrat', Arial, sans-serif; border-collapse: collapse;">

                                  <table id="header" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="center" border="0" cellpadding="0" cellspacing="0" width="100%" class="mktoModule m_header" mktoname="Header">

                                    <tbody>

                                      <tr>

                                        <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;font-family: 'Montserrat', Arial, sans-serif;border-collapse: collapse;background-color:#ffffff;" bgcolor="#ffffff" valign="top">

                                          <table class="table600" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse; margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto;" align="center" border="0" cellpadding="0" cellspacing="0" width="600">

                                            <tbody>

                                              <tr>

                                                <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;font-family: 'Montserrat', Arial, sans-serif;border-collapse: collapse;line-height:${headerSpacer};font-size:${headerSpacer};" height="${headerSpacer}"> </td>

                                              </tr>

                                              <tr>

                                                <td style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; font-family: 'Montserrat', Arial, sans-serif; border-collapse: collapse;">

                                                  <center>

                                                    <table class="table3-3" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="left" border="0" cellpadding="0" cellspacing="0" width="220">

                                                      <tbody>

                                                        <tr>

                                                          <td class="center-tablet logo" style="-webkit-hyphens: none; -webkit-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -ms-text-size-adjust: 100%; -moz-hyphens: none; hyphens: none; font-family: 'Montserrat', Arial, sans-serif; text-align: center; border-collapse: collapse;">

                                                            <div style="display:inline-block" class="mktoImg" mktoname="Logo" id="logo" mktolockimgsize="true">

                                                              <a><img src="http://pages.marlinfinance.com/rs/497-RBB-058/images/panasonic-logo.jpg" style="-ms-interpolation-mode: bicubic; outline: none; border-right-width: 0; border-bottom-width: 0; border-left-width: 0; text-decoration: none; border-top-width: 0; max-width: 100%; line-height: 100%; width: 181px; display: inline-block; height: auto;" height="auto" width="150" alt="panasonic-logo" /></a>

                                                            </div> </td>

                                                        </tr>

                                                      </tbody>

                                                    </table>

                                                    <table class="table3-3" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="right" border="0" cellpadding="0" cellspacing="0" width="340">

                                                      <tbody>

                                                        <tr class="stack-tablet" style="max-height:0px;overflow:hidden;padding-left: 0; overflow: hidden; margin-left: 0; padding-top: 0; padding-right: 0; padding-bottom: 0; float: left; margin-top: 0; margin-right: 0; margin-bottom: 0; mso-hide: all; display: none;">

                                                          <td style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; font-family: 'Montserrat', Arial, sans-serif; border-collapse: collapse;"> </td>

                                                        </tr>

                                                        <tr style="outline: medium none;" class="date">

                                                          <td class="secondary-font center-tablet" style="-moz-hyphens: none;-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-ms-text-size-adjust: 100%;hyphens: none;font-family:'Questrial', Arial, sans-serif;text-align: right;color: #878b99;font-size: 12px;border-collapse: collapse;" valign="middle">

                                                            <div class="mktoText" mktoname="Right Date" id="date">

                                                              <p style="text-align: center;"><span style="color: #005dab;">Contact your financing specialist for details.</span></p>

                                                            </div> </td>

                                                        </tr>

                                                      </tbody>

                                                    </table>

                                                  </center> </td>

                                              </tr>

                                              <tr>

                                                <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;font-family: 'Montserrat', Arial, sans-serif;border-collapse: collapse;line-height:${headerSpacer3};font-size:${headerSpacer3};" height="${headerSpacer3}"> </td>

                                              </tr>

                                            </tbody>

                                          </table> </td>

                                      </tr>

                                    </tbody>

                                  </table>

                                  <table id="free-image" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="center" border="0" cellpadding="0" cellspacing="0" width="100%" class="mktoModule m_free-image" mktoname="Free-image">

                                    <tbody>

                                      <tr>

                                        <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;font-family: 'Montserrat', Arial, sans-serif;border-collapse: collapse;background-color:#f2f2f5;" bgcolor="#f2f2f5" valign="top">

                                          <center>

                                            <table class="table600" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse; margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto;" align="center" border="0" cellpadding="0" cellspacing="0" width="640">

                                              <tbody>

                                                <tr>

                                                  <td style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; font-family: 'Montserrat', Arial, sans-serif; border-collapse: collapse;">

                                                    <center>

                                                      <div style="display:inline-block" class="mktoImg" mktoname="Photo" id="photo4" mktolockimgsize="true">

                                                        <a><img alt="Photo" src="http://pages.marlinfinance.com/rs/marlinleasingcorporation/images/panasonic-bts-july16-header.png" style="-ms-interpolation-mode: bicubic; outline: none; border-right-width: 0; border-bottom-width: 0; border-left-width: 0; text-decoration: none; border-top-width: 0; width: auto; height: auto; max-width: 100%; display: block; line-height: 100%;" width="640" /></a>

                                                      </div>

                                                    </center> </td>

                                                </tr>

                                                <tr>

                                                  <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;font-family: 'Montserrat', Arial, sans-serif;border-collapse: collapse;line-height:${freeImageSpacer2};font-size:${freeImageSpacer2};" height="${freeImageSpacer2}"> </td>

                                                </tr>

                                              </tbody>

                                            </table>

                                          </center> </td>

                                      </tr>

                                    </tbody>

                                  </table>

                                  <table id="free-text" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="center" border="0" cellpadding="0" cellspacing="0" width="100%" class="mktoModule m_free-text" mktoname="Free-text">

                                    <tbody>

                                      <tr>

                                        <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;font-family: 'Montserrat', Arial, sans-serif;border-collapse: collapse;background-color:#ffffff;" bgcolor="#ffffff" valign="top">

                                          <center>

                                            <table class="table600" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse; margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto;" align="center" border="0" cellpadding="0" cellspacing="0" width="600">

                                              <tbody>

                                                <tr>

                                                  <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;font-family: 'Montserrat', Arial, sans-serif;border-collapse: collapse;line-height:${freeTextSpacer};font-size:${freeTextSpacer};" height="${freeTextSpacer}"> </td>

                                                </tr>

                                                <tr>

                                                  <td class="primary-font text" style="-moz-hyphens: none;-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-ms-text-size-adjust: 100%;hyphens: none;font-family:'Montserrat', Arial, sans-serif;font-size: 14px;color: #333333;line-height: 170%;border-collapse: collapse;">

                                                    <div class="mktoText" mktoname="Text" id="text4">

                                                      <p style="text-align: left;"><span style="color: #323232; font-size: 26px;"><strong></strong></span>Panasonic Business Finance is currently offering an <span style="color: #005dab;"><strong>EXCLUSIVE</strong></span> 0% financing option for Panasonic KX-NS700 and KX-NS1000 communication equipment.</p>

                                                      <p style="text-align: left;"><span style="color: #005dab;"><strong><span style="font-size: 22px;">PROMOTION DETAILS:</span></strong></span></p>

                                                      <ul>

                                                        <li style="text-align: left;">0% Finance rate is valid on KX-NS700 and KX-NS1000 and associated Panasonic equipment only<br /></li>

                                                        <li style="text-align: left;">36 Month finance term / Purchase Option = $1.00 Buy Out<br /></li>

                                                        <li style="text-align: left;">First and last payments required at the time of contract execution<br /></li>

                                                        <li style="text-align: left;">Must be on one shippable Purchase Order<br /></li>

                                                        <li style="text-align: left;">Services such as installation are not eligible for the 0% rate<br /></li>

                                                        <li style="text-align: left;">Extended terms are available upon request<br /></li>

                                                        <ul style="text-align: left;">

                                                          <li>48 Months at 1.99%</li>

                                                          <li>60 Months at 2.99%</li>

                                                        </ul>

                                                        <li style="text-align: left;">Shorter terms, such as 24 months, are available upon request<br /></li>

                                                        <li style="text-align: left;">Offer valid between <span style="color: #005dab;"><strong>7/1/17 and 9/30/17</strong></span><br /></li>

                                                        <li style="text-align: left;">Subject to credit approval<br /></li>

                                                        <li style="text-align: left;">Documentation fee of $150 applies<br /></li>

                                                        <li style="text-align: left;">A quotation including Line item pricing must be provided<br /></li>

                                                        <li style="text-align: left;">Executed lease documents must be received by <span style="color: #005dab;"><strong>9/28/17</strong></span><br /></li>

                                                        <li style="text-align: left;">Installation must occur no later than <span style="color: #005dab;"><strong>10/27/17</strong></span><br /></li>

                                                      </ul>

                                                    </div> </td>

                                                </tr>

                                              </tbody>

                                            </table>

                                          </center> </td>

                                      </tr>

                                    </tbody>

                                  </table>

                                  <table id="free-text4cda17f9-f787-4c66-8442-1003fac2da28" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="center" border="0" cellpadding="0" cellspacing="0" width="100%" class="mktoModule m_free-text" mktoname="Free-text-clone">

                                    <tbody>

                                      <tr>

                                        <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;font-family: 'Montserrat', Arial, sans-serif;border-collapse: collapse;background-color:#ffffff;" bgcolor="#ffffff" valign="top">

                                          <center>

                                            <table class="table600" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse; margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto;" align="center" border="0" cellpadding="0" cellspacing="0" width="600">

                                              <tbody>

                                                <tr>

                                                  <td class="primary-font text" style="-moz-hyphens: none;-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-ms-text-size-adjust: 100%;hyphens: none;font-family:'Montserrat', Arial, sans-serif;font-size: 14px;color: #333333;line-height: 170%;border-collapse: collapse;">

                                                    <div class="mktoText" mktoname="Text" id="text44cda17f9-f787-4c66-8442-1003fac2da28">

                                                      <p style="text-align: center;"><span style="font-size: 20px; color: #005dab;"><strong>Contact your assigned National Account Executive for more information.</strong></span><br /></p>

                                                    </div> </td>

                                                </tr>

                                                <tr>

                                                  <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;font-family: 'Montserrat', Arial, sans-serif;border-collapse: collapse;line-height:${freeTextSpacer2};font-size:${freeTextSpacer2};" height="${freeTextSpacer2}"> </td>

                                                </tr>

                                              </tbody>

                                            </table>

                                          </center> </td>

                                      </tr>

                                    </tbody>

                                  </table>

                                  <table id="title56602dfbb-e701-410d-9cd8-0d560aa9ca1efd9b5db3-aa2b-4996-8939-f03b034d0419" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse; font-family: 'Montserrat', Arial, sans-serif; text-align: center; color: #005dab;" align="center" border="0" cellpadding="0" cellspacing="0" width="100%" class="mktoModule m_title" mktoname="Title5-clone-clone">

                                    <tbody>

                                      <tr>

                                        <td class="background" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;font-family: 'Montserrat', Arial, sans-serif;border-collapse: collapse;background-color:#005dab;" bgcolor="#005dab" valign="top">

                                          <table class="table600" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse; margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto;" align="center" border="0" cellpadding="0" cellspacing="0" width="600">

                                            <tbody>

                                              <tr>

                                                <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;font-family: 'Montserrat', Arial, sans-serif;border-collapse: collapse;line-height:${titleSpacer};font-size:${titleSpacer};" height="${titleSpacer}"> </td>

                                              </tr>

                                              <tr>

                                                <td class="primary-font title" style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;font-family:'Montserrat', Arial, sans-serif;border-collapse: collapse;">

                                                  <div class="mktoText" mktoname="Title" id="title66602dfbb-e701-410d-9cd8-0d560aa9ca1efd9b5db3-aa2b-4996-8939-f03b034d0419">

                                                    <p><span style="font-size: 20px;"><strong><span style="color: #ffffff;">TERRITORY COVERAGE</span></strong></span><br /><span style="font-size: 20px;"><strong><span style="color: #ffffff;">National Accounts Executive Team</span></strong></span></p>

                                                  </div> </td>

                                              </tr>

                                              <tr>

                                                <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;font-family: 'Montserrat', Arial, sans-serif;border-collapse: collapse;line-height:${titleSpacer2};font-size:${titleSpacer2};" height="${titleSpacer2}"> </td>

                                              </tr>

                                            </tbody>

                                          </table> </td>

                                      </tr>

                                    </tbody>

                                  </table>

                                  <table id="features" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="center" border="0" cellpadding="0" cellspacing="0" width="100%" class="mktoModule m_features" mktoname="Features">

                                    <tbody>

                                      <tr>

                                        <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;font-family: 'Montserrat', Arial, sans-serif;border-collapse: collapse;background-color:#ffffff;" bgcolor="#ffffff" valign="top">

                                          <table class="table600" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse; margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto;" align="center" border="0" cellpadding="0" cellspacing="0" width="450">

                                            <tbody>

                                              <tr>

                                                <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;font-family: 'Montserrat', Arial, sans-serif;border-collapse: collapse;line-height:${featuresSpacer};font-size:${featuresSpacer};" height="${featuresSpacer}"> </td>

                                              </tr>

                                              <tr>

                                                <td style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; font-family: 'Montserrat', Arial, sans-serif; border-collapse: collapse;">

                                                  <center>

                                                    <table class="table1-3" style="-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-spacing: 0;border-collapse: collapse;-ms-text-size-adjust: 100%;border-top-width:0;border-right-width:0;border-bottom-width:0;background-color:#ffffff;border-top-style: solid;border-right-style:

              solid;border-bottom-style: solid;border-left-style: solid;border-top-color:#ffffff;border-right-color:#ffffff;border-bottom-color:#ffffff;border-left-color:#ffffff;border-left-width:0;" align="left" bgcolor="#ffffff" border="0" cellpadding="0" cellspacing="0" width="210">

                                                      <tbody>

                                                        <tr>

                                                          <td class="contents" style="-webkit-hyphens: none; -webkit-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -ms-text-size-adjust: 100%; -moz-hyphens: none; hyphens: none; font-family: 'Montserrat', Arial, sans-serif; text-align: center; border-collapse: collapse;">

                                                            <table style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="center" border="0" cellpadding="0" cellspacing="0" width="100%">

                                                              <tbody>

                                                                <tr>

                                                                  <td class="primarty-font links" style="-moz-hyphens: none; -webkit-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -ms-text-size-adjust: 100%; hyphens: none; font-family: 'Montserrat', Arial, sans-serif; font-size: 13px; font-weight: 300; text-align: center; border-collapse: collapse;">

                                                                    <div class="mktoText" mktoname="Left Links" id="links">

                                                                      <div style="text-align: left;">

                                                                        <span style="color: #38b900;"><a href="http://mylink" style="text-size-adjust: 100%; text-decoration: none; color: #38b900;"><span style="color: #323232;"><strong><span mce-data-marked="1"></span></strong></span></a><strong>Elizabeth Wheeler</strong></span>

                                                                        <br />

                                                                        <span style="color: #38b900;"><strong>P:</strong></span> 888-479-9111 ext. 4156

                                                                        <br />

                                                                        <strong><span style="color: #38b900;">F:</span> </strong>877-305-6756

                                                                        <br />

                                                                        <span style="color: #38b900;"><strong>E:</strong> <a href="mailto:ewheeler@marlinfinance.com" target="_blank" id="">ewheeler@marlinfinance.com</a></span>

                                                                      </div>

                                                                    </div> </td>

                                                                </tr>

                                                              </tbody>

                                                            </table> </td>

                                                        </tr>

                                                      </tbody>

                                                    </table>

                                                    <table style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="left" border="0" cellpadding="0" cellspacing="0" width="10">

                                                      <tbody>

                                                      </tbody>

                                                    </table>

                                                    <table class="table1-3" style="-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-spacing: 0;border-collapse: collapse;-ms-text-size-adjust: 100%;border-top-width:0;border-right-width:0;border-bottom-width:0;background-color:#ffffff;border-top-style: solid;border-right-style:

              solid;border-bottom-style: solid;border-left-style: solid;border-top-color:#ffffff;border-right-color:#ffffff;border-bottom-color:#ffffff;border-left-color:#ffffff;border-left-width:0;" align="right" bgcolor="#ffffff" border="0" cellpadding="0" cellspacing="0" width="210">

                                                      <tbody>

                                                        <tr>

                                                          <td class="contents" style="-webkit-hyphens: none; -webkit-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -ms-text-size-adjust: 100%; -moz-hyphens: none; hyphens: none; font-family: 'Montserrat', Arial, sans-serif; text-align: center; border-collapse: collapse;">

                                                            <table style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="center" border="0" cellpadding="0" cellspacing="0" width="100%">

                                                              <tbody>

                                                                <tr>

                                                                  <td class="primarty-font links" style="-moz-hyphens: none; -webkit-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -ms-text-size-adjust: 100%; hyphens: none; font-family: 'Montserrat', Arial, sans-serif; font-size: 13px; font-weight: 300; text-align: center; border-collapse: collapse;">

                                                                    <div class="mktoText" mktoname="Right Links" id="links3">

                                                                      <div style="text-align: left;">

                                                                        <span style="color: #38b900;"><a href="http://mylink" style="text-size-adjust: 100%; text-decoration: none; color: #38b900;"><span style="color: #323232;"><strong><span mce-data-marked="1"></span></strong></span></a><strong>Brian Keller</strong></span>

                                                                        <br />

                                                                        <strong><span style="color: #38b900;">P:</span> </strong>888-479-9111 ext. 4334

                                                                        <br />

                                                                        <strong><span style="color: #38b900;">F:</span> </strong>877-305-6756

                                                                        <br />

                                                                        <span style="color: #38b900;"><strong>E:</strong> <a href="mailto:bkeller@marlinfinance.com" target="_blank" id="">bkeller@marlinfinance.com</a></span>

                                                                      </div>

                                                                    </div> </td>

                                                                </tr>

                                                              </tbody>

                                                            </table> </td>

                                                        </tr>

                                                      </tbody>

                                                    </table>

                                                  </center> </td>

                                              </tr>

                                              <tr>

                                                <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;font-family: 'Montserrat', Arial, sans-serif;border-collapse: collapse;line-height:${featuresSpacer14};font-size:${featuresSpacer14};" height="${featuresSpacer14}"> </td>

                                              </tr>

                                            </tbody>

                                          </table> </td>

                                      </tr>

                                    </tbody>

                                  </table>

                                  <table id="features3b1ebec5-f87b-42e4-8114-a6b77679ca9c" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="center" border="0" cellpadding="0" cellspacing="0" width="100%" class="mktoModule m_features" mktoname="Features-clone-1">

                                    <tbody>

                                      <tr>

                                        <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;font-family: 'Montserrat', Arial, sans-serif;border-collapse: collapse;background-color:#ffffff;" bgcolor="#ffffff" valign="top">

                                          <table class="table600" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse; margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto;" align="center" border="0" cellpadding="0" cellspacing="0" width="450">

                                            <tbody>

                                              <tr>

                                                <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;font-family: 'Montserrat', Arial, sans-serif;border-collapse: collapse;line-height:${featuresSpacer};font-size:${featuresSpacer};" height="${featuresSpacer}"> </td>

                                              </tr>

                                              <tr>

                                                <td style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; font-family: 'Montserrat', Arial, sans-serif; border-collapse: collapse;">

                                                  <center>

                                                    <table class="table1-3" style="-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-spacing: 0;border-collapse: collapse;-ms-text-size-adjust: 100%;border-top-width:0;border-right-width:0;border-bottom-width:0;background-color:#ffffff;border-top-style: solid;border-right-style:

              solid;border-bottom-style: solid;border-left-style: solid;border-top-color:#ffffff;border-right-color:#ffffff;border-bottom-color:#ffffff;border-left-color:#ffffff;border-left-width:0;" align="left" bgcolor="#ffffff" border="0" cellpadding="0" cellspacing="0" width="210">

                                                      <tbody>

                                                        <tr>

                                                          <td class="contents" style="-webkit-hyphens: none; -webkit-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -ms-text-size-adjust: 100%; -moz-hyphens: none; hyphens: none; font-family: 'Montserrat', Arial, sans-serif; text-align: center; border-collapse: collapse;">

                                                            <table style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="center" border="0" cellpadding="0" cellspacing="0" width="100%">

                                                              <tbody>

                                                                <tr>

                                                                  <td class="primarty-font links" style="-moz-hyphens: none; -webkit-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -ms-text-size-adjust: 100%; hyphens: none; font-family: 'Montserrat', Arial, sans-serif; font-size: 13px; font-weight: 300; text-align: center; border-collapse: collapse;">

                                                                    <div class="mktoText" mktoname="Left Links" id="links3b1ebec5-f87b-42e4-8114-a6b77679ca9c">

                                                                      <div style="text-align: left;">

                                                                        <strong><span style="color: #38b900;">Lanni Barkow</span></strong>

                                                                        <br />

                                                                        <span style="color: #38b900;"><strong>P:</strong> </span>888-479-9111 ext. 4168

                                                                        <br />

                                                                        <strong><span style="color: #38b900;">F:</span> </strong>877-305-6756

                                                                        <br />

                                                                        <span style="color: #38b900;"><strong>E:</strong> <a href="mailto:lbarkow@marlinfinance.com" target="_blank" id="">lbarkow@marlinfinance.com</a></span>

                                                                      </div>

                                                                    </div> </td>

                                                                </tr>

                                                              </tbody>

                                                            </table> </td>

                                                        </tr>

                                                      </tbody>

                                                    </table>

                                                    <table style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="left" border="0" cellpadding="0" cellspacing="0" width="10">

                                                      <tbody>

                                                      </tbody>

                                                    </table>

                                                    <table class="table1-3" style="-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;border-spacing: 0;border-collapse: collapse;-ms-text-size-adjust: 100%;border-top-width:0;border-right-width:0;border-bottom-width:0;background-color:#ffffff;border-top-style: solid;border-right-style:

              solid;border-bottom-style: solid;border-left-style: solid;border-top-color:#ffffff;border-right-color:#ffffff;border-bottom-color:#ffffff;border-left-color:#ffffff;border-left-width:0;" align="right" bgcolor="#ffffff" border="0" cellpadding="0" cellspacing="0" width="210">

                                                      <tbody>

                                                        <tr>

                                                          <td class="contents" style="-webkit-hyphens: none; -webkit-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -ms-text-size-adjust: 100%; -moz-hyphens: none; hyphens: none; font-family: 'Montserrat', Arial, sans-serif; text-align: center; border-collapse: collapse;">

                                                            <table style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="center" border="0" cellpadding="0" cellspacing="0" width="100%">

                                                              <tbody>

                                                                <tr>

                                                                  <td class="primarty-font links" style="-moz-hyphens: none; -webkit-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -ms-text-size-adjust: 100%; hyphens: none; font-family: 'Montserrat', Arial, sans-serif; font-size: 13px; font-weight: 300; text-align: center; border-collapse: collapse;">

                                                                    <div class="mktoText" mktoname="Right Links" id="links33b1ebec5-f87b-42e4-8114-a6b77679ca9c">

                                                                      <div style="text-align: left;">

                                                                        <strong><span style="color: #38b900;">Brian Dover</span></strong>

                                                                        <br />

                                                                        <span style="color: #38b900;"><strong>P:</strong></span> 888-479-9111 ext. 4368

                                                                        <br />

                                                                        <span style="color: #38b900;"><strong>F:</strong> </span>877-305-6756

                                                                        <br />

                                                                        <span style="color: #38b900;"><strong>E:</strong> <a href="mailto:bdover@marlinfinance.com" target="_blank" id="">bdover@marlinfinance.com</a></span>

                                                                      </div>

                                                                    </div> </td>

                                                                </tr>

                                                              </tbody>

                                                            </table> </td>

                                                        </tr>

                                                      </tbody>

                                                    </table>

                                                  </center> </td>

                                              </tr>

                                              <tr>

                                                <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;font-family: 'Montserrat', Arial, sans-serif;border-collapse: collapse;line-height:${featuresSpacer14};font-size:${featuresSpacer14};" height="${featuresSpacer14}"> </td>

                                              </tr>

                                            </tbody>

                                          </table> </td>

                                      </tr>

                                    </tbody>

                                  </table>

                                  <table id="title5" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse; font-family: 'Montserrat', Arial, sans-serif; text-align: center; color: #32ad84;" align="center" border="0" cellpadding="0" cellspacing="0" width="100%" class="mktoModule m_title" mktoname="ABOUT US SECTIONER">

                                    <tbody>

                                      <tr>

                                        <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;font-family: 'Montserrat', Arial, sans-serif;border-collapse: collapse;background-color:#ffffff;" bgcolor="#ffffff" valign="top">

                                          <table class="table600" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse; margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto;" align="center" border="0" cellpadding="0" cellspacing="0" width="640">

                                            <tbody>

                                              <tr>

                                                <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;font-family: 'Montserrat', Arial, sans-serif;border-collapse: collapse;line-height:${horizontalSpacer};font-size:${horizontalSpacer};" height="${horizontalSpacer}"> </td>

                                              </tr>

                                              <tr>

                                                <td style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; font-family: 'Montserrat', Arial, sans-serif; border-collapse: collapse;">

                                                  <table style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="center" border="0" cellpadding="0" cellspacing="0" width="100%">

                                                    <tbody>

                                                      <tr>

                                                        <td class="bordered" style="-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;font-family: 'Montserrat', Arial, sans-serif;-ms-text-size-adjust:

              100%;background-color:#ffffff;border-top-width:0;border-left-color:#ffffff;border-bottom-width:0;border-left-width:0;border-top-style: solid;border-right-style: solid;border-bottom-style: solid;border-left-style:

              solid;border-top-color:#ffffff;border-right-color:#ffffff;border-bottom-color:#ffffff;border-right-width:0;border-collapse: collapse;" bgcolor="#f2f2f5">

                                                          <center>

                                                            <table class="table3-3" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="left" border="0" cellpadding="0" cellspacing="0" width="209">

                                                              <tbody>

                                                                <tr>

                                                                  <td style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; font-family: 'Montserrat', Arial, sans-serif; border-collapse: collapse;">

                                                                    <table class="contents" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="center" border="0" cellpadding="0" cellspacing="0" width="100%">

                                                                      <tbody>

                                                                        <tr>

                                                                          <td class="primary-font title" style="-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;-ms-text-size-adjust: 100%;font-family:'Montserrat', Arial, sans-serif;color: #2d3235;font-size: 15px;padding-top: 0;padding-right: 20px;padding-bottom: 0;padding-left: 20px;border-collapse: collapse;">

                                                                            <div class="mktoText" mktoname="Left Title" id="title7">

                                                                              <p><span style="color: #323232;" mce-data-marked="1"><strong>PROGRAM MANAGER</strong></span></p>

                                                                            </div> </td>

                                                                        </tr>

                                                                        <tr>

                                                                          <td class="secondary-font text" style="-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;-ms-text-size-adjust: 100%;padding-left: 20px;font-family:'Questrial', Arial, sans-serif;color: #7e878b;font-size: 14px;line-height: 150%;padding-top: 0;padding-right: 20px;padding-bottom:

              0;border-collapse: collapse;">

                                                                            <div class="mktoText" mktoname="Left Text" id="text5">

                                                                              <p><span style="font-family: arial, helvetica, sans-serif;"><strong><span style="font-size: 14px;"><span style="color: #38b900;">John Gundersen</span></span></strong></span><br /><span style="font-size: 14px; font-family: arial, helvetica, sans-serif;"><span style="color: #38b900;"><strong>P:</strong></span> <span style="color: #000000;">888-479-9111 ext. 4340</span> <span style="color: #38b900;"><strong>F:</strong></span> <span style="color: #000000;">877-305-6756 </span><strong><span style="color: #38b900;">E:</span></strong> <span style="color: #000000;"><a href="mailto:jgundersen@marlinfinance.com" target="_blank" id="">jgundersen@marlinfinance.com</a></span></span></p>

                                                                            </div> </td>

                                                                        </tr>

                                                                      </tbody>

                                                                    </table> </td>

                                                                </tr>

                                                              </tbody>

                                                            </table>

                                                            <table class="table3-3" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="right" border="0" cellpadding="0" cellspacing="0" width="294">

                                                              <tbody>

                                                                <tr class="stack-tablet" style="max-height:0px;overflow:hidden;padding-left: 0; overflow: hidden; margin-left: 0; padding-top: 0; padding-right: 0; padding-bottom: 0; float: left; margin-top: 0; margin-right: 0; margin-bottom: 0; mso-hide: all; display: none;">

                                                                  <td style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; word-break: break-word; -webkit-hyphens: none; -moz-hyphens: none; hyphens: none; font-family: 'Montserrat', Arial, sans-serif; border-collapse: collapse;"> </td>

                                                                </tr>

                                                              </tbody>

                                                            </table>

                                                          </center> </td>

                                                      </tr>

                                                    </tbody>

                                                  </table> </td>

                                              </tr>

                                            </tbody>

                                          </table> </td>

                                      </tr>

                                    </tbody>

                                  </table>

                                  <table id="footer" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="center" border="0" cellpadding="0" cellspacing="0" width="100%" class="mktoModule m_footer" mktoname="Footer">

                                    <tbody>

                                      <tr>

                                        <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;font-family: 'Montserrat', Arial, sans-serif;border-collapse: collapse;background-color:#ffffff;" bgcolor="#ffffff" valign="top">

                                          <center>

                                            <table class="table600" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse; margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto;" align="center" border="0" cellpadding="0" cellspacing="0" width="600">

                                              <tbody>

                                                <tr>

                                                  <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;font-family: 'Montserrat', Arial, sans-serif;border-collapse: collapse;line-height:${footerSpacer};font-size:${footerSpacer};" height="${footerSpacer}"> </td>

                                                </tr>

                                                <tr>

                                                  <td class="primary-font text" style="-moz-hyphens: none;-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-ms-text-size-adjust: 100%;hyphens: none;font-family:'Montserrat', Arial, sans-serif;color: #7e878b;font-size: 14px;text-align: center;border-collapse: collapse;">

                                                    <div class="mktoText" mktoname="Text" id="text7">

                                                      <p style="text-align: left;"><span style="font-size: 10px; color: #000000;">This email was sent to your email by Marlin Business Services Corp.</span><br style="color: #7e878b; font-family: Montserrat, Arial, sans-serif; font-size: 14px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: left;

              text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: #2085c6;" /><span style="font-size: 10px; color: #000000;">Mt. Laurel Office | 300 Fellowship Rd | Mount Laurel | NJ | 08054</span><br style="color: #7e878b; font-family: Montserrat, Arial, sans-serif; font-size: 14px; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: normal; letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing:

              0px; -webkit-text-stroke-width: 0px; background-color: #2085c6;" /><span style="font-size: 10px; color: #000000;"><a href="mailto:marketing@marlinfinance.com" target="_blank" id="">marketing@marlinfinance.com</a> | (888) 479-9111</span></p>

                                                    </div> </td>

                                                </tr>

                                              </tbody>

                                            </table>

                                          </center> </td>

                                      </tr>

                                    </tbody>

                                  </table>

                                  <table id="footerf0d10910-ba31-4021-88e4-b0c315907d04" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="center" border="0" cellpadding="0" cellspacing="0" width="100%" class="mktoModule m_footer" mktoname="Footer-clone">

                                    <tbody>

                                      <tr>

                                        <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;font-family: 'Montserrat', Arial, sans-serif;border-collapse: collapse;background-color:#f2f2f5;" bgcolor="#f2f2f5" valign="top">

                                          <center>

                                            <table class="table600" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse; margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto;" align="center" border="0" cellpadding="0" cellspacing="0" width="600">

                                              <tbody>

                                                <tr>

                                                  <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;font-family: 'Montserrat', Arial, sans-serif;border-collapse: collapse;line-height:${footerSpacer};font-size:${footerSpacer};" height="${footerSpacer}"> </td>

                                                </tr>

                                                <tr>

                                                  <td class="primary-font text" style="-moz-hyphens: none;-webkit-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-ms-text-size-adjust: 100%;hyphens: none;font-family:'Montserrat', Arial, sans-serif;color: #7e878b;font-size: 14px;text-align: center;border-collapse: collapse;">

                                                    <div class="mktoText" mktoname="Text" id="text7f0d10910-ba31-4021-88e4-b0c315907d04">

                                                      <p style="text-align: left;"><em><span style="color: #000000; font-size: 10px;">This promotion can not be utilized in conjunction with any other promotion being offered by Panasonic Business Finance or special pricing being offered by Panasonic.</span></em></p>

                                                      <p style="text-align: left;"><em><span style="color: #000000; font-size: 10px;">Each transaction must be credit approved. Rates subject to change. Valid on finance agreements closed between 7/1/17 and 9/30/17. Certain equipment restrictions may apply. Not applicable for organizations that have been in business less than 2 years.</span></em></p>

                                                    </div> </td>

                                                </tr>

                                                <tr>

                                                  <td style="-webkit-text-size-adjust: 100%;-ms-text-size-adjust: 100%;mso-table-lspace: 0pt;mso-table-rspace: 0pt;word-break: break-word;-webkit-hyphens: none;-moz-hyphens: none;hyphens: none;font-family: 'Montserrat', Arial, sans-serif;border-collapse: collapse;line-height:${footerSpacer3};font-size:${footerSpacer3};" height="${footerSpacer3}"> </td>

                                                </tr>

                                              </tbody>

                                            </table>

                                          </center> </td>

                                      </tr>

                                    </tbody>

                                  </table></td>

                              </tr>

                            </tbody>

                          </table> </td>

                      </tr>

                    </tbody>

                  </table>

                  <!-- Outer Table END --> 

                </body>

              </html>

            • Re: Responsive design not showing responsive in email - outlook and gmail so far
              Oscar Becerra

              Are you using the right email template? That might contain the external CSS the email needs to be responsive. FYI gmail might not show background colours

                • Re: Responsive design not showing responsive in email - outlook and gmail so far
                  Dante Murphy

                  I just made a reply with my code...please let me know if anything jumps out that could be causing the issue.

                    • Re: Responsive design not showing responsive in email - outlook and gmail so far
                      Dave Roberts

                      Thanks Dante-

                      I'll spin this up in Marketo and send it to Litmus to have a closer look, let me circle back on that piece.

                       

                      In the short term, here's some "potential" feedback I noticed from a quick scan:

                      Here's a table I grabbed from the HTML:

                       

                      <table class="table3-3" style="-webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border-spacing: 0; border-collapse: collapse;" align="left" border="0" cellpadding="0" cellspacing="0" width="220">

                       

                      I might be superstitious but I've had success with defining an "order" to the HTML where attributes precede the style="" tag - as a 'rule of thumb' I try to add the class="" after the other attributes and before the style attributes b/c it pretty much reads styles into the document at that point, so that will establish some sort of "logical order" -- standardizing this order on all elements has shored up inconsistent display issues before, but more over is a peace of mind thing for testing/dev/troubleshooting. This part is more "polish" than "substance" - so not "required" but "recommended" maybe. That said - for starters it might look like this: (recommend add'l code in bold / not sure you need the other stuff yet):

                      <table width="220" cellpadding="0" cellspacing="0" border="0" align="left" class="table3-3" style="border-collapse:collapse; width:220px;">

                       

                      Next, the width="220" is likely "sticking" with your gMail display and compliments a few more tables that have fixed widths to create a row in the layout. Since those widths are fixed, Gmail will try and take the 640px display and "shrink" it down like a smaller version of the desktop version. This is b/c the elements on the screen exceed the normal screen size. Keep things in-and-around 320px max-width for mobile and you'll probably have more success with that. That said, I'd offer up this as a solution (but again, I'll loop back after a dive on this with more info):

                      <table width="100%" cellpadding="0" cellspacing="0" border="0" align="left" class="OneThird" style="border-collapse:collapse; width:100%;">

                       

                      in your <style> in the <head>, you'll want to add:

                      /* makes it full width up to 640px */

                      @media screen and (max-width: 640px) {

                      .OneThird {

                      width:100%;

                          }

                      }

                      /* makes it ____px under 640px */

                      @media screen and (min-width:640px) {

                      .OneThird {

                      width: 220px;

                      max-width:220px;

                          }

                      }

                       

                      I've found that since gMail started taking media queries, it can be good to be explicit with them and have rules for above/below 640px to "double-down" on gMail's ability to read a style and render it as expected. Sometimes tinkering with these settings (moving things from the <style> element into a media query) has helped, but not sure I completely understand why - yet.

                       

                      May need to tinker this (it's a "general solution") to fit your framework a little, but I'll get back on that and see if we can surface a few ways forward to iron this out.

                       

                      Thanks for sharing your code, stay tuned!

                      -Dave

                  • Re: Responsive design not showing responsive in email - outlook and gmail so far
                    Dave Roberts

                    Hey Dante Murphy!

                    Good news, I think I was able to get a solution in place for you here. Check out the Litmus Test Results for Android, gMail and Outlook.

                    >> Litmus

                     

                    Here's what I think is going on there:

                    When you grab the edge of your screen and resize it, you can "simulate" a smaller screen or device, but usually email has really crude breakpoints (one for mobile/one for desktop). This leaves a bunch of pixels in limbo and some of the widths you get (between 480 and 640) when you resize your screen aren't really "in play" in terms of inbox screen size for mobile devices.

                     

                    The solution:

                    That said, what I noticed was that somewhere between the desktop (640px+) breakpoint and the mobile (<480px) breakpoint the content was running off the right side of the screen. I used the inspector see what was going on there, and found the .table600 class on the wrapping tables. The CSS for that was set to 500px for "desktop" and 350px for "mobile". I was able to fix the issue by changing the .table600 CSS in both media queries (it's in there twice) to this instead:

                     

                        table.table600 {

                              width: 90% !important;

                        }

                     

                    the fluid (%) width of this gets along much better with the mobile clients. I've found that thinking about email as "mobile-first" and then applying styles as you go up to desktop (generally speaking desktop clients are more 'capable') has worked the best for me.

                     

                    Please let me know if this resolves the issue for you, of if you've got any questions here/ want help implementing testing this out?

                     

                    High five!

                    -Dave

                    developer, Digital Pi