Add 4 service category pages: Lawn & Garden, Home Services, Auto Care, Moving & Hauling
- lawn-care.html: 7 services (mowing, leaves, pick-up, edging, mulch, weeds, garden beds) - home-services.html: 9 services (gutters, windows, snow, wood, porch, trash cans, pressure wash, house wash, seasonal) - auto-care.html: 8 services (basic wash, interior detail, full detail, mobile, trash run, gas fill, jump start, wipers) - moving.html: 8 services (furniture, junk, mattress, college moves, garage, donations, appliances, lumber/soil) Each page includes: - Dedicated nav with Services dropdown linking all 4 categories - Category-specific hero with matching accent color - Service card grid with featured card - Pricing note and contact form with hidden service_category field - Full SEO (title, description, OG tags, Twitter card, canonical, JSON-LD Service schema) - Back to all services breadcrumb - Cross-links to sibling category pages in footer - Same CSS/fonts/mobile nav as main site
This commit is contained in:
John Loper II
+411
@@ -0,0 +1,411 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Auto Care Services | LoperBoys — Car Wash, Detailing, Mobile Service</title>
|
||||
<meta name="description" content="Mobile car wash, interior detail, full detail, gas fill, and basic roadside help in Warsaw, Coshocton, OH. We come to you. Call 220-200-4022.">
|
||||
<meta name="keywords" content="car wash, auto detailing, mobile car wash, interior detail, gas fill, jump start, wiper blade replacement, trash run, Warsaw OH, Coshocton, LoperBoys">
|
||||
<meta name="author" content="LoperBoys">
|
||||
<meta name="robots" content="index, follow">
|
||||
<link rel="canonical" href="https://loperboys.com/auto-care.html">
|
||||
|
||||
<!-- Open Graph / Facebook -->
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:url" content="https://loperboys.com/auto-care.html">
|
||||
<meta property="og:title" content="Auto Care Services | LoperBoys — Car Wash, Detailing, Mobile Service">
|
||||
<meta property="og:description" content="Mobile car wash, interior detail, full detail, gas fill, and basic roadside help in Warsaw, Coshocton, OH. We come to you.">
|
||||
<meta property="og:image" content="https://loperboys.com/img/og-banner.png">
|
||||
<meta property="og:locale" content="en_US">
|
||||
<meta property="og:site_name" content="LoperBoys">
|
||||
|
||||
<!-- Twitter Card -->
|
||||
<meta name="twitter:card" content="summary_large_image">
|
||||
<meta name="twitter:url" content="https://loperboys.com/auto-care.html">
|
||||
<meta name="twitter:title" content="Auto Care Services | LoperBoys — Car Wash, Detailing, Mobile Service">
|
||||
<meta name="twitter:description" content="Mobile car wash, interior detail, full detail, gas fill, and basic roadside help in Warsaw, Coshocton, OH.">
|
||||
<meta name="twitter:image" content="https://loperboys.com/img/og-banner.png">
|
||||
|
||||
<!-- Favicon -->
|
||||
<link rel="icon" type="image/svg+xml" href="img/favicon.svg">
|
||||
<link rel="apple-touch-icon" href="img/favicon.svg">
|
||||
|
||||
<!-- Structured Data (Service) -->
|
||||
<script type="application/ld+json">
|
||||
{
|
||||
"@context": "https://schema.org",
|
||||
"@type": "Service",
|
||||
"serviceType": "Auto Care Services",
|
||||
"provider": {
|
||||
"@type": "LocalBusiness",
|
||||
"name": "LoperBoys",
|
||||
"url": "https://loperboys.com",
|
||||
"telephone": "+1-220-200-4022",
|
||||
"areaServed": {
|
||||
"@type": "Place",
|
||||
"name": "Warsaw, Coshocton, and surrounding areas, Ohio"
|
||||
}
|
||||
},
|
||||
"hasOfferCatalog": {
|
||||
"@type": "OfferCatalog",
|
||||
"name": "Auto Care Services",
|
||||
"itemListElement": [
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Basic Car Wash"}},
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Interior Detail"}},
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Full Detail"}},
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Mobile Car Wash"}},
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Trash Run"}},
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Gas Fill"}},
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Jump Start"}},
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Wiper Blade Replacement"}}
|
||||
]
|
||||
},
|
||||
"priceRange": "$"
|
||||
}
|
||||
</script>
|
||||
|
||||
<link rel="stylesheet" href="css/style.css?v=2">
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;700;900&family=Open+Sans:wght@400;600&display=swap" rel="stylesheet">
|
||||
|
||||
<style>
|
||||
.cat-hero {
|
||||
position: relative;
|
||||
min-height: 60vh;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
background: linear-gradient(135deg, #1e56a0 0%, #3a8fd4 40%, #4dc8f5 70%, #1e56a0 100%);
|
||||
overflow: hidden;
|
||||
padding: 120px 24px 80px;
|
||||
}
|
||||
.cat-hero::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background:
|
||||
radial-gradient(circle at 20% 80%, rgba(255, 255, 255, 0.12) 0%, transparent 50%),
|
||||
radial-gradient(circle at 80% 20%, rgba(255, 255, 255, 0.1) 0%, transparent 50%);
|
||||
animation: heroFloat 8s ease-in-out infinite;
|
||||
}
|
||||
.cat-hero .hero-title { font-size: clamp(2rem, 5vw, 3.2rem); }
|
||||
.cat-hero .hero-slogan { color: #d0eaff; }
|
||||
|
||||
.breadcrumbs {
|
||||
background: var(--off-white);
|
||||
padding: 16px 0;
|
||||
border-bottom: 1px solid var(--gray-light);
|
||||
}
|
||||
.breadcrumbs .container { font-size: 0.9rem; color: var(--text-mid); }
|
||||
.breadcrumbs a { color: var(--blue-mid); font-weight: 600; transition: color var(--transition); }
|
||||
.breadcrumbs a:hover { color: var(--blue-accent); }
|
||||
|
||||
.cat-services { padding: 80px 0; background: var(--off-white); }
|
||||
.cat-services .service-card::before {
|
||||
background: linear-gradient(90deg, var(--blue-mid), var(--blue-light));
|
||||
}
|
||||
|
||||
.pricing-note {
|
||||
background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
|
||||
padding: 48px 24px;
|
||||
text-align: center;
|
||||
color: var(--white);
|
||||
}
|
||||
.pricing-note p {
|
||||
font-size: 1.15rem;
|
||||
max-width: 700px;
|
||||
margin: 0 auto 20px;
|
||||
line-height: 1.7;
|
||||
}
|
||||
.pricing-note .accent { color: var(--cyan-bright); }
|
||||
|
||||
.footer-categories {
|
||||
text-align: center;
|
||||
padding: 20px 0;
|
||||
border-bottom: 1px solid rgba(255,255,255,0.1);
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
.footer-categories span { color: rgba(255,255,255,0.4); font-size: 0.85rem; margin-right: 8px; }
|
||||
.footer-categories a {
|
||||
color: rgba(255,255,255,0.7);
|
||||
font-size: 0.85rem;
|
||||
font-weight: 600;
|
||||
margin: 0 8px;
|
||||
transition: color var(--transition);
|
||||
}
|
||||
.footer-categories a:hover { color: var(--cyan-bright); }
|
||||
.footer-categories a.active-link { color: var(--cyan-bright); pointer-events: none; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<!-- Navigation -->
|
||||
<nav class="navbar" id="navbar">
|
||||
<div class="nav-container">
|
||||
<a href="index.html" class="logo">
|
||||
<img src="img/logo-icon.svg" alt="LoperBoys" class="logo-icon-svg">
|
||||
<span class="logo-text">Loper<span class="accent">Boys</span></span>
|
||||
</a>
|
||||
<button class="nav-toggle" id="navToggle" aria-label="Toggle menu">
|
||||
<span></span><span></span><span></span>
|
||||
</button>
|
||||
<ul class="nav-links" id="navLinks">
|
||||
<li><a href="index.html">Home</a></li>
|
||||
<li class="nav-dropdown" id="navDropdown">
|
||||
<a href="#" class="nav-dropdown-toggle" aria-haspopup="true">Services ▾</a>
|
||||
<ul class="nav-dropdown-menu" role="menu">
|
||||
<li><a href="lawn-care.html" role="menuitem">🌿 Lawn & Garden</a></li>
|
||||
<li><a href="home-services.html" role="menuitem">🏠 Home Services</a></li>
|
||||
<li><a href="auto-care.html" role="menuitem">🚗 Auto Care</a></li>
|
||||
<li><a href="moving.html" role="menuitem">📦 Moving & Hauling</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#contact" class="nav-cta">Get a Free Quote</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- Hero Section -->
|
||||
<section class="cat-hero" id="home">
|
||||
<div class="hero-overlay"></div>
|
||||
<div class="hero-content">
|
||||
<div class="hero-badge">🚗 Auto Care</div>
|
||||
<h1 class="hero-title">Auto Care <span class="accent">Services</span></h1>
|
||||
<p class="hero-sub">From a quick wash to a full detail, we'll make your car look great. Mobile service available — we come to you.</p>
|
||||
<div class="hero-ctas">
|
||||
<a href="tel:2202004022" class="btn btn-primary">
|
||||
<svg class="btn-icon" viewBox="0 0 24 24" fill="currentColor" width="20" height="20"><path d="M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z"/></svg>
|
||||
220-200-4022
|
||||
</a>
|
||||
<a href="#contact" class="btn btn-secondary">Get a Free Quote</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Breadcrumbs -->
|
||||
<div class="breadcrumbs">
|
||||
<div class="container">
|
||||
<a href="index.html">← Back to all services</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Services Grid -->
|
||||
<section class="cat-services" id="services">
|
||||
<div class="container">
|
||||
<h2 class="section-title">Auto Care <span class="accent">Services</span></h2>
|
||||
<p class="section-subtitle">We bring the car wash to you — mobile service for your convenience.</p>
|
||||
<div class="services-grid">
|
||||
<div class="service-card featured">
|
||||
<div class="featured-badge">Most Popular</div>
|
||||
<div class="service-icon">🚿</div>
|
||||
<h3>Basic Car Wash</h3>
|
||||
<p>Exterior hand wash, tire clean, and window wipe. Fast, thorough, and affordable.</p>
|
||||
</div>
|
||||
<div class="service-card">
|
||||
<div class="service-icon">🧽</div>
|
||||
<h3>Interior Detail</h3>
|
||||
<p>Vacuum, dash wipe, window clean, and air freshen. Makes your car feel brand new inside.</p>
|
||||
</div>
|
||||
<div class="service-card">
|
||||
<div class="service-icon">✨</div>
|
||||
<h3>Full Detail</h3>
|
||||
<p>Exterior + interior + tire shine. Your car will look showroom ready.</p>
|
||||
</div>
|
||||
<div class="service-card">
|
||||
<div class="service-icon">🏠</div>
|
||||
<h3>Mobile Car Wash</h3>
|
||||
<p>We come to your house or office. No driving to the car wash — we do the driving for you.</p>
|
||||
</div>
|
||||
<div class="service-card">
|
||||
<div class="service-icon">🚘</div>
|
||||
<h3>Trash Run</h3>
|
||||
<p>We take your car to the car wash when you can't. You save time, we handle the rest.</p>
|
||||
</div>
|
||||
<div class="service-card">
|
||||
<div class="service-icon">⛽</div>
|
||||
<h3>Gas Fill</h3>
|
||||
<p>Fill your tank while you're at work or school. Just let us know how much you need.</p>
|
||||
</div>
|
||||
<div class="service-card">
|
||||
<div class="service-icon">🔋</div>
|
||||
<h3>Jump Start</h3>
|
||||
<p>Dead battery? We'll come out and get you going again. Fast, no-fuss roadside help.</p>
|
||||
</div>
|
||||
<div class="service-card">
|
||||
<div class="service-icon">🌧️</div>
|
||||
<h3>Wiper Blade Replacement</h3>
|
||||
<p>Quick wiper blade swap. You buy the blades, we install them. Done in minutes.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Pricing Note -->
|
||||
<section class="pricing-note">
|
||||
<div class="container">
|
||||
<p>Prices vary by job. <strong>Call 220-200-4022</strong> or use the form below for a <span class="accent">free, no-obligation quote</span>.</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Contact Section -->
|
||||
<section class="contact" id="contact">
|
||||
<div class="container">
|
||||
<h2 class="section-title">Get a <span class="accent">Free Quote</span></h2>
|
||||
<p class="section-subtitle">Tell us what you need — we'll get back to you fast.</p>
|
||||
<div class="contact-grid">
|
||||
<div class="contact-info">
|
||||
<h3>Contact Information</h3>
|
||||
<div class="contact-card">
|
||||
<div class="contact-item">
|
||||
<div class="contact-icon">📞</div>
|
||||
<div>
|
||||
<strong>Phone</strong>
|
||||
<a href="tel:2202004022">220-200-4022</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="contact-item">
|
||||
<div class="contact-icon">📧</div>
|
||||
<div>
|
||||
<strong>Email</strong>
|
||||
<a href="mailto:contact@loperboys.com">contact@loperboys.com</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="contact-item">
|
||||
<div class="contact-icon">📍</div>
|
||||
<div>
|
||||
<strong>Service Area</strong>
|
||||
<p>Warsaw, Coshocton, and surrounding areas</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="contact-item payment-methods">
|
||||
<div class="contact-icon">💳</div>
|
||||
<div>
|
||||
<strong>We Accept</strong>
|
||||
<div class="payment-badges">
|
||||
<span class="payment-badge">💵 Cash</span>
|
||||
<span class="payment-badge">📱 Venmo</span>
|
||||
<span class="payment-badge">📲 Cash App</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="contact-cta">
|
||||
<a href="tel:2202004022" class="btn btn-primary btn-large">📞 Call Now — It's Free to Quote!</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="contact-form-wrapper">
|
||||
<form class="contact-form" id="contactForm" action="send-contact.php" method="POST">
|
||||
<input type="hidden" name="service_category" value="auto-care">
|
||||
<p class="form-note" style="text-align:left; font-style:italic;">We value your privacy. Your information is only used to respond to your quote request and will never be shared with third parties.</p>
|
||||
<div class="form-group">
|
||||
<label for="name">Your Name *</label>
|
||||
<input type="text" id="name" name="name" required placeholder="John Smith">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="phone">Phone Number *</label>
|
||||
<input type="tel" id="phone" name="phone" required placeholder="(740) 000-0000">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="email">Email Address</label>
|
||||
<input type="email" id="email" name="email" placeholder="john@example.com">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="service">Service Needed *</label>
|
||||
<select id="service" name="service" required>
|
||||
<option value="">Select a service...</option>
|
||||
<option value="basic-car-wash">Basic Car Wash</option>
|
||||
<option value="interior-detail">Interior Detail</option>
|
||||
<option value="full-detail">Full Detail</option>
|
||||
<option value="mobile-car-wash">Mobile Car Wash</option>
|
||||
<option value="trash-run">Trash Run</option>
|
||||
<option value="gas-fill">Gas Fill</option>
|
||||
<option value="jump-start">Jump Start</option>
|
||||
<option value="wiper-blade-replacement">Wiper Blade Replacement</option>
|
||||
<option value="other">Other</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group form-honeypot" aria-hidden="true" style="display:none;">
|
||||
<label for="website_url">Leave this blank</label>
|
||||
<input type="text" id="website_url" name="website_url" tabindex="-1" autocomplete="off">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="message">Tell Us About Your Project</label>
|
||||
<textarea id="message" name="message" rows="4" placeholder="Vehicle type, service level, preferred time..."></textarea>
|
||||
</div>
|
||||
<button type="submit" class="btn btn-primary btn-block">
|
||||
Send Message →
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="footer">
|
||||
<div class="container">
|
||||
<div class="footer-categories">
|
||||
<span>Other Services:</span>
|
||||
<a href="lawn-care.html">🌿 Lawn & Garden</a>
|
||||
<a href="home-services.html">🏠 Home Services</a>
|
||||
<a class="active-link" href="auto-care.html">🚗 Auto Care</a>
|
||||
<a href="moving.html">📦 Moving & Hauling</a>
|
||||
</div>
|
||||
<div class="footer-content">
|
||||
<div class="footer-brand">
|
||||
<h3>LoperBoys</h3>
|
||||
<p class="slogan">Hard Work. Honest Prices. Local Service.</p>
|
||||
</div>
|
||||
<div class="footer-contact">
|
||||
<a href="tel:2202004022" class="footer-phone">📞 220-200-4022</a>
|
||||
<a href="mailto:contact@loperboys.com" class="footer-email">📧 contact@loperboys.com</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-bottom">
|
||||
<p>© <span id="year"></span> LoperBoys. All rights reserved.</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Floating CTA -->
|
||||
<a href="tel:2202004022" class="floating-cta" id="floatingCta" aria-label="Call LoperBoys">
|
||||
<svg viewBox="0 0 24 24" fill="currentColor" width="24" height="24"><path d="M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z"/></svg>
|
||||
</a>
|
||||
|
||||
<script src="js/main.js"></script>
|
||||
<script>
|
||||
(function() {
|
||||
var dropdown = document.getElementById('navDropdown');
|
||||
if (!dropdown) return;
|
||||
var toggle = dropdown.querySelector('.nav-dropdown-toggle');
|
||||
var menu = dropdown.querySelector('.nav-dropdown-menu');
|
||||
if (!toggle || !menu) return;
|
||||
toggle.addEventListener('click', function(e) { e.preventDefault(); menu.style.display = menu.style.display === 'block' ? 'none' : 'block'; });
|
||||
document.addEventListener('click', function(e) { if (!dropdown.contains(e.target)) { menu.style.display = 'none'; } });
|
||||
if (window.matchMedia('(min-width: 769px)').matches) {
|
||||
dropdown.addEventListener('mouseenter', function() { menu.style.display = 'block'; });
|
||||
dropdown.addEventListener('mouseleave', function() { menu.style.display = 'none'; });
|
||||
}
|
||||
menu.querySelectorAll('a').forEach(function(link) {
|
||||
link.addEventListener('click', function() {
|
||||
menu.style.display = 'none';
|
||||
var navLinks = document.getElementById('navLinks');
|
||||
var navToggle = document.getElementById('navToggle');
|
||||
if (navLinks) navLinks.classList.remove('active');
|
||||
if (navToggle) navToggle.classList.remove('active');
|
||||
});
|
||||
});
|
||||
})();
|
||||
(function() {
|
||||
var style = document.createElement('style');
|
||||
style.textContent =
|
||||
'.nav-dropdown { position: relative; }' +
|
||||
'.nav-dropdown-menu { display: none; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); background: rgba(10, 36, 99, 0.98); backdrop-filter: blur(12px); border-radius: 12px; padding: 12px 0; min-width: 220px; box-shadow: 0 8px 32px rgba(0,0,0,0.3); z-index: 1001; }' +
|
||||
'.nav-dropdown-menu li a { display: block; padding: 10px 20px; color: rgba(255,255,255,0.85); font-size: 0.95rem; font-weight: 600; font-family: Montserrat, sans-serif; transition: background 0.2s, color 0.2s; white-space: nowrap; }' +
|
||||
'.nav-dropdown-menu li a:hover { background: rgba(255,255,255,0.1); color: #00e0ff; }' +
|
||||
'@media (max-width: 768px) { .nav-dropdown-menu { position: static; transform: none; background: transparent; box-shadow: none; padding: 4px 0 0 16px; } .nav-dropdown-menu li a { font-size: 1.1rem; padding: 8px 12px; } }';
|
||||
document.head.appendChild(style);
|
||||
})();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
@@ -0,0 +1,418 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Home Services | LoperBoys — Gutter Cleaning, Window Washing, Snow Removal</title>
|
||||
<meta name="description" content="Gutter cleanout, window washing, snow shoveling, pressure washing, and seasonal home maintenance in Warsaw, Coshocton, OH. Call 220-200-4022.">
|
||||
<meta name="keywords" content="gutter cleaning, window washing, snow shoveling, pressure washing, house washing, porch sweeping, trash can cleaning, wood stacking, seasonal cleanup, Warsaw OH, Coshocton, LoperBoys">
|
||||
<meta name="author" content="LoperBoys">
|
||||
<meta name="robots" content="index, follow">
|
||||
<link rel="canonical" href="https://loperboys.com/home-services.html">
|
||||
|
||||
<!-- Open Graph / Facebook -->
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:url" content="https://loperboys.com/home-services.html">
|
||||
<meta property="og:title" content="Home Services | LoperBoys — Gutter Cleaning, Window Washing, Snow Removal">
|
||||
<meta property="og:description" content="Gutter cleanout, window washing, snow shoveling, pressure washing, and seasonal home maintenance in Warsaw, Coshocton, OH.">
|
||||
<meta property="og:image" content="https://loperboys.com/img/og-banner.png">
|
||||
<meta property="og:locale" content="en_US">
|
||||
<meta property="og:site_name" content="LoperBoys">
|
||||
|
||||
<!-- Twitter Card -->
|
||||
<meta name="twitter:card" content="summary_large_image">
|
||||
<meta name="twitter:url" content="https://loperboys.com/home-services.html">
|
||||
<meta name="twitter:title" content="Home Services | LoperBoys — Gutter Cleaning, Window Washing, Snow Removal">
|
||||
<meta name="twitter:description" content="Gutter cleanout, window washing, snow shoveling, pressure washing, and seasonal home maintenance in Warsaw, Coshocton, OH.">
|
||||
<meta name="twitter:image" content="https://loperboys.com/img/og-banner.png">
|
||||
|
||||
<!-- Favicon -->
|
||||
<link rel="icon" type="image/svg+xml" href="img/favicon.svg">
|
||||
<link rel="apple-touch-icon" href="img/favicon.svg">
|
||||
|
||||
<!-- Structured Data (Service) -->
|
||||
<script type="application/ld+json">
|
||||
{
|
||||
"@context": "https://schema.org",
|
||||
"@type": "Service",
|
||||
"serviceType": "Home Services",
|
||||
"provider": {
|
||||
"@type": "LocalBusiness",
|
||||
"name": "LoperBoys",
|
||||
"url": "https://loperboys.com",
|
||||
"telephone": "+1-220-200-4022",
|
||||
"areaServed": {
|
||||
"@type": "Place",
|
||||
"name": "Warsaw, Coshocton, and surrounding areas, Ohio"
|
||||
}
|
||||
},
|
||||
"hasOfferCatalog": {
|
||||
"@type": "OfferCatalog",
|
||||
"name": "Home Services",
|
||||
"itemListElement": [
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Gutter Cleanout"}},
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Window Cleaning"}},
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Snow Shoveling"}},
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Wood Stacking"}},
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Porch Sweeping"}},
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Trash Can Cleaning"}},
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Pressure Washing"}},
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "House Washing"}},
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Seasonal Cleanup"}}
|
||||
]
|
||||
},
|
||||
"priceRange": "$"
|
||||
}
|
||||
</script>
|
||||
|
||||
<link rel="stylesheet" href="css/style.css?v=2">
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;700;900&family=Open+Sans:wght@400;600&display=swap" rel="stylesheet">
|
||||
|
||||
<style>
|
||||
.cat-hero {
|
||||
position: relative;
|
||||
min-height: 60vh;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
background: linear-gradient(135deg, #1e56a0 0%, #4dc8f5 40%, #00e0ff 70%, #1e56a0 100%);
|
||||
overflow: hidden;
|
||||
padding: 120px 24px 80px;
|
||||
}
|
||||
.cat-hero::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background:
|
||||
radial-gradient(circle at 20% 80%, rgba(255, 255, 255, 0.12) 0%, transparent 50%),
|
||||
radial-gradient(circle at 80% 20%, rgba(255, 255, 255, 0.1) 0%, transparent 50%);
|
||||
animation: heroFloat 8s ease-in-out infinite;
|
||||
}
|
||||
.cat-hero .hero-title { font-size: clamp(2rem, 5vw, 3.2rem); }
|
||||
.cat-hero .hero-slogan { color: #e0f4ff; }
|
||||
|
||||
.breadcrumbs {
|
||||
background: var(--off-white);
|
||||
padding: 16px 0;
|
||||
border-bottom: 1px solid var(--gray-light);
|
||||
}
|
||||
.breadcrumbs .container { font-size: 0.9rem; color: var(--text-mid); }
|
||||
.breadcrumbs a { color: var(--blue-mid); font-weight: 600; transition: color var(--transition); }
|
||||
.breadcrumbs a:hover { color: var(--blue-accent); }
|
||||
|
||||
.cat-services { padding: 80px 0; background: var(--off-white); }
|
||||
.cat-services .service-card::before {
|
||||
background: linear-gradient(90deg, var(--blue-accent), var(--cyan-bright));
|
||||
}
|
||||
|
||||
.pricing-note {
|
||||
background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
|
||||
padding: 48px 24px;
|
||||
text-align: center;
|
||||
color: var(--white);
|
||||
}
|
||||
.pricing-note p {
|
||||
font-size: 1.15rem;
|
||||
max-width: 700px;
|
||||
margin: 0 auto 20px;
|
||||
line-height: 1.7;
|
||||
}
|
||||
.pricing-note .accent { color: var(--cyan-bright); }
|
||||
|
||||
.footer-categories {
|
||||
text-align: center;
|
||||
padding: 20px 0;
|
||||
border-bottom: 1px solid rgba(255,255,255,0.1);
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
.footer-categories span { color: rgba(255,255,255,0.4); font-size: 0.85rem; margin-right: 8px; }
|
||||
.footer-categories a {
|
||||
color: rgba(255,255,255,0.7);
|
||||
font-size: 0.85rem;
|
||||
font-weight: 600;
|
||||
margin: 0 8px;
|
||||
transition: color var(--transition);
|
||||
}
|
||||
.footer-categories a:hover { color: var(--cyan-bright); }
|
||||
.footer-categories a.active-link { color: var(--cyan-bright); pointer-events: none; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<!-- Navigation -->
|
||||
<nav class="navbar" id="navbar">
|
||||
<div class="nav-container">
|
||||
<a href="index.html" class="logo">
|
||||
<img src="img/logo-icon.svg" alt="LoperBoys" class="logo-icon-svg">
|
||||
<span class="logo-text">Loper<span class="accent">Boys</span></span>
|
||||
</a>
|
||||
<button class="nav-toggle" id="navToggle" aria-label="Toggle menu">
|
||||
<span></span><span></span><span></span>
|
||||
</button>
|
||||
<ul class="nav-links" id="navLinks">
|
||||
<li><a href="index.html">Home</a></li>
|
||||
<li class="nav-dropdown" id="navDropdown">
|
||||
<a href="#" class="nav-dropdown-toggle" aria-haspopup="true">Services ▾</a>
|
||||
<ul class="nav-dropdown-menu" role="menu">
|
||||
<li><a href="lawn-care.html" role="menuitem">🌿 Lawn & Garden</a></li>
|
||||
<li><a href="home-services.html" role="menuitem">🏠 Home Services</a></li>
|
||||
<li><a href="auto-care.html" role="menuitem">🚗 Auto Care</a></li>
|
||||
<li><a href="moving.html" role="menuitem">📦 Moving & Hauling</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#contact" class="nav-cta">Get a Free Quote</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- Hero Section -->
|
||||
<section class="cat-hero" id="home">
|
||||
<div class="hero-overlay"></div>
|
||||
<div class="hero-content">
|
||||
<div class="hero-badge">🏠 Home Services</div>
|
||||
<h1 class="hero-title">Home <span class="accent">Services</span></h1>
|
||||
<p class="hero-sub">Gutters, windows, snow, and everything in between. We take care of the stuff that keeps your home looking its best.</p>
|
||||
<div class="hero-ctas">
|
||||
<a href="tel:2202004022" class="btn btn-primary">
|
||||
<svg class="btn-icon" viewBox="0 0 24 24" fill="currentColor" width="20" height="20"><path d="M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z"/></svg>
|
||||
220-200-4022
|
||||
</a>
|
||||
<a href="#contact" class="btn btn-secondary">Get a Free Quote</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Breadcrumbs -->
|
||||
<div class="breadcrumbs">
|
||||
<div class="container">
|
||||
<a href="index.html">← Back to all services</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Services Grid -->
|
||||
<section class="cat-services" id="services">
|
||||
<div class="container">
|
||||
<h2 class="section-title">Home <span class="accent">Services</span></h2>
|
||||
<p class="section-subtitle">From seasonal tasks to one-time cleanups, we keep your home in top shape.</p>
|
||||
<div class="services-grid">
|
||||
<div class="service-card featured">
|
||||
<div class="featured-badge">Most Popular</div>
|
||||
<div class="service-icon">🪜</div>
|
||||
<h3>Gutter Cleanout</h3>
|
||||
<p>Remove leaves and debris, flush downspouts, and ensure proper drainage to protect your home.</p>
|
||||
</div>
|
||||
<div class="service-card">
|
||||
<div class="service-icon">🪟</div>
|
||||
<h3>Window Cleaning</h3>
|
||||
<p>Interior or exterior — streak-free windows that let the light in.</p>
|
||||
</div>
|
||||
<div class="service-card">
|
||||
<div class="service-icon">❄️</div>
|
||||
<h3>Snow Shoveling</h3>
|
||||
<p>Driveways, walkways, and steps cleared before school and work. Stay safe all winter.</p>
|
||||
</div>
|
||||
<div class="service-card">
|
||||
<div class="service-icon">🪵</div>
|
||||
<h3>Wood Stacking</h3>
|
||||
<p>Firewood delivery and stacking. We'll organize your wood so it's ready to burn.</p>
|
||||
</div>
|
||||
<div class="service-card">
|
||||
<div class="service-icon">🧹</div>
|
||||
<h3>Porch Sweeping</h3>
|
||||
<p>Clean your porch, patio, and entryways. First impressions matter.</p>
|
||||
</div>
|
||||
<div class="service-card">
|
||||
<div class="service-icon">🗑️</div>
|
||||
<h3>Trash Can Cleaning</h3>
|
||||
<p>Hose down and sanitize your bins. Weekly or bi-weekly option available.</p>
|
||||
</div>
|
||||
<div class="service-card">
|
||||
<div class="service-icon">💦</div>
|
||||
<h3>Pressure Washing</h3>
|
||||
<p>Driveways, walkways, and front porches — blast away dirt and grime. Available on request.</p>
|
||||
</div>
|
||||
<div class="service-card">
|
||||
<div class="service-icon">🏡</div>
|
||||
<h3>House Washing</h3>
|
||||
<p>Soft wash for vinyl siding. Gentle on your home, tough on dirt and mildew.</p>
|
||||
</div>
|
||||
<div class="service-card">
|
||||
<div class="service-icon">🍁</div>
|
||||
<h3>Seasonal Cleanup</h3>
|
||||
<p>Comprehensive fall or spring yard service — leaves, debris, trim, and tidy-up.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Pricing Note -->
|
||||
<section class="pricing-note">
|
||||
<div class="container">
|
||||
<p>Prices vary by job. <strong>Call 220-200-4022</strong> or use the form below for a <span class="accent">free, no-obligation quote</span>.</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Contact Section -->
|
||||
<section class="contact" id="contact">
|
||||
<div class="container">
|
||||
<h2 class="section-title">Get a <span class="accent">Free Quote</span></h2>
|
||||
<p class="section-subtitle">Tell us what you need — we'll get back to you fast.</p>
|
||||
<div class="contact-grid">
|
||||
<div class="contact-info">
|
||||
<h3>Contact Information</h3>
|
||||
<div class="contact-card">
|
||||
<div class="contact-item">
|
||||
<div class="contact-icon">📞</div>
|
||||
<div>
|
||||
<strong>Phone</strong>
|
||||
<a href="tel:2202004022">220-200-4022</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="contact-item">
|
||||
<div class="contact-icon">📧</div>
|
||||
<div>
|
||||
<strong>Email</strong>
|
||||
<a href="mailto:contact@loperboys.com">contact@loperboys.com</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="contact-item">
|
||||
<div class="contact-icon">📍</div>
|
||||
<div>
|
||||
<strong>Service Area</strong>
|
||||
<p>Warsaw, Coshocton, and surrounding areas</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="contact-item payment-methods">
|
||||
<div class="contact-icon">💳</div>
|
||||
<div>
|
||||
<strong>We Accept</strong>
|
||||
<div class="payment-badges">
|
||||
<span class="payment-badge">💵 Cash</span>
|
||||
<span class="payment-badge">📱 Venmo</span>
|
||||
<span class="payment-badge">📲 Cash App</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="contact-cta">
|
||||
<a href="tel:2202004022" class="btn btn-primary btn-large">📞 Call Now — It's Free to Quote!</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="contact-form-wrapper">
|
||||
<form class="contact-form" id="contactForm" action="send-contact.php" method="POST">
|
||||
<input type="hidden" name="service_category" value="home-services">
|
||||
<p class="form-note" style="text-align:left; font-style:italic;">We value your privacy. Your information is only used to respond to your quote request and will never be shared with third parties.</p>
|
||||
<div class="form-group">
|
||||
<label for="name">Your Name *</label>
|
||||
<input type="text" id="name" name="name" required placeholder="John Smith">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="phone">Phone Number *</label>
|
||||
<input type="tel" id="phone" name="phone" required placeholder="(740) 000-0000">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="email">Email Address</label>
|
||||
<input type="email" id="email" name="email" placeholder="john@example.com">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="service">Service Needed *</label>
|
||||
<select id="service" name="service" required>
|
||||
<option value="">Select a service...</option>
|
||||
<option value="gutter-cleanout">Gutter Cleanout</option>
|
||||
<option value="window-cleaning">Window Cleaning</option>
|
||||
<option value="snow-shoveling">Snow Shoveling</option>
|
||||
<option value="wood-stacking">Wood Stacking</option>
|
||||
<option value="porch-sweeping">Porch Sweeping</option>
|
||||
<option value="trash-can-cleaning">Trash Can Cleaning</option>
|
||||
<option value="pressure-washing">Pressure Washing</option>
|
||||
<option value="house-washing">House Washing</option>
|
||||
<option value="seasonal-cleanup">Seasonal Cleanup</option>
|
||||
<option value="other">Other</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group form-honeypot" aria-hidden="true" style="display:none;">
|
||||
<label for="website_url">Leave this blank</label>
|
||||
<input type="text" id="website_url" name="website_url" tabindex="-1" autocomplete="off">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="message">Tell Us About Your Project</label>
|
||||
<textarea id="message" name="message" rows="4" placeholder="House size, service frequency, any special requests..."></textarea>
|
||||
</div>
|
||||
<button type="submit" class="btn btn-primary btn-block">
|
||||
Send Message →
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="footer">
|
||||
<div class="container">
|
||||
<div class="footer-categories">
|
||||
<span>Other Services:</span>
|
||||
<a href="lawn-care.html">🌿 Lawn & Garden</a>
|
||||
<a class="active-link" href="home-services.html">🏠 Home Services</a>
|
||||
<a href="auto-care.html">🚗 Auto Care</a>
|
||||
<a href="moving.html">📦 Moving & Hauling</a>
|
||||
</div>
|
||||
<div class="footer-content">
|
||||
<div class="footer-brand">
|
||||
<h3>LoperBoys</h3>
|
||||
<p class="slogan">Hard Work. Honest Prices. Local Service.</p>
|
||||
</div>
|
||||
<div class="footer-contact">
|
||||
<a href="tel:2202004022" class="footer-phone">📞 220-200-4022</a>
|
||||
<a href="mailto:contact@loperboys.com" class="footer-email">📧 contact@loperboys.com</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-bottom">
|
||||
<p>© <span id="year"></span> LoperBoys. All rights reserved.</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Floating CTA -->
|
||||
<a href="tel:2202004022" class="floating-cta" id="floatingCta" aria-label="Call LoperBoys">
|
||||
<svg viewBox="0 0 24 24" fill="currentColor" width="24" height="24"><path d="M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z"/></svg>
|
||||
</a>
|
||||
|
||||
<script src="js/main.js"></script>
|
||||
<script>
|
||||
(function() {
|
||||
var dropdown = document.getElementById('navDropdown');
|
||||
if (!dropdown) return;
|
||||
var toggle = dropdown.querySelector('.nav-dropdown-toggle');
|
||||
var menu = dropdown.querySelector('.nav-dropdown-menu');
|
||||
if (!toggle || !menu) return;
|
||||
toggle.addEventListener('click', function(e) { e.preventDefault(); menu.style.display = menu.style.display === 'block' ? 'none' : 'block'; });
|
||||
document.addEventListener('click', function(e) { if (!dropdown.contains(e.target)) { menu.style.display = 'none'; } });
|
||||
if (window.matchMedia('(min-width: 769px)').matches) {
|
||||
dropdown.addEventListener('mouseenter', function() { menu.style.display = 'block'; });
|
||||
dropdown.addEventListener('mouseleave', function() { menu.style.display = 'none'; });
|
||||
}
|
||||
menu.querySelectorAll('a').forEach(function(link) {
|
||||
link.addEventListener('click', function() {
|
||||
menu.style.display = 'none';
|
||||
var navLinks = document.getElementById('navLinks');
|
||||
var navToggle = document.getElementById('navToggle');
|
||||
if (navLinks) navLinks.classList.remove('active');
|
||||
if (navToggle) navToggle.classList.remove('active');
|
||||
});
|
||||
});
|
||||
})();
|
||||
(function() {
|
||||
var style = document.createElement('style');
|
||||
style.textContent =
|
||||
'.nav-dropdown { position: relative; }' +
|
||||
'.nav-dropdown-menu { display: none; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); background: rgba(10, 36, 99, 0.98); backdrop-filter: blur(12px); border-radius: 12px; padding: 12px 0; min-width: 220px; box-shadow: 0 8px 32px rgba(0,0,0,0.3); z-index: 1001; }' +
|
||||
'.nav-dropdown-menu li a { display: block; padding: 10px 20px; color: rgba(255,255,255,0.85); font-size: 0.95rem; font-weight: 600; font-family: Montserrat, sans-serif; transition: background 0.2s, color 0.2s; white-space: nowrap; }' +
|
||||
'.nav-dropdown-menu li a:hover { background: rgba(255,255,255,0.1); color: #00e0ff; }' +
|
||||
'@media (max-width: 768px) { .nav-dropdown-menu { position: static; transform: none; background: transparent; box-shadow: none; padding: 4px 0 0 16px; } .nav-dropdown-menu li a { font-size: 1.1rem; padding: 8px 12px; } }';
|
||||
document.head.appendChild(style);
|
||||
})();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
+493
@@ -0,0 +1,493 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Lawn & Garden Services | LoperBoys — Warsaw, Coshocton, OH</title>
|
||||
<meta name="description" content="Professional lawn mowing, leaf raking, edging, mulching, and garden care in Warsaw, Coshocton, and surrounding areas. Honest prices, reliable service. Call 220-200-4022.">
|
||||
<meta name="keywords" content="lawn mowing, leaf raking, lawn pickup, edging, trimming, mulching, weed control, garden bed cleanup, lawn care, Warsaw OH, Coshocton, LoperBoys">
|
||||
<meta name="author" content="LoperBoys">
|
||||
<meta name="robots" content="index, follow">
|
||||
<link rel="canonical" href="https://loperboys.com/lawn-care.html">
|
||||
|
||||
<!-- Open Graph / Facebook -->
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:url" content="https://loperboys.com/lawn-care.html">
|
||||
<meta property="og:title" content="Lawn & Garden Services | LoperBoys — Warsaw, Coshocton, OH">
|
||||
<meta property="og:description" content="Professional lawn mowing, leaf raking, edging, mulching, and garden care in Warsaw, Coshocton, and surrounding areas.">
|
||||
<meta property="og:image" content="https://loperboys.com/img/og-banner.png">
|
||||
<meta property="og:locale" content="en_US">
|
||||
<meta property="og:site_name" content="LoperBoys">
|
||||
|
||||
<!-- Twitter Card -->
|
||||
<meta name="twitter:card" content="summary_large_image">
|
||||
<meta name="twitter:url" content="https://loperboys.com/lawn-care.html">
|
||||
<meta name="twitter:title" content="Lawn & Garden Services | LoperBoys — Warsaw, Coshocton, OH">
|
||||
<meta name="twitter:description" content="Professional lawn mowing, leaf raking, edging, mulching, and garden care in Warsaw, Coshocton, and surrounding areas.">
|
||||
<meta name="twitter:image" content="https://loperboys.com/img/og-banner.png">
|
||||
|
||||
<!-- Favicon -->
|
||||
<link rel="icon" type="image/svg+xml" href="img/favicon.svg">
|
||||
<link rel="apple-touch-icon" href="img/favicon.svg">
|
||||
|
||||
<!-- Structured Data (Service) -->
|
||||
<script type="application/ld+json">
|
||||
{
|
||||
"@context": "https://schema.org",
|
||||
"@type": "Service",
|
||||
"serviceType": "Lawn & Garden Services",
|
||||
"provider": {
|
||||
"@type": "LocalBusiness",
|
||||
"name": "LoperBoys",
|
||||
"url": "https://loperboys.com",
|
||||
"telephone": "+1-220-200-4022",
|
||||
"areaServed": {
|
||||
"@type": "Place",
|
||||
"name": "Warsaw, Coshocton, and surrounding areas, Ohio"
|
||||
}
|
||||
},
|
||||
"hasOfferCatalog": {
|
||||
"@type": "OfferCatalog",
|
||||
"name": "Lawn & Garden Services",
|
||||
"itemListElement": [
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Lawn Mowing"}},
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Leaf Raking"}},
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Lawn Pick-up"}},
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Edging & Trimming"}},
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Mulching"}},
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Weed Control"}},
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Garden Bed Cleanup"}}
|
||||
]
|
||||
},
|
||||
"priceRange": "$"
|
||||
}
|
||||
</script>
|
||||
|
||||
<link rel="stylesheet" href="css/style.css?v=2">
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;700;900&family=Open+Sans:wght@400;600&display=swap" rel="stylesheet">
|
||||
|
||||
<style>
|
||||
/* Category-specific hero for Lawn & Garden */
|
||||
.cat-hero {
|
||||
position: relative;
|
||||
min-height: 60vh;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
background: linear-gradient(135deg, #16a34a 0%, #22c55e 40%, #15803d 70%, #16a34a 100%);
|
||||
overflow: hidden;
|
||||
padding: 120px 24px 80px;
|
||||
}
|
||||
.cat-hero::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background:
|
||||
radial-gradient(circle at 20% 80%, rgba(255, 255, 255, 0.12) 0%, transparent 50%),
|
||||
radial-gradient(circle at 80% 20%, rgba(255, 255, 255, 0.1) 0%, transparent 50%);
|
||||
animation: heroFloat 8s ease-in-out infinite;
|
||||
}
|
||||
.cat-hero .hero-title {
|
||||
font-size: clamp(2rem, 5vw, 3.2rem);
|
||||
}
|
||||
.cat-hero .hero-slogan {
|
||||
color: #bbf7d0;
|
||||
}
|
||||
|
||||
/* Breadcrumbs */
|
||||
.breadcrumbs {
|
||||
background: var(--off-white);
|
||||
padding: 16px 0;
|
||||
border-bottom: 1px solid var(--gray-light);
|
||||
}
|
||||
.breadcrumbs .container {
|
||||
font-size: 0.9rem;
|
||||
color: var(--text-mid);
|
||||
}
|
||||
.breadcrumbs a {
|
||||
color: var(--blue-mid);
|
||||
font-weight: 600;
|
||||
transition: color var(--transition);
|
||||
}
|
||||
.breadcrumbs a:hover {
|
||||
color: var(--blue-accent);
|
||||
}
|
||||
|
||||
/* Category services section */
|
||||
.cat-services {
|
||||
padding: 80px 0;
|
||||
background: var(--off-white);
|
||||
}
|
||||
|
||||
/* Category service cards with green accent bar */
|
||||
.cat-services .service-card::before {
|
||||
background: linear-gradient(90deg, var(--green), var(--green-dark));
|
||||
}
|
||||
|
||||
/* Pricing note */
|
||||
.pricing-note {
|
||||
background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
|
||||
padding: 48px 24px;
|
||||
text-align: center;
|
||||
color: var(--white);
|
||||
}
|
||||
.pricing-note p {
|
||||
font-size: 1.15rem;
|
||||
max-width: 700px;
|
||||
margin: 0 auto 20px;
|
||||
line-height: 1.7;
|
||||
}
|
||||
.pricing-note .accent {
|
||||
color: var(--cyan-bright);
|
||||
}
|
||||
|
||||
/* Footer cross-links */
|
||||
.footer-categories {
|
||||
text-align: center;
|
||||
padding: 20px 0;
|
||||
border-bottom: 1px solid rgba(255,255,255,0.1);
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
.footer-categories span {
|
||||
color: rgba(255,255,255,0.4);
|
||||
font-size: 0.85rem;
|
||||
margin-right: 8px;
|
||||
}
|
||||
.footer-categories a {
|
||||
color: rgba(255,255,255,0.7);
|
||||
font-size: 0.85rem;
|
||||
font-weight: 600;
|
||||
margin: 0 8px;
|
||||
transition: color var(--transition);
|
||||
}
|
||||
.footer-categories a:hover {
|
||||
color: var(--cyan-bright);
|
||||
}
|
||||
.footer-categories a.active-link {
|
||||
color: var(--cyan-bright);
|
||||
pointer-events: none;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<!-- Navigation -->
|
||||
<nav class="navbar" id="navbar">
|
||||
<div class="nav-container">
|
||||
<a href="index.html" class="logo">
|
||||
<img src="img/logo-icon.svg" alt="LoperBoys" class="logo-icon-svg">
|
||||
<span class="logo-text">Loper<span class="accent">Boys</span></span>
|
||||
</a>
|
||||
<button class="nav-toggle" id="navToggle" aria-label="Toggle menu">
|
||||
<span></span><span></span><span></span>
|
||||
</button>
|
||||
<ul class="nav-links" id="navLinks">
|
||||
<li><a href="index.html">Home</a></li>
|
||||
<li class="nav-dropdown" id="navDropdown">
|
||||
<a href="#" class="nav-dropdown-toggle" aria-haspopup="true">Services ▾</a>
|
||||
<ul class="nav-dropdown-menu" role="menu">
|
||||
<li><a href="lawn-care.html" role="menuitem">🌿 Lawn & Garden</a></li>
|
||||
<li><a href="home-services.html" role="menuitem">🏠 Home Services</a></li>
|
||||
<li><a href="auto-care.html" role="menuitem">🚗 Auto Care</a></li>
|
||||
<li><a href="moving.html" role="menuitem">📦 Moving & Hauling</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#contact" class="nav-cta">Get a Free Quote</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- Hero Section -->
|
||||
<section class="cat-hero" id="home">
|
||||
<div class="hero-overlay"></div>
|
||||
<div class="hero-content">
|
||||
<div class="hero-badge">🌿 Lawn & Garden</div>
|
||||
<h1 class="hero-title">Lawn & Garden <span class="accent">Services</span></h1>
|
||||
<p class="hero-sub">Keep your yard looking sharp all season long. From mowing to mulching, we handle the work you'd rather not do.</p>
|
||||
<div class="hero-ctas">
|
||||
<a href="tel:2202004022" class="btn btn-primary" style="background: linear-gradient(135deg, var(--green), var(--green-dark)); box-shadow: 0 4px 16px rgba(34,197,94,0.4);">
|
||||
<svg class="btn-icon" viewBox="0 0 24 24" fill="currentColor" width="20" height="20"><path d="M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z"/></svg>
|
||||
220-200-4022
|
||||
</a>
|
||||
<a href="#contact" class="btn btn-secondary">Get a Free Quote</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Breadcrumbs -->
|
||||
<div class="breadcrumbs">
|
||||
<div class="container">
|
||||
<a href="index.html">← Back to all services</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Services Grid -->
|
||||
<section class="cat-services" id="services">
|
||||
<div class="container">
|
||||
<h2 class="section-title">Lawn & Garden <span class="accent">Services</span></h2>
|
||||
<p class="section-subtitle">Everything your yard needs, covered by one reliable crew.</p>
|
||||
<div class="services-grid">
|
||||
<div class="service-card featured">
|
||||
<div class="featured-badge">Most Popular</div>
|
||||
<div class="service-icon">🌱</div>
|
||||
<h3>Lawn Mowing</h3>
|
||||
<p>Professional mowing, edging, and trimming. All season, every season. We keep your lawn neat and tidy.</p>
|
||||
</div>
|
||||
<div class="service-card">
|
||||
<div class="service-icon">🍂</div>
|
||||
<h3>Leaf Raking</h3>
|
||||
<p>Complete fall cleanup — leaf removal, bagging, and yard prep so your property is ready for winter.</p>
|
||||
</div>
|
||||
<div class="service-card">
|
||||
<div class="service-icon">🗑️</div>
|
||||
<h3>Lawn Pick-up</h3>
|
||||
<p>Branches, sticks, debris — we'll pick up anything off your lawn and haul it away.</p>
|
||||
</div>
|
||||
<div class="service-card">
|
||||
<div class="service-icon">✂️</div>
|
||||
<h3>Edging & Trimming</h3>
|
||||
<p>Clean, crisp edges around your driveway, walkways, and flower beds. The finishing touch that makes a difference.</p>
|
||||
</div>
|
||||
<div class="service-card">
|
||||
<div class="service-icon">🪵</div>
|
||||
<h3>Mulching</h3>
|
||||
<p>Garden bed mulch installation and refresh. Fresh mulch looks great and helps retain moisture.</p>
|
||||
</div>
|
||||
<div class="service-card">
|
||||
<div class="service-icon">🌿</div>
|
||||
<h3>Weed Control</h3>
|
||||
<p>Hand-pulled, no chemicals. We remove weeds the natural way so your lawn stays green without the spray.</p>
|
||||
</div>
|
||||
<div class="service-card">
|
||||
<div class="service-icon">🌻</div>
|
||||
<h3>Garden Bed Cleanup</h3>
|
||||
<p>Remove dead plants, clear debris, and prep your garden beds for the next season.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Pricing Note -->
|
||||
<section class="pricing-note">
|
||||
<div class="container">
|
||||
<p>Prices vary by job. <strong>Call 220-200-4022</strong> or use the form below for a <span class="accent">free, no-obligation quote</span>.</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Contact Section -->
|
||||
<section class="contact" id="contact">
|
||||
<div class="container">
|
||||
<h2 class="section-title">Get a <span class="accent">Free Quote</span></h2>
|
||||
<p class="section-subtitle">Tell us what you need — we'll get back to you fast.</p>
|
||||
<div class="contact-grid">
|
||||
<div class="contact-info">
|
||||
<h3>Contact Information</h3>
|
||||
<div class="contact-card">
|
||||
<div class="contact-item">
|
||||
<div class="contact-icon">📞</div>
|
||||
<div>
|
||||
<strong>Phone</strong>
|
||||
<a href="tel:2202004022">220-200-4022</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="contact-item">
|
||||
<div class="contact-icon">📧</div>
|
||||
<div>
|
||||
<strong>Email</strong>
|
||||
<a href="mailto:contact@loperboys.com">contact@loperboys.com</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="contact-item">
|
||||
<div class="contact-icon">📍</div>
|
||||
<div>
|
||||
<strong>Service Area</strong>
|
||||
<p>Warsaw, Coshocton, and surrounding areas</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="contact-item payment-methods">
|
||||
<div class="contact-icon">💳</div>
|
||||
<div>
|
||||
<strong>We Accept</strong>
|
||||
<div class="payment-badges">
|
||||
<span class="payment-badge">💵 Cash</span>
|
||||
<span class="payment-badge">📱 Venmo</span>
|
||||
<span class="payment-badge">📲 Cash App</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="contact-cta">
|
||||
<a href="tel:2202004022" class="btn btn-primary btn-large">📞 Call Now — It's Free to Quote!</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="contact-form-wrapper">
|
||||
<form class="contact-form" id="contactForm" action="send-contact.php" method="POST">
|
||||
<input type="hidden" name="service_category" value="lawn-garden">
|
||||
<p class="form-note" style="text-align:left; font-style:italic;">We value your privacy. Your information is only used to respond to your quote request and will never be shared with third parties.</p>
|
||||
<div class="form-group">
|
||||
<label for="name">Your Name *</label>
|
||||
<input type="text" id="name" name="name" required placeholder="John Smith">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="phone">Phone Number *</label>
|
||||
<input type="tel" id="phone" name="phone" required placeholder="(740) 000-0000">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="email">Email Address</label>
|
||||
<input type="email" id="email" name="email" placeholder="john@example.com">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="service">Service Needed *</label>
|
||||
<select id="service" name="service" required>
|
||||
<option value="">Select a service...</option>
|
||||
<option value="lawn-mowing">Lawn Mowing</option>
|
||||
<option value="leaf-raking">Leaf Raking</option>
|
||||
<option value="lawn-pickup">Lawn Pick-up</option>
|
||||
<option value="edging-trimming">Edging & Trimming</option>
|
||||
<option value="mulching">Mulching</option>
|
||||
<option value="weed-control">Weed Control</option>
|
||||
<option value="garden-bed-cleanup">Garden Bed Cleanup</option>
|
||||
<option value="other">Other</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group form-honeypot" aria-hidden="true" style="display:none;">
|
||||
<label for="website_url">Leave this blank</label>
|
||||
<input type="text" id="website_url" name="website_url" tabindex="-1" autocomplete="off">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="message">Tell Us About Your Project</label>
|
||||
<textarea id="message" name="message" rows="4" placeholder="Yard size, service frequency, any special requests..."></textarea>
|
||||
</div>
|
||||
<button type="submit" class="btn btn-primary btn-block">
|
||||
Send Message →
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="footer">
|
||||
<div class="container">
|
||||
<div class="footer-categories">
|
||||
<span>Other Services:</span>
|
||||
<a class="active-link" href="lawn-care.html">🌿 Lawn & Garden</a>
|
||||
<a href="home-services.html">🏠 Home Services</a>
|
||||
<a href="auto-care.html">🚗 Auto Care</a>
|
||||
<a href="moving.html">📦 Moving & Hauling</a>
|
||||
</div>
|
||||
<div class="footer-content">
|
||||
<div class="footer-brand">
|
||||
<h3>LoperBoys</h3>
|
||||
<p class="slogan">Hard Work. Honest Prices. Local Service.</p>
|
||||
</div>
|
||||
<div class="footer-contact">
|
||||
<a href="tel:2202004022" class="footer-phone">📞 220-200-4022</a>
|
||||
<a href="mailto:contact@loperboys.com" class="footer-email">📧 contact@loperboys.com</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-bottom">
|
||||
<p>© <span id="year"></span> LoperBoys. All rights reserved.</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Floating CTA -->
|
||||
<a href="tel:2202004022" class="floating-cta" id="floatingCta" aria-label="Call LoperBoys">
|
||||
<svg viewBox="0 0 24 24" fill="currentColor" width="24" height="24"><path d="M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z"/></svg>
|
||||
</a>
|
||||
|
||||
<script src="js/main.js"></script>
|
||||
<script>
|
||||
// Nav dropdown support for sub-pages
|
||||
(function() {
|
||||
var dropdown = document.getElementById('navDropdown');
|
||||
if (!dropdown) return;
|
||||
var toggle = dropdown.querySelector('.nav-dropdown-toggle');
|
||||
var menu = dropdown.querySelector('.nav-dropdown-menu');
|
||||
if (!toggle || !menu) return;
|
||||
|
||||
// Toggle on click (desktop)
|
||||
toggle.addEventListener('click', function(e) {
|
||||
e.preventDefault();
|
||||
menu.style.display = menu.style.display === 'block' ? 'none' : 'block';
|
||||
});
|
||||
|
||||
// Close dropdown when clicking outside
|
||||
document.addEventListener('click', function(e) {
|
||||
if (!dropdown.contains(e.target)) {
|
||||
menu.style.display = 'none';
|
||||
}
|
||||
});
|
||||
|
||||
// Show dropdown on hover (desktop only)
|
||||
if (window.matchMedia('(min-width: 769px)').matches) {
|
||||
dropdown.addEventListener('mouseenter', function() { menu.style.display = 'block'; });
|
||||
dropdown.addEventListener('mouseleave', function() { menu.style.display = 'none'; });
|
||||
}
|
||||
|
||||
// On mobile, dropdown links close the nav
|
||||
menu.querySelectorAll('a').forEach(function(link) {
|
||||
link.addEventListener('click', function() {
|
||||
menu.style.display = 'none';
|
||||
var navLinks = document.getElementById('navLinks');
|
||||
var navToggle = document.getElementById('navToggle');
|
||||
if (navLinks) navLinks.classList.remove('active');
|
||||
if (navToggle) navToggle.classList.remove('active');
|
||||
});
|
||||
});
|
||||
})();
|
||||
|
||||
// Dropdown menu inline styles
|
||||
(function() {
|
||||
var style = document.createElement('style');
|
||||
style.textContent =
|
||||
'.nav-dropdown { position: relative; }' +
|
||||
'.nav-dropdown-menu { ' +
|
||||
' display: none; ' +
|
||||
' position: absolute; ' +
|
||||
' top: 100%; ' +
|
||||
' left: 50%; ' +
|
||||
' transform: translateX(-50%); ' +
|
||||
' background: rgba(10, 36, 99, 0.98); ' +
|
||||
' backdrop-filter: blur(12px); ' +
|
||||
' border-radius: 12px; ' +
|
||||
' padding: 12px 0; ' +
|
||||
' min-width: 220px; ' +
|
||||
' box-shadow: 0 8px 32px rgba(0,0,0,0.3); ' +
|
||||
' z-index: 1001; ' +
|
||||
'}' +
|
||||
'.nav-dropdown-menu li a { ' +
|
||||
' display: block; ' +
|
||||
' padding: 10px 20px; ' +
|
||||
' color: rgba(255,255,255,0.85); ' +
|
||||
' font-size: 0.95rem; ' +
|
||||
' font-weight: 600; ' +
|
||||
' font-family: Montserrat, sans-serif; ' +
|
||||
' transition: background 0.2s, color 0.2s; ' +
|
||||
' white-space: nowrap; ' +
|
||||
'}' +
|
||||
'.nav-dropdown-menu li a:hover { ' +
|
||||
' background: rgba(255,255,255,0.1); ' +
|
||||
' color: #00e0ff; ' +
|
||||
'}' +
|
||||
'@media (max-width: 768px) { ' +
|
||||
' .nav-dropdown-menu { ' +
|
||||
' position: static; ' +
|
||||
' transform: none; ' +
|
||||
' background: transparent; ' +
|
||||
' box-shadow: none; ' +
|
||||
' padding: 4px 0 0 16px; ' +
|
||||
' } ' +
|
||||
' .nav-dropdown-menu li a { ' +
|
||||
' font-size: 1.1rem; ' +
|
||||
' padding: 8px 12px; ' +
|
||||
' } ' +
|
||||
'}';
|
||||
document.head.appendChild(style);
|
||||
})();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
+411
@@ -0,0 +1,411 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Moving & Hauling Services | LoperBoys — Warsaw, Coshocton, OH</title>
|
||||
<meta name="description" content="Furniture moving, junk removal, college moves, garage clean-outs, and appliance pickup in Warsaw, Coshocton, OH. Honest pricing. Call 220-200-4022.">
|
||||
<meta name="keywords" content="furniture moving, junk removal, college move-in, college move-out, garage cleanup, basement cleanup, donation drop-off, appliance pickup, mattress delivery, lumber delivery, soil delivery, Warsaw OH, Coshocton, LoperBoys">
|
||||
<meta name="author" content="LoperBoys">
|
||||
<meta name="robots" content="index, follow">
|
||||
<link rel="canonical" href="https://loperboys.com/moving.html">
|
||||
|
||||
<!-- Open Graph / Facebook -->
|
||||
<meta property="og:type" content="website">
|
||||
<meta property="og:url" content="https://loperboys.com/moving.html">
|
||||
<meta property="og:title" content="Moving & Hauling Services | LoperBoys — Warsaw, Coshocton, OH">
|
||||
<meta property="og:description" content="Furniture moving, junk removal, college moves, garage clean-outs, and appliance pickup in Warsaw, Coshocton, OH. Honest pricing.">
|
||||
<meta property="og:image" content="https://loperboys.com/img/og-banner.png">
|
||||
<meta property="og:locale" content="en_US">
|
||||
<meta property="og:site_name" content="LoperBoys">
|
||||
|
||||
<!-- Twitter Card -->
|
||||
<meta name="twitter:card" content="summary_large_image">
|
||||
<meta name="twitter:url" content="https://loperboys.com/moving.html">
|
||||
<meta name="twitter:title" content="Moving & Hauling Services | LoperBoys — Warsaw, Coshocton, OH">
|
||||
<meta name="twitter:description" content="Furniture moving, junk removal, college moves, garage clean-outs, and appliance pickup in Warsaw, Coshocton, OH.">
|
||||
<meta name="twitter:image" content="https://loperboys.com/img/og-banner.png">
|
||||
|
||||
<!-- Favicon -->
|
||||
<link rel="icon" type="image/svg+xml" href="img/favicon.svg">
|
||||
<link rel="apple-touch-icon" href="img/favicon.svg">
|
||||
|
||||
<!-- Structured Data (Service) -->
|
||||
<script type="application/ld+json">
|
||||
{
|
||||
"@context": "https://schema.org",
|
||||
"@type": "Service",
|
||||
"serviceType": "Moving & Hauling Services",
|
||||
"provider": {
|
||||
"@type": "LocalBusiness",
|
||||
"name": "LoperBoys",
|
||||
"url": "https://loperboys.com",
|
||||
"telephone": "+1-220-200-4022",
|
||||
"areaServed": {
|
||||
"@type": "Place",
|
||||
"name": "Warsaw, Coshocton, and surrounding areas, Ohio"
|
||||
}
|
||||
},
|
||||
"hasOfferCatalog": {
|
||||
"@type": "OfferCatalog",
|
||||
"name": "Moving & Hauling Services",
|
||||
"itemListElement": [
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Furniture Moving"}},
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Junk Removal"}},
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Mattress Delivery"}},
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "College Move-In/Move-Out"}},
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Garage/Basement Clean-Out"}},
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Donation Drop-Off"}},
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Appliance Pickup"}},
|
||||
{"@type": "Offer", "itemOffered": {"@type": "Service", "name": "Lumber/Soil Delivery"}}
|
||||
]
|
||||
},
|
||||
"priceRange": "$"
|
||||
}
|
||||
</script>
|
||||
|
||||
<link rel="stylesheet" href="css/style.css?v=2">
|
||||
<link rel="preconnect" href="https://fonts.googleapis.com">
|
||||
<link href="https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600;700;900&family=Open+Sans:wght@400;600&display=swap" rel="stylesheet">
|
||||
|
||||
<style>
|
||||
.cat-hero {
|
||||
position: relative;
|
||||
min-height: 60vh;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
text-align: center;
|
||||
background: linear-gradient(135deg, #0a2463 0%, #1e56a0 40%, #2d7dd2 70%, #0a2463 100%);
|
||||
overflow: hidden;
|
||||
padding: 120px 24px 80px;
|
||||
}
|
||||
.cat-hero::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background:
|
||||
radial-gradient(circle at 20% 80%, rgba(255, 255, 255, 0.12) 0%, transparent 50%),
|
||||
radial-gradient(circle at 80% 20%, rgba(255, 255, 255, 0.1) 0%, transparent 50%);
|
||||
animation: heroFloat 8s ease-in-out infinite;
|
||||
}
|
||||
.cat-hero .hero-title { font-size: clamp(2rem, 5vw, 3.2rem); }
|
||||
.cat-hero .hero-slogan { color: #b0d4f1; }
|
||||
|
||||
.breadcrumbs {
|
||||
background: var(--off-white);
|
||||
padding: 16px 0;
|
||||
border-bottom: 1px solid var(--gray-light);
|
||||
}
|
||||
.breadcrumbs .container { font-size: 0.9rem; color: var(--text-mid); }
|
||||
.breadcrumbs a { color: var(--blue-mid); font-weight: 600; transition: color var(--transition); }
|
||||
.breadcrumbs a:hover { color: var(--blue-accent); }
|
||||
|
||||
.cat-services { padding: 80px 0; background: var(--off-white); }
|
||||
.cat-services .service-card::before {
|
||||
background: linear-gradient(90deg, var(--blue-dark), var(--blue-mid));
|
||||
}
|
||||
|
||||
.pricing-note {
|
||||
background: linear-gradient(135deg, var(--blue-dark), var(--blue-mid));
|
||||
padding: 48px 24px;
|
||||
text-align: center;
|
||||
color: var(--white);
|
||||
}
|
||||
.pricing-note p {
|
||||
font-size: 1.15rem;
|
||||
max-width: 700px;
|
||||
margin: 0 auto 20px;
|
||||
line-height: 1.7;
|
||||
}
|
||||
.pricing-note .accent { color: var(--cyan-bright); }
|
||||
|
||||
.footer-categories {
|
||||
text-align: center;
|
||||
padding: 20px 0;
|
||||
border-bottom: 1px solid rgba(255,255,255,0.1);
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
.footer-categories span { color: rgba(255,255,255,0.4); font-size: 0.85rem; margin-right: 8px; }
|
||||
.footer-categories a {
|
||||
color: rgba(255,255,255,0.7);
|
||||
font-size: 0.85rem;
|
||||
font-weight: 600;
|
||||
margin: 0 8px;
|
||||
transition: color var(--transition);
|
||||
}
|
||||
.footer-categories a:hover { color: var(--cyan-bright); }
|
||||
.footer-categories a.active-link { color: var(--cyan-bright); pointer-events: none; }
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<!-- Navigation -->
|
||||
<nav class="navbar" id="navbar">
|
||||
<div class="nav-container">
|
||||
<a href="index.html" class="logo">
|
||||
<img src="img/logo-icon.svg" alt="LoperBoys" class="logo-icon-svg">
|
||||
<span class="logo-text">Loper<span class="accent">Boys</span></span>
|
||||
</a>
|
||||
<button class="nav-toggle" id="navToggle" aria-label="Toggle menu">
|
||||
<span></span><span></span><span></span>
|
||||
</button>
|
||||
<ul class="nav-links" id="navLinks">
|
||||
<li><a href="index.html">Home</a></li>
|
||||
<li class="nav-dropdown" id="navDropdown">
|
||||
<a href="#" class="nav-dropdown-toggle" aria-haspopup="true">Services ▾</a>
|
||||
<ul class="nav-dropdown-menu" role="menu">
|
||||
<li><a href="lawn-care.html" role="menuitem">🌿 Lawn & Garden</a></li>
|
||||
<li><a href="home-services.html" role="menuitem">🏠 Home Services</a></li>
|
||||
<li><a href="auto-care.html" role="menuitem">🚗 Auto Care</a></li>
|
||||
<li><a href="moving.html" role="menuitem">📦 Moving & Hauling</a></li>
|
||||
</ul>
|
||||
</li>
|
||||
<li><a href="#contact" class="nav-cta">Get a Free Quote</a></li>
|
||||
</ul>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
<!-- Hero Section -->
|
||||
<section class="cat-hero" id="home">
|
||||
<div class="hero-overlay"></div>
|
||||
<div class="hero-content">
|
||||
<div class="hero-badge">📦 Moving & Hauling</div>
|
||||
<h1 class="hero-title">Moving & Hauling <span class="accent">Services</span></h1>
|
||||
<p class="hero-sub">Heavy lifting, hauling, and clean-outs. We have the truck, the strength, and the willingness to get it done.</p>
|
||||
<div class="hero-ctas">
|
||||
<a href="tel:2202004022" class="btn btn-primary">
|
||||
<svg class="btn-icon" viewBox="0 0 24 24" fill="currentColor" width="20" height="20"><path d="M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z"/></svg>
|
||||
220-200-4022
|
||||
</a>
|
||||
<a href="#contact" class="btn btn-secondary">Get a Free Quote</a>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Breadcrumbs -->
|
||||
<div class="breadcrumbs">
|
||||
<div class="container">
|
||||
<a href="index.html">← Back to all services</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Services Grid -->
|
||||
<section class="cat-services" id="services">
|
||||
<div class="container">
|
||||
<h2 class="section-title">Moving & Hauling <span class="accent">Services</span></h2>
|
||||
<p class="section-subtitle">We've got the truck, the crew, and the grit to handle any move or haul.</p>
|
||||
<div class="services-grid">
|
||||
<div class="service-card featured">
|
||||
<div class="featured-badge">Most Popular</div>
|
||||
<div class="service-icon">🛋️</div>
|
||||
<h3>Furniture Moving</h3>
|
||||
<p>Inside a house, between rooms, or short-distance hauling. We'll get it where it needs to go.</p>
|
||||
</div>
|
||||
<div class="service-card">
|
||||
<div class="service-icon">🗑️</div>
|
||||
<h3>Junk Removal</h3>
|
||||
<p>Haul away old furniture, appliances, and yard waste. We clean it up and take it with us.</p>
|
||||
</div>
|
||||
<div class="service-card">
|
||||
<div class="service-icon">🛏️</div>
|
||||
<h3>Mattress Delivery</h3>
|
||||
<p>Pick up and deliver mattresses. Stores charge $100+ — we'll do it for way less.</p>
|
||||
</div>
|
||||
<div class="service-card">
|
||||
<div class="service-icon">🎓</div>
|
||||
<h3>College Move-In/Move-Out</h3>
|
||||
<p>Heavy lifting for dorms and apartments. We make college moves stress-free.</p>
|
||||
</div>
|
||||
<div class="service-card">
|
||||
<div class="service-icon">🏚️</div>
|
||||
<h3>Garage/Basement Clean-Out</h3>
|
||||
<p>Decluttering and hauling. We sort, pack, and haul away what you don't need.</p>
|
||||
</div>
|
||||
<div class="service-card">
|
||||
<div class="service-icon">❤️</div>
|
||||
<h3>Donation Drop-Off</h3>
|
||||
<p>We take your items to Goodwill, Salvation Army, or other local charities. No hassle for you.</p>
|
||||
</div>
|
||||
<div class="service-card">
|
||||
<div class="service-icon">🔧</div>
|
||||
<h3>Appliance Pickup</h3>
|
||||
<p>Old washer, dryer, or furnace? We'll haul it away so you don't have to deal with it.</p>
|
||||
</div>
|
||||
<div class="service-card">
|
||||
<div class="service-icon">🪵</div>
|
||||
<h3>Lumber/Soil Delivery</h3>
|
||||
<p>Pick up from the store and deliver to your job site. Save yourself the trip and the hassle.</p>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Pricing Note -->
|
||||
<section class="pricing-note">
|
||||
<div class="container">
|
||||
<p>Prices vary by job. <strong>Call 220-200-4022</strong> or use the form below for a <span class="accent">free, no-obligation quote</span>.</p>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Contact Section -->
|
||||
<section class="contact" id="contact">
|
||||
<div class="container">
|
||||
<h2 class="section-title">Get a <span class="accent">Free Quote</span></h2>
|
||||
<p class="section-subtitle">Tell us what you need — we'll get back to you fast.</p>
|
||||
<div class="contact-grid">
|
||||
<div class="contact-info">
|
||||
<h3>Contact Information</h3>
|
||||
<div class="contact-card">
|
||||
<div class="contact-item">
|
||||
<div class="contact-icon">📞</div>
|
||||
<div>
|
||||
<strong>Phone</strong>
|
||||
<a href="tel:2202004022">220-200-4022</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="contact-item">
|
||||
<div class="contact-icon">📧</div>
|
||||
<div>
|
||||
<strong>Email</strong>
|
||||
<a href="mailto:contact@loperboys.com">contact@loperboys.com</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="contact-item">
|
||||
<div class="contact-icon">📍</div>
|
||||
<div>
|
||||
<strong>Service Area</strong>
|
||||
<p>Warsaw, Coshocton, and surrounding areas</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="contact-item payment-methods">
|
||||
<div class="contact-icon">💳</div>
|
||||
<div>
|
||||
<strong>We Accept</strong>
|
||||
<div class="payment-badges">
|
||||
<span class="payment-badge">💵 Cash</span>
|
||||
<span class="payment-badge">📱 Venmo</span>
|
||||
<span class="payment-badge">📲 Cash App</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="contact-cta">
|
||||
<a href="tel:2202004022" class="btn btn-primary btn-large">📞 Call Now — It's Free to Quote!</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="contact-form-wrapper">
|
||||
<form class="contact-form" id="contactForm" action="send-contact.php" method="POST">
|
||||
<input type="hidden" name="service_category" value="moving-hauling">
|
||||
<p class="form-note" style="text-align:left; font-style:italic;">We value your privacy. Your information is only used to respond to your quote request and will never be shared with third parties.</p>
|
||||
<div class="form-group">
|
||||
<label for="name">Your Name *</label>
|
||||
<input type="text" id="name" name="name" required placeholder="John Smith">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="phone">Phone Number *</label>
|
||||
<input type="tel" id="phone" name="phone" required placeholder="(740) 000-0000">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="email">Email Address</label>
|
||||
<input type="email" id="email" name="email" placeholder="john@example.com">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="service">Service Needed *</label>
|
||||
<select id="service" name="service" required>
|
||||
<option value="">Select a service...</option>
|
||||
<option value="furniture-moving">Furniture Moving</option>
|
||||
<option value="junk-removal">Junk Removal</option>
|
||||
<option value="mattress-delivery">Mattress Delivery</option>
|
||||
<option value="college-move">College Move-In/Move-Out</option>
|
||||
<option value="garage-basement-cleanup">Garage/Basement Clean-Out</option>
|
||||
<option value="donation-dropoff">Donation Drop-Off</option>
|
||||
<option value="appliance-pickup">Appliance Pickup</option>
|
||||
<option value="lumber-soil-delivery">Lumber/Soil Delivery</option>
|
||||
<option value="other">Other</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group form-honeypot" aria-hidden="true" style="display:none;">
|
||||
<label for="website_url">Leave this blank</label>
|
||||
<input type="text" id="website_url" name="website_url" tabindex="-1" autocomplete="off">
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label for="message">Tell Us About Your Project</label>
|
||||
<textarea id="message" name="message" rows="4" placeholder="What needs moved, pickup/drop-off locations, timing..."></textarea>
|
||||
</div>
|
||||
<button type="submit" class="btn btn-primary btn-block">
|
||||
Send Message →
|
||||
</button>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
<!-- Footer -->
|
||||
<footer class="footer">
|
||||
<div class="container">
|
||||
<div class="footer-categories">
|
||||
<span>Other Services:</span>
|
||||
<a href="lawn-care.html">🌿 Lawn & Garden</a>
|
||||
<a href="home-services.html">🏠 Home Services</a>
|
||||
<a href="auto-care.html">🚗 Auto Care</a>
|
||||
<a class="active-link" href="moving.html">📦 Moving & Hauling</a>
|
||||
</div>
|
||||
<div class="footer-content">
|
||||
<div class="footer-brand">
|
||||
<h3>LoperBoys</h3>
|
||||
<p class="slogan">Hard Work. Honest Prices. Local Service.</p>
|
||||
</div>
|
||||
<div class="footer-contact">
|
||||
<a href="tel:2202004022" class="footer-phone">📞 220-200-4022</a>
|
||||
<a href="mailto:contact@loperboys.com" class="footer-email">📧 contact@loperboys.com</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="footer-bottom">
|
||||
<p>© <span id="year"></span> LoperBoys. All rights reserved.</p>
|
||||
</div>
|
||||
</div>
|
||||
</footer>
|
||||
|
||||
<!-- Floating CTA -->
|
||||
<a href="tel:2202004022" class="floating-cta" id="floatingCta" aria-label="Call LoperBoys">
|
||||
<svg viewBox="0 0 24 24" fill="currentColor" width="24" height="24"><path d="M6.62 10.79c1.44 2.83 3.76 5.14 6.59 6.59l2.2-2.2c.27-.27.67-.36 1.02-.24 1.12.37 2.33.57 3.57.57.55 0 1 .45 1 1V20c0 .55-.45 1-1 1-9.39 0-17-7.61-17-17 0-.55.45-1 1-1h3.5c.55 0 1 .45 1 1 0 1.25.2 2.45.57 3.57.11.35.03.74-.25 1.02l-2.2 2.2z"/></svg>
|
||||
</a>
|
||||
|
||||
<script src="js/main.js"></script>
|
||||
<script>
|
||||
(function() {
|
||||
var dropdown = document.getElementById('navDropdown');
|
||||
if (!dropdown) return;
|
||||
var toggle = dropdown.querySelector('.nav-dropdown-toggle');
|
||||
var menu = dropdown.querySelector('.nav-dropdown-menu');
|
||||
if (!toggle || !menu) return;
|
||||
toggle.addEventListener('click', function(e) { e.preventDefault(); menu.style.display = menu.style.display === 'block' ? 'none' : 'block'; });
|
||||
document.addEventListener('click', function(e) { if (!dropdown.contains(e.target)) { menu.style.display = 'none'; } });
|
||||
if (window.matchMedia('(min-width: 769px)').matches) {
|
||||
dropdown.addEventListener('mouseenter', function() { menu.style.display = 'block'; });
|
||||
dropdown.addEventListener('mouseleave', function() { menu.style.display = 'none'; });
|
||||
}
|
||||
menu.querySelectorAll('a').forEach(function(link) {
|
||||
link.addEventListener('click', function() {
|
||||
menu.style.display = 'none';
|
||||
var navLinks = document.getElementById('navLinks');
|
||||
var navToggle = document.getElementById('navToggle');
|
||||
if (navLinks) navLinks.classList.remove('active');
|
||||
if (navToggle) navToggle.classList.remove('active');
|
||||
});
|
||||
});
|
||||
})();
|
||||
(function() {
|
||||
var style = document.createElement('style');
|
||||
style.textContent =
|
||||
'.nav-dropdown { position: relative; }' +
|
||||
'.nav-dropdown-menu { display: none; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); background: rgba(10, 36, 99, 0.98); backdrop-filter: blur(12px); border-radius: 12px; padding: 12px 0; min-width: 220px; box-shadow: 0 8px 32px rgba(0,0,0,0.3); z-index: 1001; }' +
|
||||
'.nav-dropdown-menu li a { display: block; padding: 10px 20px; color: rgba(255,255,255,0.85); font-size: 0.95rem; font-weight: 600; font-family: Montserrat, sans-serif; transition: background 0.2s, color 0.2s; white-space: nowrap; }' +
|
||||
'.nav-dropdown-menu li a:hover { background: rgba(255,255,255,0.1); color: #00e0ff; }' +
|
||||
'@media (max-width: 768px) { .nav-dropdown-menu { position: static; transform: none; background: transparent; box-shadow: none; padding: 4px 0 0 16px; } .nav-dropdown-menu li a { font-size: 1.1rem; padding: 8px 12px; } }';
|
||||
document.head.appendChild(style);
|
||||
})();
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user