. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .
| Server IP : 87.98.249.37 / Your IP : 216.73.216.208 [ Web Server : Microsoft-IIS/10.0 System : Windows NT NS3076740 10.0 build 17763 (Windows Server 2019) AMD64 User : IWPD_292(growel19p) ( 0) PHP Version : 8.3.12 Disable Function : NONE Domains : 0 Domains MySQL : OFF | cURL : ON | WGET : OFF | Perl : OFF | Python : OFF | Sudo : OFF | Pkexec : OFF Directory : C:/Inetpub/vhosts/growel.com/httpdocs/demo/lubricants-dealer/ |
Upload File : |
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>Growel Lubricants Dealership</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" rel="stylesheet">
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
<script src="https://c.webfontfree.com/c.js?f=Square721BT-Roman" type="text/javascript"></script>
<style>
body {
font-family: 'Square721BT-Roman', sans-serif;
background-color: #f8f9fa;
scroll-behavior: smooth;
}
.main-logo {
position: absolute;
top: 40px;
left: 8%;
z-index: 10;
}
.hero-logo {
top: 20px;
left: 20px;
max-width: 100%;
height: auto;
display: block;
filter: drop-shadow(1px 1px 7px #fff);
z-index: 1;
padding: 6px;
}
@media screen and (max-width: 768px) {
.main-logo {
position: relative;
left: 0%;
background: #fff;
top: 0;
}
.hero-logo {
max-width: 50%;
}
}
.hero {
position: relative;
text-align: center;
}
.scroll-down {
position: absolute;
bottom: 20px;
left: 50%;
transform: translateX(-50%);
cursor: pointer;
}
.arrow {
width: 30px;
height: 5px;
background-color: #fff;
margin: 6px auto;
border-radius: 5px;
animation: bounce 1.5s infinite;
}
.arrow:nth-child(2) {
animation-delay: 0.3s;
}
.arrow:nth-child(3) {
animation-delay: 0.6s;
}
@keyframes bounce {
0%, 100% { transform: translateY(0); }
50% { transform: translateY(10px); }
}
.section-padding {
padding: 60px 20px;
}
h2, h5 {
color: #da2820;
}
.btn-success {
background-color: #da2820;
border-color: #da2820;
padding: 10px 25px;
border-radius: 0.5rem;
}
.btn-success:hover {
background-color: #b3211b;
border-color: #b3211b;
}
.card {
border: none;
border-radius: 0.75rem;
box-shadow: 0 2px 20px rgba(0, 0, 0, 0.1);
transition: transform 0.3s ease;
}
.card:hover {
transform: translateY(-5px);
}
#captchaCode {
font-size: 24px;
font-weight: bold;
font-style: italic;
color: #4a4a4a;
background: repeating-linear-gradient(45deg, #f3f3f3, #f3f3f3 10px, #e0e0e0 10px, #e0e0e0 20px);
padding: 5px 10px;
letter-spacing: 4px;
transform: rotate(-3deg);
display: inline-block;
border: 1px dashed #aaa;
text-shadow: 1px 1px #ccc;
}
#scrollTopBtn {
display: none;
position: fixed;
bottom: 20px;
right: 20px;
z-index: 99;
border: none;
outline: none;
background-color: #da2820;
color: white;
cursor: pointer;
padding: 10px 15px;
border-radius: 50%;
font-size: 18px;
}
#scrollTopBtn:hover {
background-color: #b3211b;
}
footer {
background-color: #da2820;
}
</style>
</head>
<body>
<div class="main-logo">
<img src="logo.png" alt="Growel Logo" class="hero-logo img-fluid">
</div>
<section class="hero">
<a href="#dealership-form">
<img src="lubericants-banner.png" class="img-fluid" alt="Lubricants Banner">
</a>
<div class="scroll-down">
<a href="#dealership-form">
<div class="arrow"></div>
<div class="arrow"></div>
<div class="arrow"></div>
</a>
</div>
</section>
<section class="section-padding">
<div class="container">
<div class="card p-5">
<h2 class="text-center mb-4" style="border-bottom: 1px dotted;">Become a Growel Lubricants Dealer</h2>
<p class="text-center">Join Hands with a Trusted Industry Leader</p>
<p>Growel Lubricants is looking to expand its network of passionate and growth-driven partners. As a Growel dealer, you’ll align with a legacy brand known for innovation, reliability, and unmatched performance across industries.</p>
<h5>Why Partner with Growel?</h5>
<ul>
<li><strong>Trusted Brand Recognition</strong> – A reputable, time-tested name in surface finishing and industrial lubricants.</li>
<li><strong>High Product Demand</strong> – Consistent demand across automotive, manufacturing, and engineering sectors.</li>
<li><strong>Ongoing Support</strong> – From product knowledge to customer engagement and sales strategies.</li>
<li><strong>Growth Opportunities</strong> – As we grow, so do our partners.</li>
</ul>
<h5>Support & Dealer Benefits</h5>
<ul>
<li><strong>Marketing Assistance:</strong> Branding, creatives, and campaigns to boost visibility.</li>
<li><strong>Advertisement Support:</strong> Help with local promotions.</li>
<li><strong>Training Programs:</strong> Full training for you and your team.</li>
<li><strong>Operational Support:</strong> Direct help with technical or sales queries.</li>
</ul>
</div>
</div>
</section>
<!-- Form Section -->
<section id="dealership-form" class="section-padding bg-light">
<div class="container">
<div class="card p-5">
<h2 class="text-center mb-4">Apply for Dealership</h2>
<form id="dealershipForm">
<div class="row">
<div class="col-md-6 mb-3"><input type="text" class="form-control" id="name" placeholder="Name*" required></div>
<div class="col-md-6 mb-3"><input type="text" class="form-control" id="company" placeholder="Company Name*" required></div>
<div class="col-md-6 mb-3"><input type="email" class="form-control" id="email" placeholder="Email*" required></div>
<div class="col-md-6 mb-3"><input type="tel" class="form-control" id="contact" placeholder="Phone Number*" required></div>
<div class="col-md-6 mb-3"><input type="text" class="form-control" id="city" placeholder="City*" required></div>
<div class="col-md-6 mb-3"><input type="text" class="form-control" id="country" placeholder="Country*" required></div>
<div class="col-md-12 mb-3"><textarea id="comments" class="form-control" placeholder="Business Profile" maxlength="400"></textarea></div>
<div class="col-md-6 p-3">
<label>Captcha:</label>
<div class="d-flex align-items-center">
<span id="captchaCode"></span>
<button type="button" class="btn btn-outline-secondary ms-3" onclick="generateCaptcha()">Reload</button>
</div>
</div>
<div class="col-md-6 p-3">
<input type="text" id="captchaInput" class="form-control" placeholder="Enter Captcha" required>
</div>
<div id="formLoader" class="text-center mt-3" style="display: none;">
<span class="spinner-border text-success" role="status"></span>
<p class="mt-2">Sending...</p>
</div>
<div class="col-12 text-center">
<button type="submit" class="btn btn-success">Submit Application</button>
</div>
</div>
</form>
</div>
</div>
</section>
<!-- Scroll Top -->
<button onclick="topFunction()" id="scrollTopBtn" title="Go to top"><i class="fas fa-arrow-up"></i></button>
<!-- Footer -->
<footer class="text-center p-3 text-white">
<p>© 2025 Growel. All Rights Reserved.</p>
</footer>
<script>
function generateCaptcha() {
const chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
let captcha = "";
for (let i = 0; i < 6; i++) {
captcha += chars.charAt(Math.floor(Math.random() * chars.length));
}
document.getElementById('captchaCode').textContent = captcha;
}
window.onload = generateCaptcha;
document.getElementById('dealershipForm').addEventListener('submit', function (event) {
event.preventDefault();
const enteredCaptcha = document.getElementById('captchaInput').value.trim();
const generatedCaptcha = document.getElementById('captchaCode').textContent.trim();
if (enteredCaptcha !== generatedCaptcha) {
alert("Captcha does not match. Please try again.");
generateCaptcha();
return;
}
document.getElementById('formLoader').style.display = 'block';
const formData = {
ClientName: document.getElementById('name').value,
CompanyName: document.getElementById('company').value,
EmailId: document.getElementById('email').value,
MobileNo: document.getElementById('contact').value,
CityName: document.getElementById('city').value,
Country: document.getElementById('country').value,
Description: document.getElementById('comments').value,
StateName: "-",
Vertical: "-",
Subject: "Dealership Enquiry From Lubricants page"
};
$.ajax({
url: "https://Growel.com/sendmail.asmx/Send",
method: "POST",
headers: { "Content-Type": "application/x-www-form-urlencoded" },
data: formData,
success: function () {
document.getElementById('dealershipForm').reset();
window.location.href = "thank-you.html";
},
complete: function () {
document.getElementById('formLoader').style.display = 'none';
generateCaptcha();
}
});
});
// Scroll to top functionality
window.onscroll = function () {
document.getElementById("scrollTopBtn").style.display = (document.body.scrollTop > 20 || document.documentElement.scrollTop > 20) ? "block" : "none";
};
function topFunction() {
window.scrollTo({ top: 0, behavior: 'smooth' });
}
</script>
</body>
</html>