Your Achievements
Level 1
0% to
Level 2
Next /
to gain points, level up, and earn exciting badges like the new Applaud 5 BadgeLearn more!
View All BadgesSign in to view all badges
Open Alert Bar
SOLVED

Re: HTML issue with cross browser css not working

Go to solution
akshat_goyal
Level 3
Level 3
‎10-30-2023 09:04 AM
‎10-30-2023 09:04 AM

HTML issue with cross browser css not working

Hi,

 

I need help with the office and android cross browsing design issue. - Email module issue

 

https://everest.validity.com/design/share/92a942fef2bfa0/

 

The design is not coming properly in android and outlook i dont know where i am missing, i created the module and stuck with this cross browser. Its not coming fine with web client and android and office and outlook. 


akshat_goyal_0-1698681686645.png

akshat_goyal_1-1698681706229.png

 

This is the code- 

 
 
 
 <div style="background-color:${headerSectionContentColor};margin:0px auto;max-width:${emailWidth};">
                        <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background-color:${headerSectionContentColor};width:100%;">
                          <tbody>
                            <tr>
                              <td style="font-size:0px;padding:${headerSectionMobTopPadding} ${headerSectionMobRightPadding} ${headerSectionMobBottomPadding} ${headerSectionMobLeftPadding};vertical-align:top;mso-padding-alt:${headerSectionDeskTopPadding} ${headerSectionDeskRightPadding} ${headerSectionDeskBottomPadding} ${headerSectionDeskLeftPadding};" class="block-grid padding-${headerSectionDeskTopPadding}-${headerSectionDeskRightPadding}-${headerSectionDeskBottomPadding}-${headerSectionDeskLeftPadding}">
                                <!--[if mso | IE]>
                                                <table role="presentation" border="0" cellpadding="0" cellspacing="0">
                                                <tr>
                                                <td style="vertical-align:top;"><![endif]-->
                                <div class="mj-column-per-100 mj-outlook-group-fix mj-column-header-mobile-fix" cellpadding="10" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;height: 34vh;">
                                  <table class="mj-table-header-mobile-fix" border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:0px;vertical-align:top;padding: 30px;text-align: center; background-color: #ffffff; top: -90px;position: relative;" width="100%">
                                    <tbody>
                                     
                                      <tr>
                                        <td class="text-container" style="font-size:0px;padding:${headerSectionTitleTopSpacing} ${headerSectionTitleRightSpacing} ${headerSectionTitleBottomSpacing} ${headerSectionTitleLeftSpacing};mso-padding-alt:${headerSectionTitleTopSpacing} ${headerSectionTitleRightSpacing} ${headerSectionTitleBottomSpacing} ${headerSectionTitleLeftSpacing} ;word-break:break-word;text-align:${headerSectionTitleAlign};">
                                          <div class="mktoText ${headerSectionTitleFontFamily}" id="title" mktoname="Title" style="font-size:${headerSectionTitleFontSize};letter-spacing:${headerSectionTitleLetterSpacing};line-height:${headerSectionTitleLineHeight};mso-line-height-rule:exactly;text-align:${headerSectionTitleAlign};color:${headerSectionTitleColor};font-style:${headerSectionTitleFontStyle}">
                                            <p>Make it stand out</p>
                                          </div> </td>
                                      </tr>
                                     
                                      <tr>
                                        <td class="text-container" style="font-size:0px;padding:${headerSectionSubTitleTopSpacing} ${headerSectionSubTitleRightSpacing} ${headerSectionSubTitleBottomSpacing} ${headerSectionSubTitleLeftSpacing};word-break:break-word;mso-padding-alt:${headerSectionSubTitleTopSpacing} ${headerSectionSubTitleRightSpacing} ${headerSectionSubTitleBottomSpacing} ${headerSectionSubTitleLeftSpacing};text-align:${headerSectionSubTitleAlign};">
                                          <div class="mktoText ${headerSectionSubTitleFontFamily}" id="subTitle" mktoname="Sub Title" style="font-size:${headerSectionSubTitleFontSize};letter-spacing:${headerSectionSubTitleLetterSpacing};line-height:${headerSectionSubTitleLineHeight};mso-line-height-rule:exactly;text-align:${headerSectionSubTitleAlign};color:${headerSectionSubTitleColor};font-style:${headerSectionSubTitleFontStyle}">
                                            <p>This is for two line subheads. This is for two line subheads.</p>
                                          </div> </td>
                                      </tr>
                                     
                                      <tr style="display:${hideCTA}">
                                        <td valign="middle" class="button-container" style="font-size:0px;padding:${headerSectionCTATopSpacing} ${headerSectionCTARightSpacing} ${headerSectionCTABottomSpacing} ${headerSectionCTALeftSpacing};mso-padding-alt:${headerSectionCTATopSpacing} ${headerSectionCTARightSpacing} ${headerSectionCTABottomSpacing} ${headerSectionCTALeftSpacing};word-break:break-word;text-align:${headerSectionCTAAlign};">
                                          <div>
                                            <!--[if mso]>
                                                                    <table width="100%" align="center" border="0" cellpadding="0" cellspacing="0" style="border-spacing:0;border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;">
                                                                    <tr>
                                                                    <td align="left" class="mso-button-dark-mode"><a:roundrect xmlns:a="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" fillcolor="${headerSectionCTABgColor}" arcsize="52%" style="v-text-anchor:middle;width:105pt;height:36pt;" stroke="f" ><w:anchorlock/><a:textbox inset="0,0,0,0"><center style="color:${headerSectionCTAColor}; font-family:${headerSectionCTAFontFamily}; font-size:${headerSectionSubTitleFontSize}"><![endif]-->
                                            <div class="mktoText ${headerSectionCTAFontFamily} ${ctaUnderline}" id="headerCTA" mktoname="Header CTA" style="display:inline-block;background:${headerSectionCTABgColor};color:${headerSectionCTAColor};font-size:${headerSectionSubTitleFontSize};font-weight:${headerSectionCTAFontWeight};letter-spacing:${headerSectionCTALetterSpacing};line-height:${headerSectionCTALineHeight};mso-line-height-rule:exactly;margin:0;text-align:${headerSectionCTAAlign};text-decoration:${ctaUnderline};text-transform:none;padding:16px 24px 16px 24px;mso-padding-alt:0px;border-radius:25px;mso-border-alt:none;box-sizing:border-box;width:auto;white-space:nowrap">
                                              <p> <a href="https://www.linkedin.com/showcase/vanguard-financial-advisor-services/?CID=FAS:MC:123456." title="Header CTA" style="color:${headerSectionCTAColor}">Lorem ipsum </a> </p>
                                            </div>
                                            <!--[if mso]></center></a:textbox></a:roundrect>
                                                                    </td>
                                                                    </tr>
                                                                    </table><![endif]-->
                                          </div> </td>
                                      </tr>
                                     
                                    </tbody>
                                  </table>
                                </div>
                                <!--[if mso | IE]>
                                                </td>
                                                </tr>
                                                </table><![endif]--> </td>
                            </tr>
                          </tbody>
                        </table>
                      </div>
0 Likes
931
Reply
2 ACCEPTED SOLUTIONS

Accepted Solutions
Jasbir_Kaur
Level 5
Level 5
‎11-02-2023 02:42 AM
‎11-02-2023 02:42 AM

Re: HTML issue with cross browser css not working

Hi @akshat_goyal,

 

Here you don't need to use a background image, please use a simple image - https://prnt.sc/9BZJ0nYMjwrs

 

After that, it will work on Android devices.

 

Thanks!

 

 

View solution in original post

0 Likes
850
Reply
Jasbir_Kaur
Level 5
Level 5
‎11-02-2023 04:21 AM
‎11-02-2023 04:21 AM

Re: HTML issue with cross browser css not working

Hi @akshat_goyal,

 

Remove <p> tag from here - https://prnt.sc/V-Ix0V4WFTe1 and use div and then try.

View solution in original post

0 Likes
841
Reply
10 REPLIES 10
akshat_goyal
Level 3
Level 3
‎10-30-2023 08:00 PM
‎10-30-2023 08:00 PM

Re: HTML issue with cross browser css not working 

