-
Notifications
You must be signed in to change notification settings - Fork 1
/
index.html
416 lines (353 loc) · 15.7 KB
/
index.html
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
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
364
365
366
367
368
369
370
371
372
373
374
375
376
377
378
379
380
381
382
383
384
385
386
387
388
389
390
391
392
393
394
395
396
397
398
399
400
401
402
403
404
405
406
407
408
409
410
411
412
413
414
415
416
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Aditya Web</title>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css" integrity="sha512-SnH5WK+bZxgPHs44uWIX+LLJAJ9/2PkPKZ5QiAj6Ta86w+fsb2TkcmfRyVX3pBnMFcV7oQPJkl9QevSCWr3W6A==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<link rel="stylesheet" href="Style.css">
<link rel="stylesheet" href="responsive.css">
</head>
<body>
<script src="javascript.js" >
</script>
<header>
<nav class="navbar navbar-expand-sm bg-body-tertiary fixed-top bt-2">
<div class="container">
<a class="navbar-brand" href="#home"><i class="fa-regular fa-snowflake"></i> Template</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNavDropdown" aria-controls="navbarNavDropdown" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse justify-content-end m-2" id="navbarNavDropdown">
<ul class="navbar-nav nav">
<li class="nav-item">
<a class="nav-link active " aria-current="page" href="#home">Home</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#about">About Us</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#services">Services</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#team">Team</a>
</li>
<li class="nav-item">
<a class="nav-link" href="#contact">Contact</a>
</li>
</ul>
</div>
</div>
</nav>
</header>
<!--Home Section-->
<section id="home" class="section1">
<section class="home_page">
<div class="container pt-5">
<div class="row pt-5 pb-5">
<div class="text mb-5 top_text">
<h1>Welcome to Our Website</h1>
<p style="color: white;">We are team of talented designers making websites with Bootstrap</p>
</div>
<div class="col-lg-4 col-sm-12 class_col1">
<div class="card p-5">
<h2>Why Choose Our Services?</h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Duis aute irure dolor in reprehenderit Asperiores dolores sed et. Tenetur quia eos. Autem tempore quibusdam vel necessitatibus optio ad corporis.</p>
<div class="btn">
<button class="btn btn-primary">Learn More ></button>
</div>
</div>
</div>
<div class="class_col2 col-lg-8 col-md-12 col-sm-12 pt-5 text-center">
<div class="row">
<div class="col-xl-4 col-lg-12 co-sm-12 pt-2">
<div class="card p-3">
<i class="fa-solid fa-envelope"></i>
<h3>Corporis voluptates officia eiusmod</h3>
<p>Consequuntur sunt aut quasi enim aliquam quae harum pariatur laboris nisi ut aliquip</p>
</div>
</div>
<div class=" col-xl-4 col-lg-12 co-sm-12 pt-2">
<div class="card p-3">
<i class="fa-brands fa-squarespace"></i>
<h3>Ullamco laboris ladore pan</h3>
<p>Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt</p>
</div>
</div>
<div class="col-xl-4 col-lg-12 co-sm-12 pt-2">
<div class="card p-3">
<i class="fa-solid fa-handshake"></i>
<h3>Labore consequatur incidid dolore</h3>
<p>Aut suscipit aut cum nemo deleniti aut omnis. Doloribus ut maiores omnis facere</p>
</div>
</div>
</div>
</div>
</div>
</div>
</section>
</section>
<!--About Section-->
<section id="about" class="about_page" >
<div class="container">
<div class="row pt-5 pb-5 ">
<h1 class="about_heading text-center">About Us</h1>
<p>Dolor iure expedita id fuga asperiores qui sunt consequatur minima. Quidem voluptas deleniti. Sit quia molestiae quia quas qui magnam itaque veritatis dolores. Corrupti totam ut eius incidunt reiciendis veritatis asperiores placeat.</p>
<div class="col1 col-sm-12 col-lg-6">
<div class="card border-0 ">
<img src="images/bgAbout.jpg" alt="about_img">
</div>
</div>
<div class="col2 col-sm-12 col-md-12 col-lg-6 pt-2">
<div class="about_texts pt-2 d-flex">
<div><i class="fa-brands fa-algolia"></i></div>
<div>
<h5>Ullamco laboris nisi ut aliquip consequat</h5>
<p>Magni facilis facilis repellendus cum excepturi quaerat praesentium libre trade</p>
</div>
</div>
<div class="about_texts pt-2 d-flex">
<div><i class="fa-brands fa-codepen"></i></div>
<div>
<h5>Magnam soluta odio exercitationem reprehender</h5>
<p>Quo totam dolorum at pariatur aut distinctio dolorum laudantium illo direna pasata redi</p>
</div>
</div>
<div class="about_texts pt-2 d-flex">
<div><i class="fa-solid fa-paper-plane"></i></div>
<div>
<h5>Voluptatem et qui exercitationem</h5>
<p>Et velit et eos maiores est tempora et quos dolorem autem tempora incidunt maxime veniam</p>
</div>
</div>
<div class="about_texts pt-2 d-flex">
<div><i class="fa-solid fa-compass"></i></div>
<div>
<h5>istinctio dolorum</h5>
<p>Et velit et eos maiores est tempora et quos dolorem autem tempora incidunt maxime veniam</p>
</div>
</div>
</div>
</div>
</div>
</section>
<!--Advertisement-->
<section class="advertisement">
<div class="container">
<div class="row">
<div class="col-sm-12 text-center p-5">
<h3> Hurry up for Subscrition and follow us</h3>
<div class="btn">
<button class="btn btn-dark">Subscribe us</button>
</div>
</div>
</div>
</div>
</section>
<!--Team section-->
<section id="team" class="team_page">
<div class="containter">
<div class="row text-center p-5">
<h1>Team</h1>
<p>Necessitatibus eius consequatur ex aliquid fuga eum quidem sint consectetur velit</p>
<div class="col-sm-12 col-md-6 col-lg-3 p-2">
<div class="card">
<img class="card-img-top" src="images/team1 (1).jpg" alt="team1">
<h4 class="card-title">Walter White</h4>
<p class="card-text">Chief Executive Officer</p>
</div>
</div>
<div class="col-sm-12 col-md-6 col-lg-3 p-2">
<div class="card">
<img class="card-img-top" src="images/team1 (2).jpg" alt="team1">
<h4 class="card-title">Amanda Jepson</h4>
<p class="card-text">Accountant</p>
</div>
</div>
<div class="col-sm-12 col-md-6 col-lg-3 p-2">
<div class="card">
<img class="card-img-top" src="images/team1(6).jpg" style="height:245 px;" alt="team1">
<h4 class="card-title">Sarah Jhonson</h4>
<p class="card-text">Product Manager</p>
</div>
</div>
<div class="col-sm-12 col-md-6 col-lg-3 p-2">
<div class="card">
<img class="card-img-top" src="images/team1 (4).jpg" alt="team1">
<h4 class="card-title">William Anderson</h4>
<p class="card-text">CTO</p>
</div>
</div>
</div>
</div>
</section>
<section id="services">
<section class="services_page pt-4 ">
<div class="container text-center justify-content-center">
<div class="row">
<h1 >Services</h1>
<p>Necessitatibus eius consequatur ex aliquid fuga eum quidem sint consectetur velit</p>
</div>
<div class="row pt-5 services_data">
<div class="col-lg-4 col-md-6 mb-5">
<div class="card p-5">
<i class="fa-solid fa-bug"></i>
<h2 >Nesciunt Mete</h2>
<p>
Provident nihil minus qui consequatur non omnis maiores. Eos accusantium minus dolores iure </p>
</div>
</div>
<div class="col-lg-4 col-md-6 mb-5">
<div class="card p-5">
<i class="fa-solid fa-snowflake"></i>
<h2 >Asperiores Commodit
</h2>
<p>Non et temporibus minus omnis sed dolor esse consequatur. Cupiditate sed error ea fuga sit provident adipisci neque. </p>
</div>
</div>
<div class="col-lg-4 col-md-6 mb-5">
<div class="card p-5">
<i class="fa-solid fa-earth-americas"></i>
<h2 >Ledo Market</h2>
<p>
Provident nihil minus qui consequatur non omnis maiores. Eos accusantium minus dolores iure </p>
</div>
</div>
<div class="col-lg-4 col-md-6 mb-5">
<div class="card p-5">
<i class="fa-solid fa-handshake"></i>
<h2 >Asphalt 9</h2>
<p>
Provident nihil minus qui consequatur non omnis maiores. Eos accusantium minus dolores iure </p>
</div>
</div>
<div class="col-lg-4 col-md-6 mb-5">
<div class="card p-5">
<i class="fa-brands fa-airbnb"></i>
<h2 >Nesciunt Mete</h2>
<p>
Provident nihil minus qui consequatur non omnis maiores. Eos accusantium minus dolores iure </p>
</div>
</div>
<div class="col-lg-4 col-md-6 mb-5">
<div class="card p-5">
<i class="fa-solid fa-ticket"></i>
<h2 >Bootstrap </h2>
<p>Hic molestias ea quibusdam eos. Fugiat enim doloremque aut neque non et debitis iure. Corrupti recusandae ducimus enim.</p>
</div>
</div>
</div>
</div>
</section>
</section>
<!--Contact page -->
<section id="contact" class="contact_page p-5">
<div class="container">
<div class="row p-5 text-center justify-content-center Row_class">
<h1>Contact</h1>
<p>Necessitatibus eius consequatur ex aliquid fuga eum quidem sint consectetur velit</p>
<div class="col-sm-12 col-md-5 d-flex js">
<div><i class="fa-solid fa-envelope"></i></div>
<div class="">
<h3>Email Us</h3>
<p>info@example.com</p>
</div>
</div>
<div class="col-sm-12 col-md-5 d-flex">
<div><i class="fa-solid fa-house"></i></div>
<div class="">
<h3>Address</h3>
<p>A108 Adam Street</p>
</div>
</div>
<div class="col-sm-12 col-md-5 d-flex">
<div><i class="fa-solid fa-phone"></i></div>
<div class="">
<h3>Call Us</h3>
<p>+1 5589 55488 55</p>
</div>
</div>
<div class="col-sm-12 col-md-5 d-flex">
<div><i class="fa-solid fa-user"></i></div>
<div class="">
<h3>Profiles</h3>
<p>on footer</p>
</div>
</div>
</div>
<div class="contact_col2">
<form method="post" class="form-control pt-4">
<div class="row">
<div class="col-lg-6 col-sm-12 pt-2">
<input class="form-control" placeholder="Your Name" type="text">
</div>
<div class="col-lg-6 col-sm-12 pt-2">
<input class="form-control" placeholder="Email" type="email">
</div>
<div class="col-lg-12 col-sm-12 pt-2">
<input type="text" placeholder="Subject" class="form-control">
</div>
<div class="col-lg-12 col-sm-12 pt-2">
<textarea class="form-control" placeholder="Message" name="Message" rows="6"></textarea>
</div>
<div class="btn">
<button class="btn btn-secondary">Submited</button>
</div>
</div>
</form>
</div>
</div>
</section>
<footer>
<section class="footer_page pt-5 " id="footer">
<div class="container">
<div class="row">
<div class="col-lg-4 col-md-6 col-sm-12 pt-3">
<h2>Template</h2>
<p>A108 Adam Street</p>
<p>New York, NY 535022</p>
<p><b>Phone:</b> +1 5589 55488 55</p>
<p><b>Email:</b> info@example.com</p>
<div class="d-flex ">
<div><i class="fa-brands fa-twitter"></i></div>
<div><i class="fa-brands fa-facebook"></i></div>
<diV><i class="fa-brands fa-linkedin"></i></diV>
<div><i class="fa-brands fa-instagram"></i></div>
</div>
</div>
<div class="useful col-lg-2 col-md-6 col-sm-12 d-column pt-3" style="text-decoration: none;">
<h4>Useful Links</h4>
<a href="#home">Home</a><br>
<a href="#about">About Us</a><br>
<a href="#services">Services</a><br>
<a href="#contact">Contact</a><br>
<a href="#team">Team</a>
</div>
<div class="col-lg-2 col-md-6 col-sm-12 pt-3">
<h4>Our Services</h4>
<p>Web Design</p>
<p>Web Development</p>
<p>App Development</p>
<p>Attractive Designs</p>
</div>
<div class="col-lg-4 col-md-6 col-sm-12 pt-3">
<h4>Our Newsletter</h4>
<p>Subscribe to our newsletter and receive the latest news about our products and services!</p>
<div class="btn">
<button class="btn btn-dark">Subscribe</button>
</div>
</div>
</div>
<div class="row p-4">
<div class="col-sm-12 col-lg-12 text-center " style="border-top: 1px solid gray;">
<p>© Copyright <b>2024 </b> All Rights Reserved</p>
<p>Designed by Aditya</p>
</div>
</div>
</div>
</section>
</footer>
</body>
</html>