-
Notifications
You must be signed in to change notification settings - Fork 0
/
about.php
198 lines (197 loc) · 8.5 KB
/
about.php
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Club MS8</title>
<link rel="icon" href="assets/img/favicon.png" sizes="16x16">
<meta name="author" content="Samartha">
<meta name="description" content="ClubMS8 is a group of auto-mototive enthusiast in the town of sagar. To be specific, we are the group of proud MS800 owners.">
<!-- fontawesome -->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
<!-- Bootstrap CSS -->
<link rel="stylesheet" href="assets/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="assets/css/styles.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<!-- aos -->
<link rel="stylesheet" href="https://unpkg.com/aos@next/dist/aos.css" />
<script src="https://unpkg.com/aos@next/dist/aos.js"></script>
</head>
<body>
<?php include 'header.php'; ?>
<div class="content">
<section id="hero" class="full-page-section bg-image" data-aos="fade">
<div class="container hero-con">
<div class="row" data-aos="fade-right">
<div class="col-md-12">
<h1 class="big-text">About</h1>
<h4 class="tag">The MS800 Hub</h4>
</div>
</div>
<a href="#about-us" id="swipe_down">
<div class="arrow">
<div class="chevron"></div>
<div class="chevron"></div>
<div class="chevron"></div>
</div>
</a>
</div>
</section>
<br>
<section id="about-us" data-aos="fade">
<div class="container">
<div class="row">
<div class="col-md-4" >
<div class="cardy cell-left" data-aos="fade-right">
<h3 class="heading">ABOUT US</h3>
<img src="assets/img/ms8i1.png" alt="" width="100%">
</div>
</div>
<div class="col-md-8">
<div class="cell-right cardy" data-aos="fade-left">
<p>
MS800 Hub is a group of auto-mototive enthusiast in the town of sagar.
To be specific, we are the group of proud MS800 owners. MS800 is a legendary car manufactured and sold in India.
2.6M units have been sold across India during the time period of 20 years since 1984.
It has been the family car of middle class indians as well as rich.
As Maruti Suzuki India.ltd has stopped the production of this species, it is on the edge of extinction.
So as a tribute, to set a trend and to carry on our passion for this Legendary hatch we have come up with the
<b>MS800 Hub</b>
</p>
</div>
</div>
</div>
</div>
</section>
<br>
<section data-aos="fade">
<div class="container-fluid bg-image">
<br>
<div class="row justify-content-center">
<div class="col-md-8" data-aos="fade-up">
<h3 class="heading"> " We have an emotional connection with the vehicle, but at some point of time, you have to take hard decisions, "</h3>
</div>
</div>
<div class="row justify-content-center" >
<div class="col-md-8 text-right" data-aos="fade-up">
<h5> - C.V Raman</h5>
<p class="text-right">Executive director of engineering <br> Maruti Suzuki</p>
</div>
</div>
<br>
</div>
</section>
<br>
<section data-aos="fade">
<div class="container">
<div class="row" >
<div class="col-md-8">
<div class="cardy cell-left" data-aos="fade-right">
<h2 class="heading">Mission</h2>
<p>
We are 20yo car enthusiast. We're interested in cars since
childhood. There are many automobile clubs like JAWA Motorcycle
club, RX club, JEEP club... So being a car enthusiast we wanted
to start something like this but how? Maruti 800 is a very
familiar car to every indian and we had 2 of 'em in our garage. As it is on the edge of extiction, we started this club to create a trend
in the community and preserve the legend for future generation
</p>
</div>
</div>
<div class="col-md-4">
<div class="cardy cell-right inverse" data-aos="fade-right">
<h2 class="heading">Get Updates.</h2>
<h2 class="heading">Follow Us</h2>
<ul class="social-list">
<li><a href="https://www.instagram.com/clubms8/" target="_blank"><i class="fa fa-instagram"></i></a></li>
<li><a href="https://youtube.com/channel/UC5f8s1EALJIYR1ag_GZtEKQ" target="_blank"><i class="fa fa-youtube"></i></a></li>
<li><a href="mailto:[email protected]" target="_blank"><i class="fa fa-envelope"></i></a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="container">
<div class="row" >
<div class="col-md-8">
<div class="cardy cell-left" data-aos="fade-right">
<h2 class="heading">Contact Us</h2>
<form class="form-dark-con" action="assets/php/send_mail.php" method="post">
<div class="form-row">
<div class="col-1 form-group"><i class="fa fa-user"></i></div>
<div class="col-11 form-group">
<label>Name : </label>
<input class="form-dark" type="text" name="name" value="" required>
</div>
</div>
<div class="form-row">
<div class="col-1 form-group"><i class="fa fa-at"></i></div>
<div class="col-11 form-group">
<label>Mail ID : </label>
<input class="form-dark" type="email" name="email" value="" required>
</div>
</div>
<div class="form-row">
<div class="col-1 form-group"><i class="fa fa-envelope"></i></div>
<div class="col-11 form-group">
<label>Subject : </label>
<input class="form-dark" type="text" name="subject" value="" required>
</div>
</div>
<div class="form-row">
<div class="col-1 form-group"></div>
<div class="col-11 form-group">
<label>Ask us : </label>
<textarea class="form-dark" type="text" name="body" rows="5" value="" required></textarea>
</div>
</div>
<div class="form-row">
<div class="col-12 text-center form-group">
<button type="submit" class="btn btn-primary" name="send_mail">Send mail</button>
</div>
</div>
</form>
</div>
</div>
</div>
</div>
</section>
</div>
<?php include 'footer.php'; ?>
<script type="text/javascript">
document.getElementById('about').classList.add('active2');
document.getElementById('about_us').classList.add('active2');
</script>
<script>
AOS.init({
once: true,
duration: 1000,
});
</script>
<script>
$(document).ready(function(){
$("#swipe_down").on('click', function(event) {
if (this.hash !== "") {
event.preventDefault();
var hash = this.hash;
$('html, body').animate({
scrollTop: $(hash).offset().top
}, 800, function(){
window.location.hash = hash;
});
}
});
});
</script>
<script type="text/javascript">
$('.form-dark').on('focusin', function() {
$(this).parent().find('label').addClass('active-label');});
$('.form-dark').on('focusout', function() {
if (!this.value) {
$(this).parent().find('label').removeClass('active-label');}});
</script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js" integrity="sha384-wfSDF2E50Y2D1uUdj0O3uMBJnjuUD4Ih7YwaYd1iqfktj0Uod8GCExl3Og8ifwB6" crossorigin="anonymous"></script>
</body>
</html>