forked from ammarlodhi255/travel-and-tour-agency-website
-
Notifications
You must be signed in to change notification settings - Fork 0
/
services.html
281 lines (260 loc) · 11 KB
/
services.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
<!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.0" />
<title>Services</title>
<link rel="preconnect" href="https://fonts.googleapis.com" />
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin />
<link
href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@300&display=swap"
rel="stylesheet"
/>
<link
rel="stylesheet"
href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.2/css/all.min.css"
/>
<link
href="https://fonts.googleapis.com/css2?family=Mouse+Memoirs&family=Open+Sans:wght@300&display=swap"
rel="stylesheet"
/>
<link
rel="stylesheet"
href="./bootstrap-5.0.2-dist/css/bootstrap.min.css"
crossorigin="anonymous"
/>
<script
src="./bootstrap-5.0.2-dist/js/bootstrap.min.js"
crossorigin="anonymous"
></script>
<!-- CSS only -->
<link
href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-gH2yIJqKdNHPEq0n4Mqa/HGKIhSkIHeL5AyhkYV8i59U5AR6csBvApHHNl/vI1Bx"
crossorigin="anonymous"
/>
<!-- JavaScript Bundle with Popper -->
<script
src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js"
integrity="sha384-A3rJD856KowSb7dwlZdYEkO39Gagi7vIsF0jrRAoQmDKKtQBHUuLZ9AsSv4jD4Xa"
crossorigin="anonymous"
></script>
<link rel="stylesheet" href="./services.css" />
</head>
<body>
<!-- Navbar -->
<nav class="navbar navbar-expand-md navbar-dark">
<div class="container nav-contents">
<a href="" class="navbar-brand"><b>World Dive</b></a>
<button
class="navbar-toggler"
type="button"
data-bs-toggle="collapse"
data-bs-target="#bar"
>
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="bar">
<ul class="navbar-nav nav-items ms-auto">
<li class="nav-item">
<a href="./home.html" class="nav-link">Home</a>
</li>
<li class="nav-item">
<a href="./services.html" class="nav-link">Services</a>
</li>
<li class="nav-item">
<a href="./packages.html" class="nav-link">Packages</a>
</li>
<li class="nav-item">
<a href="./gallery.html" class="nav-link">Gallery</a>
</li>
<li class="nav-item">
<a href="./about.html" class="nav-link about">About</a>
</li>
<li class="nav-item">
<a href="#login" class="nav-link login">Login</a>
</li>
<li class="nav-item">
<a href="#signup" class="nav-link signup">Sign Up</a>
</li>
</ul>
</div>
</div>
</nav>
<!-- Main Section -->
<div id="camp" class="section container">
<div class="row">
<div class="service camp col-md-6 col-sm-12"></div>
<div class="camp-detail col-md-6 col-sm-12">
<h2 class="camp-title">CAMPING</h2>
Camping is a recreational (and oftentimes laid-back) activity pursued
outdoors, away from cities and towns and in the lap of nature, with
fresh air and (occasionally) wildlife for company. One can set up a
tent, or live in a caravan, camper-van or motor-home when camping. But
the classic camping trip involves toughing it out in tents – and at
the mercy of Mother Nature. Camping can be – and usually is – combined
with other adventure activities, such as hiking/trekking, fishing,
whitewater rafting and kayaking, giving one the ultimate outdoors
experience. It can be an individual pursuit, but is often done in the
company of friends and family. It’s a pastime that can be enjoyed by
the young and the old. Camping is also a convenient option for those
attending music festivals or sports gatherings. While camping has
moved on from its rough-and-ready, back-to-nature origins, hardy folks
are still willing to rough it out in the wilderness, no matter how
conspiratorial the elements might be. But for families, with kids in
tow, camping is the perfect activity for a vacation.
</div>
</div>
</div>
<div class="images row">
<div class="pic camppic1 col-md-4 col-sm-12">
<div class="layer"><h3>Campfire</h3></div>
</div>
<div class="pic camppic2 col-md-4 col-sm-12">
<div class="layer"><h3>Explore Alone</h3></div>
</div>
<div class="pic camppic3 col-md-4 col-sm-12">
<div class="layer"><h3>Couples</h3></div>
</div>
</div>
<br />
<hr />
<!-- Activities -->
<div id="activity" class="section container">
<div class="row">
<div class="activity-detail col-md-6 col-sm-12">
<h2 class="camp-title">FUN ACTIVITIES</h2>
One strategy has proved particularly successful across all sectors of
the industry. Whether you are a provider of boat tours, cooking
courses or run an escape room – vouchers have proven to help all
providers, especially during the lockdown. Although tours could not be
offered, dreaming about them and buying them in advance was
nonetheless still possible, and helped some providers weather the
storm. People want something to look forward to, especially when
redemption dates are flexible. The providers we spoke to are
particularly keen to make their voucher offers highly visible.
Directly and prominently featured on their homepage, potential
customers get all the important information about the current
promotions and find out at a glance why they should buy vouchers right
now. In our example from Virtual Lounge aus Braunschweig the action
description is followed by a colour-coded button with a clear request
to buy. After clicking on the button, you are taken directly to the
overview of all offers and can book immediately.
</div>
<div class="service activity col-md-6 col-sm-12"></div>
</div>
</div>
<div class="images row">
<div class="pic activity1 col-md-4 col-sm-12">
<div class="layer"><h3>Volleyball</h3></div>
</div>
<div class="pic activity2 col-md-4 col-sm-12">
<div class="layer"><h3>Horseshoes</h3></div>
</div>
<div class="pic activity3 col-md-4 col-sm-12">
<div class="layer"><h3>Rock Climbing</h3></div>
</div>
</div>
<!-- Tour Guide -->
<br />
<hr />
<div id="tour" class="section container">
<div class="row">
<div class="service tour col-md-6 col-sm-12"></div>
<div class="camp-detail col-md-6 col-sm-12">
<h2 class="camp-title">TOUR GUIDE</h2>
Tour guides lead visitors, individually or in groups, on tours less
than a day in length. Tour guides ensure that itineraries are met and
that customers are being informed in an entertaining manner the
location they are touring. They are also responsible for ensuring the
safety of the group and ensuring that tour groups remain together.
Tour guides are employed by tour companies, resorts and attractions.
</div>
</div>
</div>
<div class="images row">
<div class="pic tourpic1 col-md-4 col-sm-12">
<div class="layer"><h3>History Narration</h3></div>
</div>
<div class="pic tourpic2 col-md-4 col-sm-12">
<div class="layer"><h3>Personal Tour Guider</h3></div>
</div>
<div class="pic tourpic3 col-md-4 col-sm-12">
<div class="layer"><h3>Participate in Guiding</h3></div>
</div>
</div>
<br />
<hr />
<!-- Tracking -->
<div id="track" class="section container">
<div class="row">
<div class="activity-detail col-md-6 col-sm-12">
<h2 class="camp-title">TRACKING</h2>
One strategy has proved particularly successful across all sectors of
the industry. Whether you are a provider of boat tours, cooking
courses or run an escape room vouchers have proven to help all
providers, especially during the lockdown. Although tours could not be
offered, dreaming about them and buying them in advance was
nonetheless still possible, and helped some providers weather the
storm. People want something to look forward to, especially when
redemption dates are flexible. The providers we spoke to are
particularly keen to make their voucher offers highly visible.
Directly and prominently featured on their homepage, potential
customers get all the important information about the current
promotions and find out at a glance why they should buy vouchers right
now. In our example from Virtual Lounge aus Braunschweig the action
description is followed by a colour-coded button with a clear request
to buy. After clicking on the button, you are taken directly to the
overview of all offers and can book immediately.
</div>
<div class="service track col-md-6 col-sm-12"></div>
</div>
</div>
<div class="images row">
<div class="pic track1 col-md-4 col-sm-12">
<div class="layer"><h3>Provided Maps</h3></div>
</div>
<div class="pic track2 col-md-4 col-sm-12">
<div class="layer"><h3>Mobile Tracking</h3></div>
</div>
<div class="pic track3 col-md-4 col-sm-12">
<div class="layer"><h3>Explore and Unlock New Places</h3></div>
</div>
</div>
<br />
<br />
<!-- FOOTER -->
<section class="footer">
<div class="container box-container">
<div class="row">
<div class="col col-4 box">
<h3>Contact Us</h3>
<a href="#"> <i class="fas fa-phone"></i> +333-2323-730 </a>
<a href="#"> <i class="fas fa-phone"></i> +567-695-765 </a>
<a href="#">
<i class="fas fa-envelope"></i> [email protected]
</a>
<a href="#"> <i class="fas fa-map"></i> Sukkur, Pakistan </a>
</div>
<div class="col-4 box">
<h3>Socials</h3>
<a href="#"> <i class="fab fa-facebook-f"></i> Facebook </a>
<a href="#"> <i class="fab fa-twitter"></i> Twitter </a>
<a href="#"> <i class="fab fa-instagram"></i> Instagram </a>
<a href="#"> <i class="fab fa-linkedin"></i> Linkedin </a>
</div>
<div class="col-4">
<img
class="img-fluid"
src="./Travel_fall_in_love_and_be_happy_6210.svg"
alt=""
/>
</div>
</div>
</div>
</section>
<script type="text/javascript" src="./index.js"></script>
</body>
</html>