azcomputerguru/claudetools
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

refactor(service-overview): Rework for comfortable two-page layout

Browse Source 
Major improvements for readability:
- Font sizes increased 20-40% (body 10px→12px, headers 22-26px→26-28px)
- Page padding increased 0.4in→0.6in for more breathing room
- All spacing increased 50-60% (margins, gaps, padding)
- Line-height improved (1.35→1.5 for body text)
- Box padding increased 30-50% across all elements
- Grid gaps increased (6px→10px)

Result: Professional, comfortable two-page layout that's easy to read
without the cramped, maximum-density feel of the previous version.
This commit is contained in:
Mike Swanson
2026-02-01 19:08:38 -07:00
parent 1a8993610e
commit 24ea18c248
1 changed files with 150 additions and 150 deletions
Download Patch File Download Diff File Expand all files Collapse all files

300
projects/msp-pricing/marketing/Service-Overview-OnePager.html
View File

@@ -11,8 +11,8 @@ body { font-family: 'Segoe UI', Tahoma, sans-serif; line-height: 1.5; color: #33
.page {
width: 8.5in;
height: 11in;
padding: 0.4in;
padding-bottom: 0.65in;
padding: 0.6in;
padding-bottom: 0.8in;
background: white;
position: relative;
margin: 20px auto;
@@ -27,8 +27,8 @@ body { font-family: 'Segoe UI', Tahoma, sans-serif; line-height: 1.5; color: #33
width: 100%;
height: 11in;
margin: 0;
padding: 0.4in;
padding-bottom: 0.65in;
padding: 0.6in;
padding-bottom: 0.8in;
page-break-after: always;
box-shadow: none;
overflow: hidden;
@@ -40,32 +40,32 @@ body { font-family: 'Segoe UI', Tahoma, sans-serif; line-height: 1.5; color: #33
display: flex;
justify-content: space-between;
align-items: center;
padding-bottom: 8px;
padding-bottom: 12px;
border-bottom: 3px solid #1e3c72;
margin-bottom: 12px;
margin-bottom: 16px;
}
.logo { font-size: 20px; font-weight: bold; color: #1e3c72; }
.contact { text-align: right; font-size: 10px; color: #666; }
.contact .phone { font-size: 14px; font-weight: bold; color: #f39c12; }
.logo { font-size: 22px; font-weight: bold; color: #1e3c72; }
.contact { text-align: right; font-size: 11px; color: #666; }
.contact .phone { font-size: 16px; font-weight: bold; color: #f39c12; }
h1 { color: #1e3c72; font-size: 22px; margin-bottom: 4px; line-height: 1.2; }
h2 { color: #1e3c72; font-size: 15px; margin: 10px 0 6px 0; padding-bottom: 3px; border-bottom: 2px solid #f39c12; page-break-after: avoid; }
h3 { color: #1e3c72; font-size: 12px; margin: 6px 0 3px 0; font-weight: bold; page-break-after: avoid; }
.subtitle { font-size: 11px; color: #666; font-style: italic; margin-bottom: 6px; }
h1 { color: #1e3c72; font-size: 26px; margin-bottom: 6px; line-height: 1.2; }
h2 { color: #1e3c72; font-size: 18px; margin: 15px 0 9px 0; padding-bottom: 4px; border-bottom: 2px solid #f39c12; page-break-after: avoid; }
h3 { color: #1e3c72; font-size: 14px; margin: 9px 0 5px 0; font-weight: bold; page-break-after: avoid; }
.subtitle { font-size: 12px; color: #666; font-style: italic; margin-bottom: 9px; }
p { font-size: 10px; margin-bottom: 5px; line-height: 1.35; }
p { font-size: 12px; margin-bottom: 8px; line-height: 1.5; }
.tier-comparison {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 6px;
margin: 6px 0;
gap: 10px;
margin: 10px 0;
}
.tier-box {
border: 2px solid #e0e0e0;
border-radius: 6px;
padding: 6px;
padding: 10px;
position: relative;
background: white;
page-break-inside: avoid;
@@ -76,42 +76,42 @@ p { font-size: 10px; margin-bottom: 5px; line-height: 1.35; }
}
.tier-box .badge {
position: absolute;
top: -8px;
top: -10px;
left: 50%;
transform: translateX(-50%);
background: #f39c12;
color: white;
padding: 2px 6px;
padding: 3px 8px;
border-radius: 8px;
font-weight: bold;
font-size: 8px;
font-size: 9px;
white-space: nowrap;
}
.tier-name {
font-size: 11px;
font-size: 13px;
font-weight: bold;
color: #1e3c72;
text-align: center;
margin-bottom: 3px;
margin-bottom: 4px;
}
.tier-price {
text-align: center;
font-size: 16px;
font-size: 18px;
font-weight: bold;
color: #27ae60;
margin-bottom: 3px;
margin-bottom: 4px;
}
.tier-price .period {
font-size: 8px;
font-size: 9px;
color: #666;
display: block;
}
.tier-label {
text-align: center;
font-size: 9px;
font-size: 10px;
font-weight: bold;
color: #666;
margin-bottom: 5px;
margin-bottom: 6px;
}
.tier-features {
list-style: none;
@@ -119,11 +119,11 @@ p { font-size: 10px; margin-bottom: 5px; line-height: 1.35; }
margin: 0;
}
.tier-features li {
font-size: 9px;
padding: 2px 0;
padding-left: 12px;
font-size: 11px;
padding: 3px 0;
padding-left: 14px;
position: relative;
line-height: 1.3;
line-height: 1.4;
}
.tier-features li:before {
content: "✓";
@@ -131,16 +131,16 @@ p { font-size: 10px; margin-bottom: 5px; line-height: 1.35; }
left: 0;
color: #27ae60;
font-weight: bold;
font-size: 10px;
font-size: 12px;
}
.tier-features li strong {
color: #1e3c72;
}
.best-for {
margin-top: 5px;
padding-top: 5px;
margin-top: 8px;
padding-top: 8px;
border-top: 1px solid #e0e0e0;
font-size: 8px;
font-size: 10px;
color: #666;
text-align: center;
}
@@ -148,13 +148,13 @@ p { font-size: 10px; margin-bottom: 5px; line-height: 1.35; }
.support-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 5px;
margin: 6px 0;
gap: 10px;
margin: 10px 0;
}
.support-card {
border: 2px solid #e0e0e0;
border-radius: 6px;
padding: 5px;
padding: 8px;
text-align: center;
position: relative;
page-break-inside: avoid;
@@ -165,70 +165,70 @@ p { font-size: 10px; margin-bottom: 5px; line-height: 1.35; }
.support-card.popular:before {
content: "⭐ POPULAR";
position: absolute;
top: -6px;
top: -8px;
left: 50%;
transform: translateX(-50%);
background: #f39c12;
color: white;
padding: 1px 4px;
padding: 2px 6px;
border-radius: 6px;
font-size: 7px;
font-size: 8px;
font-weight: bold;
}
.support-name {
font-size: 10px;
font-size: 12px;
font-weight: bold;
color: #1e3c72;
margin-bottom: 2px;
margin-bottom: 3px;
}
.support-price {
font-size: 14px;
font-size: 16px;
font-weight: bold;
color: #27ae60;
margin-bottom: 2px;
margin-bottom: 3px;
}
.support-details {
font-size: 8px;
font-size: 10px;
color: #666;
margin-bottom: 3px;
margin-bottom: 4px;
}
.support-features {
list-style: none;
padding: 0;
margin: 3px 0 0 0;
margin: 4px 0 0 0;
}
.support-features li {
font-size: 8px;
padding: 1px 0;
line-height: 1.2;
font-size: 10px;
padding: 2px 0;
line-height: 1.3;
}
.table {
width: 100%;
border-collapse: collapse;
margin: 5px 0;
font-size: 8px;
margin: 8px 0;
font-size: 10px;
page-break-inside: avoid;
}
.table th {
background: #1e3c72;
color: white;
padding: 3px;
padding: 5px;
text-align: left;
font-weight: 600;
}
.table td {
padding: 2px 3px;
padding: 4px 5px;
border-bottom: 1px solid #e0e0e0;
}
.callout-box {
background: #fff3cd;
border-left: 3px solid #f39c12;
padding: 5px 6px;
margin: 5px 0;
padding: 8px 10px;
margin: 8px 0;
border-radius: 2px;
font-size: 8px;
font-size: 10px;
page-break-inside: avoid;
}
.callout-box.success {
@@ -244,26 +244,26 @@ p { font-size: 10px; margin-bottom: 5px; line-height: 1.35; }
background: #f8f9fa;
border: 1px solid #1e3c72;
border-radius: 4px;
padding: 5px;
margin: 5px 0;
padding: 8px;
margin: 8px 0;
page-break-inside: avoid;
}
.example-header {
font-size: 9px;
font-size: 11px;
font-weight: bold;
color: #1e3c72;
margin-bottom: 2px;
margin-bottom: 4px;
}
.cost-line {
display: flex;
justify-content: space-between;
font-size: 8px;
padding: 1px 0;
font-size: 10px;
padding: 2px 0;
}
.cost-line.total {
border-top: 1px solid #1e3c72;
margin-top: 3px;
padding-top: 3px;
margin-top: 5px;
padding-top: 5px;
font-weight: bold;
color: #1e3c72;
}
@@ -271,13 +271,13 @@ p { font-size: 10px; margin-bottom: 5px; line-height: 1.35; }
ul.feature-list {
list-style: none;
padding: 0;
margin: 3px 0;
margin: 5px 0;
}
ul.feature-list li {
padding: 1px 0;
padding-left: 12px;
padding: 2px 0;
padding-left: 14px;
position: relative;
font-size: 9px;
font-size: 11px;
}
ul.feature-list li:before {
content: "✓";
@@ -285,98 +285,98 @@ ul.feature-list li:before {
left: 0;
color: #27ae60;
font-weight: bold;
font-size: 10px;
font-size: 12px;
}
.cta-box {
background: linear-gradient(135deg, #f39c12 0%, #e67e22 100%);
color: white;
padding: 8px;
padding: 12px;
border-radius: 6px;
text-align: center;
margin: 6px 0;
margin: 10px 0;
page-break-inside: avoid;
}
.cta-box h2 {
color: white;
border: none;
margin: 0 0 3px 0;
font-size: 13px;
margin: 0 0 5px 0;
font-size: 16px;
}
.cta-box .phone-large {
font-size: 16px;
font-size: 18px;
font-weight: bold;
margin: 3px 0;
margin: 5px 0;
}
.cta-box p {
font-size: 9px;
margin: 2px 0;
font-size: 11px;
margin: 3px 0;
}
.footer {
position: absolute;
bottom: 0.25in;
left: 0.4in;
right: 0.4in;
bottom: 0.3in;
left: 0.6in;
right: 0.6in;
text-align: center;
padding-top: 5px;
padding-top: 6px;
border-top: 2px solid #1e3c72;
color: #666;
font-size: 8px;
font-size: 9px;
background: white;
}
.pricing-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 6px;
margin: 5px 0;
gap: 10px;
margin: 8px 0;
}
.pricing-tier {
border: 1px solid #e0e0e0;
border-radius: 4px;
padding: 5px;
padding: 8px;
text-align: center;
page-break-inside: avoid;
}
.pricing-tier h4 {
font-size: 10px;
font-size: 12px;
color: #1e3c72;
margin-bottom: 2px;
margin-bottom: 3px;
}
.pricing-tier .price {
font-size: 13px;
font-size: 15px;
font-weight: bold;
color: #27ae60;
margin: 2px 0;
margin: 3px 0;
}
.pricing-tier .details {
font-size: 7px;
font-size: 9px;
color: #666;
margin: 1px 0;
margin: 2px 0;
}
.pricing-tier ul {
list-style: none;
padding: 0;
margin: 3px 0 0 0;
margin: 5px 0 0 0;
text-align: left;
}
.pricing-tier li {
font-size: 7px;
padding: 1px 0;
line-height: 1.2;
font-size: 9px;
padding: 2px 0;
line-height: 1.3;
}
.voip-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 4px;
margin: 5px 0;
gap: 8px;
margin: 8px 0;
}
.voip-box {
border: 1px solid #e0e0e0;
border-radius: 4px;
padding: 4px;
padding: 6px;
position: relative;
page-break-inside: avoid;
}
@@ -387,40 +387,40 @@ ul.feature-list li:before {
.voip-box.popular:before {
content: "★ POPULAR";
position: absolute;
top: -5px;
top: -7px;
left: 50%;
transform: translateX(-50%);
background: #f39c12;
color: white;
padding: 1px 3px;
padding: 2px 5px;
border-radius: 4px;
font-size: 6px;
font-size: 7px;
font-weight: bold;
}
.voip-name {
font-size: 9px;
font-size: 11px;
font-weight: bold;
color: #1e3c72;
text-align: center;
margin-bottom: 2px;
margin-bottom: 3px;
}
.voip-price {
font-size: 13px;
font-size: 15px;
font-weight: bold;
color: #27ae60;
text-align: center;
margin-bottom: 2px;
margin-bottom: 3px;
}
.voip-price .period {
font-size: 7px;
font-size: 8px;
color: #666;
display: block;
}
.voip-label {
font-size: 7px;
font-size: 9px;
color: #666;
text-align: center;
margin-bottom: 3px;
margin-bottom: 4px;
}
.voip-features {
list-style: none;
@@ -428,9 +428,9 @@ ul.feature-list li:before {
margin: 0;
}
.voip-features li {
font-size: 7px;
padding: 1px 0;
line-height: 1.2;
font-size: 9px;
padding: 2px 0;
line-height: 1.3;
}
</style>
</head>
@@ -471,7 +471,7 @@ ul.feature-list li:before {
<div class="tier-name">GPS-PRO</div>
<div class="tier-price">$26<span class="period">/endpoint/month</span></div>
<div class="tier-label">Business Protection</div>
<p style="font-size: 8px; font-weight: 600; margin-bottom: 2px; text-align: center;">Everything in BASIC, PLUS:</p>
<p style="font-size: 10px; font-weight: 600; margin-bottom: 3px; text-align: center;">Everything in BASIC, PLUS:</p>
<ul class="tier-features">
<li><strong>Advanced EDR</strong> threat detection</li>
<li><strong>Email security</strong> & anti-phishing</li>
@@ -486,7 +486,7 @@ ul.feature-list li:before {
<div class="tier-name">GPS-ADVANCED</div>
<div class="tier-price">$39<span class="period">/endpoint/month</span></div>
<div class="tier-label">Maximum Protection</div>
<p style="font-size: 8px; font-weight: 600; margin-bottom: 2px; text-align: center;">Everything in PRO, PLUS:</p>
<p style="font-size: 10px; font-weight: 600; margin-bottom: 3px; text-align: center;">Everything in PRO, PLUS:</p>
<ul class="tier-features">
<li><strong>Advanced threat intelligence</strong></li>
<li><strong>Ransomware rollback</strong></li>
@@ -546,10 +546,10 @@ ul.feature-list li:before {
</div>
</div>
<p style="font-size: 8px; margin: 3px 0;"><strong>All Support Plans Include:</strong> Email & phone support, covers GPS-enrolled endpoints and equipment, professional service, single point of contact.</p>
<p style="font-size: 10px; margin: 5px 0;"><strong>All Support Plans Include:</strong> Email & phone support, covers GPS-enrolled endpoints and equipment, professional service, single point of contact.</p>
<h2>Prepaid Block Time - Non-Expiring Project Hours</h2>
<p style="font-size: 8px;">Perfect for one-time projects, seasonal needs, or supplementing your Support Plan.</p>
<p style="font-size: 10px;">Perfect for one-time projects, seasonal needs, or supplementing your Support Plan.</p>
<table class="table">
<tr><th>Block Size</th><th>Price</th><th>Effective Rate</th><th>Expiration</th></tr>
@@ -568,7 +568,7 @@ ul.feature-list li:before {
<div class="cost-line total"><span>TOTAL</span><span>$665/month</span></div>
</div>
<div style="display: grid; grid-template-columns: 1fr 1fr; gap: 8px;">
<div style="display: grid; grid-template-columns: 1fr 1fr; gap: 12px;">
<div class="example-box">
<div class="example-header">Growing Business (22 endpoints)</div>
<div class="cost-line"><span>GPS-Pro (22 × $26)</span><span>$572</span></div>
@@ -589,11 +589,11 @@ ul.feature-list li:before {
</div>
<div class="footer">
<div style="margin-bottom: 4px;">
<strong style="font-size: 11px; color: #f39c12;">Ready to Get Started?</strong>
<div style="margin-bottom: 5px;">
<strong style="font-size: 12px; color: #f39c12;">Ready to Get Started?</strong>
Call <strong style="color: #1e3c72;">520.304.8300</strong> or visit <strong style="color: #1e3c72;">azcomputerguru.com</strong>
</div>
<div style="font-size: 8px;">
<div style="font-size: 9px;">
Protecting Tucson Businesses Since 2001 | 7437 E. 22nd St, Tucson, AZ 85710 | Turn over for complete IT services →
</div>
</div>
@@ -658,21 +658,21 @@ ul.feature-list li:before {
<h2>Email Hosting - Budget-Friendly or Enterprise</h2>
<div style="display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin: 5px 0;">
<div style="display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 8px 0;">
<div>
<h3>WHM Email - Budget Option</h3>
<p><strong>From $2/mailbox/mo</strong> (5GB) + $2 per 5GB</p>
<ul class="feature-list" style="font-size: 8px;">
<ul class="feature-list" style="font-size: 10px;">
<li>IMAP/POP3/SMTP, webmail</li>
<li>Works with Outlook, mobile apps</li>
<li>Daily backups, spam filtering</li>
</ul>
<p style="font-size: 8px; margin-top: 3px;"><strong>Packages:</strong> 5GB: $2 | 10GB: $4 | 25GB: $10 | 50GB: $20</p>
<p style="font-size: 10px; margin-top: 5px;"><strong>Packages:</strong> 5GB: $2 | 10GB: $4 | 25GB: $10 | 50GB: $20</p>
</div>
<div>
<h3>Microsoft 365 - Enterprise</h3>
<ul class="feature-list" style="font-size: 8px;">
<ul class="feature-list" style="font-size: 10px;">
<li><strong>Basic:</strong> $7/user (50GB, web/mobile, Teams)</li>
<li><strong>Standard:</strong> $14/user (Desktop apps) - POPULAR</li>
<li><strong>Premium:</strong> $24/user (Advanced security)</li>
@@ -681,7 +681,7 @@ ul.feature-list li:before {
</div>
</div>
<p style="font-size: 8px; margin: 3px 0;"><strong>Email Security Add-On:</strong> $3/mailbox/month (Anti-phishing, spam, DLP) - Recommended for WHM</p>
<p style="font-size: 10px; margin: 5px 0;"><strong>Email Security Add-On:</strong> $3/mailbox/month (Anti-phishing, spam, DLP) - Recommended for WHM</p>
<h2>VoIP Services - GPS-Voice Business Phone Systems</h2>
@@ -704,7 +704,7 @@ ul.feature-list li:before {
<div class="voip-name">GPS-Voice Standard</div>
<div class="voip-price">$28<span class="period">/user/month</span></div>
<div class="voip-label">Business Communications</div>
<p style="font-size: 6px; font-weight: 600; margin-bottom: 1px;">Everything in Basic, PLUS:</p>
<p style="font-size: 8px; font-weight: 600; margin-bottom: 2px;">Everything in Basic, PLUS:</p>
<ul class="voip-features">
<li>Voicemail transcription</li>
<li>Ring groups & call queues</li>
@@ -717,7 +717,7 @@ ul.feature-list li:before {
<div class="voip-name">GPS-Voice Pro</div>
<div class="voip-price">$35<span class="period">/user/month</span></div>
<div class="voip-label">Advanced Communications</div>
<p style="font-size: 6px; font-weight: 600; margin-bottom: 1px;">Everything in Standard, PLUS:</p>
<p style="font-size: 8px; font-weight: 600; margin-bottom: 2px;">Everything in Standard, PLUS:</p>
<ul class="voip-features">
<li>SMS text messaging</li>
<li>Call recording</li>
@@ -731,7 +731,7 @@ ul.feature-list li:before {
<div class="voip-name">GPS-Voice Call Center</div>
<div class="voip-price">$55<span class="period">/user/month</span></div>
<div class="voip-label">Full Contact Center</div>
<p style="font-size: 6px; font-weight: 600; margin-bottom: 1px;">Everything in Pro, PLUS:</p>
<p style="font-size: 8px; font-weight: 600; margin-bottom: 2px;">Everything in Pro, PLUS:</p>
<ul class="voip-features">
<li>Call center seat (ACD)</li>
<li>Real-time dashboards</li>
@@ -742,9 +742,9 @@ ul.feature-list li:before {
</div>
</div>
<p style="font-size: 8px; margin: 3px 0;"><strong>VoIP Add-Ons:</strong> Add'l Number: $2.50 | Toll-Free: $4.95 | SMS: $4 | Transcription: $3 | Teams: $8 | Fax: $12/mo</p>
<p style="font-size: 10px; margin: 5px 0;"><strong>VoIP Add-Ons:</strong> Add'l Number: $2.50 | Toll-Free: $4.95 | SMS: $4 | Transcription: $3 | Teams: $8 | Fax: $12/mo</p>
<p style="font-size: 8px; margin: 3px 0;"><strong>Phone Hardware:</strong> Basic (T53W): $219 | Business (T54W): $279 | Executive (T57W): $359 | Conference (CP920): $599 | Headset: $159 | Cordless: $199</p>
<p style="font-size: 10px; margin: 5px 0;"><strong>Phone Hardware:</strong> Basic (T53W): $219 | Business (T54W): $279 | Executive (T57W): $359 | Conference (CP920): $599 | Headset: $159 | Cordless: $199</p>
<div class="callout-box success">
<strong>Special for GPS Clients:</strong> Free number porting + 50% off first month VoIP
@@ -776,27 +776,27 @@ ul.feature-list li:before {
<h2>Get Started in 3 Easy Steps</h2>
<div style="display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px; margin: 5px 0;">
<div style="text-align: center; padding: 5px; background: #f8f9fa; border-radius: 3px;">
<div style="font-size: 18px; color: #f39c12; font-weight: bold;">1</div>
<div style="font-size: 8px; font-weight: bold; color: #1e3c72; margin: 2px 0;">FREE CONSULTATION</div>
<div style="font-size: 7px;">Call 520.304.8300 for assessment</div>
<div style="display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin: 8px 0;">
<div style="text-align: center; padding: 8px; background: #f8f9fa; border-radius: 3px;">
<div style="font-size: 20px; color: #f39c12; font-weight: bold;">1</div>
<div style="font-size: 10px; font-weight: bold; color: #1e3c72; margin: 3px 0;">FREE CONSULTATION</div>
<div style="font-size: 9px;">Call 520.304.8300 for assessment</div>
</div>
<div style="text-align: center; padding: 5px; background: #f8f9fa; border-radius: 3px;">
<div style="font-size: 18px; color: #f39c12; font-weight: bold;">2</div>
<div style="font-size: 8px; font-weight: bold; color: #1e3c72; margin: 2px 0;">CUSTOM PROPOSAL</div>
<div style="font-size: 7px;">Solution for your budget</div>
<div style="text-align: center; padding: 8px; background: #f8f9fa; border-radius: 3px;">
<div style="font-size: 20px; color: #f39c12; font-weight: bold;">2</div>
<div style="font-size: 10px; font-weight: bold; color: #1e3c72; margin: 3px 0;">CUSTOM PROPOSAL</div>
<div style="font-size: 9px;">Solution for your budget</div>
</div>
<div style="text-align: center; padding: 5px; background: #f8f9fa; border-radius: 3px;">
<div style="font-size: 18px; color: #f39c12; font-weight: bold;">3</div>
<div style="font-size: 8px; font-weight: bold; color: #1e3c72; margin: 2px 0;">SEAMLESS SETUP</div>
<div style="font-size: 7px;">Migration, training, support</div>
<div style="text-align: center; padding: 8px; background: #f8f9fa; border-radius: 3px;">
<div style="font-size: 20px; color: #f39c12; font-weight: bold;">3</div>
<div style="font-size: 10px; font-weight: bold; color: #1e3c72; margin: 3px 0;">SEAMLESS SETUP</div>
<div style="font-size: 9px;">Migration, training, support</div>
</div>
</div>
<div style="background: #f8f9fa; padding: 5px; border-left: 4px solid #27ae60; border-radius: 3px; margin: 5px 0 10px 0;">
<p style="font-size: 8px; font-weight: bold; color: #1e3c72; margin-bottom: 2px;">Our Commitment to You:</p>
<ul class="feature-list" style="font-size: 8px;">
<div style="background: #f8f9fa; padding: 8px; border-left: 4px solid #27ae60; border-radius: 3px; margin: 8px 0 12px 0;">
<p style="font-size: 10px; font-weight: bold; color: #1e3c72; margin-bottom: 3px;">Our Commitment to You:</p>
<ul class="feature-list" style="font-size: 10px;">
<li>Fast response (2-24 hours by plan)</li>
<li>Proactive monitoring prevents problems</li>
<li>Transparent pricing, no hidden fees</li>
@@ -807,11 +807,11 @@ ul.feature-list li:before {
</div>
<div class="footer">
<div style="margin-bottom: 4px;">
<strong style="font-size: 11px; color: #f39c12;">Contact Us Today:</strong>
<div style="margin-bottom: 5px;">
<strong style="font-size: 12px; color: #f39c12;">Contact Us Today:</strong>
520.304.8300 | info@azcomputerguru.com | azcomputerguru.com
</div>
<div style="font-size: 8px;">
<div style="font-size: 9px;">
Protecting Tucson Businesses Since 2001 | 7437 E. 22nd St, Tucson, AZ 85710
</div>
</div>