<!doctype html>
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office">
  <head> 
    <!--[if !mso]><!-- --> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge"> 
    <!--<![endif]--> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> 
    <meta name="viewport" content="width=device-width,initial-scale=1"> 
    <!-- Use Internet Explorer 9 Standards mode -->
  <meta http-equiv="x-ua-compatible" content="IE=9">
    <!--Marketo Variables Declarations Starts--> 
    <!--Global Variables Declarations Starts--> 
    <meta class="mktoNumber" id="emailWidth" mktoname="Email Width" default="600" min="600" max="640" units="px" step="1"> 
    <meta class="mktoList" id="emailBackgroundColor" mktoname="Email Background Color" values="#FFFFFF,#F5F5F5,#000000,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <!--Header Text With CTA Starts--> 
    <meta class="mktoNumber" id="headerSectionDeskTopPadding" mktoname="Header Section Desktop Top Padding" default="32" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="headerSectionDeskBottomPadding" mktoname="Header Section Desktop Bottom Padding" default="32" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="headerSectionDeskLeftPadding" mktoname="Header Section Desktop Left Padding" default="24" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="headerSectionDeskRightPadding" mktoname="Header Section Desktop Right Padding" default="24" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="headerSectionMobTopPadding" mktoname="Header Section Mobile Top Padding" default="32" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="headerSectionMobBottomPadding" mktoname="Header Section Mobile Bottom Padding" default="32" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="headerSectionMobLeftPadding" mktoname="Header Section Mobile Left Padding" default="24" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="headerSectionMobRightPadding" mktoname="Header Section Mobile Right Padding" default="24" min="0" max="300" units="px" step="1"> 
    <!--Header Text With CTA Ends--> 
    <!--Heading_image_module Starts--> 
    <meta class="mktoNumber" id="Header_imagewithmoduleDeskTopPadding" mktoname="Heading Modulex Desktop Top Padding" default="32" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="Header_imagewithmoduleDeskBottomPadding" mktoname="Heading Modulex Desktop Bottom Padding" default="32" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="Header_imagewithmoduleDeskLeftPadding" mktoname="Heading Modulex Desktop Left Padding" default="24" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="Header_imagewithmoduleDeskRightPadding" mktoname="Heading Modulex Desktop Right Padding" default="24" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="Header_imagewithmoduleMobTopPadding" mktoname="Heading Modulex Mobile Top Padding" default="32" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="Header_imagewithmoduleMobBottomPadding" mktoname="Heading Modulex Mobile Bottom Padding" default="32" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="Header_imagewithmoduleMobLeftPadding" mktoname="Heading Modulex Mobile Left Padding" default="24" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="Header_imagewithmoduleMobRightPadding" mktoname="Heading Modulex Mobile Right Padding" default="24" min="0" max="300" units="px" step="1"> 
    <!--Heading_image_module Ends--> 
    <!--Body Text With CTA Starts--> 
    <meta class="mktoNumber" id="bodyTextSectionDeskTopPadding" mktoname="Body Text Desktop Top Padding" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="bodyTextSectionDeskBottomPadding" mktoname="Body Text Desktop Bottom Padding" default="60" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="bodyTextSectionDeskLeftPadding" mktoname="Body Text Desktop Left Padding" default="32" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="bodyTextSectionDeskRightPadding" mktoname="Body Text Desktop Right Padding" default="32" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="bodyTextSectionMobTopPadding" mktoname="Body Text Mobile Top Padding" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="bodyTextSectionMobBottomPadding" mktoname="Body Text Mobile Bottom Padding" default="48" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="bodyTextSectionMobLeftPadding" mktoname="Body Text Mobile Left Padding" default="24" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="bodyTextSectionMobRightPadding" mktoname="Body Text Mobile Right Padding" default="24" min="0" max="300" units="px" step="1"> 
    <!--Body Text With CTA Ends--> 
    <!--Event In Body Starts--> 
    <meta class="mktoNumber" id="eventBodySectionDeskTopPadding" mktoname="Event Body Desktop Top Padding" default="32" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="eventBodySectionDeskBottomPadding" mktoname="Event Body Desktop Bottom Padding" default="32" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="eventBodySectionDeskLeftPadding" mktoname="Event Body Desktop Left Padding" default="24" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="eventBodySectionDeskRightPadding" mktoname="Event Body Desktop Right Padding" default="24" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="eventBodySectionMobTopPadding" mktoname="Event Body Mobile Top Padding" default="32" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="eventBodySectionMobBottomPadding" mktoname="Event Body Mobile Bottom Padding" default="32" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="eventBodySectionMobLeftPadding" mktoname="Event Body Mobile Left Padding" default="24" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="eventBodySectionMobRightPadding" mktoname="Event Body Mobile Right Padding" default="24" min="0" max="300" units="px" step="1"> 
    <!--Event In Body Ends--> 
    <!--Body Two Column Starts--> 
    <meta class="mktoNumber" id="bodyTwoColumnSectionDeskTopPadding" mktoname="Body Two ColumnDesktop Top Padding" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="bodyTwoColumnSectionDeskBottomPadding" mktoname="Body Two ColumnDesktop Bottom Padding" default="60" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="bodyTwoColumnSectionDeskLeftPadding" mktoname="Body Two ColumnDesktop Left Padding" default="32" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="bodyTwoColumnSectionDeskRightPadding" mktoname="Body Two ColumnDesktop Right Padding" default="32" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="bodyTwoColumnSectionMobTopPadding" mktoname="Body Two ColumnMobile Top Padding" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="bodyTwoColumnSectionMobBottomPadding" mktoname="Body Two ColumnMobile Bottom Padding" default="48" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="bodyTwoColumnSectionMobLeftPadding" mktoname="Body Two ColumnMobile Left Padding" default="24" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="bodyTwoColumnSectionMobRightPadding" mktoname="Body Two ColumnMobile Right Padding" default="24" min="0" max="300" units="px" step="1"> 
    <!--Body Two Column Ends--> 
    <!--General Disclaimer Starts--> 
    <meta class="mktoNumber" id="generalDisclaimerSectionDeskTopPadding" mktoname="General Disclaimer Section Desktop Top Padding" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="generalDisclaimerSectionDeskBottomPadding" mktoname="General Disclaimer Section Desktop Bottom Padding" default="40" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="generalDisclaimerSectionDeskLeftPadding" mktoname="General Disclaimer Section Desktop Left Padding" default="32" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="generalDisclaimerSectionDeskRightPadding" mktoname="General Disclaimer Section Desktop Right Padding" default="32" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="generalDisclaimerSectionMobTopPadding" mktoname="General Disclaimer Section Mobile Top Padding" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="generalDisclaimerSectionMobBottomPadding" mktoname="General Disclaimer Section Mobile Bottom Padding" default="32" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="generalDisclaimerSectionMobLeftPadding" mktoname="General Disclaimer Section Mobile Left Padding" default="24" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="generalDisclaimerSectionMobRightPadding" mktoname="General Disclaimer Section Mobile Right Padding" default="24" min="0" max="300" units="px" step="1"> 
    <!--General Disclaimer Ends--> 
    <!--Email Disclaimer Starts--> 
    <meta class="mktoNumber" id="emailDisclaimerSectionDeskTopPadding" mktoname="Email Disclaimer Section Desktop Top Padding" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="emailDisclaimerSectionDeskBottomPadding" mktoname="Email Disclaimer Section Desktop Bottom Padding" default="40" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="emailDisclaimerSectionDeskLeftPadding" mktoname="Email Disclaimer Section Desktop Left Padding" default="32" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="emailDisclaimerSectionDeskRightPadding" mktoname="Email Disclaimer Section Desktop Right Padding" default="32" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="emailDisclaimerSectionMobTopPadding" mktoname="Email Disclaimer Section Mobile Top Padding" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="emailDisclaimerSectionMobBottomPadding" mktoname="Email Disclaimer Section Mobile Bottom Padding" default="32" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="emailDisclaimerSectionMobLeftPadding" mktoname="Email Disclaimer Section Mobile Left Padding" default="24" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" id="emailDisclaimerSectionMobRightPadding" mktoname="Email Disclaimer Section Mobile Right Padding" default="24" min="0" max="300" units="px" step="1"> 
    <!--Email Disclaimer Ends--> 
    <!--Global Variables Declarations Ends--> 
    <!--Header Text With CTA Variables Declaration Starts--> 
    <meta class="mktoList" id="headerSectionColor" mktomodulescope="true" mktoname="Section Background Color" values="#F5F5F5,#FFFFFF,#000000,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoList" id="headerSectionContentColor" mktomodulescope="true" mktoname="Content Background Color" values="#C20029,#FFFFFF,#F5F5F5,#000000,#232323,#F51914,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <!-- Logo Variables Declaration Starts--> 
    <meta class="mktoList" mktomodulescope="true" id="headerSectionLogoAlignment" mktoname="Logo Alignment" values="left,right,center"> 
    <meta class="mktoNumber" mktomodulescope="true" id="headerSectionLogoWidth" mktoname="Logo Width" default="90" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="headerSectionLogoTopSpacing" mktoname="Logo Top Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="headerSectionLogoLeftSpacing" mktoname="Logo Left Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="headerSectionLogoBottomSpacing" mktoname="Logo Bottom Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="headerSectionLogoRightSpacing" mktoname="Logo Right Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <!-- Logo Variables Declaration Ends--> 
    <!-- Title Variables Declaration Starts--> 
    <meta class="mktoList" mktomodulescope="true" id="headerSectionTitleFontFamily" mktoname="Title Font Family" values="arial,arial-light"> 
    <meta class="mktoNumber" mktomodulescope="true" id="headerSectionTitleFontSize" mktoname="Title Font Size" default="40" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="headerSectionTitleFontWeight" mktoname="Title Font Weight" values="normal,bold"> 
    <meta class="mktoList" mktomodulescope="true" id="headerSectionTitleFontStyle" mktoname="Title Font Style" values="normal,italic"> 
    <meta class="mktoNumber" mktomodulescope="true" id="headerSectionTitleLetterSpacing" mktoname="Title Letter Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="headerSectionTitleLineHeight" mktoname="Title Line Height" default="40" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" id="headerSectionTitleColor" mktomodulescope="true" mktoname="Title Color" values="#000000,#F5F5F5,#FFFFFF,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoList" mktomodulescope="true" id="headerSectionTitleAlign" mktoname="Title Align" values="left,center,right,justify"> 
    <meta class="mktoNumber" mktomodulescope="true" id="headerSectionTitleTopSpacing" mktoname="Title Top Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="headerSectionTitleLeftSpacing" mktoname="Title Left Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="headerSectionTitleBottomSpacing" mktoname="Title Bottom Spacing" default="24" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="headerSectionTitleRightSpacing" mktoname="Title Right Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <!-- Title Variables Declaration Ends--> 
    <!-- Sub Title Variables Declaration Starts--> 
    <meta class="mktoList" mktomodulescope="true" id="headerSectionSubTitleFontFamily" mktoname="Sub Title Font Family" values="arial,arial-light"> 
    <meta class="mktoNumber" mktomodulescope="true" id="headerSectionSubTitleFontSize" mktoname="Sub Title Font Size" default="16" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="headerSectionSubTitleFontWeight" mktoname="Sub Title Font Weight" values="normal,bold"> 
    <meta class="mktoList" mktomodulescope="true" id="headerSectionSubTitleFontStyle" mktoname="Sub Title Font Style" values="normal,italic"> 
    <meta class="mktoNumber" mktomodulescope="true" id="headerSectionSubTitleLineHeight" mktoname="Sub Title Line Height" default="16" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="headerSectionSubTitleLetterSpacing" mktoname="Sub Title Letter Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" id="headerSectionSubTitleColor" mktomodulescope="true" mktoname="Sub Title Color" values="#000000,#FFFFFF,#F5F5F5,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoList" mktomodulescope="true" id="headerSectionSubTitleAlign" mktoname="Sub Title Align" values="left,center,right,justify"> 
    <meta class="mktoNumber" mktomodulescope="true" id="headerSectionSubTitleTopSpacing" mktoname="Sub Title Top Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="headerSectionSubTitleLeftSpacing" mktoname="Sub Title Left Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="headerSectionSubTitleBottomSpacing" mktoname="Sub Title Bottom Spacing" default="24" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="headerSectionSubTitleRightSpacing" mktoname="Sub Title Right Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <!-- Sub Title Variables Declaration Ends--> 
    <!-- CTA Variables Declaration Starts--> 
    <meta class="mktoList" mktomodulescope="true" id="headerSectionCTAFontFamily" mktoname="CTA Font Family" values="arial,arial-light"> 
    <meta class="mktoNumber" mktomodulescope="true" id="headerSectionCTAFontSize" mktoname="CTA Font Size" default="16" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="headerSectionCTAFontWeight" mktoname="CTA Font Weight" values="normal,bold"> 
    <meta class="mktoNumber" mktomodulescope="true" id="headerSectionCTALetterSpacing" mktoname="Header CTA Letter Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="headerSectionCTALineHeight" mktoname="Header CTA Line Height" default="16" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" id="headerSectionCTAColor" mktomodulescope="true" mktoname="CTA Color" values="#FFFFFF,#000000,#F5F5F5,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoList" id="headerSectionCTABgColor" mktomodulescope="true" mktoname="CTA Background Color" values="#000000,#FFFFFF,#F5F5F5,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoList" mktomodulescope="true" id="headerSectionCTAAlign" mktoname="CTA Align" values="left,center,right"> 
    <meta class="mktoBoolean" id="hideCTA" mktomodulescope="true" mktoname="Hide Button" default="false" false_value="table-row" true_value="none" false_value_name="NO" true_value_name="YES"> 
    <meta class="mktoBoolean" id="ctaUnderline" mktomodulescope="true" mktoname="Underline CTA" default="false" false_value="none" true_value="underline" false_value_name="NO" true_value_name="YES"> 
    <meta class="mktoNumber" mktomodulescope="true" id="headerSectionCTATopSpacing" mktoname="Header CTA Top Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="headerSectionCTALeftSpacing" mktoname="Header CTA Left Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="headerSectionCTABottomSpacing" mktoname="Header CTA Bottom Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="headerSectionCTARightSpacing" mktoname="Header CTA Right Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <!-- CTA Variables Declaration Ends--> 
    <!--Header Text With CTA Variables Declaration Ends--> 
    <!--Header Image with module Variables Declaration Starts--> 
    <meta class="mktoList" id="Header_imagewithmoduleSectionColor" mktomodulescope="true" mktoname="Section Background Color" values="#F5F5F5,#FFFFFF,#000000,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoList" id="Header_imagewithmoduleContentColor" mktomodulescope="true" mktoname="Content Background Color" values="#FFFFFF,#F5F5F5,#000000,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <!-- First Person Image Variables Declaration Starts--> 
    <meta class="mktoList" mktomodulescope="true" id="Header_imagewithmoduleImageAlignment" mktoname="Moduley Image Alignment" values="center,left,right"> 
    <meta class="mktoNumber" mktomodulescope="true" id="Header_imagewithmoduleImageWidth" mktoname="Moduley Image Width" default="110" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="Header_imagewithmoduleImageTopSpacing" mktoname="Moduley Image Top Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="Header_imagewithmoduleImageLeftSpacing" mktoname="Moduley Image Left Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="Header_imagewithmoduleImageBottomSpacing" mktoname="Moduley Image Bottom Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="Header_imagewithmoduleImageRightSpacing" mktoname="Moduley Image Right Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <!-- First Person Image Variables Declaration Ends--> 
    <!--Header Image with module Variables Declaration Ends--> 
    <!--Body Text With CTA Variables Declaration Ends--> 
    <meta class="mktoList" id="bodyTextSectionColor" mktomodulescope="true" mktoname="Section Background Color" values="#F5F5F5,#FFFFFF,#000000,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoList" id="bodyTextContentColor" mktomodulescope="true" mktoname="Content Background Color" values="#FFFFFF,#F5F5F5,#000000,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <!-- Text Variables Declaration Starts--> 
    <meta class="mktoList" id="bodyTextColor" mktomodulescope="true" mktoname="Body Text Color" values="#000000,#F5F5F5,#FFFFFF,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTextFontFamily" mktoname="Body Text Font Family" values="arial,arial-light"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTextFontSize" mktoname="Body Text Font Size" default="16" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTextFontWeight" mktoname="Body Text Font Weight" values="normal,bold"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTextFontStyle" mktoname="Body Text Font Style" values="normal,italic"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTextLetterSpacing" mktoname="Body Text Letter Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTextLineHeight" mktoname="Body Text Line Height" default="29" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTextAlign" mktoname="Body Text Align" values="left,center,right,justify"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTextTopSpacing" mktoname="Body Text Top Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTextLeftSpacing" mktoname="Body Text Left Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTextBottomSpacing" mktoname="Body Text Bottom Spacing" default="32" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTextRightSpacing" mktoname="Body Text Right Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <!-- Text Variables Declaration Ends--> 
    <!-- CTA Variables Declaration Starts--> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTextCTAFontFamily" mktoname="CTA Font Family" values="arial,arial-light"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTextCTAFontSize" mktoname="CTA Font Size" default="16" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTextCTAFontWeight" mktoname="CTA Font Weight" values="normal,bold"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTextCTAFontStyle" mktoname="CTA Font Style" values="normal,italic"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTextCTALetterSpacing" mktoname="Body Text CTA Letter Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTextCTALineHeight" mktoname="CTA Line Height" default="16" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTextCTAAlign" mktoname="CTA Align" values="left,center,right"> 
    <meta class="mktoBoolean" id="bodyTextCTAUnderline" mktomodulescope="true" mktoname="Underline CTA" default="false" false_value="none" true_value="underline" false_value_name="NO" true_value_name="YES"> 
    <meta class="mktoList" id="bodyTextCTAColor" mktomodulescope="true" mktoname="CTA Color" values="#FFFFFF,#F5F5F5,#000000,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoList" id="bodyTextCTABgColor" mktomodulescope="true" mktoname="CTA Background Color" values="#C20029,#FFFFFF,#F5F5F5,#000000,#232323,#F51914,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTextCTATopSpacing" mktoname="Body Text CTA Top Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTextCTALeftSpacing" mktoname="Body Text CTA Left Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTextCTABottomSpacing" mktoname="Body Text CTA Bottom Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTextCTARightSpacing" mktoname="Body Text CTA Right Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <!-- CTA Variables Declaration Ends--> 
    <!--Body Text With CTA Variables Declaration Ends--> 
    <!--Event In Body Variables Declaration Starts--> 
    <meta class="mktoList" id="eventBodySectionColor" mktomodulescope="true" mktoname="Section Background Color" values="#F5F5F5,#FFFFFF,#000000,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoList" id="eventBodyContentColor" mktomodulescope="true" mktoname="Content Background Color" values="#FFFFFF,#F5F5F5,#000000,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <!-- Title Variables Declaration Starts--> 
    <meta class="mktoList" id="eventBodyTitleColor" mktomodulescope="true" mktoname="Title Color" values="#000000,#F5F5F5,#FFFFFF,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodyTitleFontFamily" mktoname="Title Font Family" values="arial,arial-light"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyTitleFontSize" mktoname="Title Font Size" default="48" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodyTitleFontWeight" mktoname="Title Font Weight" values="bold,normal"> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodyTitleFontStyle" mktoname="Title Font Style" values="normal,italic"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyTitleLetterSpacing" mktoname="Title Letter Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyTitleLineHeight" mktoname="Title Line Height" default="48" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodyTitleAlign" mktoname="Title Align" values="left,center,right,justify"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyTitleTopSpacing" mktoname="Title Top Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyTitleLeftSpacing" mktoname="Title Left Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyTitleBottomSpacing" mktoname="Title Bottom Spacing" default="24" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyTitleRightSpacing" mktoname="Title Right Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <!-- Title Variables Declaration Ends--> 
    <!-- Description Variables Declaration Starts--> 
    <meta class="mktoList" id="eventBodyDescColor" mktomodulescope="true" mktoname="Description Color" values="#000000,#F5F5F5,#FFFFFF,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodyDescFontFamily" mktoname="Description Font Family" values="arial,arial-light"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyDescFontSize" mktoname="Description Font Size" default="16" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodyDescFontWeight" mktoname="Description Font Weight" values="normal,bold"> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodyDescFontStyle" mktoname="Description Font Style" values="normal,italic"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyDescLetterSpacing" mktoname="Description Letter Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyDescLineHeight" mktoname="Description Line Height" default="29" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodyDescAlign" mktoname="Description Align" values="left,center,right,justify"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyDescTopSpacing" mktoname="Description Top Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyDescLeftSpacing" mktoname="Description Left Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyDescBottomSpacing" mktoname="Description Bottom Spacing" default="32" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyDescRightSpacing" mktoname="Description Right Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <!-- Description Variables Declaration Ends--> 
    <!-- CTA Variables Declaration Starts--> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodyCTAFontFamily" mktoname="CTA Font Family" values="arial,arial-light"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyCTAFontSize" mktoname="CTA Font Size" default="16" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodyCTAFontWeight" mktoname="CTA Font Weight" values="normal,bold"> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodyCTAFontStyle" mktoname="CTA Font Style" values="normal,italic"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyCTALetterSpacing" mktoname="Body Text CTA Letter Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyCTALineHeight" mktoname="CTA Line Height" default="16" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodyCTAAlign" mktoname="CTA Align" values="left,center,right"> 
    <meta class="mktoBoolean" id="eventBodyCTAUnderline" mktomodulescope="true" mktoname="Underline CTA" default="false" false_value="none" true_value="underline" false_value_name="NO" true_value_name="YES"> 
    <meta class="mktoList" id="eventBodyCTAColor" mktomodulescope="true" mktoname="CTA Color" values="#FFFFFF,#F5F5F5,#000000,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoList" id="eventBodyCTABgColor" mktomodulescope="true" mktoname="CTA Background Color" values="#C20029,#FFFFFF,#F5F5F5,#000000,#232323,#F51914,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyCTATopSpacing" mktoname="CTA Top Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyCTALeftSpacing" mktoname="CTA Left Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyCTABottomSpacing" mktoname="CTA Bottom Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyCTARightSpacing" mktoname="CTA Right Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <!-- CTA Variables Declaration Ends--> 
    <!-- First Person Image Variables Declaration Starts--> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodyFirstPersonImageAlignment" mktoname="First Person Image Alignment" values="center,left,right"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyFirstPersonImageWidth" mktoname="First Person Image Width" default="110" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyFirstPersonImageTopSpacing" mktoname="First Person Image Top Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyFirstPersonImageLeftSpacing" mktoname="First Person Image Left Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyFirstPersonImageBottomSpacing" mktoname="First Person Image Bottom Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyFirstPersonImageRightSpacing" mktoname="First Person Image Right Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <!-- First Person Image Variables Declaration Ends--> 
    <!-- First Person Name Variables Declaration Starts--> 
    <meta class="mktoList" id="eventBodyFirstPersonNameColor" mktomodulescope="true" mktoname="First Person Name Color" values="#000000,#F5F5F5,#FFFFFF,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodyFirstPersonNameFontFamily" mktoname="First Person Name Font Family" values="arial,arial-light"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyFirstPersonNameFontSize" mktoname="First Person Name Font Size" default="16" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodyFirstPersonNameFontWeight" mktoname="First Person Name Font Weight" values="bold,normal"> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodyFirstPersonNameFontStyle" mktoname="First Person Name Font Style" values="normal,italic"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyFirstPersonNameLetterSpacing" mktoname="First Person Name Letter Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyFirstPersonNameLineHeight" mktoname="First Person Name Line Height" default="16" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodyFirstPersonNameAlign" mktoname="First Person Name Align" values="center,left,right,justify"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyFirstPersonNameTopSpacing" mktoname="First Person Name Top Spacing" default="10" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyFirstPersonNameLeftSpacing" mktoname="First Person Name Left Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyFirstPersonNameBottomSpacing" mktoname="First Person Name Bottom Spacing" default="4" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyFirstPersonNameRightSpacing" mktoname="First Person Name Right Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <!-- First Person Name Variables Declaration Ends--> 
    <!-- First Person Designation Variables Declaration Starts--> 
    <meta class="mktoList" id="eventBodyFirstPersonDesignationColor" mktomodulescope="true" mktoname="First Person Designation Color" values="#000000,#F5F5F5,#FFFFFF,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodyFirstPersonDesignationFontFamily" mktoname="First Person Designation Font Family" values="arial,arial-light"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyFirstPersonDesignationFontSize" mktoname="First Person Designation Font Size" default="12" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodyFirstPersonDesignationFontWeight" mktoname="First Person Designation Font Weight" values="normal,bold"> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodyFirstPersonDesignationFontStyle" mktoname="First Person Designation Font Style" values="normal,italic"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyFirstPersonDesignationLetterSpacing" mktoname="First Person Designation Letter Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyFirstPersonDesignationLineHeight" mktoname="First Person Designation Line Height" default="12" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodyFirstPersonDesignationAlign" mktoname="First Person Designation Align" values="center,left,right,justify"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyFirstPersonDesignationTopSpacing" mktoname="First Person Designation Top Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyFirstPersonDesignationLeftSpacing" mktoname="First Person Designation Left Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyFirstPersonDesignationBottomSpacing" mktoname="First Person Designation Bottom Spacing" default="12" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodyFirstPersonDesignationRightSpacing" mktoname="First Person Designation Right Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <!-- First Person Designation Variables Declaration Ends--> 
    <!-- Second Person Image Variables Declaration Starts--> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodySecondPersonImageAlignment" mktoname="Second Person Image Alignment" values="center,left,right"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodySecondPersonImageWidth" mktoname="Second Person Image Width" default="110" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodySecondPersonImageTopSpacing" mktoname="Second Person Image Top Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodySecondPersonImageLeftSpacing" mktoname="Second Person Image Left Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodySecondPersonImageBottomSpacing" mktoname="Second Person Image Bottom Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodySecondPersonImageRightSpacing" mktoname="Second Person Image Right Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <!-- Second Person Image Variables Declaration Ends--> 
    <!-- Second Person Name Variables Declaration Starts--> 
    <meta class="mktoList" id="eventBodySecondPersonNameColor" mktomodulescope="true" mktoname="Second Person Name Color" values="#000000,#F5F5F5,#FFFFFF,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodySecondPersonNameFontFamily" mktoname="Second Person Name Font Family" values="arial,arial-light"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodySecondPersonNameFontSize" mktoname="Second Person Name Font Size" default="16" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodySecondPersonNameFontWeight" mktoname="Second Person Name Font Weight" values="bold,normal"> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodySecondPersonNameFontStyle" mktoname="Second Person Name Font Style" values="normal,italic"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodySecondPersonNameLetterSpacing" mktoname="Second Person Name Letter Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodySecondPersonNameLineHeight" mktoname="Second Person Name Line Height" default="16" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodySecondPersonNameAlign" mktoname="Second Person Name Align" values="center,left,right,justify"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodySecondPersonNameTopSpacing" mktoname="Second Person Name Top Spacing" default="10" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodySecondPersonNameLeftSpacing" mktoname="Second Person Name Left Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodySecondPersonNameBottomSpacing" mktoname="Second Person Name Bottom Spacing" default="4" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodySecondPersonNameRightSpacing" mktoname="Second Person Name Right Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <!-- Second Person Name Variables Declaration Ends--> 
    <!-- Second Person Designation Variables Declaration Starts--> 
    <meta class="mktoList" id="eventBodySecondPersonDesignationColor" mktomodulescope="true" mktoname="Second Person Designation Color" values="#000000,#F5F5F5,#FFFFFF,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodySecondPersonDesignationFontFamily" mktoname="Second Person Designation Font Family" values="arial,arial-light"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodySecondPersonDesignationFontSize" mktoname="Second Person Designation Font Size" default="12" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodySecondPersonDesignationFontWeight" mktoname="Second Person Designation Font Weight" values="normal,bold"> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodySecondPersonDesignationFontStyle" mktoname="Second Person Designation Font Style" values="normal,italic"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodySecondPersonDesignationLetterSpacing" mktoname="Second Person Designation Letter Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodySecondPersonDesignationLineHeight" mktoname="Second Person Designation Line Height" default="12" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="eventBodySecondPersonDesignationAlign" mktoname="Second Person Designation Align" values="center,left,right,justify"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodySecondPersonDesignationTopSpacing" mktoname="Second Person Designation Top Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodySecondPersonDesignationLeftSpacing" mktoname="Second Person Designation Left Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodySecondPersonDesignationBottomSpacing" mktoname="Second Person Designation Bottom Spacing" default="12" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="eventBodySecondPersonDesignationRightSpacing" mktoname="Second Person Designation Right Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <!-- Second Person Designation Variables Declaration Ends--> 
    <!--Event In Body Variables Declaration Ends--> 
    <!--Two Body Column Variables Decaration Starts--> 
    <meta class="mktoList" id="bodyTwoColumnSectionColor" mktomodulescope="true" mktoname="Section Background Color" values="#F5F5F5,#FFFFFF,#000000,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoList" id="bodyTwoColumnContentColor" mktomodulescope="true" mktoname="Content Background Color" values="#FFFFFF,#F5F5F5,#000000,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <!-- Title Variables Declaration Starts--> 
    <meta class="mktoList" id="bodyTwoColumnTitleColor" mktomodulescope="true" mktoname="Title Color" values="#000000,#F5F5F5,#FFFFFF,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTwoColumnTitleFontFamily" mktoname="Title Font Family" values="arial,arial-light"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnTitleFontSize" mktoname="Title Font Size" default="24" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTwoColumnTitleFontWeight" mktoname="Title Font Weight" values="bold,normal"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTwoColumnTitleFontStyle" mktoname="Title Font Style" values="normal,italic"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnTitleLetterSpacing" mktoname="Title Letter Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnTitleLineHeight" mktoname="Title Line Height" default="29" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTwoColumnTitleAlign" mktoname="Title Align" values="left,center,right,justify"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnTitleTopSpacing" mktoname="Title Top Spacing" default="24" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnTitleLeftSpacing" mktoname="Title Left Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnTitleBottomSpacing" mktoname="Title Bottom Spacing" default="24" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnTitleRightSpacing" mktoname="Title Right Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <!-- Title Variables Declaration Ends--> 
    <!-- Description Variables Declaration Starts--> 
    <meta class="mktoList" id="bodyTwoColumnDescColor" mktomodulescope="true" mktoname="Description Color" values="#000000,#F5F5F5,#FFFFFF,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTwoColumnDescFontFamily" mktoname="Description Font Family" values="arial,arial-light"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnDescFontSize" mktoname="Description Font Size" default="16" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTwoColumnDescFontWeight" mktoname="Description Font Weight" values="normal,bold"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTwoColumnDescFontStyle" mktoname="Description Font Style" values="normal,italic"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnDescLetterSpacing" mktoname="Description Letter Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnDescLineHeight" mktoname="Description Line Height" default="29" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTwoColumnDescAlign" mktoname="Description Align" values="left,center,right,justify"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnDescTopSpacing" mktoname="Description Top Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnDescLeftSpacing" mktoname="Description Left Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnDescBottomSpacing" mktoname="Description Bottom Spacing" default="24" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnDescRightSpacing" mktoname="Description Right Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <!-- Description Variables Declaration Ends--> 
    <!-- CTA Variables Declaration Starts--> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTwoColumnCTAFontFamily" mktoname="CTA Font Family" values="arial,arial-light"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnCTAFontSize" mktoname="CTA Font Size" default="16" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTwoColumnCTAFontWeight" mktoname="CTA Font Weight" values="normal,bold"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTwoColumnCTAFontStyle" mktoname="CTA Font Style" values="normal,italic"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnCTALetterSpacing" mktoname="Body Text CTA Letter Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnCTALineHeight" mktoname="CTA Line Height" default="16" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTwoColumnCTAAlign" mktoname="CTA Align" values="left,center,right"> 
    <meta class="mktoBoolean" id="bodyTwoColumnCTAUnderline" mktomodulescope="true" mktoname="Underline CTA" default="false" false_value="none" true_value="underline" false_value_name="NO" true_value_name="YES"> 
    <meta class="mktoList" id="bodyTwoColumnCTAColor" mktomodulescope="true" mktoname="CTA Color" values="#FFFFFF,#F5F5F5,#000000,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoList" id="bodyTwoColumnCTABgColor" mktomodulescope="true" mktoname="CTA Background Color" values="#000000,#C20029,#FFFFFF,#F5F5F5,#232323,#F51914,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnCTATopSpacing" mktoname="CTA Top Spacing" default="8" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnCTALeftSpacing" mktoname="CTA Left Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnCTABottomSpacing" mktoname="CTA Bottom Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnCTARightSpacing" mktoname="CTA Right Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <!-- CTA Variables Declaration Ends--> 
    <!--Data Title Variables Declaration Starts--> 
    <meta class="mktoList" id="bodyTwoColumnDataTitleColor" mktomodulescope="true" mktoname="Data Title Color" values="#000000,#F5F5F5,#FFFFFF,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTwoColumnDataTitleFontFamily" mktoname="Data Title Font Family" values="arial,arial-light"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnDataTitleFontSize" mktoname="Data Title Font Size" default="14" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTwoColumnDataTitleFontWeight" mktoname="Data Title Font Weight" values="bold,normal"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTwoColumnDataTitleFontStyle" mktoname="Data Title Font Style" values="normal,italic"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnDataTitleLetterSpacing" mktoname="Data Title Letter Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnDataTitleLineHeight" mktoname="Data Title Line Height" default="14" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTwoColumnDataTitleAlign" mktoname="Data Title Align" values="left,center,right,justify"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnDataTitleTopSpacing" mktoname="Data Title Top Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnDataTitleLeftSpacing" mktoname="Data Title Left Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnDataTitleBottomSpacing" mktoname="Data Title Bottom Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnDataTitleRightSpacing" mktoname="Data Title Right Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <!--Data Title Variables Declaration Ends--> 
    <!--Data Value Variables Declaration Starts--> 
    <meta class="mktoList" id="bodyTwoColumnDataValueColor" mktomodulescope="true" mktoname="Data Value Color" values="#000000,#F5F5F5,#FFFFFF,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTwoColumnDataValueFontFamily" mktoname="Data Value Font Family" values="arial,arial-light"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnDataValueFontSize" mktoname="Data Value Font Size" default="48" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTwoColumnDataValueFontWeight" mktoname="Data Value Font Weight" values="bold,normal"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTwoColumnDataValueFontStyle" mktoname="Data Value Font Style" values="normal,italic"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnDataValueLetterSpacing" mktoname="Data Value Letter Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnDataValueLineHeight" mktoname="Data Value Line Height" default="58" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTwoColumnDataValueAlign" mktoname="Data Value Align" values="left,center,right,justify"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnDataValueTopSpacing" mktoname="Data Value Top Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnDataValueLeftSpacing" mktoname="Data Value Left Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnDataValueBottomSpacing" mktoname="Data Value Bottom Spacing" default="24" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnDataValueRightSpacing" mktoname="Data Value Right Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <!--Data Value Variables Declaration Ends--> 
    <!--Data Description Variables Declaration Starts--> 
    <meta class="mktoList" id="bodyTwoColumnDataDescColor" mktomodulescope="true" mktoname="Data Description Color" values="#000000,#F5F5F5,#FFFFFF,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTwoColumnDataDescFontFamily" mktoname="Data Description Font Family" values="arial,arial-light"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnDataDescFontSize" mktoname="Data Description Font Size" default="14" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTwoColumnDataDescFontWeight" mktoname="Data Description Font Weight" values="bold,normal"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTwoColumnDataDescFontStyle" mktoname="Data Description Font Style" values="normal,italic"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnDataDescLetterSpacing" mktoname="Data Description Letter Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnDataDescLineHeight" mktoname="Data Description Line Height" default="17" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="bodyTwoColumnDataDescAlign" mktoname="Data Description Align" values="left,center,right,justify"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnDataDescTopSpacing" mktoname="Data Description Top Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnDataDescLeftSpacing" mktoname="Data Description Left Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnDataDescBottomSpacing" mktoname="Data Description Bottom Spacing" default="16" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="bodyTwoColumnDataDescRightSpacing" mktoname="Data Description Right Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <!--Data Description Variables Declaration Ends--> 
    <!--Two Body Column Variables Declaration Ends--> 
    <!--General Disclaimer Variables Declaration Starts--> 
    <meta class="mktoList" id="generalDisclaimerSectionColor" mktomodulescope="true" mktoname="Section Background Color" values="#F5F5F5,#FFFFFF,#000000,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoList" id="generalDisclaimerContentColor" mktomodulescope="true" mktoname="Content Background Color" values="#EAEAEA,#FFFFFF,#F5F5F5,#000000,#232323,#F51914,#C20029,#E8F6F5,#4094E6,transparent"> 
    <!-- Disclaimer Text Variables Declaration Starts--> 
    <meta class="mktoList" id="generalDisclaimerTextColor" mktomodulescope="true" mktoname="Disclaimer Text Color" values="#000000,#F5F5F5,#FFFFFF,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoList" mktomodulescope="true" id="generalDisclaimerTextFontFamily" mktoname="Disclaimer Text Font Family" values="arial,arial-light"> 
    <meta class="mktoNumber" mktomodulescope="true" id="generalDisclaimerTextFontSize" mktoname="Disclaimer Text Font Size" default="13" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="generalDisclaimerTextFontStyle" mktoname="Disclaimer Text Font Style" values="normal,italic"> 
    <meta class="mktoNumber" mktomodulescope="true" id="generalDisclaimerTextLetterSpacing" mktoname="Disclaimer Text Letter Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="generalDisclaimerTextLineHeight" mktoname="Disclaimer Text Line Height" default="18" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="generalDisclaimerTextAlign" mktoname="Disclaimer Text Align" values="left,center,right,justify"> 
    <!-- Disclaimer Text Variables Declaration Ends--> 
    <!--General Disclaimer Variables Declaration Ends--> 
    <!--Email Disclaimer Variables Declaration Starts--> 
    <meta class="mktoList" id="emailDisclaimerSectionColor" mktomodulescope="true" mktoname="Section Background Color" values="#F5F5F5,#FFFFFF,#000000,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoList" id="emailDisclaimerContentColor" mktomodulescope="true" mktoname="Content Background Color" values="#EAEAEA,#FFFFFF,#F5F5F5,#000000,#232323,#F51914,#C20029,#E8F6F5,#4094E6,transparent"> 
    <!-- Disclaimer Text Variables Declaration Starts--> 
    <meta class="mktoList" id="emailDisclaimerTextColor" mktomodulescope="true" mktoname="Disclaimer Text Color" values="#000000,#F5F5F5,#FFFFFF,#232323,#F51914,#C20029,#EAEAEA,#E8F6F5,#4094E6,transparent"> 
    <meta class="mktoList" mktomodulescope="true" id="emailDisclaimerTextFontFamily" mktoname="Disclaimer Text Font Family" values="arial-light,arial"> 
    <meta class="mktoNumber" mktomodulescope="true" id="emailDisclaimerTextFontSize" mktoname="Disclaimer Text Font Size" default="13" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="emailDisclaimerTextLetterSpacing" mktoname="Disclaimer Text Letter Spacing" default="0" min="0" max="300" units="px" step="1"> 
    <meta class="mktoNumber" mktomodulescope="true" id="emailDisclaimerTextLineHeight" mktoname="Disclaimer Text Line Height" default="18" min="0" max="300" units="px" step="1"> 
    <meta class="mktoList" mktomodulescope="true" id="emailDisclaimerTextAlign" mktoname="Disclaimer Text Align" values="left,center,right,justify"> 
    <!-- Disclaimer Text Variables Declaration Ends--> 
    <!--Email Disclaimer Variables Declaration Ends--> 
    <!--Marketo Variable Declarations Ends--> 
    <style type="text/css">
        #outlook a {
            padding: 0;
            color: inherit !important;
        }

        body, .body {
            margin: 0;
            padding: 0;
            -webkit-text-size-adjust: 100%;
            -ms-text-size-adjust: 100%;
        }

        table {
            border-spacing: 0;
        }

        img {
            border: 0;
            height: auto;
            line-height: 100%;
            outline: none;
            text-decoration: none;
            -ms-interpolation-mode: bicubic;
        }

        p {
            display: block;
            margin: 13px 0;
        }
    </style> 
    <!--[if mso]>
        <xml>
            <o:OfficeDocumentSettings>
                <o:AllowPNG/>
                <o:PixelsPerInch>96</o:PixelsPerInch>
            </o:OfficeDocumentSettings>
        </xml>
        <style type="text/css">
        table { border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt; }
        .mj-outlook-group-fix { width:100% !important; }
        .mso-button-dark-mode a {background: transparent !important;}
        a { color: inherit !important;}
        </style>
    <![endif]--> 
    <!--[if !mso]><!--> 
    <style type="text/css">
        @font-face {
            font-family: 'Arial Light';
            src: url("https://assets.knak.io/custom-fonts/Arial/arial-light.woff");
            font-style: normal;
        }

        @font-face {
            font-family: 'Arial Light';
            src: url("https://assets.knak.io/custom-fonts/Arial/arial.ttf");
            font-weight: bold;
            font-style: normal;
        }
    </style> 
    <!--<![endif]--> 
    <style type="text/css">
        @media only screen and (min-width:620px) {
            .mj-column-header-mobile-fix{
                height:20vh !important;
            }
            .mj-table-header-mobile-fix{
                top:-100px !important;
            }
            .mj-column-per-59 {
                width: 59% !important;
                max-width: 59%;
            }

            .mj-column-per-41 {
                width: 41% !important;
                max-width: 41%;
            }

            .mj-column-per-30 {
                width: 30% !important;
                max-width: 30%;
            }

            .mj-column-per-70 {
                width: 70% !important;
                max-width: 70%;
            }

            .mj-column-per-100 {
                width: 100% !important;
                max-width: 100%;
            }

            .mj-column-per-35 {
                width: 35% !important;
                max-width: 35%;
            }

            .mj-column-per-10 {
                width: 10% !important;
                max-width: 10%;
            }

            .mj-column-per-55 {
                width: 55% !important;
                max-width: 55%;
            }

            .mj-column-per-33-333333333333336 {
                width: 33.333333333333336% !important;
                max-width: 33.333333333333336%;
            }

            .mj-column-per-15 {
                width: 15% !important;
                max-width: 15%;
            }

            .mj-column-per-50 {
                width: 50% !important;
                max-width: 50%;
            }

            .mj-column-per-69 {
                width: 69% !important;
                max-width: 69%;
            }

            .mj-column-per-31 {
                width: 31% !important;
                max-width: 31%;
            }
        }
    </style> 
    <style type="text/css">
        .arial {
            font-family: Arial, sans-serif;
        }

        .arial-light {
            font-family: 'Arial Light', Arial, sans-serif;
        }

        .align-left {
            margin: 0 auto 0 0;
        }

        .align-right {
            margin: 0 0 0 auto;
        }

        .align-center {
            margin: 0 auto;
        }

        .mktoText a {
            text-decoration: none;
        }

        .underline a {
            text-decoration: underline;
        }

        @media only screen and (min-width:620px) {
            .border-bottom-0-none-FFFFFF {
                border-bottom: 0 none #FFFFFF !important
            }

            .border-left-1px-none-121212 {
                border-left: 1px none #121212 !important
            }

            .border-right-1px-solid-C9C9C9 {
                border-right: 1px solid #C9C9C9 !important
            }

            .border-top-0-none-FFFFFF {
                border-top: 0 none #FFFFFF !important
            }

            .text-align-left {
                text-align: left !important
            }

            .text-align-right {
                text-align: right !important
            }

            .max-width-100px {
                max-width: 100px !important
            }

            .border-bottom-0px-none-FFFFFF {
                border-bottom: 0px none #FFFFFF !important
            }

            .border-left-1px-solid-FFFFFF {
                border-left: 1px solid #FFFFFF !important
            }

            .font-size-40px {
               font-size: 40px !important
            }

            .margin-0-auto-0-0 {
               margin: 0 auto 0 0 !important
            }

            .font-size-32px {
               font-size: 32px !important
            }

            .border-left-0px-none-121212 {
               border-left: 0px none #121212 !important
            }

            .border-top-0-solid-BAC5C4 {
               border-top: 0 solid #BAC5C4 !important
            }

            .font-size-16px {
               font-size: 16px !important
            }

            .font-size-14px {
                font-size: 14px !important
            }

            .text-align-center {
                text-align: center !important
            }

            .fix-padding {
                padding-right: 15%;
            }

            .padding-${headerSectionDeskTopPadding}-${headerSectionDeskRightPadding}-${headerSectionDeskBottomPadding}-${headerSectionDeskLeftPadding} {
                padding: ${headerSectionDeskTopPadding} ${headerSectionDeskRightPadding} ${headerSectionDeskBottomPadding} ${headerSectionDeskLeftPadding} !important;
            }

            .padding-${Header_imagewithmoduleDeskTopPadding}-${Header_imagewithmoduleDeskRightPadding}-${Header_imagewithmoduleDeskBottomPadding}-${Header_imagewithmoduleDeskLeftPadding} {
                padding: ${Header_imagewithmoduleDeskTopPadding} ${Header_imagewithmoduleDeskRightPadding} ${Header_imagewithmoduleDeskBottomPadding} ${Header_imagewithmoduleDeskLeftPadding} !important;
            }
            .padding-${bodyTextSectionDeskTopPadding}-${bodyTextSectionDeskRightPadding}-${bodyTextSectionDeskBottomPadding}-${bodyTextSectionDeskLeftPadding} {
                padding: ${bodyTextSectionDeskTopPadding} ${bodyTextSectionDeskRightPadding} ${bodyTextSectionDeskBottomPadding} ${bodyTextSectionDeskLeftPadding} !important;
            }
            .padding-${eventBodySectionDeskTopPadding}-${eventBodySectionDeskRightPadding}-${eventBodySectionDeskBottomPadding}-${eventBodySectionDeskLeftPadding} {
                padding: ${eventBodySectionDeskTopPadding} ${eventBodySectionDeskRightPadding} ${eventBodySectionDeskBottomPadding} ${eventBodySectionDeskLeftPadding} !important;
            }
            .padding-${bodyTwoColumnSectionDeskTopPadding}-${bodyTwoColumnSectionDeskRightPadding}-${bodyTwoColumnSectionDeskBottomPadding}-${bodyTwoColumnSectionDeskLeftPadding} {
                padding: ${bodyTwoColumnSectionDeskTopPadding} ${bodyTwoColumnSectionDeskRightPadding} ${bodyTwoColumnSectionDeskBottomPadding} ${bodyTwoColumnSectionDeskLeftPadding} !important;
            }
            .padding-${generalDisclaimerSectionDeskTopPadding}-${generalDisclaimerSectionDeskRightPadding}-${generalDisclaimerSectionDeskBottomPadding}-${generalDisclaimerSectionDeskLeftPadding} {
                padding: ${generalDisclaimerSectionDeskTopPadding} ${generalDisclaimerSectionDeskRightPadding} ${generalDisclaimerSectionDeskBottomPadding} ${generalDisclaimerSectionDeskLeftPadding} !important;
            }
            .padding-${emailDisclaimerSectionDeskTopPadding}-${emailDisclaimerSectionDeskRightPadding}-${emailDisclaimerSectionDeskBottomPadding}-${emailDisclaimerSectionDeskLeftPadding} {
                padding: ${emailDisclaimerSectionDeskTopPadding} ${emailDisclaimerSectionDeskRightPadding} ${emailDisclaimerSectionDeskBottomPadding} ${emailDisclaimerSectionDeskLeftPadding} !important;
            }

        }
    </style> 
    <style type="text/css">
        p {
            margin: 0 0;
            color: inherit !important;
        }

        ul {
            display: block;
        }

            ul li {
                list-style: disc;
            }

        li li {
            list-style: circle;
        }

        sup, sub {
            line-height: 0;
        }

        body a {
            text-decoration: none !important;
            color: inherit;
        }

        .image-highlight {
            transition: 0.3s;
        }

            .image-highlight:hover {
                filter: brightness(1.2);
            }

        .button-highlight {
            transition: 0.3s;
        }

            .button-highlight:hover {
                filter: brightness(1.5);
            }

        @media only screen and (min-width: 620px) {
            .hide-on-mobile {
                display: block !important;
            }

            .hide-on-desktop {
                display: none !important;
            }
        }

        .hide-on-desktop {
            display: block;
        }

        .hide-on-mobile {
            display: none;
        }
    </style> 
    <!--[if mso]>
        <style>
            .hide-on-mobile {display:block !important}
        </style>
    <![endif]--> 
    <!--[if mso]>
         <style>
                .text-align-left { text-align: left !important}
                .mso-font-size-40px { font-size: 40px !important; }
                .mso-text-align-left { text-align: left !important; }
                .mso-font-size-32px { font-size: 32px !important; }
                .mso-font-size-16px { font-size: 16px !important; }
                .mso-font-size-14px { font-size: 14px !important; }
                .font-size-16px { font-size: 16px !important}
                .text-align-center { text-align: center !important}
          </style>
     <![endif]--> 
    <style>
        [class~="x_body"] {
            width: 99.9%
        }
    </style> 
  </head> 
  <body style="word-spacing:normal;background-color:${emailBackgroundColor};" class="body"> 
    <div style="background-color:${emailBackgroundColor};width:100%;"> 
      <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background-color: ${emailBackgroundColor}; width:100%;"> 
        <tbody> 
          <tr> 
            <td class="mktoContainer container" id="container">
              <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background-color:${Header_imagewithmoduleSectionColor};width:100%;" class="mktoModule section" id="headermodule" mktoname="HeaderImage InModule"> 
                <tbody> 
                  <tr> 
                    <td align="center"> 
                      <!--[if mso | IE]>
                <table align="center" border="0" cellpadding="0" cellspacing="0" class="block-grid-outlook" style="width:${emailWidth};" width="${emailWidth}" >
                <tr>
                <td style="line-height:0px;font-size:0px;mso-line-height-rule:exactly;"><![endif]--> 
                      <div style="background:${Header_imagewithmoduleContentColor};background-color:${Header_imagewithmoduleContentColor};margin:0px auto;max-width:${emailWidth};"> 
                        <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background-color:${Header_imagewithmoduleContentColor};width:100%;"> 
                          <tbody> 
                            <tr> 
                              <td style="font-size:0px;text-align:center;vertical-align:top;> 
                                <!--[if mso | IE]>
                                <table role=" presentation" border="0" cellpadding="0" cellspacing="0"> </td> 
                            </tr> 
                            <tr> 
                              <td width="100%" style="vertical-align:top;"> 
                                <!--[endif]----> 
                                <div class="mj-column-per-100 mj-outlook-group-fix" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;"> 
                                  <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%"> 
                                    <tbody> 
                                      <tr> 
                                        <td style="border-radius:0px;vertical-align:top;padding:0px 0px 0px 0px;mso-padding-alt:0px 0px 0px 0px;" class="padding-0px-0px-0px-0px"> 
                                          <table border="0" cellpadding="0" cellspacing="0" role="presentation" width="100%"> 
                                            <tbody> 
                                              <tr> 
                                                <td class="img-container" style="font-size:0px;word-break:break-word;text-align:${Header_imagewithmoduleImageAlignment};"> 
                                                  <div class="mktoImg" id="ModuleheaderImage" mktoname="Moduley Image" style="margin:0 auto;">
                                                    <a target="_blank" title="Moduley Image" href="http://crewnet.vanguard.com/#!/home/main"> <img alt="Moduley Image" height="${Header_imagewithmoduleImageWidth}" src="http://394-IPM-414.mktoweb.com/rs/394-IPM-414/images/MicrosoftTeams-image (24).png" style="border:none;display:block;outline:none;text-decoration:none;height:auto;width:100%"> </a>
                                                  </div> </td> 
                                              </tr> 
                                            </tbody> 
                                          </table> </td> 
                                      </tr> 
                                    </tbody> 
                                  </table> 
                                </div> 
                                <!--[if mso | IE]>
                                </td>
                                </tr>
                                </table><![endif]--> </td> 
                            </tr> 
                          </tbody> 
                        </table> 
                      </div> 
                      <!--[if mso | IE]>
                </td>
                </tr>
                </table><![endif]--> </td> 
                  </tr> 
                </tbody> 
              </table>

              <!------------------------table-watch---------------->
              <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background-color:${headerSectionColor};width:100%;" class="mktoModule section" mktoname="Header Text With CTA" id="headerTextWithCTA"> 
                <tbody> 
                  <tr> 
                    <td align="center"> 
                      <!--[if mso | IE]>
                                <table align="center" border="0" cellpadding="0" cellspacing="0" class="block-grid-outlook" style="width:${emailWidth};" width="${emailWidth}" >
                                <tr>
                                <td style="font-size:0px;mso-line-height-rule:exactly;"><![endif]--> 
                      <div style="background-color:${headerSectionContentColor};margin:0px auto;max-width:${emailWidth};"> 
                        <table align="center" border="0" cellpadding="0" cellspacing="0" role="presentation" style="background-color:${headerSectionContentColor};width:100%;"> 
                          <tbody> 
                            <tr> 
                              <td style="font-size:0px;padding:${headerSectionMobTopPadding} ${headerSectionMobRightPadding} ${headerSectionMobBottomPadding} ${headerSectionMobLeftPadding};vertical-align:top;mso-padding-alt:${headerSectionDeskTopPadding} ${headerSectionDeskRightPadding} ${headerSectionDeskBottomPadding} ${headerSectionDeskLeftPadding};" class="block-grid padding-${headerSectionDeskTopPadding}-${headerSectionDeskRightPadding}-${headerSectionDeskBottomPadding}-${headerSectionDeskLeftPadding}"> 
                                <!--[if mso | IE]>
                                                <table role="presentation" border="0" cellpadding="0" cellspacing="0">
                                                <tr>
                                                <td style="vertical-align:top;"><![endif]--> 
                                <div class="mj-column-per-100 mj-outlook-group-fix mj-column-header-mobile-fix" cellpadding="10" style="font-size:0px;text-align:left;direction:ltr;display:inline-block;vertical-align:top;width:100%;height: 34vh;"> 
                                  <table class="mj-table-header-mobile-fix" border="0" cellpadding="0" cellspacing="0" role="presentation" style="border-radius:0px;vertical-align:top;padding: 30px;text-align: center; background-color: #ffffff; top: -90px;position: relative;" width="100%"> 
                                    <tbody> 
                                     
                                      <tr> 
                                        <td class="text-container" style="font-size:0px;padding:${headerSectionTitleTopSpacing} ${headerSectionTitleRightSpacing} ${headerSectionTitleBottomSpacing} ${headerSectionTitleLeftSpacing};mso-padding-alt:${headerSectionTitleTopSpacing} ${headerSectionTitleRightSpacing} ${headerSectionTitleBottomSpacing} ${headerSectionTitleLeftSpacing} ;word-break:break-word;text-align:${headerSectionTitleAlign};"> 
                                          <div class="mktoText ${headerSectionTitleFontFamily}" id="title" mktoname="Title" style="font-size:${headerSectionTitleFontSize};letter-spacing:${headerSectionTitleLetterSpacing};line-height:${headerSectionTitleLineHeight};mso-line-height-rule:exactly;text-align:${headerSectionTitleAlign};color:${headerSectionTitleColor};font-style:${headerSectionTitleFontStyle}">
                                            <p>Make it stand out</p>
                                          </div> </td> 
                                      </tr> 
                                     
                                      <tr> 
                                        <td class="text-container" style="font-size:0px;padding:${headerSectionSubTitleTopSpacing} ${headerSectionSubTitleRightSpacing} ${headerSectionSubTitleBottomSpacing} ${headerSectionSubTitleLeftSpacing};word-break:break-word;mso-padding-alt:${headerSectionSubTitleTopSpacing} ${headerSectionSubTitleRightSpacing} ${headerSectionSubTitleBottomSpacing} ${headerSectionSubTitleLeftSpacing};text-align:${headerSectionSubTitleAlign};"> 
                                          <div class="mktoText ${headerSectionSubTitleFontFamily}" id="subTitle" mktoname="Sub Title" style="font-size:${headerSectionSubTitleFontSize};letter-spacing:${headerSectionSubTitleLetterSpacing};line-height:${headerSectionSubTitleLineHeight};mso-line-height-rule:exactly;text-align:${headerSectionSubTitleAlign};color:${headerSectionSubTitleColor};font-style:${headerSectionSubTitleFontStyle}">
                                            <p>This is for two line subheads. This is for two line subheads.</p>
                                          </div> </td> 
                                      </tr> 
                                     
                                      <tr style="display:${hideCTA}"> 
                                        <td valign="middle" class="button-container" style="font-size:0px;padding:${headerSectionCTATopSpacing} ${headerSectionCTARightSpacing} ${headerSectionCTABottomSpacing} ${headerSectionCTALeftSpacing};mso-padding-alt:${headerSectionCTATopSpacing} ${headerSectionCTARightSpacing} ${headerSectionCTABottomSpacing} ${headerSectionCTALeftSpacing};word-break:break-word;text-align:${headerSectionCTAAlign};"> 
                                          <div> 
                                            <!--[if mso]>
                                                                    <table width="100%" align="center" border="0" cellpadding="0" cellspacing="0" style="border-spacing:0;border-collapse:collapse;mso-table-lspace:0pt;mso-table-rspace:0pt;">
                                                                    <tr>
                                                                    <td align="left" class="mso-button-dark-mode"><a:roundrect xmlns:a="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" fillcolor="${headerSectionCTABgColor}" arcsize="52%" style="v-text-anchor:middle;width:105pt;height:36pt;" stroke="f" ><w:anchorlock/><a:textbox inset="0,0,0,0"><center style="color:${headerSectionCTAColor}; font-family:${headerSectionCTAFontFamily}; font-size:${headerSectionSubTitleFontSize}"><![endif]--> 
                                            <div class="mktoText ${headerSectionCTAFontFamily} ${ctaUnderline}" id="headerCTA" mktoname="Header CTA" style="display:inline-block;background:${headerSectionCTABgColor};color:${headerSectionCTAColor};font-size:${headerSectionSubTitleFontSize};font-weight:${headerSectionCTAFontWeight};letter-spacing:${headerSectionCTALetterSpacing};line-height:${headerSectionCTALineHeight};mso-line-height-rule:exactly;margin:0;text-align:${headerSectionCTAAlign};text-decoration:${ctaUnderline};text-transform:none;padding:16px 24px 16px 24px;mso-padding-alt:0px;border-radius:25px;mso-border-alt:none;box-sizing:border-box;width:auto;white-space:nowrap">
                                              <p> <a href="https://www.linkedin.com/showcase/vanguard-financial-advisor-services/?CID=FAS:MC:123456." title="Header CTA" style="color:${headerSectionCTAColor}">Lorem ipsum </a> </p>
                                            </div> 
                                            <!--[if mso]></center></a:textbox></a:roundrect>
                                                                    </td>
                                                                    </tr>
                                                                    </table><![endif]--> 
                                          </div> </td> 
                                      </tr> 
                                     
                                    </tbody> 
                                  </table> 
                                </div> 
                                <!--[if mso | IE]>
                                                </td>
                                                </tr>
                                                </table><![endif]--> </td> 
                            </tr> 
                          </tbody> 
                        </table> 
                      </div> 
                      <!--[if mso | IE]>
                                </td>
                                </tr>
                                </table><![endif]--> </td> 
                  </tr> 
                </tbody> 
              </table></td> 
          </tr> 
        </tbody> 
      </table> 
    </div>  
  </body>
