-
Notifications
You must be signed in to change notification settings - Fork 0
/
index.html
331 lines (321 loc) · 21.4 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
<!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">
<!--! Font Awesome CDN -->
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.15.4/css/all.css" integrity="sha384-DyZ88mC6Up2uqS4h/KRgHuoeGwBcD4Ng9SiP4dIRy0EXTlnuz47vAwmeGwVChigm" crossorigin="anonymous">
<!--! Bootstrap CDN -->
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
<!--! Custom CSS -->
<link rel="stylesheet" href="style.css">
<title>Welcome</title>
</head>
<body>
<header>
<!--! nav area start -->
<nav class="navbar navbar-expand-lg navbar-light py-4">
<div class="container">
<a class="navbar-brand fw-bold" href="#">Nimontron Convention Centre</a>
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav ms-auto mb-2 mb-lg-0">
<li class="nav-item mx-3">
<a class="nav-link active" aria-current="page" href="#">Home</a>
</li>
<li class="nav-item mx-3">
<a class="nav-link" href="#">About us</a>
</li>
<li class="nav-item mx-3">
<a class="nav-link" href="#">Contact</a>
</li>
<li class="nav-item mx-3">
<a class="nav-link" href="#">Subscribe</a>
</li>
</ul>
</div>
</div>
</nav>
<!--! nav area end -->
<!--! Carousel section start -->
<section class="">
<div id="carouselExampleCaptions" class="carousel slide" data-bs-ride="carousel">
<div class="carousel-indicators">
<button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="0" class="active" aria-current="true" aria-label="Slide 1"></button>
<button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="1" aria-label="Slide 2"></button>
<button type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide-to="2" aria-label="Slide 3"></button>
</div>
<div class="carousel-inner">
<div class="carousel-item active">
<img src="./images/banner.png" class="csl-img min-vw-100" alt="...">
<div class="carousel-caption d-block d-md-block pb-lg-4">
<h1 class="fs-1">The Perfect Venue For Your Next Event</h1>
<p class="">The Country's 1st largest luxurious Convention Center in your near town. Lovely place and awesome decorations are looking very nice. You wull be surprised to see our facilities.</p>
<a href="https://www.diccbd.com" target="_blank" class="btn csl-button mb-3 px-5 py-2 fw-bold">Book Now</a>
</div>
</div>
<div class="carousel-item">
<img src="./images/wedding1.jpg" class="csl-img w-100" alt="...">
<div class="carousel-caption d-block d-md-block pb-lg-4">
<h1 class="fs-1">The Perfect Venue at Your Next Door</h1>
<p class="">Located in the heart of the city, our place is a leading destination for conventions, trade shows, and exhibitions. We are committed to delivering excellent service and exceeding our clients’ and guests’ expectations at every event.</p>
<a href="https://www.diccbd.com" target="_blank" class="btn csl-button mb-3 px-5 py-2 fw-bold">Book Now</a>
</div>
</div>
<div class="carousel-item">
<img src="./images/conv1.jpg" class="csl-img w-100" alt="...">
<div class="carousel-caption d-block d-md-block pb-lg-4">
<h1 class="fs-1">The Perfect Venue For Your Moments</h1>
<p class="">Opened in 2000, with more than 100 professional meeting planners working together with architects to design every aspect of the building. Expanded in 2008, well-known as one of the most practical and “user friendly” meeting facilities, the Nimontron Convention Center is now home to over 130+ events annually. </p>
<a href="https://www.diccbd.com" target="_blank" class="btn csl-button mb-3 px-5 py-2 fw-bold">Book Now</a>
</div>
</div>
</div>
<button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="visually-hidden">Previous</span>
</button>
<button class="carousel-control-next" type="button" data-bs-target="#carouselExampleCaptions" data-bs-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="visually-hidden">Next</span>
</button>
</div>
</section>
<!--! Carousel section end -->
</header>
<main class="container">
<!--! album section start -->
<section class="section-margin">
<div class="row gx-4 gy-3 align-items-center">
<div class="col-lg-6 col-md-6">
<img class="img-fluid rounded-3" src="./images/flower.jpg" alt="">
</div>
<div class="col-lg-6 col-md-6">
<div>
<h1>Every moment is Precious</h1>
<p>
Living in the present implies being aware of each situation and finding our eternity in every single moment. Only you can decide how would you like to spend your moments
</p>
<a class="btn btn-primary px-4 py-2" href="">Explore our album <i class="fas fa-arrow-right ms-2"></i></a>
</div>
</div>
</div>
</section>
<!--! album section end -->
<!--! package section start -->
<section class="section-margin">
<h1 class="text-center section-title">Our Package</h1>
<!--!-----------toast code start---------------->
<div class="toast show mb-5 ms-auto align-items-center border-5 border-primary border-top-0 border-end-0 border-bottom-0 rounded-0" role="alert" aria-live="assertive" aria-atomic="true">
<div class="d-flex align-items-center">
<div class="toast-body d-flex align-items-center">
<i class="fas fa-gift text-primary fs-3 me-3"></i> <span>20% off on next booking</span>
</div>
<button type="button" class="btn-close me-2 m-auto" data-bs-dismiss="toast" aria-label="Close"></button>
</div>
</div>
<!--!-----------toast code end---------------->
<div class="row row-cols-1 row-cols-lg-2 row-cols-xl-4 row-cols-md-2 gx-4 gy-5">
<div class="col">
<div class="card p-3 mt-lg-5 px-lg-0 border-0 c-round">
<div class="card-body">
<h2 class="card-title mb-3">$300</h2>
<h4 class="mb-3">Business fair</h5>
<p class="card-text c-text fw-light">
For most businesses event like book fair, craft fair.
</p>
<p class="c-text fw-light lh-lg">
<span><i class="fas fa-check-circle me-1"></i> Limited space access</span><br>
<span><i class="fas fa-check-circle me-1"></i> Security facility</span><br>
<span><i class="fas fa-check-circle me-1"></i> Event Support</span><br>
<span><i class="fas fa-check-circle me-1"></i> Decoration Design</span><br>
<span><i class="fas fa-check-circle me-1"></i> Per day bill</span><br>
</p>
</div>
<div class="mb-3 px-0 text-lg-center bg-white">
<button class="btn btn-primary px-5 py-2 c-button">Choose Plan</button>
</div>
</div>
</div>
<div class="col">
<div class="card p-3 mt-lg-5 px-lg-0 border-0 c-round">
<div class="card-body">
<h2 class="card-title mb-3">$600</h2>
<h4 class="mb-3">Wedding basic</h5>
<p class="card-text c-text fw-light">
For weddings with basic plan and limited item
</p>
<p class="c-text fw-light lh-lg">
<span><i class="fas fa-check-circle me-1"></i> Full space access</span><br>
<span><i class="fas fa-check-circle me-1"></i> Food arrangement </span><br>
<span><i class="fas fa-check-circle me-1"></i> Management Support</span><br>
<span><i class="fas fa-check-circle me-1"></i> Decoration Design</span><br>
<span><i class="fas fa-check-circle me-1"></i> Billed as shift</span><br>
</p>
</div>
<div class="mb-3 px-0 text-lg-center bg-white">
<button class="btn btn-primary px-5 py-2 c-button">Choose Plan</button>
</div>
</div>
</div>
<div class="col">
<div class="card h-100 card-custom p-3 mt-lg-1 px-lg-0 bg-primary text-white border-0 shadow c-round card-h">
<div class="card-body">
<span class="upper-box px-3 py-1 position-absolute top-0 translate-middle">Hot</span>
<h2 class="card-title mb-3">$1000</h2>
<h4 class="mb-3">Wedding plus</h5>
<p class="card-text c-text-unique fw-light">
For most weddings with premium plans.
</p>
<p class="c-text-unique fw-light lh-lg">
<span><i class="fas fa-check-circle me-1 text-white"></i> Full space access</span><br>
<span><i class="fas fa-check-circle me-1 text-white"></i> Dedicated team</span><br>
<span><i class="fas fa-check-circle me-1 text-white"></i> Buffet food</span><br>
<span><i class="fas fa-check-circle me-1 text-white"></i> Premium decoration</span><br>
<span><i class="fas fa-check-circle me-1 text-white"></i> Pay as plan</span><br>
</p>
</div>
<div class=" text-lg-center bg-primary border-top-0">
<button class="btn px-5 py-2 c-button-unique mb-3">Choose Plan</button>
</div>
</div>
</div>
<div class="col">
<div class="card p-3 mt-lg-5 px-lg-0 border-0 c-round">
<div class="card-body">
<h2 class="card-title mb-3">$1500</h2>
<h4 class="mb-3">Corporate event</h5>
<p class="card-text c-text fw-light">
For most corporate business event and meetings.
</p>
<p class="c-text fw-light lh-lg">
<span><i class="fas fa-check-circle me-1"></i> Full space access</span><br>
<span><i class="fas fa-check-circle me-1"></i> Dedicated team</span><br>
<span><i class="fas fa-check-circle me-1"></i> Buffet food</span><br>
<span><i class="fas fa-check-circle me-1"></i> Premium decoration</span><br>
<span><i class="fas fa-check-circle me-1"></i> Pay as plan</span><br>
</p>
</div>
<div class="mb-3 px-0 text-lg-center bg-white">
<button class="btn btn-primary px-5 py-2 c-button">Choose Plan</button>
</div>
</div>
</div>
</div>
</section>
<!--! package section end -->
<!--! custom section with map -->
<section class="section-margin">
<h1 class="text-center section-title">Always at Your Service</h1>
<div class="row gx-4 gy-4 flex-sm-column-reverse flex-column-reverse flex-md-column-reverse flex-lg-row align-items-center">
<div class="col-lg-6">
<div class="text-white py-5 px-4 rounded-3 bg-primary shadow">
<h2 class="fs-2 text-center">Let's Get Planning</h2>
<p class="text-center my-5">
We always prioritize our customer's thought. Fill out our Event Enquiries form and let's bring your vision to reality.
</p>
<div class="text-center">
<button class="custom-button btn btn-light text-primary px-4 mx-3 my-2">Get Started</button>
<button class="custom-button btn btn-light text-primary px-4 mx-3 my-2">Book Now</button>
</div>
</div>
</div>
<div class="col-lg-6">
<div class="bg-primary py-2 px-3 rounded-3 shadow">
<h2 class="fs-2 text-center text-white py-3">Our location</h2>
<iframe class="w-100" src="https://www.google.com/maps/embed?pb=!1m14!1m8!1m3!1d14183.6204365667!2d90.42406329290834!3d23.825427024729578!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x0%3A0xd632032ce04b6c71!2sInternational%20Convention%20City%20Bashundhara%20(ICCB)!5e0!3m2!1sen!2sus!4v1643015643121!5m2!1sen!2sus" height="350" style="border:0;" allowfullscreen="" loading="lazy"></iframe>
</div>
</div>
</div>
</section>
<!--! custom section with map -->
<!--! accordion section start -->
<section class="section-margin">
<h1 class="text-center section-title">Frequently Asked Questions</h1>
<div class="row flex-sm-column-reverse flex-column-reverse flex-md-column-reverse flex-lg-row align-items-center gx-lg-5 gy-sm-5">
<div class="col-lg-6">
<div class="accordion" id="accordionPanelsStayOpenExample">
<div class="accordion-item my-3 border-top shadow rounded-3">
<h2 class="accordion-header" id="panelsStayOpen-headingOne">
<button class="accordion-button acd-button" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapseOne" aria-expanded="true" aria-controls="panelsStayOpen-collapseOne">
<span class="fs-5 acd-title">What is the difference between event design and event planning?</span>
</button>
</h2>
<div id="panelsStayOpen-collapseOne" class="accordion-collapse collapse show" aria-labelledby="panelsStayOpen-headingOne">
<div class="accordion-body text-secondary">
Event design and event planning work hand in hand to deliver a successful event.Events by Knight offer tailor made events. This means we incorporate both event design and event planning to create that perfect event.
</div>
</div>
</div>
<div class="accordion-item my-3 border-top shadow rounded-3">
<h2 class="accordion-header" id="panelsStayOpen-headingTwo">
<button class="accordion-button acd-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapseTwo" aria-expanded="false" aria-controls="panelsStayOpen-collapseTwo">
<span class="fs-5 acd-title">How early do we need to start planning an event?</span>
</button>
</h2>
<div id="panelsStayOpen-collapseTwo" class="accordion-collapse collapse" aria-labelledby="panelsStayOpen-headingTwo">
<div class="accordion-body">
Planning really depends on the size and the details that the event involves. Having enough time allows you to comfortably cover different areas and prepare yourself for potential scenarios that might happen so you can consider various options prior the date.
</div>
</div>
</div>
<div class="accordion-item my-3 border-top shadow rounded-3">
<h2 class="accordion-header" id="panelsStayOpen-headingThree">
<button class="accordion-button acd-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapseThree" aria-expanded="false" aria-controls="panelsStayOpen-collapseThree">
<span class="fs-5 acd-title">What is your refund and cancellation policy?</span>
</button>
</h2>
<div id="panelsStayOpen-collapseThree" class="accordion-collapse collapse" aria-labelledby="panelsStayOpen-headingThree">
<div class="accordion-body">
Refund and cancellation policy is applicable only for some conditions. Please call us for more details.
</div>
</div>
</div>
<div class="accordion-item my-3 border-top shadow rounded-3">
<h2 class="accordion-header" id="panelsStayOpen-headingFour">
<button class="accordion-button acd-button collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#panelsStayOpen-collapseFour" aria-expanded="false" aria-controls="panelsStayOpen-collapseThree">
<span class="fs-5 acd-title">How do you keep budgets on track?</span>
</button>
</h2>
<div id="panelsStayOpen-collapseFour" class="accordion-collapse collapse" aria-labelledby="panelsStayOpen-headingFour">
<div class="accordion-body">
There are several options available to track your expenses. One of the simplest is a written ledger or tracking system. It may be even easier to choose budgeting software that works with an app to track expenses on your phone.
</div>
</div>
</div>
</div>
</div>
<div class="col-lg-6">
<img src="./images/emily-morter-8xAA0f9yQnE-unsplash.jpg" class="w-100 mb-3" alt="">
</div>
</div>
</section>
<!--! accordion section end -->
</main>
<!--! footer start -->
<footer class="w-100 bg-black text-white p-5">
<div class="container">
<div class="row align-items-center flex-sm-column-reverse flex-column-reverse flex-md-column-reverse flex-lg-row">
<div class="col-lg-6 col-md-12 d-flex justify-content-lg-start justify-content-sm-center justify-content-md-center">
<div class="mt-5">
© Md. Ishtiyak Ali Rifat . All rights reserved
</div>
</div>
<div class="col-lg-6 col-md-12 d-flex justify-content-lg-end justify-content-sm-center justify-content-md-center">
<div class="">
<h4 class="mb-3 fw-normal">Get the App</h4>
<a href="https://apps.apple.com/us/app/mikrotik/id1323064830" target="_blank" class="store-button d-inline-block"><img class="" src="./images/apple.png" width="180" height="55" alt=""></a><br>
<a href="https://play.google.com/store/apps/details?id=com.netflix.mediaclient" target="_blank" class="store-button d-inline-block mt-2"><img class="" src="./images/ps.png" width="180" height="55" alt=""></a>
</div>
</div>
</div>
</div>
</footer>
<!--!-- footer end -->
<!--! bootstrap script -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/js/bootstrap.bundle.min.js" integrity="sha384-ka7Sk0Gln4gmtz2MlQnikT1wXgYsOg+OMhuP+IlRH9sENBO0LRn5q+8nbTov4+1p" crossorigin="anonymous"></script>
</body>
</html>