-
Notifications
You must be signed in to change notification settings - Fork 0
Expand file tree
/
Copy pathindex.html
More file actions
252 lines (230 loc) · 11.3 KB
/
Copy pathindex.html
File metadata and controls
252 lines (230 loc) · 11.3 KB
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.0.0/dist/css/bootstrap.min.css"
integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" />
<link rel="stylesheet" href="style.css">
<title>Consegic Business Intelligence</title>
</head>
<body>
<!-- Navbar -->
<nav class="navbar navbar-expand-lg sticky-top navbar-light bg-light">
<a class="navbar-brand" href="#"><img src="logo.png" alt="logo" /></a>
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarSupportedContent">
<ul class="navbar-nav mr-auto">
<li class="nav-item active"><a class="nav-link" href="#">Home</a></li>
<li class="nav-item"><a class="nav-link" href="#">Industries</a></li>
<li class="nav-item"><a class="nav-link" href="#">Insights</a></li>
<li class="nav-item"><a class="nav-link" href="#">About</a></li>
<li class="nav-item"><a class="nav-link" href="#">Contact</a></li>
</ul>
<form class="form-inline my-2 my-lg-0">
<input class="form-control mr-sm-2" type="search" placeholder="Search" />
<button class="btn btn-outline-success" type="submit">Search</button>
</form>
</div>
</nav>
<!-- Page -->
<div class="container-fluid">
<div class="row">
<!-- Left Sidebar -->
<div class="col-md-3 mb-4">
<div class="card sticky-sidebar position-sticky shadow-lg" style="top: 20px; border-radius: 12px;">
<div class="card-body">
<h5 class="card-title text-primary d-flex align-items-center mb-3">
<i class="fas fa-info-circle mr-2"></i> Description
</h5>
<ul class="list-unstyled sidebar-links mb-3">
<li><a href="#">Table Of Content</a></li>
<li><a href="#">Methodology</a></li>
<li><a href="#">Related Reports</a></li>
</ul>
<hr />
<button class="btn btn-outline-primary btn-sm w-100 mb-2">Inquire Before Buying</button>
<button class="btn btn-outline-secondary btn-sm w-100 mb-2">Speak To An Analyst</button>
<button class="btn btn-outline-info btn-sm w-100 mb-2">Request Brochure</button>
<button class="btn btn-outline-dark btn-sm w-100">Request Customization</button>
</div>
</div>
</div>
<!-- Main Content -->
<div class="col-md-6">
<div class="report-header">
<h4>Dental Washer-Disinfectors Market</h4>
<p>Market Size, Types, Applications, and Forecast 2023 - 2030</p>
<div class="d-flex gap-3">
<button class="btn btn-primary">Get Free Report Sample</button>
<button style="margin-left: 10px;" class="btn btn-outline-primary">Ask an Expert</button>
</div>
</div>
<div class="my-4">
<p>The market for aviation infrastructure is anticipated to witness a CAGR of about 7% during the forecast
period.</p>
<div class="report-box my-3">
<h6 class="report-highlight">Key Market Segmentation:</h6>
<p>Breakup by Type of Warehouses:</p>
<ul>
<li>General Warehousing and Storage</li>
<li>Refrigerated Warehousing and Storage</li>
<li>Farm Product Warehousing and Storage</li>
</ul>
</div>
</div>
<!-- Data Table -->
<h5 class="mt-4">Report Attributes</h5>
<table class="table table-bordered">
<thead>
<tr>
<th>Report Attribute</th>
<th>Details</th>
</tr>
</thead>
<tbody>
<tr>
<td>No. of Pages</td>
<td>143</td>
</tr>
<tr>
<td>Published</td>
<td>February 2022</td>
</tr>
<tr>
<td>Forecast Period</td>
<td>2021 - 2027</td>
</tr>
<tr>
<td>Estimated Market Value (2021)</td>
<td>USD 574.5 Billion</td>
</tr>
<tr>
<td>Forecasted Market Value (2027)</td>
<td>USD 1215.2 Billion</td>
</tr>
<tr>
<td>Compound Annual Growth Rate</td>
<td>13.3%</td>
</tr>
<tr>
<td>Regions Covered</td>
<td>Global</td>
</tr>
<tr>
<td>Companies Mentioned</td>
<td>11</td>
</tr>
</tbody>
</table>
<!-- Chart -->
<div class="my-4">
<h6 class="text-danger">EXPENSIVENESS OF HIGH-CAPACITY BATTERIES MAY HINDER INDUSTRY DEVELOPMENT</h6>
<p>High performance in electric ships can be attained through high-capacity batteries...</p>
<img src="graph.png" class="img-fluid" alt="Market Graph">
<p style = "text-align: justify;">
Lorem ipsum, dolor sit amet consectetur adipisicing elit. Fuga ab quos distinctio
veritatis natus magni nam
pariatur aut itaque. Adipisci voluptas vitae ipsum magni vel reprehenderit temporibus veniam facilis totam
animi nobis, numquam hic necessitatibus. Eos, vitae numquam? Hic labore animi ullam in, quisquam quidem
incidunt dolorum fugit corrupti, ut illum nam rerum at. Minus alias necessitatibus rem culpa voluptatem
temporibus, quo nesciunt architecto vero non quae, molestiae placeat ab natus consequuntur quisquam et
dolorem sit reprehenderit optio quidem, odio voluptate distinctio eum? Nulla quia repudiandae voluptatum
aperiam unde harum molestiae ullam sint id. Porro eos recusandae vitae quia repellat eveniet, quaerat
deserunt tempore accusamus necessitatibus, voluptatem debitis beatae illo ab culpa odit asperiores, aliquam
nesciunt. Dolore maiores inventore, molestias possimus, in ut sunt impedit quae asperiores porro unde dicta
ipsam iusto reiciendis facere ad consequatur! Corporis quidem exercitationem nesciunt, deleniti qui minima
architecto fugit quam, ab velit error totam autem vel illo voluptatibus. Quasi dolorem itaque suscipit optio
blanditiis libero ex nisi dolor aperiam perspiciatis, dicta harum porro esse quo sint est, aut
exercitationem excepturi ipsam tempora reiciendis! Quae, necessitatibus nesciunt ut autem veniam cum
corrupti culpa commodi tempora, quos provident, voluptates exercitationem odio. Dolore placeat vitae in
magni sequi nesciunt? Natus recusandae officiis dicta officia nihil reiciendis facere? Nostrum, fuga.
Asperiores ex quisquam cupiditate incidunt non placeat vitae. Placeat, optio. Ipsum ipsa atque ut hic
tempora illo, accusamus ad dicta voluptas distinctio tempore nesciunt nihil rerum nulla exercitationem
adipisci pariatur assumenda molestiae ipsam, enim voluptatem. Illum, debitis magnam sint pariatur rem
laudantium laboriosam possimus tenetur aut ipsa. Iusto fugit praesentium laborum, nobis perferendis corporis
amet numquam dolore pariatur excepturi quia quasi animi facilis quidem, aspernatur temporibus quo doloribus
nihil deserunt porro obcaecati nulla itaque hic optio. Reiciendis, incidunt sed quaerat eaque quibusdam quas
voluptatibus dolorum facere numquam quam.
</p>
</div>
<!-- Enquiry Form -->
<div id="enquire-form" class="border p-4 mt-5 bg-light rounded">
<h5>Enquire Now</h5>
<form>
<input type="text" class="form-control mb-3" placeholder="Enter your full name" />
<input type="email" class="form-control mb-3" placeholder="Enter your email address" />
<input type="tel" class="form-control mb-3" placeholder="Enter your phone number" />
<input type="text" class="form-control mb-3" placeholder="Enter your address" />
<button class="btn btn-primary w-100">Submit</button>
</form>
</div>
</div>
<!-- Right Sticky Sidebar -->
<div class="col-md-3 d-none d-md-block">
<div class="card position-sticky shadow-lg" style="top: 20px; border-radius: 12px;">
<div class="card-body">
<div class="accordion custom-accordion my-4" id="accordionPanelsStayOpenExample">
<div class="accordion-item shadow-sm mb-3 border-0">
<h2 class="accordion-header" id="panelsStayOpen-headingOne">
<button class="accordion-button custom-btn" type="button" data-bs-toggle="collapse"
data-bs-target="#panelsStayOpen-collapseOne" aria-expanded="true"
aria-controls="panelsStayOpen-collapseOne">
<i class="fas fa-chart-line me-2 text-primary"></i> Market Overview
</button>
</h2>
<div id="panelsStayOpen-collapseOne" class="accordion-collapse collapse show"
aria-labelledby="panelsStayOpen-headingOne">
<div class="accordion-body">
<strong>This is the first item's accordion body.</strong> Lorem ipsum dolor, sit amet consectetur adipisicing elit. Quis, voluptas earum exercitationem nam eum, consequatur sunt molestias ullam libero totam molestiae quidem commodi accusamus odit consequuntur. Maxime similique et reiciendis sint voluptas qui exercitationem!
</div>
</div>
</div>
<div class="accordion-item shadow-sm mb-3 border-0">
<h2 class="accordion-header" id="panelsStayOpen-headingTwo">
<button class="accordion-button collapsed custom-btn" type="button" data-bs-toggle="collapse"
data-bs-target="#panelsStayOpen-collapseTwo" aria-expanded="false"
aria-controls="panelsStayOpen-collapseTwo">
<i class="fas fa-cogs me-2 text-warning"></i> Methodology
</button>
</h2>
<div id="panelsStayOpen-collapseTwo" class="accordion-collapse collapse"
aria-labelledby="panelsStayOpen-headingTwo">
<div class="accordion-body">
<strong>This is the second item's accordion body.</strong> Lorem ipsum dolor sit amet consectetur adipisicing elit. Expedita at totam amet?
or media if needed.
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- Floating Button -->
<a href="#enquire-form" class="btn btn-danger position-fixed d-flex align-items-center get-sample-btn"
style="top: 50%; right: 10px; z-index: 1050; transform: translateY(-50%); animation: pulse 2s infinite;">
<i class="fas fa-file-alt mr-2"></i> Get Sample Report
</a>
<!-- Animation for buttton -->
<style>
@keyframes pulse {
0% {
transform: translateY(-50%) scale(1);
}
50% {
transform: translateY(-50%) scale(1.05);
}
100% {
transform: translateY(-50%) scale(1);
}
}
</style>
<!-- Bootstrap script -->
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
</body>
</html>