</html>
0 Likes
904
Reply
Jasbir_Kaur
Level 5
Level 5
‎10-31-2023 04:37 AM
‎10-31-2023 04:37 AM

Re: HTML issue with cross browser css not working

Hi @akshat_goyal,

 

As I've noticed that variables are extensively used throughout the code, I'm unable to make corrections without replacing them first. If you can provide the code without variables, I'd be happy to assist further.

 

Upon reviewing your code, it appears that you've utilized CSS for layout, however some email clients may not fully support this type of CSS, that's why you're experiencing this issue.

 

Thanks!

Jasbir

0 Likes
893
Reply
akshat_goyal
Level 3
Level 3
‎10-31-2023 07:32 AM
‎10-31-2023 07:32 AM

Re: HTML issue with cross browser css not working

Can you try copy and paste this code i shared above in Marketo Email < edit code? 
Hope that works then? If that does not work i can remove variables as well. 

https://everest.validity.com/design/share/92a942fef2bfa0/

 

This is Everest design test result. 

0 Likes
888
Reply
Jasbir_Kaur
Level 5
Level 5
‎10-31-2023 11:21 PM
‎10-31-2023 11:21 PM

Re: HTML issue with cross browser css not working

Please share your code without variables, and then I'll check it.

0 Likes
876
Reply
akshat_goyal
Level 3
Level 3
‎11-01-2023 07:18 AM
‎11-01-2023 07:18 AM

