Offer Materials
4 min
HTML Snippets
Representation 1
West Coast Fiber 1000
<th class="colspan-n" style="width:14%;background-color:rgb(255, 255, 255);background-image:url("https://adbecdn.blob.core.windows.net/stor/msimpson/hol-assets/citisignal-background-riser.png");background-repeat:no-repeat;background-size:100% 100%;background-position:50% 50%;height:300px;border-radius:0px;border:none;padding:0px;" data-has-int-mso-hack="true" data-source-uuid="359034fa-f21c-44bc-8fae-aa281c10690d">
<!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="background-image: url('https://adbecdn.blob.core.windows.net/stor/msimpson/hol-assets/citisignal-background-riser.png'); border-radius: 0px; padding: 0px;" >
<![endif]--><!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="padding: 0px 0px 0px 15px;" >
<![endif]-->
<div class="acr-fragment acr-component" data-component-id="text" data-source-uuid="70d5b511-6561-4c86-8cbf-8ee2befeb335" style="margin:0px 0px 0px 15px;font-size:16px;font-family:"arial black";color:rgb(0, 0, 0);text-align:left;font-weight:bold;font-style:normal;text-decoration:none;height:auto;width:171px;" data-has-ext-mso-hack="true" data-has-int-mso-hack="true" data-contenteditable="false">
<!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="171">
<tr>
<td style="font-size: 16px; font-family: 'arial black'; color: rgb(0, 0, 0); text-align: left; font-weight: bold; font-style: normal; text-decoration: none; height: auto;" >
<![endif]-->
<div class="text-container" data-contenteditable="true">
<p>FIBER 1000 - $79</p>
</div>
<!--[if mso]>
</td>
</tr>
</table>
<![endif]-->
</div>
<!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="padding: 0px 0px 0px 9px;" >
<![endif]-->
<div class="acr-fragment acr-component image-container" data-component-id="image" style="width:100%;text-align:left;margin:0px 0px 0px 9px;" data-source-uuid="07253701-6959-4474-b273-6147947158e8" data-has-ext-mso-hack="true" data-has-int-mso-hack="true" data-contenteditable="false">
<!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="text-align: left;" >
<![endif]--><img src="https://adbecdn.blob.core.windows.net/stor/msimpson/hol-assets/20-percent.png" style="height:auto;width:60%;max-width:60%;" width="108" height="21"><!--[if mso]>
</td>
</tr>
</table>
<![endif]-->
</div>
<!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="padding: 0px 10px 0px 15px;" >
<![endif]-->
<div class="acr-fragment acr-component" data-component-id="text" style="margin:0px 10px 0px 15px;font-size:12px;font-family:sans-serif;color:rgb(0, 0, 0);text-align:left;font-weight:normal;font-style:normal;padding:10px 0px 15px;" data-has-ext-mso-hack="true" data-has-int-mso-hack="true" data-contenteditable="false">
<!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="font-size: 12px; font-family: sans-serif; color: rgb(0, 0, 0); text-align: left; font-weight: normal; font-style: normal; padding: 10px 0px 15px;" >
<![endif]-->
<div class="text-container" data-contenteditable="true">
<p>Best for connected homes, telecommuting, competitive gaming, and more</p>
</div>
<!--[if mso]>
</td>
</tr>
</table>
<![endif]-->
</div>
<!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="padding: 0px 0px 0px 7px;" >
<![endif]-->
<div class="acr-fragment acr-component" data-component-id="text" style="background-color:rgb(119, 55, 154);margin:0px 0px 0px 7px;font-size:16px;font-family:sans-serif;color:rgb(255, 255, 255);text-align:left;font-weight:normal;font-style:normal;" data-has-ext-mso-hack="true" data-has-int-mso-hack="true" data-contenteditable="false">
<!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="background-color: rgb(119, 55, 154); font-size: 16px; font-family: sans-serif; color: rgb(255, 255, 255); text-align: left; font-weight: normal; font-style: normal;" >
<![endif]-->
<div class="text-container" data-contenteditable="true">
<p><span style="font-size:12px;">Get a $50 CitiSignal Visa® Reward Card with online orders</span></p>
</div>
<!--[if mso]>
</td>
</tr>
</table>
<![endif]-->
</div>
<div class="acr-fragment acr-component" data-component-id="html" style="margin:0px 2px 0px 15px;" data-contenteditable="true">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Checkmark Bullets</title>
<style>
ul {
list-style-type: none; /* Remove default bullets */
padding: 0; /* Remove padding */
font-size: 12px; /* Set font size to 12 pixels */
}
li {
position: relative; /* Positioning for the checkmark */
padding-left: 20px; /* Space for the checkmark */
}
li::before {
content: '✔'; /* Checkmark character */
color: #77379A; /* Set checkmark color */
position: absolute; /* Position the checkmark */
left: 0; /* Align to the left */
}
</style>
<ul>
<li>1000Mbps internet speed</li>
<li>Stream HD on 5 devices at the same time</li>
<li>Professional installation included ($99 value)</li>
</ul>
</div>
<!--[if mso]>
</td>
</tr>
</table>
<![endif]--><!--[if mso]>
</td>
</tr>
</table>
<![endif]--><!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="padding: 10px 0px;" >
<![endif]-->
<div class="acr-fragment acr-component" data-component-id="button:2" style="width:100%;text-align:center;margin:10px 0px;background-color:transparent;font-size:16px;font-family:sans-serif;" data-has-ext-mso-hack="true" data-has-int-mso-hack="true" data-contenteditable="false">
<!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="background-color: transparent; text-align: center;" >
<table cellpadding="0" cellspacing="0" border="0" width="140">
<tr>
<td style="text-align: center;" >
<v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" style="height:24pt; width:108pt; v-text-anchor:middle;" arcsize="50%" fillcolor="rgb(119, 55, 154)" strokeweight="1.5pt" strokecolor="rgb(119, 55, 154)">
<v:stroke dashstyle="solid" />
<v:textbox inset="0,0,0,0">
<center style="color:rgb(255, 255, 255); font-family:sans-serif; font-size:14px">
<![endif]-->
<a class="arc-link" style="text-decoration:none;" _href="#" data-nl-type="externalLink" href="https://dsn.adobe.com/web/arex-NK7Q/fiber-plans?rid=wc1000">
<div class="button-container" style="width:140px;text-align:center;margin:auto;max-width:100%;display:inline-block;border:2px solid rgb(119, 55, 154);border-radius:16px;height:28px;line-height:28px;padding:0px;background-color:#CD70FF;" contenteditable="true">
<span style="color:rgb(255, 255, 255);font-weight:normal;font-style:normal;font-size:14px;" contenteditable="true">Check Availability</span>
</div>
</a>
<!--[if mso]>
</center>
</v:textbox>
</v:stroke>
</v:roundrect>
</td>
</tr>
</table>
</td>
</tr>
</table>
<![endif]-->
</div>
<!--[if mso]>
</td>
</tr>
</table>
<![endif]--><!--[if mso]>
</td>
</tr>
</table>
<![endif]--></th>Representation 2
West Coast Fiber 3000
<th class="colspan-n" style="width:14%;background-color:rgb(255, 255, 255);background-image:url("https://adbecdn.blob.core.windows.net/stor/msimpson/hol-assets/citisignal-background-riser.png");background-repeat:no-repeat;background-size:100% 100%;background-position:50% 50%;height:300px;border-radius:0px;border:none;padding:0px;" data-has-int-mso-hack="true" data-source-uuid="359034fa-f21c-44bc-8fae-aa281c10690d">
<!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="background-image: url('https://adbecdn.blob.core.windows.net/stor/msimpson/hol-assets/citisignal-background-riser.png'); border-radius: 0px; padding: 0px;" >
<![endif]--><!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="padding: 0px 0px 0px 15px;" >
<![endif]-->
<div class="acr-fragment acr-component" data-component-id="text" data-source-uuid="70d5b511-6561-4c86-8cbf-8ee2befeb335" style="margin:0px 0px 0px 15px;font-size:16px;font-family:"arial black";color:rgb(0, 0, 0);text-align:left;font-weight:bold;font-style:normal;text-decoration:none;height:auto;width:171px;" data-has-ext-mso-hack="true" data-has-int-mso-hack="true" data-contenteditable="false">
<!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="171">
<tr>
<td style="font-size: 16px; font-family: 'arial black'; color: rgb(0, 0, 0); text-align: left; font-weight: bold; font-style: normal; text-decoration: none; height: auto;" >
<![endif]-->
<div class="text-container" data-contenteditable="true">
<p>FIBER 1000 - $89</p>
</div>
<!--[if mso]>
</td>
</tr>
</table>
<![endif]-->
</div>
<!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="padding: 0px 0px 0px 9px;" >
<![endif]-->
<div class="acr-fragment acr-component image-container" data-component-id="image" style="width:100%;text-align:left;margin:0px 0px 0px 9px;" data-source-uuid="07253701-6959-4474-b273-6147947158e8" data-has-ext-mso-hack="true" data-has-int-mso-hack="true" data-contenteditable="false">
<!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="text-align: left;" >
<![endif]--><img src="https://adbecdn.blob.core.windows.net/stor/msimpson/hol-assets/40-percent.png" style="height:auto;width:60%;max-width:60%;" width="108" height="21"><!--[if mso]>
</td>
</tr>
</table>
<![endif]-->
</div>
<!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="padding: 0px 10px 0px 15px;" >
<![endif]-->
<div class="acr-fragment acr-component" data-component-id="text" style="margin:0px 10px 0px 15px;font-size:12px;font-family:sans-serif;color:rgb(0, 0, 0);text-align:left;font-weight:normal;font-style:normal;padding:10px 0px 15px;" data-has-ext-mso-hack="true" data-has-int-mso-hack="true" data-contenteditable="false">
<!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="font-size: 12px; font-family: sans-serif; color: rgb(0, 0, 0); text-align: left; font-weight: normal; font-style: normal; padding: 10px 0px 15px;" >
<![endif]-->
<div class="text-container" data-contenteditable="true">
<p>Best for connected homes, telecommuting, competitive gaming, and more</p>
</div>
<!--[if mso]>
</td>
</tr>
</table>
<![endif]-->
</div>
<!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="padding: 0px 0px 0px 7px;" >
<![endif]-->
<div class="acr-fragment acr-component" data-component-id="text" style="background-color:rgb(119, 55, 154);margin:0px 0px 0px 7px;font-size:16px;font-family:sans-serif;color:rgb(255, 255, 255);text-align:left;font-weight:normal;font-style:normal;" data-has-ext-mso-hack="true" data-has-int-mso-hack="true" data-contenteditable="false">
<!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="background-color: rgb(119, 55, 154); font-size: 16px; font-family: sans-serif; color: rgb(255, 255, 255); text-align: left; font-weight: normal; font-style: normal;" >
<![endif]-->
<div class="text-container" data-contenteditable="true">
<p><span style="font-size:12px;">Get a $100 CitiSignal Visa® Reward Card with online orders</span></p>
</div>
<!--[if mso]>
</td>
</tr>
</table>
<![endif]-->
</div>
<div class="acr-fragment acr-component" data-component-id="html" style="margin:0px 2px 0px 15px;" data-contenteditable="true">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Checkmark Bullets</title>
<style>
ul {
list-style-type: none; /* Remove default bullets */
padding: 0; /* Remove padding */
font-size: 12px; /* Set font size to 12 pixels */
}
li {
position: relative; /* Positioning for the checkmark */
padding-left: 20px; /* Space for the checkmark */
}
li::before {
content: '✔'; /* Checkmark character */
color: #77379A; /* Set checkmark color */
position: absolute; /* Position the checkmark */
left: 0; /* Align to the left */
}
</style>
<ul>
<li>3000Mbps internet speed</li>
<li>Stream HD on 5 devices at the same time</li>
<li>Professional installation included ($99 value)</li>
</ul>
</div>
<!--[if mso]>
</td>
</tr>
</table>
<![endif]--><!--[if mso]>
</td>
</tr>
</table>
<![endif]--><!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="padding: 10px 0px;" >
<![endif]-->
<div class="acr-fragment acr-component" data-component-id="button:2" style="width:100%;text-align:center;margin:10px 0px;background-color:transparent;font-size:16px;font-family:sans-serif;" data-has-ext-mso-hack="true" data-has-int-mso-hack="true" data-contenteditable="false">
<!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="background-color: transparent; text-align: center;" >
<table cellpadding="0" cellspacing="0" border="0" width="140">
<tr>
<td style="text-align: center;" >
<v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" style="height:24pt; width:108pt; v-text-anchor:middle;" arcsize="50%" fillcolor="rgb(119, 55, 154)" strokeweight="1.5pt" strokecolor="rgb(119, 55, 154)">
<v:stroke dashstyle="solid" />
<v:textbox inset="0,0,0,0">
<center style="color:rgb(255, 255, 255); font-family:sans-serif; font-size:14px">
<![endif]-->
<a class="arc-link" style="text-decoration:none;" _href="#" data-nl-type="externalLink" href="https://dsn.adobe.com/web/arex-NK7Q/fiber-plans?rid=wc3000">
<div class="button-container" style="width:140px;text-align:center;margin:auto;max-width:100%;display:inline-block;border:2px solid rgb(119, 55, 154);border-radius:16px;height:28px;line-height:28px;padding:0px;background-color:#CD70FF;" contenteditable="true">
<span style="color:rgb(255, 255, 255);font-weight:normal;font-style:normal;font-size:14px;" contenteditable="true">Check Availability</span>
</div>
</a>
<!--[if mso]>
</center>
</v:textbox>
</v:stroke>
</v:roundrect>
</td>
</tr>
</table>
</td>
</tr>
</table>
<![endif]-->
</div>
<!--[if mso]>
</td>
</tr>
</table>
<![endif]--><!--[if mso]>
</td>
</tr>
</table>
<![endif]--></th>Representation 3
West Coast Fiber 5000
<th class="colspan-n" style="width:14%;background-color:rgb(255, 255, 255);background-image:url("https://adbecdn.blob.core.windows.net/stor/msimpson/hol-assets/citisignal-background-riser.png");background-repeat:no-repeat;background-size:100% 100%;background-position:50% 50%;height:300px;border-radius:0px;border:none;padding:0px;" data-has-int-mso-hack="true" data-source-uuid="359034fa-f21c-44bc-8fae-aa281c10690d">
<!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="background-image: url('https://adbecdn.blob.core.windows.net/stor/msimpson/hol-assets/citisignal-background-riser.png'); border-radius: 0px; padding: 0px;" >
<![endif]--><!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="padding: 0px 0px 0px 15px;" >
<![endif]-->
<div class="acr-fragment acr-component" data-component-id="text" data-source-uuid="70d5b511-6561-4c86-8cbf-8ee2befeb335" style="margin:0px 0px 0px 15px;font-size:16px;font-family:"arial black";color:rgb(0, 0, 0);text-align:left;font-weight:bold;font-style:normal;text-decoration:none;height:auto;width:171px;" data-has-ext-mso-hack="true" data-has-int-mso-hack="true" data-contenteditable="false">
<!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="171">
<tr>
<td style="font-size: 16px; font-family: 'arial black'; color: rgb(0, 0, 0); text-align: left; font-weight: bold; font-style: normal; text-decoration: none; height: auto;" >
<![endif]-->
<div class="text-container" data-contenteditable="true">
<p>FIBER 5000 - $99</p>
</div>
<!--[if mso]>
</td>
</tr>
</table>
<![endif]-->
</div>
<!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="padding: 0px 0px 0px 9px;" >
<![endif]-->
<div class="acr-fragment acr-component image-container" data-component-id="image" style="width:100%;text-align:left;margin:0px 0px 0px 9px;" data-source-uuid="07253701-6959-4474-b273-6147947158e8" data-has-ext-mso-hack="true" data-has-int-mso-hack="true" data-contenteditable="false">
<!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="text-align: left;" >
<![endif]--><img src="https://adbecdn.blob.core.windows.net/stor/msimpson/hol-assets/100-percent.png" style="height:auto;width:60%;max-width:60%;" width="108" height="21"><!--[if mso]>
</td>
</tr>
</table>
<![endif]-->
</div>
<!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="padding: 0px 10px 0px 15px;" >
<![endif]-->
<div class="acr-fragment acr-component" data-component-id="text" style="margin:0px 10px 0px 15px;font-size:12px;font-family:sans-serif;color:rgb(0, 0, 0);text-align:left;font-weight:normal;font-style:normal;padding:10px 0px 15px;" data-has-ext-mso-hack="true" data-has-int-mso-hack="true" data-contenteditable="false">
<!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="font-size: 12px; font-family: sans-serif; color: rgb(0, 0, 0); text-align: left; font-weight: normal; font-style: normal; padding: 10px 0px 15px;" >
<![endif]-->
<div class="text-container" data-contenteditable="true">
<p>Best for connected homes, telecommuting, competitive gaming, and more</p>
</div>
<!--[if mso]>
</td>
</tr>
</table>
<![endif]-->
</div>
<!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="padding: 0px 0px 0px 7px;" >
<![endif]-->
<div class="acr-fragment acr-component" data-component-id="text" style="background-color:rgb(119, 55, 154);margin:0px 0px 0px 7px;font-size:16px;font-family:sans-serif;color:rgb(255, 255, 255);text-align:left;font-weight:normal;font-style:normal;" data-has-ext-mso-hack="true" data-has-int-mso-hack="true" data-contenteditable="false">
<!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="background-color: rgb(119, 55, 154); font-size: 16px; font-family: sans-serif; color: rgb(255, 255, 255); text-align: left; font-weight: normal; font-style: normal;" >
<![endif]-->
<div class="text-container" data-contenteditable="true">
<p><span style="font-size:12px;">Get a $150 CitiSignal Visa® Reward Card with online orders</span></p>
</div>
<!--[if mso]>
</td>
</tr>
</table>
<![endif]-->
</div>
<div class="acr-fragment acr-component" data-component-id="html" style="margin:0px 2px 0px 15px;" data-contenteditable="true">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Checkmark Bullets</title>
<style>
ul {
list-style-type: none; /* Remove default bullets */
padding: 0; /* Remove padding */
font-size: 12px; /* Set font size to 12 pixels */
}
li {
position: relative; /* Positioning for the checkmark */
padding-left: 20px; /* Space for the checkmark */
}
li::before {
content: '✔'; /* Checkmark character */
color: #77379A; /* Set checkmark color */
position: absolute; /* Position the checkmark */
left: 0; /* Align to the left */
}
</style>
<ul>
<li>5000Mbps internet speed</li>
<li>Stream HD on 5 devices at the same time</li>
<li>Professional installation included ($99 value)</li>
</ul>
</div>
<!--[if mso]>
</td>
</tr>
</table>
<![endif]--><!--[if mso]>
</td>
</tr>
</table>
<![endif]--><!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="padding: 10px 0px;" >
<![endif]-->
<div class="acr-fragment acr-component" data-component-id="button:2" style="width:100%;text-align:center;margin:10px 0px;background-color:transparent;font-size:16px;font-family:sans-serif;" data-has-ext-mso-hack="true" data-has-int-mso-hack="true" data-contenteditable="false">
<!--[if mso]>
<table cellpadding="0" cellspacing="0" border="0" width="100%">
<tr>
<td style="background-color: transparent; text-align: center;" >
<table cellpadding="0" cellspacing="0" border="0" width="140">
<tr>
<td style="text-align: center;" >
<v:roundrect xmlns:v="urn:schemas-microsoft-com:vml" xmlns:w="urn:schemas-microsoft-com:office:word" style="height:24pt; width:108pt; v-text-anchor:middle;" arcsize="50%" fillcolor="rgb(119, 55, 154)" strokeweight="1.5pt" strokecolor="rgb(119, 55, 154)">
<v:stroke dashstyle="solid" />
<v:textbox inset="0,0,0,0">
<center style="color:rgb(255, 255, 255); font-family:sans-serif; font-size:14px">
<![endif]-->
<a class="arc-link" style="text-decoration:none;" _href="#" data-nl-type="externalLink" href="https://dsn.adobe.com/web/arex-NK7Q/fiber-plans?rid=wc5000">
<div class="button-container" style="width:140px;text-align:center;margin:auto;max-width:100%;display:inline-block;border:2px solid rgb(119, 55, 154);border-radius:16px;height:28px;line-height:28px;padding:0px;background-color:#CD70FF;" contenteditable="true">
<span style="color:rgb(255, 255, 255);font-weight:normal;font-style:normal;font-size:14px;" contenteditable="true">Check Availability</span>
</div>
</a>
<!--[if mso]>
</center>
</v:textbox>
</v:stroke>
</v:roundrect>
</td>
</tr>
</table>
</td>
</tr>
</table>
<![endif]-->
</div>
<!--[if mso]>
</td>
</tr>
</table>
<![endif]--><!--[if mso]>
</td>
</tr>
</table>
<![endif]--></th>