File "test.html"
Full Path: /home/chawlag2/public_html/cars/admin/test.html
File size: 49.16 KB
MIME-type: text/html
Charset: utf-8
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Booking Form</title>
<link href="https://fonts.googleapis.com/css?family=PT+Sans:400" rel="stylesheet">
<link type="text/css" rel="stylesheet" href="css/booking.css" />
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css">
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.bundle.min.js">
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"></script>
<script src="https://cdn.jsdelivr.net/npm/@fortawesome/fontawesome-free@6.6.0/css/fontawesome.min.css"></script>
<link rel="alternate" hreflang="x-default" href="https://www.dongfeng-nammi-box.ch/">
<link rel="alternate" hreflang="de" href="https://www.dongfeng-nammi-box.ch/">
<link rel="alternate" hreflang="en" href="https://www.dongfeng-nammi-box.ch/en">
<meta content="Stylish, practical, and innovative – CGM-Box is your perfect companion for everyday journeys with a range of 430 km" name="description">
<meta content="CGM-Box – the new rising star in affordable electric mobility in Pakistan" property="og:title">
<meta content="Stylish, practical, and innovative – CGM-Box is your perfect companion for everyday journeys with a range of 430 km for only CHF 21,990.–, available in Switzerland from autumn 2024." property="og:description">
<meta content="images/668681a7e07badadddadde51_Sharing_Image.webp" property="og:image">
<meta content="CGM-Box – the new rising star in affordable electric mobility in Switzerland" property="twitter:title">
<meta content="Stylish, practical, and innovative – CGM-Box is your perfect companion for everyday journeys with a range of 430 km" property="twitter:description">
<meta content="https://cdn.prod.website-files.com/6673de3350ec9a81ecfa64a2/668681a7e07badadddadde51_Sharing_Image.webp" property="twitter:image">
<meta property="og:type" content="website">
<meta content="summary_large_image" name="twitter:card">
<meta content="width=device-width, initial-scale=1" name="viewport">
<link href="css/dongfeng-nammi-box.webflow.7ffe7ed09.min.css" rel="stylesheet" type="text/css">
<script type="text/javascript">!function(o,c){var n=c.documentElement,t=" w-mod-";n.className+=t+"js",("ontouchstart"in o||o.DocumentTouch&&c instanceof DocumentTouch)&&(n.className+=t+"touch")}(window,document);</script>
<link href="images/6675a83c20d748b3dea3be18_Favicon.png" rel="shortcut icon" type="image/x-icon">
<link href="images/6675a84021eb67bac0af9632_Webclip.png" rel="apple-touch-icon">
<script id="Cookiebot" src="js/uc.js" data-cbid="d7888c28-abe6-4050-b8bb-a20ac72085b2" data-blockingmode="auto" type="text/javascript">
</script>
<!-- Google tag (gtag.js) -->
<script async="" src="https://www.googletagmanager.com/gtag/js?id=G-BX12GEE1BJ"></script>
<script>
window.dataLayer = window.dataLayer || [];
function gtag(){dataLayer.push(arguments);}
gtag('js', new Date());
gtag('config', 'G-BX12GEE1BJ');
function bookNow()
{
alert("COMING SOON!");
}
</script>
<link href="css/floating.css" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<body>
<section class="nav-mobile-wrap">
<nav class="nav-mobile-menu">
<div class="close-menu">
<img loading="lazy" src="images/667d85fe1c9bb91e2148b21c_X.svg" alt="" class="close-menu-icon">
</div>
<a href="#contact" class="nav-link hover-vf" onclick="bookNow();">Book now</a>
<a href="#contact" class="nav-link hover-el">Get in touch</a>
<a href="/en" aria-current="page" class="logo-wrap nav-mobile w-inline-block w--current">
<img loading="lazy" src="images/6675a6a2fbb4928ef3ab89eb_dongfeng_logo_black.svg" alt="" class="logo nav--mobile">
</a>
</nav>
</section>
<header class="header" style="background-color: black; height: 120px;">
<a href="../index.html" aria-current="page" class="logo-wrap w-inline-block w--current">
<img data-w-id="a4d58063-073f-caaa-d506-731e5ea51c46" loading="lazy" alt="" style="width:161px;height:95px;margin-top:px;" src="images/logo2.png" class="logo light">
</a>
<a href="../index.html" aria-current="page" class="logo-wrap w-inline-block w--current">
<img data-w-id="a4d58063-073f-caaa-d506-731e5ea51c46" loading="lazy" alt="" style="width:231px;height:136px;margin-top:px;margin-left:-200px;" src="images/6675a6a246c2cbec25eb9aa5_dongfeng_logo_white.svg" class="logo light">
</a>
<div class="navigation">
<nav class="nav-buttons-wrap">
<a href="#contact" data-w-id="a4d58063-073f-caaa-d506-731e5ea51c48" class="button-secondary reverse-no-hover w-button">Get in touch
</a>
<a data-w-id="a4d58063-073f-caaa-d506-731e5ea51c4a" href="#" class="button-primary reverse-no-hover w-button" disabled onclick="bookNow();">Book now
</a>
</nav>
<div class="burger">
<div class="burger-element">
</div>
<div class="burger-element">
</div>
<div class="burger-element">
</div>
</div>
</div>
</header>
<div class="container-fluid px-1 px-md-5 px-lg-1 px-xl-5 py-5 mx-auto ">
<div class="card card0 border-0" style="background-image: linear-gradient(283deg,var(--ocean-eyes)25%,var(--white)75%,#f9faf5 104%);">
<div class="row d-flex">
<div class="col-lg-6">
<div class="card1 pb-5">
<div class="row">
<!-- <img src="images/logo2.png" class="logo"> -->
</div>
<br/>
<div class="row" id="rowLUX" style="display: block">
<div class="col-md-12">
<div id="main">
<div class="container">
<div class="accordion" id="faq">
<div class="card">
<div class="card-header" id="faqhead1">
<a href="#" id="dimCard1" class="btn btn-header-link" data-toggle="collapse" data-target="#faq1"
aria-expanded="true" aria-controls="faq1"><b>DIMENSIONS</b></a>
</div>
<div id="faq1" class="collapse show" aria-labelledby="faqhead1" data-parent="#faq">
<table class="" border="1" style="margin-left: 3%">
<tr>
<td colspan="6">
<img id="carImg" src="images/lux430.jpg" class="image" style="height: 390px; width: 100%;">
</td>
</tr>
<tr style="background-color: #f9f9f9;">
<td align="" style="padding: 5px"><b>Length (mm)</b></td>
<td align="" style="padding: 5px">4030</td>
<td align="" style="padding: 5px"><b>Width (mm)</b></td>
<td align="" style="padding: 5px">1810</td>
</tr>
<tr style="background-color: #f9f9f9;">
<td align="" style="padding: 5px"><b>Height (mm)</b></td>
<td align="" style="padding: 5px">1570</td>
<td align="" style="padding: 5px"><b>Wheelbase (mm)</b></td>
<td align="" style="padding: 5px">2660</td>
</tr>
<tr style="background-color: #f9f9f9;">
<td align="" style="padding: 5px"><b>Body Structure</b></td>
<td align="" colspan="3" style="padding: 5px">5 Door - 5 Seats (HB)</td>
</tr>
</table>
</div>
</div>
<div class="card">
<div class="card-header" id="faqhead2">
<a href="#" id="elecCard1" class="btn btn-header-link collapsed" data-toggle="collapse" data-target="#faq2"
aria-expanded="true" aria-controls="faq2"><b>ELECTRICAL INFORMATION</b></a>
</div>
<div id="faq2" class="collapse" aria-labelledby="faqhead2" data-parent="#faq">
<table class="" border="1" style="margin-left: 3%">
<tr style="background-color: #f9f9f9;">
<td align="" style="padding: 5px"><b>AC Charger Power 6.6 KW</b></td>
<td align="" style="padding: 5px">S</td>
<td align="" style="padding: 5px"><b>DC Charging Time</b></td>
<td align="" style="padding: 5px">30 Minutes</td>
</tr>
<tr style="background-color: #f9f9f9;">
<td align="" style="padding: 5px"><b>Fast Charging Percentage</b></td>
<td align="" style="padding: 5px">80%</td>
<td align="" style="padding: 5px"><b>AC Charger Type 2 Euro</b></td>
<td align="" style="padding: 5px">S</td>
</tr>
<tr style="background-color: #f9f9f9;">
<td align="" style="padding: 5px"><b>DC Combo (CCS)</b></td>
<td align="" style="padding: 5px">S</td>
<td align="" style="padding: 5px"><b>Battery Type LFP</b></td>
<td align="" style="padding: 5px">LFP (Lithium Iron Phosphate)</td>
</tr>
<tr style="background-color: #f9f9f9;">
<td align="" style="padding: 5px"><b>Battery Capacity</b></td>
<td align="" style="padding: 5px">42.3 KWH</td>
<td align="" style="padding: 5px"><b>Battery Pre-Heating</b></td>
<td align="" style="padding: 5px">S</td>
</tr>
<tr style="background-color: #f9f9f9;">
<td align="" style="padding: 5px"><b>Battery Cooling Scheme</b></td>
<td align="" style="padding: 5px">S</td>
<td align="" style="padding: 5px"><b>Vehicle Warranty</b></td>
<td align="" style="padding: 5px">4 Years or 150,000 KM</td>
</tr>
<tr style="background-color: #f9f9f9;">
<td align="" style="padding: 5px"><b>Battery Warranty</b></td>
<td align="" colspan="3" style="padding: 5px">8 Years or 200,000 KM</td>
</tr>
</table>
</div>
</div>
<div class="card">
<div class="card-header" id="faqhead3">
<a href="#" id="perCard1" class="btn btn-header-link collapsed" data-toggle="collapse" data-target="#faq3"
aria-expanded="true" aria-controls="faq3"><b>PERFORMANCE</b></a>
</div>
<div id="faq3" class="collapse" aria-labelledby="faqhead3" data-parent="#faq">
<table class="" border="1" style="margin-left: 3%">
<tr style="background-color: #f9f9f9;">
<td align="" style="padding: 5px"><b>Max Speed</b></td>
<td align="" style="padding: 5px">140 KM/H</td>
<td align="" style="padding: 5px"><b>CLTC Comprehensive Range</b></td>
<td align="" style="padding: 5px">430 KM</td>
</tr>
<tr style="background-color: #f9f9f9;">
<td align="" style="padding: 5px"><b>Motor Power</b></td>
<td align="" style="padding: 5px">70KW</td>
<td align="" style="padding: 5px"><b>Motor Type</b></td>
<td align="" style="padding: 5px">Permanent Magnet Synchronous Motor</td>
</tr>
<tr style="background-color: #f9f9f9;">
<td align="" style="padding: 5px"><b>Motor Layout</b></td>
<td align="" style="padding: 5px">Front</td>
<td align="" style="padding: 5px"><b>Number of Motors</b></td>
<td align="" style="padding: 5px">1</td>
</tr>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="row" id="rowFlagship" style="display: none">
<div class="col-md-12">
<div id="main">
<div class="container">
<div class="accordion" id="faq">
<div class="card">
<div class="card-header" id="faqhead4">
<a href="#" id="dimCard2" class="btn btn-header-link" data-toggle="collapse" data-target="#faq4"
aria-expanded="true" aria-controls="faq4"><b>DIMENSIONS</b></a>
</div>
<div id="faq4" class="collapse show" aria-labelledby="faqhead4" data-parent="#faq">
<table class="" border="1" style="margin-left: 3%; margin-right: 2%;">
<tr>
<td colspan="6" style="padding: 5px">
<img id="carImg" src="images/flagship430.jpg" class="image" style="height: 390px; width: 100%;">
</td>
</tr>
<tr style="background-color: #f9f9f9;">
<td align="" style="padding: 5px;"><b>Length (mm)</b></td>
<td align="" style="padding: 5px;">4030</td>
<td align="" style="padding: 5px;"><b>Width (mm)</b></td>
<td align="" style="padding: 5px;">1810</td>
</tr>
<tr style="background-color: #f9f9f9;">
<td align="" style="padding: 5px;"><b>Height (mm)</b></td>
<td align="" style="padding: 5px;">1570</td>
<td align="" style="padding: 5px;"><b>Wheelbase (mm)</b></td>
<td align="" style="padding: 5px;">2660</td>
</tr>
<tr style="background-color: #f9f9f9;">
<td align="" style="padding: 5px;"><b>Body Structure</b></td>
<td align="" colspan="3" style="padding: 5px;">5 Door - 5 Seats (HB)</td>
</tr>
</table>
</div>
</div>
<div class="card">
<div class="card-header" id="faqhead5">
<a href="#" id="elecCard2" class="btn btn-header-link collapsed" data-toggle="collapse" data-target="#faq5"
aria-expanded="true" aria-controls="faq5"><b>ELECTRICAL INFORMATION</b></a>
</div>
<div id="faq5" class="collapse" aria-labelledby="faqhead5" data-parent="#faq">
<table class="" border="1" style="margin-left: 3%;">
<tr style="background-color: #f9f9f9;">
<td align="" style="padding: 5px;"><b>AC Charger Power 6.6 KW</b></td>
<td align="" style="padding: 5px;">S</td>
<td align="" style="padding: 5px;"><b>DC Charging Time</b></td>
<td align="" style="padding: 5px;">30 Minutes</td>
</tr>
<tr style="background-color: #f9f9f9;">
<td align="" style="padding: 5px;"><b>Fast Charging Percentage</b></td>
<td align="" style="padding: 5px;">80%</td>
<td align="" style="padding: 5px;"><b>AC Charger Type 2 Euro</b></td>
<td align="" style="padding: 5px;">S</td>
</tr>
<tr style="background-color: #f9f9f9;">
<td align="" style="padding: 5px;"><b>DC Combo (CCS)</b></td>
<td align="" style="padding: 5px;">S</td>
<td align="" style="padding: 5px;"><b>Battery Type LFP</b></td>
<td align="" style="padding: 5px;">LFP (Lithium Iron Phosphate)</td>
</tr>
<tr style="background-color: #f9f9f9;">
<td align="" style="padding: 5px;"><b>Battery Capacity</b></td>
<td align="" style="padding: 5px;">42.3 KWH</td>
<td align="" style="padding: 5px;"><b>Battery Pre-Heating</b></td>
<td align="" style="padding: 5px;">S</td>
</tr>
<tr style="background-color: #f9f9f9;">
<td align="" style="padding: 5px;"><b>Battery Cooling Scheme</b></td>
<td align="" style="padding: 5px;">S</td>
<td align="" style="padding: 5px;"><b>Vehicle Warranty</b></td>
<td align="" style="padding: 5px;">4 Years or 150,000 KM</td>
</tr>
<tr style="background-color: #f9f9f9;">
<td align="" style="padding: 5px;"><b>Battery Warranty</b></td>
<td align="" colspan="3" style="padding: 5px;">8 Years or 200,000 KM</td>
</tr>
</table>
</div>
</div>
<div class="card">
<div class="card-header" id="faqhead6">
<a href="#" id="perCard2" class="btn btn-header-link collapsed" data-toggle="collapse" data-target="#faq6"
aria-expanded="true" aria-controls="faq6"><b>PERFORMANCE</b></a>
</div>
<div id="faq6" class="collapse" aria-labelledby="faqhead6" data-parent="#faq">
<table class="" border="1" style="margin-left: 3%">
<tr style="background-color: #f9f9f9;">
<td align="" style="padding: 5px;"><b>Max Speed</b></td>
<td align="" style="padding: 5px;">140 KM/H</td>
<td align="" style="padding: 5px;"><b>CLTC Comprehensive Range</b></td>
<td align="" style="padding: 5px;">430 KM</td>
</tr>
<tr style="background-color: #f9f9f9;">
<td align="" style="padding: 5px;"><b>Motor Power</b></td>
<td align="" style="padding: 5px;">70KW</td>
<td align="" style="padding: 5px;"><b>Motor Type</b></td>
<td align="" style="padding: 5px;">Permanent Magnet Synchronous Motor</td>
</tr>
<tr style="background-color: #f9f9f9;">
<td align="" style="padding: 5px;"><b>Motor Layout</b></td>
<td align="" style="padding: 5px;">Front</td>
<td align="" style="padding: 5px;"><b>Number of Motors</b></td>
<td align="" style="padding: 5px;">1</td>
</tr>
</table>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-6">
<form action="addCustomerBookingDone.php" method="post" enctype="multipart/form-data">
<div class="card2 card border-0 px-4 py-5">
<div class="row px-3 mb-4">
<div class="custom-control custom-control-inline">
<input id="lux" type="radio" name="variant" value="LUX 430" class="custom-control-input" onchange="showSpecs(this.id)" checked>
<label for="lux" class="custom-control-label text-sm">LUX 430</label>
</div>
<div class="custom-control custom-control-inline">
<input id="flagship" type="radio" name="variant" value="FLAGSHIP 430" class="custom-control-input" onchange="showSpecs(this.id)">
<label for="flagship" class="custom-control-label text-sm">FLAGSHIP 430</label>
</div>
</div>
<script type="text/javascript">
function showSpecs(id)
{
if(id == 'lux')
{
document.getElementById('rowLUX').style.display = "block";
document.getElementById('rowFlagship').style.display = "none";
}
else if(id == 'flagship')
{
document.getElementById('rowLUX').style.display = "none";
document.getElementById('rowFlagship').style.display = "block";
}
else
{
document.getElementById('rowLUX').style.display = "none";
document.getElementById('rowFlagship').style.display = "none";
}
}
function showColors(id)
{
if(id == 'ocean')
{
document.getElementById('dimCard1').style.backgroundColor = "#4e8bc0";
document.getElementById('faq1').style.backgroundColor = "#4e8bc0";
document.getElementById('dimCard2').style.backgroundColor = "#4e8bc0";
document.getElementById('faq4').style.backgroundColor = "#4e8bc0";
document.getElementById('elecCard1').style.backgroundColor = "#4e8bc0";
document.getElementById('faq2').style.backgroundColor = "#4e8bc0";
document.getElementById('elecCard2').style.backgroundColor = "#4e8bc0";
document.getElementById('faq5').style.backgroundColor = "#4e8bc0";
document.getElementById('perCard1').style.backgroundColor = "#4e8bc0";
document.getElementById('faq3').style.backgroundColor = "#4e8bc0";
document.getElementById('perCard2').style.backgroundColor = "#4e8bc0";
document.getElementById('faq6').style.backgroundColor = "#4e8bc0";
}
else if(id == 'vanilla')
{
document.getElementById('dimCard1').style.backgroundColor = "#d4d4d4";
document.getElementById('faq1').style.backgroundColor = "#d4d4d4";
document.getElementById('dimCard2').style.backgroundColor = "#d4d4d4";
document.getElementById('faq4').style.backgroundColor = "#d4d4d4";
document.getElementById('elecCard1').style.backgroundColor = "#d4d4d4";
document.getElementById('faq2').style.backgroundColor = "#d4d4d4";
document.getElementById('elecCard2').style.backgroundColor = "#d4d4d4";
document.getElementById('faq5').style.backgroundColor = "#d4d4d4";
document.getElementById('perCard1').style.backgroundColor = "#d4d4d4";
document.getElementById('faq3').style.backgroundColor = "#d4d4d4";
document.getElementById('perCard2').style.backgroundColor = "#d4d4d4";
document.getElementById('faq6').style.backgroundColor = "#d4d4d4";
}
else if(id == 'lavendar')
{
document.getElementById('dimCard1').style.backgroundColor = "#9c81c5";
document.getElementById('faq1').style.backgroundColor = "#9c81c5";
document.getElementById('dimCard2').style.backgroundColor = "#9c81c5";
document.getElementById('faq4').style.backgroundColor = "#9c81c5";
document.getElementById('elecCard1').style.backgroundColor = "#9c81c5";
document.getElementById('faq2').style.backgroundColor = "#9c81c5";
document.getElementById('elecCard2').style.backgroundColor = "#9c81c5";
document.getElementById('faq5').style.backgroundColor = "#9c81c5";
document.getElementById('perCard1').style.backgroundColor = "#9c81c5";
document.getElementById('faq3').style.backgroundColor = "#9c81c5";
document.getElementById('perCard2').style.backgroundColor = "#9c81c5";
document.getElementById('faq6').style.backgroundColor = "#9c81c5";
}
else if(id == 'electric')
{
document.getElementById('dimCard1').style.backgroundColor = "#bfd536";
document.getElementById('faq1').style.backgroundColor = "#bfd536";
document.getElementById('dimCard2').style.backgroundColor = "#bfd536";
document.getElementById('faq4').style.backgroundColor = "#bfd536";
document.getElementById('elecCard1').style.backgroundColor = "#bfd536";
document.getElementById('faq2').style.backgroundColor = "#bfd536";
document.getElementById('elecCard2').style.backgroundColor = "#bfd536";
document.getElementById('faq5').style.backgroundColor = "#bfd536";
document.getElementById('perCard1').style.backgroundColor = "#bfd536";
document.getElementById('faq3').style.backgroundColor = "#bfd536";
document.getElementById('perCard2').style.backgroundColor = "#bfd536";
document.getElementById('faq6').style.backgroundColor = "#bfd536";
}
else
{
document.getElementById('dimCard1').style.backgroundColor = "silver";
document.getElementById('faq1').style.backgroundColor = "silver";
document.getElementById('dimCard2').style.backgroundColor = "silver";
document.getElementById('faq4').style.backgroundColor = "silver";
document.getElementById('elecCard1').style.backgroundColor = "silver";
document.getElementById('faq2').style.backgroundColor = "silver";
document.getElementById('elecCard2').style.backgroundColor = "silver";
document.getElementById('faq5').style.backgroundColor = "silver";
document.getElementById('perCard1').style.backgroundColor = "silver";
document.getElementById('faq3').style.backgroundColor = "silver";
document.getElementById('perCard2').style.backgroundColor = "silver";
document.getElementById('faq6').style.backgroundColor = "silver";
}
}
</script>
<div class="row px-3 mb-4">
<label class="mb-1"><h6 class="mb-0 text-sm">Color Selection</h6></label>
</div>
<div class="row px-3 mb-4">
<div class="custom-control custom-control-inline">
<input id="ocean" type="radio" name="color" value="Ocean Eyes" class="custom-control-input" onchange="showColors(this.id)">
<label for="ocean" class="custom-control-label text-sm">Ocean Eyes</label>
</div>
<div class="custom-control custom-control-inline">
<input id="vanilla" type="radio" name="color" value="Vanilla Frost" class="custom-control-input" onchange="showColors(this.id)">
<label for="vanilla" class="custom-control-label text-sm">Vanilla Frost</label>
</div>
<div class="custom-control custom-control-inline">
<input id="lavendar" type="radio" name="color" value="Lavender Haze" class="custom-control-input" onchange="showColors(this.id)">
<label for="lavendar" class="custom-control-label text-sm">Lavender Haze</label>
</div>
<div class="custom-control custom-control-inline">
<input id="electric" type="radio" name="color" value="Electric Lemon" class="custom-control-input" onchange="showColors(this.id)">
<label for="electric" class="custom-control-label text-sm">Electric Lemon</label>
</div>
<div class="custom-control custom-control-inline">
<input id="silver" type="radio" name="color" value="Silver Forest" class="custom-control-input" onchange="showColors(this.id)">
<label for="silver" class="custom-control-label text-sm">Silver Forest</label>
</div>
</div>
<div class="row">
<div class="col-lg-6">
<label class="mb-1"><h6 class="mb-0 text-sm">Fullname</h6></label>
<input class="mb-4" type="text" name="fullname" placeholder="Enter Fullname" required>
</div>
<div class="col-lg-6">
<label class="mb-1"><h6 class="mb-0 text-sm">Father/Husband</h6></label>
<input class="mb-4" type="text" name="guardian" placeholder="Enter guardian name" required>
</div>
</div>
<div class="row">
<div class="col-lg-6">
<label class="mb-1"><h6 class="mb-0 text-sm">Email</h6></label>
<input class="mb-4" type="text" name="email" placeholder="Enter Email" required>
</div>
<div class="col-lg-6">
<label class="mb-1"><h6 class="mb-0 text-sm">Password</h6></label>
<input class="mb-4" type="password" name="password" placeholder="Enter Password" required>
</div>
</div>
<div class="row">
<div class="col-lg-6">
<label class="mb-1"><h6 class="mb-0 text-sm">DOB</h6></label>
<input class="mb-4" type="date" name="dob" placeholder="Enter Date of Birth" required>
</div>
<div class="col-lg-6">
<label class="mb-1"><h6 class="mb-0 text-sm">Phone#</h6></label>
<input class="mb-4" type="text" name="contactNo" placeholder="Enter Contact No" required>
</div>
</div>
<div class="row px-3">
<label class="mb-1"><h6 class="mb-0 text-sm">Address</h6></label>
<textarea class="form-control" rows="3" name="address" required></textarea>
</div>
<br/>
<div class="row">
<div class="col-lg-6">
<label class="mb-1"><h6 class="mb-0 text-sm">Country</h6></label>
<select class="form-control" name="country" required>
<option>--Select--</option>
<option selected>Pakistan</option>
</select>
</div>
<div class="col-lg-6">
<label class="mb-1"><h6 class="mb-0 text-sm">City</h6></label>
<input list="cities" class="form-control" name="city" required>
<datalist id="cities">
<option>--Select--</option>
<option value="Islamabad">Islamabad</option>
<option value="" disabled>Punjab Cities</option>
<option value="Ahmed Nager Chatha">Ahmed Nager Chatha</option>
<option value="Ahmadpur East">Ahmadpur East</option>
<option value="Ali Khan Abad">Ali Khan Abad</option>
<option value="Alipur">Alipur</option>
<option value="Arifwala">Arifwala</option>
<option value="Attock">Attock</option>
<option value="Bhera">Bhera</option>
<option value="Bhalwal">Bhalwal</option>
<option value="Bahawalnagar">Bahawalnagar</option>
<option value="Bahawalpur">Bahawalpur</option>
<option value="Bhakkar">Bhakkar</option>
<option value="Burewala">Burewala</option>
<option value="Chillianwala">Chillianwala</option>
<option value="Chakwal">Chakwal</option>
<option value="Chichawatni">Chichawatni</option>
<option value="Chiniot">Chiniot</option>
<option value="Chishtian">Chishtian</option>
<option value="Daska">Daska</option>
<option value="Darya Khan">Darya Khan</option>
<option value="Dera Ghazi Khan">Dera Ghazi Khan</option>
<option value="Dhaular">Dhaular</option>
<option value="Dina">Dina</option>
<option value="Dinga">Dinga</option>
<option value="Dipalpur">Dipalpur</option>
<option value="Faisalabad">Faisalabad</option>
<option value="Ferozewala">Ferozewala</option>
<option value="Fateh Jhang">Fateh Jang</option>
<option value="Ghakhar Mandi">Ghakhar Mandi</option>
<option value="Gojra">Gojra</option>
<option value="Gujranwala">Gujranwala</option>
<option value="Gujrat">Gujrat</option>
<option value="Gujar Khan">Gujar Khan</option>
<option value="Hafizabad">Hafizabad</option>
<option value="Haroonabad">Haroonabad</option>
<option value="Hasilpur">Hasilpur</option>
<option value="Haveli Lakha">Haveli Lakha</option>
<option value="Jatoi">Jatoi</option>
<option value="Jalalpur">Jalalpur</option>
<option value="Jattan">Jattan</option>
<option value="Jampur">Jampur</option>
<option value="Jaranwala">Jaranwala</option>
<option value="Jhang">Jhang</option>
<option value="Jhelum">Jhelum</option>
<option value="Kalabagh">Kalabagh</option>
<option value="Karor Lal Esan">Karor Lal Esan</option>
<option value="Kasur">Kasur</option>
<option value="Kamalia">Kamalia</option>
<option value="Kamoke">Kamoke</option>
<option value="Khanewal">Khanewal</option>
<option value="Khanpur">Khanpur</option>
<option value="Kharian">Kharian</option>
<option value="Khushab">Khushab</option>
<option value="Kot Addu">Kot Addu</option>
<option value="Jauharabad">Jauharabad</option>
<option value="Lahore">Lahore</option>
<option value="Lalamusa">Lalamusa</option>
<option value="Layyah">Layyah</option>
<option value="Liaquat Pur">Liaquat Pur</option>
<option value="Lodhran">Lodhran</option>
<option value="Malakwal">Malakwal</option>
<option value="Mamoori">Mamoori</option>
<option value="Mailsi">Mailsi</option>
<option value="Mandi Bahauddin">Mandi Bahauddin</option>
<option value="Mian Channu">Mian Channu</option>
<option value="Mianwali">Mianwali</option>
<option value="Multan">Multan</option>
<option value="Murree">Murree</option>
<option value="Muridke">Muridke</option>
<option value="Mianwali Bangla">Mianwali Bangla</option>
<option value="Muzaffargarh">Muzaffargarh</option>
<option value="Narowal">Narowal</option>
<option value="Nankana Sahib">Nankana Sahib</option>
<option value="Okara">Okara</option>
<option value="Renala Khurd">Renala Khurd</option>
<option value="Pakpattan">Pakpattan</option>
<option value="Pattoki">Pattoki</option>
<option value="Pir Mahal">Pir Mahal</option>
<option value="Qaimpur">Qaimpur</option>
<option value="Qila Didar Singh">Qila Didar Singh</option>
<option value="Rabwah">Rabwah</option>
<option value="Raiwind">Raiwind</option>
<option value="Rajanpur">Rajanpur</option>
<option value="Rahim Yar Khan">Rahim Yar Khan</option>
<option value="Rawalpindi">Rawalpindi</option>
<option value="Sadiqabad">Sadiqabad</option>
<option value="Safdarabad">Safdarabad</option>
<option value="Sahiwal">Sahiwal</option>
<option value="Sangla Hill">Sangla Hill</option>
<option value="Sarai Alamgir">Sarai Alamgir</option>
<option value="Sargodha">Sargodha</option>
<option value="Shakargarh">Shakargarh</option>
<option value="Sheikhupura">Sheikhupura</option>
<option value="Sialkot">Sialkot</option>
<option value="Sohawa">Sohawa</option>
<option value="Soianwala">Soianwala</option>
<option value="Siranwali">Siranwali</option>
<option value="Talagang">Talagang</option>
<option value="Taxila">Taxila</option>
<option value="Toba Tek Singh">Toba Tek Singh</option>
<option value="Vehari">Vehari</option>
<option value="Wah Cantonment">Wah Cantonment</option>
<option value="Wazirabad">Wazirabad</option>
<option value="" disabled>Sindh Cities</option>
<option value="Badin">Badin</option>
<option value="Bhirkan">Bhirkan</option>
<option value="Rajo Khanani">Rajo Khanani</option>
<option value="Chak">Chak</option>
<option value="Dadu">Dadu</option>
<option value="Digri">Digri</option>
<option value="Diplo">Diplo</option>
<option value="Dokri">Dokri</option>
<option value="Ghotki">Ghotki</option>
<option value="Haala">Haala</option>
<option value="Hyderabad">Hyderabad</option>
<option value="Islamkot">Islamkot</option>
<option value="Jacobabad">Jacobabad</option>
<option value="Jamshoro">Jamshoro</option>
<option value="Jungshahi">Jungshahi</option>
<option value="Kandhkot">Kandhkot</option>
<option value="Kandiaro">Kandiaro</option>
<option value="Karachi">Karachi</option>
<option value="Kashmore">Kashmore</option>
<option value="Keti Bandar">Keti Bandar</option>
<option value="Khairpur">Khairpur</option>
<option value="Kotri">Kotri</option>
<option value="Larkana">Larkana</option>
<option value="Matiari">Matiari</option>
<option value="Mehar">Mehar</option>
<option value="Mirpur Khas">Mirpur Khas</option>
<option value="Mithani">Mithani</option>
<option value="Mithi">Mithi</option>
<option value="Mehrabpur">Mehrabpur</option>
<option value="Moro">Moro</option>
<option value="Nagarparkar">Nagarparkar</option>
<option value="Naudero">Naudero</option>
<option value="Naushahro Feroze">Naushahro Feroze</option>
<option value="Naushara">Naushara</option>
<option value="Nawabshah">Nawabshah</option>
<option value="Nazimabad">Nazimabad</option>
<option value="Qambar">Qambar</option>
<option value="Qasimabad">Qasimabad</option>
<option value="Ranipur">Ranipur</option>
<option value="Ratodero">Ratodero</option>
<option value="Rohri">Rohri</option>
<option value="Sakrand">Sakrand</option>
<option value="Sanghar">Sanghar</option>
<option value="Shahbandar">Shahbandar</option>
<option value="Shahdadkot">Shahdadkot</option>
<option value="Shahdadpur">Shahdadpur</option>
<option value="Shahpur Chakar">Shahpur Chakar</option>
<option value="Shikarpaur">Shikarpaur</option>
<option value="Sukkur">Sukkur</option>
<option value="Tangwani">Tangwani</option>
<option value="Tando Adam Khan">Tando Adam Khan</option>
<option value="Tando Allahyar">Tando Allahyar</option>
<option value="Tando Muhammad Khan">Tando Muhammad Khan</option>
<option value="Thatta">Thatta</option>
<option value="Umerkot">Umerkot</option>
<option value="Warah">Warah</option>
<option value="" disabled>Khyber Cities</option>
<option value="Abbottabad">Abbottabad</option>
<option value="Adezai">Adezai</option>
<option value="Alpuri">Alpuri</option>
<option value="Akora Khattak">Akora Khattak</option>
<option value="Ayubia">Ayubia</option>
<option value="Banda Daud Shah">Banda Daud Shah</option>
<option value="Bannu">Bannu</option>
<option value="Batkhela">Batkhela</option>
<option value="Battagram">Battagram</option>
<option value="Birote">Birote</option>
<option value="Chakdara">Chakdara</option>
<option value="Charsadda">Charsadda</option>
<option value="Chitral">Chitral</option>
<option value="Daggar">Daggar</option>
<option value="Dargai">Dargai</option>
<option value="Darya Khan">Darya Khan</option>
<option value="Dera Ismail Khan">Dera Ismail Khan</option>
<option value="Doaba">Doaba</option>
<option value="Dir">Dir</option>
<option value="Drosh">Drosh</option>
<option value="Hangu">Hangu</option>
<option value="Haripur">Haripur</option>
<option value="Karak">Karak</option>
<option value="Kohat">Kohat</option>
<option value="Kulachi">Kulachi</option>
<option value="Lakki Marwat">Lakki Marwat</option>
<option value="Latamber">Latamber</option>
<option value="Madyan">Madyan</option>
<option value="Mansehra">Mansehra</option>
<option value="Mardan">Mardan</option>
<option value="Mastuj">Mastuj</option>
<option value="Mingora">Mingora</option>
<option value="Nowshera">Nowshera</option>
<option value="Paharpur">Paharpur</option>
<option value="Pabbi">Pabbi</option>
<option value="Peshawar">Peshawar</option>
<option value="Saidu Sharif">Saidu Sharif</option>
<option value="Shorkot">Shorkot</option>
<option value="Shewa Adda">Shewa Adda</option>
<option value="Swabi">Swabi</option>
<option value="Swat">Swat</option>
<option value="Tangi">Tangi</option>
<option value="Tank">Tank</option>
<option value="Thall">Thall</option>
<option value="Timergara">Timergara</option>
<option value="Tordher">Tordher</option>
<option value="" disabled>Balochistan Cities</option>
<option value="Awaran">Awaran</option>
<option value="Barkhan">Barkhan</option>
<option value="Chagai">Chagai</option>
<option value="Dera Bugti">Dera Bugti</option>
<option value="Gwadar">Gwadar</option>
<option value="Harnai">Harnai</option>
<option value="Jafarabad">Jafarabad</option>
<option value="Jhal Magsi">Jhal Magsi</option>
<option value="Kacchi">Kacchi</option>
<option value="Kalat">Kalat</option>
<option value="Kech">Kech</option>
<option value="Kharan">Kharan</option>
<option value="Khuzdar">Khuzdar</option>
<option value="Killa Abdullah">Killa Abdullah</option>
<option value="Killa Saifullah">Killa Saifullah</option>
<option value="Kohlu">Kohlu</option>
<option value="Lasbela">Lasbela</option>
<option value="Lehri">Lehri</option>
<option value="Loralai">Loralai</option>
<option value="Mastung">Mastung</option>
<option value="Musakhel">Musakhel</option>
<option value="Nasirabad">Nasirabad</option>
<option value="Nushki">Nushki</option>
<option value="Panjgur">Panjgur</option>
<option value="Pishin Valley">Pishin Valley</option>
<option value="Quetta">Quetta</option>
<option value="Sherani">Sherani</option>
<option value="Sibi">Sibi</option>
<option value="Sohbatpur">Sohbatpur</option>
<option value="Washuk">Washuk</option>
<option value="Zhob">Zhob</option>
<option value="Ziarat">Ziarat</option>
</datalist>
</div>
</div>
<br/>
<div class="row">
<div class="col-lg-4">
<label class="mb-1"><h6 class="mb-0 text-sm">CNIC/NTN</h6></label>
<input class="mb-4" type="text" name="cnic" placeholder="Enter CNIC/NTN" required>
</div>
<div class="col-lg-4">
<label class="mb-1"><h6 class="mb-0 text-sm">CNIC Front</h6></label>
<input class="mb-4" type="file" name="image1ToUpload" placeholder="" required>
</div>
<div class="col-lg-4">
<label class="mb-1"><h6 class="mb-0 text-sm">CNIC Back</h6></label>
<input class="mb-4" type="file" name="image2ToUpload" placeholder="" required>
</div>
</div>
<br/>
<div class="row mb-3 px-3">
<button type="submit" class="button-primary hover-lh w-button text-center">Submit</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
<div class="wrapper">
<a href="https://api.whatsapp.com/send?phone=+923114995162&text=Hello" class="float" target="_blank">
<i class="fa fa-whatsapp" style="font-size: x-large;"></i>
</a>
<!-- <a class="social" href="#"> <i class="fa fa-phone"></i></a> -->
<!-- <a class="close-button" href="#"> <i class="fa fa-close"></i></a> -->
</div>
</section>
<footer class="footer">
<div class="footer-top">
<div class="footer-multi-link-wrap">
<div class="footer-multi-link">
<div class="footer-text-wrap">
<div class="h5">CHAWLA GREEN MOTORS</div>
<div><p>3-KM Rohi Nala Road Kahna, Lahore, Pakistan<br/>
Phone: +92 311 4995162<br/>
Email: info@chawlagreenmotors.com</p></div>
</div>
<div class="footer-socials-links-wrap">
<a href="https://www.facebook.com/chawlagreenmotorsofficial/" target="_blank" class="social-media-wrap w-inline-block">
<img loading="lazy" src="img/face.jpg" alt="" class="social-media-icon">
</a>
<a href="https://www.instagram.com/chawlagreenmotors/" target="_blank" class="social-media-wrap w-inline-block">
<img loading="lazy" src="img/instagram.jpg" alt="" class="social-media-icon">
</a>
<a href="https://www.linkedin.com/company/chawla-green-motors/about/?viewAsMember=true" target="_blank" class="social-media-wrap w-inline-block">
<img loading="lazy" src="img/linkedin.jpg" alt="" class="social-media-icon">
</a>
<a href="https://www.youtube.com/@ChawlaGreenMotors" target="_blank" class="social-media-wrap w-inline-block">
<img loading="lazy" src="img/youTube.jpg" alt="" class="social-media-icon">
</a>
</div>
</div>
</div>
</div>
<div class="footer-bottom">
<div class="p-16 bold w-embed w-script"><font color="white">© <script>new Date().getFullYear()>2023&&document.write(new Date().getFullYear());</script>CGM</font>
</div>
<div class="footer-links-wrap">
<a href="/en/privacy-policy" class="footer-link"></a>
</div>
</div>
<div class="footer-legal-text">
<p class="p-12"></div></footer>
<script src="js/jquery-3.5.1.min.dc5e7f18c8.js" type="text/javascript" crossorigin="anonymous"></script>
<script src="js/webflow.47f6ebd2463ade7f4b066282b5b2bc43.js" type="text/javascript">
</script>
<script src="js/form-124.js" type="text/javascript" crossorigin="anonymous">
</script>
<script src="js/floating.js"></script>
</body>
</html>