Re: HTML issue with cross browser css not working

The testing result - https://everest.validity.com/design/share/499b9f2d05c086/

0 Likes
867
Reply
Jasbir_Kaur
Level 5
Level 5
‎11-02-2023 02:42 AM
‎11-02-2023 02:42 AM

Re: HTML issue with cross browser css not working

Hi @akshat_goyal,

 

Here you don't need to use a background image, please use a simple image - https://prnt.sc/9BZJ0nYMjwrs

 

After that, it will work on Android devices.

 

Thanks!

 

 

0 Likes
851
Reply
akshat_goyal
Level 3
Level 3
‎11-02-2023 02:55 AM
‎11-02-2023 02:55 AM

Re: HTML issue with cross browser css not working

akshat_goyal_0-1698918632484.png

Hi @Jasbir_Kaur  thanks for help I dont know why button not fixed in outlook software, but looking fine in all other versions. please check the testing result. 

https://everest.validity.com/design/share/1effb401175b78/

 

Here is the button code:

  <tr style="display:table-row;">

            <td valign="middle"

                class="padContainerLR"

              style="font-size: 0px; padding: 0px 69px; word-break: break-word; text-align: left; color: rgb(255, 255, 255) !important;">

                <div>

                    <!--[if mso]>

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

                                    <tr>

                                    <td align="left" class="mso-button-dark-mode"><a:roundrect xmlns:a="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" fillcolor="${headerSectionCTABgColor}" arcsize="52%" style="v-text-anchor:middle;width:105pt;height:45pt;" stroke="f" ><w:anchorlock/><a:textbox inset="0,0,0,0"><center style="color:#ffffff; font-family:${headerSectionCTAFontFamily}; font-size:${headerSectionSubTitleFontSize}"><![endif]-->

                    <div class="mktoText ${headerSectionCTAFontFamily} ${ctaUnderline} button-a"

                        id="headerCTA" mktoname="Header CTA"

                        style="display:inline-block; background-image:initial; background-position:initial; background-size:initial; background-repeat:initial; background-attachment:initial; background-origin:initial; background-clip:initial; background-color:rgb(41,41,41)!important; color:rgb(255,255,255)!important; font-size:16px; font-weight:normal; letter-spacing:0px; line-height:16px; margin:0px; text-align:left; text-decoration:none; text-transform:none; padding:16px 24px; border-radius:60px; box-sizing:border-box; width:auto; white-space:nowrap">

                        <p> <a href="https://www.linkedin.com/showcase/vanguard-financial-advisor-services/?CID=FAS:MC:123456."

                                title="Header CTA"

                                style="color:#ffffff;">Lorem

                                ipsum </a> </p>

                    </div>

                    <!--[if mso]></center></a:textbox></a:roundrect>

                                    </td>

                                    </tr>

                                    </table><![endif]-->

                </div>

            </td>

        </tr>

 

 

 

0 Likes
843
Reply
Jasbir_Kaur
Level 5
Level 5
‎11-02-2023 04:21 AM
‎11-02-2023 04:21 AM

Re: HTML issue with cross browser css not working

Hi @akshat_goyal,

 

Remove <p> tag from here - https://prnt.sc/V-Ix0V4WFTe1 and use div and then try.

0 Likes
842
Reply
akshat_goyal
Level 3
Level 3
‎11-14-2023 01:19 PM
‎11-14-2023 01:19 PM

Re: HTML issue with cross browser css not working

Thanks, Jasbir this really help.

732
Reply
Home