xxxxxxxxxx1
<!--Main Navigation-->2
<header>3
<!-- Jumbotron -->4
<div class="p-3 text-center bg-white border-bottom">5
<div class="container">6
<div class="row gy-3">7
<!-- Left elements -->8
<div class="col-lg-2 col-sm-4 col-4">9
<a href="https://mdbootstrap.com/" target="_blank" class="float-start">10
<img src="https://mdbootstrap.com/img/logo/mdb-transaprent-noshadows.png" height="35" />11
</a>12
</div>13
<!-- Left elements -->14
15
<!-- Center elements -->16
<div class="order-lg-last col-lg-5 col-sm-8 col-8">17
<div class="d-flex float-end">18
<a href="https://github.com/mdbootstrap/bootstrap-material-design" class="me-1 border rounded py-1 px-3 nav-link d-flex align-items-center" target="_blank"> <i class="fas fa-user-alt m-1 me-md-2"></i><p class="d-none d-md-block mb-0">Sign in</p> </a>19
<a href="https://github.com/mdbootstrap/bootstrap-material-design" class="me-1 border rounded py-1 px-3 nav-link d-flex align-items-center" target="_blank"> <i class="fas fa-heart m-1 me-md-2"></i><p class="d-none d-md-block mb-0">Wishlist</p> </a>20
<a href="https://github.com/mdbootstrap/bootstrap-material-design" class="border rounded py-1 px-3 nav-link d-flex align-items-center" target="_blank"> <i class="fas fa-shopping-cart m-1 me-md-2"></i><p class="d-none d-md-block mb-0">My cart</p> </a>21
</div>22
</div>23
<!-- Center elements -->24
25
<!-- Right elements -->26
<div class="col-lg-5 col-md-12 col-12">27
<div class="input-group float-center">28
<div class="form-outline">29
<input type="search" id="form1" class="form-control" />30
<label class="form-label" for="form1">Search</label>31
</div>32
<button type="button" class="btn btn-primary shadow-0">33
<i class="fas fa-search"></i>34
</button>35
</div>36
</div>37
<!-- Right elements -->38
</div>39
</div>40
</div>41
<!-- Jumbotron -->42
43
<!-- Navbar -->44
<nav class="navbar navbar-expand-lg navbar-light" style="background-color: #f5f5f5;">45
<!-- Container wrapper -->46
<div class="container justify-content-center justify-content-md-between">47
<!-- Toggle button -->48
<button49
class="navbar-toggler border text-dark py-2"50
type="button"51
data-mdb-toggle="collapse"52
data-mdb-target="#navbarLeftAlignExample"53
aria-controls="navbarLeftAlignExample"54
aria-expanded="false"55
aria-label="Toggle navigation"56
>57
<i class="fas fa-bars"></i>58
</button>59
60
<!-- Collapsible wrapper -->61
<div class="collapse navbar-collapse" id="navbarLeftAlignExample">62
<!-- Left links -->63
<ul class="navbar-nav me-auto mb-2 mb-lg-0">64
<li class="nav-item">65
<a class="nav-link text-dark" aria-current="page" href="#">Home</a>66
</li>67
<li class="nav-item">68
<a class="nav-link text-dark" href="#">Categories</a>69
</li>70
<li class="nav-item">71
<a class="nav-link text-dark" href="#">Hot offers</a>72
</li>73
<li class="nav-item">74
<a class="nav-link text-dark" href="#">Gift boxes</a>75
</li>76
<li class="nav-item">77
<a class="nav-link text-dark" href="#">Projects</a>78
</li>79
<li class="nav-item">80
<a class="nav-link text-dark" href="#">Menu item</a>81
</li>82
<li class="nav-item">83
<a class="nav-link text-dark" href="#">Menu name</a>84
</li>85
<!-- Navbar dropdown -->86
<li class="nav-item dropdown">87
<a class="nav-link dropdown-toggle text-dark mb-0" href="#" id="navbarDropdown" role="button" data-mdb-toggle="dropdown" aria-expanded="false">88
Others89
</a>90
<!-- Dropdown menu -->91
<ul class="dropdown-menu" aria-labelledby="navbarDropdown">92
<li>93
<a class="dropdown-item" href="#">Action</a>94
</li>95
<li>96
<a class="dropdown-item" href="#">Another action</a>97
</li>98
<li><hr class="dropdown-divider" /></li>99
<li>100
<a class="dropdown-item" href="#">Something else here</a>101
</li>102
</ul>103
</li>104
</ul>105
<!-- Left links -->106
</div>107
</div>108
<!-- Container wrapper -->109
</nav>110
<!-- Navbar -->111
</header>112
113
<!-- intro -->114
<section class="pt-3">115
<div class="container">116
<div class="row gx-3">117
<main class="col-lg-9">118
<div class="card-banner p-5 bg-primary rounded-5" style="height: 350px;">119
<div style="max-width: 500px;">120
<h2 class="text-white">121
Great products with <br />122
best deals123
</h2>124
<p class="text-white">No matter how far along you are in your sophistication as an amateur astronomer, there is always one.</p>125
<a href="#" class="btn btn-light shadow-0 text-primary"> View more </a>126
</div>127
</div>128
</main>129
<aside class="col-lg-3">130
<div class="card-banner h-100 rounded-5" style="background-color: #f87217;">131
<div class="card-body text-center pb-5">132
<h5 class="pt-5 text-white">Amazing Gifts</h5>133
<p class="text-white">No matter how far along you are in your sophistication</p>134
<a href="#" class="btn btn-outline-light"> View more </a>135
</div>136
</div>137
</aside>138
</div>139
<!-- row //end -->140
</div>141
<!-- container end.// -->142
</section>143
<!-- intro -->144
145
<!-- category -->146
<section>147
<div class="container pt-5">148
<nav class="row gy-4">149
<div class="col-lg-6 col-md-12">150
<div class="row">151
<div class="col-3">152
<a href="#" class="text-center d-flex flex-column justify-content-center">153
<button type="button" class="btn btn-outline-secondary mx-auto p-3 mb-2" data-mdb-ripple-color="dark">154
<i class="fas fa-couch fa-xl fa-fw"></i>155
</button>156
<div class="text-dark">Interior items</div>157
</a>158
</div>159
<div class="col-3">160
<a href="#" class="text-center d-flex flex-column justify-content-center">161
<button type="button" class="btn btn-outline-secondary mx-auto p-3 mb-2" data-mdb-ripple-color="dark">162
<i class="fas fa-basketball-ball fa-xl fa-fw"></i>163
</button>164
<div class="text-dark">Sport and travel</div>165
</a>166
</div>167
<div class="col-3">168
<a href="#" class="text-center d-flex flex-column justify-content-center">169
<button type="button" class="btn btn-outline-secondary mx-auto p-3 mb-2" data-mdb-ripple-color="dark">170
<i class="fas fa-ring fa-xl fa-fw"></i>171
</button>172
<div class="text-dark">Jewellery</div>173
</a>174
</div>175
<div class="col-3">176
<a href="#" class="text-center d-flex flex-column justify-content-center">177
<button type="button" class="btn btn-outline-secondary mx-auto p-3 mb-2" data-mdb-ripple-color="dark">178
<i class="fas fa-clock fa-xl fa-fw"></i>179
</button>180
<div class="text-dark">Accessories</div>181
</a>182
</div>183
</div>184
</div>185
<div class="col-lg-6 col-md-12">186
<div class="row">187
<div class="col-3">188
<a href="#" class="text-center d-flex flex-column justify-content-center">189
<button type="button" class="btn btn-outline-secondary mx-auto p-3 mb-2" data-mdb-ripple-color="dark">190
<i class="fas fa-car-side fa-xl fa-fw"></i>191
</button>192
<div class="text-dark">Automobiles</div>193
</a>194
</div>195
<div class="col-3">196
<a href="#" class="text-center d-flex flex-column justify-content-center">197
<button type="button" class="btn btn-outline-secondary mx-auto p-3 mb-2" data-mdb-ripple-color="dark">198
<i class="fas fa-home fa-xl fa-fw"></i>199
</button>200
<div class="text-dark">Home items</div>201
</a>202
</div>203
<div class="col-3">204
<a href="#" class="text-center d-flex flex-column justify-content-center">205
<button type="button" class="btn btn-outline-secondary mx-auto p-3 mb-2" data-mdb-ripple-color="dark">206
<i class="fas fa-guitar fa-xl fa-fw"></i>207
</button>208
<div class="text-dark">Musical items</div>209
</a>210
</div>211
<div class="col-3">212
<a href="#" class="text-center d-flex flex-column justify-content-center">213
<button type="button" class="btn btn-outline-secondary mx-auto p-3 mb-2" data-mdb-ripple-color="dark">214
<i class="fas fa-book fa-xl fa-fw"></i>215
</button>216
<div class="text-dark">Book, reading</div>217
</a>218
</div>219
</div>220
</div>221
<div class="col-lg-6 col-md-12">222
<div class="row">223
<div class="col-3">224
<a href="#" class="text-center d-flex flex-column justify-content-center">225
<button type="button" class="btn btn-outline-secondary mx-auto p-3 mb-2" data-mdb-ripple-color="dark">226
<i class="fas fa-baby-carriage fa-xl fa-fw"></i>227
</button>228
<div class="text-dark">Kid's toys</div>229
</a>230
</div>231
<div class="col-3">232
<a href="#" class="text-center d-flex flex-column justify-content-center">233
<button type="button" class="btn btn-outline-secondary mx-auto p-3 mb-2" data-mdb-ripple-color="dark">234
<i class="fas fa-paw fa-xl fa-fw"></i>235
</button>236
<div class="text-dark">Pet items</div>237
</a>238
</div>239
<div class="col-3">240
<a href="#" class="text-center d-flex flex-column justify-content-center">241
<button type="button" class="btn btn-outline-secondary mx-auto p-3 mb-2" data-mdb-ripple-color="dark">242
<i class="fas fa-tshirt fa-xl fa-fw"></i>243
</button>244
<div class="text-dark">Men's clothing</div>245
</a>246
</div>247
<div class="col-3">248
<a href="#" class="text-center d-flex flex-column justify-content-center">249
<button type="button" class="btn btn-outline-secondary mx-auto p-3 mb-2" data-mdb-ripple-color="dark">250
<i class="fas fa-shoe-prints fa-xl fa-fw"></i>251
</button>252
<div class="text-dark">Men's clothing</div>253
</a>254
</div>255
</div>256
</div>257
<div class="col-lg-6 col-md-12">258
<div class="row">259
<div class="col-3">260
<a href="#" class="text-center d-flex flex-column justify-content-center">261
<button type="button" class="btn btn-outline-secondary mx-auto p-3 mb-2" data-mdb-ripple-color="dark">262
<i class="fas fa-mobile fa-xl fa-fw"></i>263
</button>264
<div class="text-dark">Smartphones</div>265
</a>266
</div>267
<div class="col-3">268
<a href="#" class="text-center d-flex flex-column justify-content-center">269
<button type="button" class="btn btn-outline-secondary mx-auto p-3 mb-2" data-mdb-ripple-color="dark">270
<i class="fas fa-tools fa-xl fa-fw"></i>271
</button>272
<div class="text-dark">Tools</div>273
</a>274
</div>275
<div class="col-3">276
<a href="#" class="text-center d-flex flex-column justify-content-center">277
<button type="button" class="btn btn-outline-secondary mx-auto p-3 mb-2" data-mdb-ripple-color="dark">278
<i class="fas fa-pencil-ruler fa-xl fa-fw"></i>279
</button>280
<div class="text-dark">Education</div>281
</a>282
</div>283
<div class="col-3">284
<a href="#" class="text-center d-flex flex-column justify-content-center">285
<button type="button" class="btn btn-outline-secondary mx-auto p-3 mb-2" data-mdb-ripple-color="dark">286
<i class="fas fa-warehouse fa-xl fa-fw"></i>287
</button>288
<div class="text-dark">Other items</div>289
</a>290
</div>291
</div>292
</div>293
</nav>294
</div>295
</section>296
<!-- category -->297
298
<!-- Products -->299
<section>300
<div class="container my-5">301
<header class="mb-4">302
<h3>New products</h3>303
</header>304
305
<div class="row">306
<div class="col-lg-3 col-md-6 col-sm-6">307
<div class="card my-2 shadow-0">308
<a href="#" class="">309
<div class="mask" style="height: 50px;">310
<div class="d-flex justify-content-start align-items-start h-100 m-2">311
<h6><span class="badge bg-danger pt-1">New</span></h6>312
</div>313
</div>314
<img src="https://mdbootstrap.com/img/bootstrap-ecommerce/items/1.webp" class="card-img-top rounded-2" style="aspect-ratio: 1 / 1"/>315
</a>316
<div class="card-body p-0 pt-3">317
<a href="#!" class="btn btn-light border px-2 pt-2 float-end icon-hover"><i class="fas fa-heart fa-lg px-1 text-secondary"></i></a>318
<h5 class="card-title">$29.95</h5>319
<p class="card-text mb-0">GoPro action camera 4K</p>320
<p class="text-muted">321
Model: X-200322
</p>323
</div>324
</div>325
</div>326
<div class="col-lg-3 col-md-6 col-sm-6">327
<div class="card my-2 shadow-0">328
<a href="#" class="">329
<div class="mask" style="height: 50px;">330
<div class="d-flex justify-content-start align-items-start h-100 m-2">331
<h6><span class="badge pt-1" style="background-color: #f87217;">Offer</span></h6>332
</div>333
</div>334
<img src="https://mdbootstrap.com/img/bootstrap-ecommerce/items/2.webp" class="card-img-top rounded-2" style="aspect-ratio: 1 / 1"/>335
</a>336
<div class="card-body p-0 pt-2">337
<a href="#!" class="btn btn-light border px-2 pt-2 float-end icon-hover"><i class="fas fa-heart fa-lg px-1 text-secondary"></i></a>338
<h5 class="card-title">$590.00</h5>339
<p class="card-text mb-0">Canon EOS professional</p>340
<p class="text-muted">341
Capacity: 128GB342
</p>343
</div>344
</div>345
</div>346
<div class="col-lg-3 col-md-6 col-sm-6">347
<div class="card my-2 shadow-0">348
<a href="#" class="">349
<img src="https://mdbootstrap.com/img/bootstrap-ecommerce/items/3.webp" class="card-img-top rounded-2" style="aspect-ratio: 1 / 1"/>350
</a>351
<div class="card-body p-0 pt-2">352
<a href="#!" class="btn btn-light border px-2 pt-2 float-end icon-hover"><i class="fas fa-heart fa-lg px-1 text-secondary"></i></a>353
<h5 class="card-title">$29.95</h5>354
<p class="card-text mb-0">Modern product name here</p>355
<p class="text-muted">356
Sizes: S, M, XL357
</p>358
</div>359
</div>360
</div>361
<div class="col-lg-3 col-md-6 col-sm-6">362
<div class="card my-2 shadow-0">363
<a href="#" class="">364
<img src="https://mdbootstrap.com/img/bootstrap-ecommerce/items/4.webp" class="card-img-top rounded-2" style="aspect-ratio: 1 / 1"/>365
</a>366
<div class="card-body p-0 pt-2">367
<a href="#!" class="btn btn-light border px-2 pt-2 float-end icon-hover"><i class="fas fa-heart fa-lg px-1 text-secondary"></i></a>368
<h5 class="card-title">$1099.00</h5>369
<p class="card-text mb-0">Apple iPhone 13 Pro max</p>370
<p class="text-muted">371
Color: Black, Memory: 128GB372
</p>373
</div>374
</div>375
</div>376
<div class="col-lg-3 col-md-6 col-sm-6">377
<div class="card my-2 shadow-0">378
<a href="#" class="">379
<img src="https://mdbootstrap.com/img/bootstrap-ecommerce/items/5.webp" class="card-img-top rounded-2" style="aspect-ratio: 1 / 1"/>380
</a>381
<div class="card-body p-0 pt-2">382
<a href="#!" class="btn btn-light border px-2 pt-2 float-end icon-hover"><i class="fas fa-heart fa-lg px-1 text-secondary"></i></a>383
<h5 class="card-title">$29.95</h5>384
<p class="card-text mb-0">Modern product name here</p>385
<p class="text-muted">386
Sizes: S, M, XL387
</p>388
</div>389
</div>390
</div>391
<div class="col-lg-3 col-md-6 col-sm-6">392
<div class="card my-2 shadow-0">393
<a href="#" class="">394
<img src="https://mdbootstrap.com/img/bootstrap-ecommerce/items/6.webp" class="card-img-top rounded-2" style="aspect-ratio: 1 / 1"/>395
</a>396
<div class="card-body p-0 pt-2">397
<a href="#!" class="btn btn-light border px-2 pt-2 float-end icon-hover"><i class="fas fa-heart fa-lg px-1 text-secondary"></i></a>398
<h5 class="card-title">$29.95</h5>399
<p class="card-text mb-0">Modern product name here</p>400
<p class="text-muted">401
Model: X-200402
</p>403
</div>404
</div>405
</div>406
<div class="col-lg-3 col-md-6 col-sm-6">407
<div class="card my-2 shadow-0">408
<a href="#" class="">409
<img src="https://mdbootstrap.com/img/bootstrap-ecommerce/items/7.webp" class="card-img-top rounded-2" style="aspect-ratio: 1 / 1"/>410
</a>411
<div class="card-body p-0 pt-2">412
<a href="#!" class="btn btn-light border px-2 pt-2 float-end icon-hover"><i class="fas fa-heart fa-lg px-1 text-secondary"></i></a>413
<h5 class="card-title">$29.95</h5>414
<p class="card-text mb-0">Modern product name here</p>415
<p class="text-muted">416
Sizes: S, M, XL417
</p>418
</div>419
</div>420
</div>421
<div class="col-lg-3 col-md-6 col-sm-6">422
<div class="card my-2 shadow-0">423
<a href="#" class="">424
<img src="https://mdbootstrap.com/img/bootstrap-ecommerce/items/8.webp" class="card-img-top rounded-2" style="aspect-ratio: 1 / 1"/>425
</a>426
<div class="card-body p-0 pt-2">427
<a href="#!" class="btn btn-light border px-2 pt-2 float-end icon-hover"><i class="fas fa-heart fa-lg px-1 text-secondary"></i></a>428
<h5 class="card-title">$29.95</h5>429
<p class="card-text mb-0">Modern product name here</p>430
<p class="text-muted">431
Material: Jeans432
</p>433
</div>434
</div>435
</div>436
</div>437
</div>438
</section>439
<!-- Products -->440
441
<!-- Features -->442
<section>443
<div class="container">444
<div class="card p-4 bg-primary">445
<div class="row align-items-center">446
<div class="col">447
<h4 class="mb-0 text-white">Best products and brands in store</h4>448
<p class="mb-0 text-white-50">Trendy products and text to build on the card title</p>449
</div>450
<div class="col-auto"><a class="btn btn-white text-primary shadow-0" href="#">Discover</a></div>451
</div>452
</div>453
</div>454
</section>455
<!-- Features -->456
457
<!-- Recommended -->458
<section>459
<div class="container my-5">460
<header class="mb-4">461
<h3>Recommended</h3>462
</header>463
464
<div class="row">465
<div class="col-lg-3 col-md-6 col-sm-6">466
<div class="card my-2 shadow-0">467
<a href="#" class="">468
<img src="https://mdbootstrap.com/img/bootstrap-ecommerce/items/9.webp" class="card-img-top rounded-2" style="aspect-ratio: 1 / 1"/>469
</a>470
<div class="card-body p-0 pt-3">471
<a href="#!" class="btn btn-light border px-2 pt-2 float-end icon-hover"><i class="fas fa-heart fa-lg px-1 text-secondary"></i></a>472
<h5 class="card-title">$17.00</h5>473
<p class="card-text mb-0">Blue jeans shorts for men</p>474
<p class="text-muted">475
Sizes: S, M, XL476
</p>477
</div>478
</div>479
</div>480
<div class="col-lg-3 col-md-6 col-sm-6">481
<div class="card my-2 shadow-0">482
<a href="#" class="">483
<img src="https://mdbootstrap.com/img/bootstrap-ecommerce/items/10.webp" class="card-img-top rounded-2"style="aspect-ratio: 1 / 1" />484
</a>485
<div class="card-body p-0 pt-2">486
<a href="#!" class="btn btn-light border px-2 pt-2 float-end icon-hover"><i class="fas fa-heart fa-lg px-1 text-secondary"></i></a>487
<h5 class="card-title">$9.50</h5>488
<p class="card-text mb-0">Slim fit T-shirt for men</p>489
<p class="text-muted">490
Sizes: S, M, XL491
</p>492
</div>493
</div>494
</div>495
<div class="col-lg-3 col-md-6 col-sm-6">496
<div class="card my-2 shadow-0">497
<a href="#" class="">498
<img src="https://mdbootstrap.com/img/bootstrap-ecommerce/items/11.webp" class="card-img-top rounded-2" style="aspect-ratio: 1 / 1"/>499
</a>500
<div class="card-body p-0 pt-2">501
<a href="#!" class="btn btn-light border px-2 pt-2 float-end icon-hover"><i class="fas fa-heart fa-lg px-1 text-secondary"></i></a>502
<h5 class="card-title">$29.95</h5>503
<p class="card-text mb-0">Modern product name here</p>504
<p class="text-muted">505
Sizes: S, M, XL506
</p>507
</div>508
</div>509
</div>510
<div class="col-lg-3 col-md-6 col-sm-6">511
<div class="card my-2 shadow-0">512
<a href="#" class="">513
<img src="https://mdbootstrap.com/img/bootstrap-ecommerce/items/12.webp" class="card-img-top rounded-2" style="aspect-ratio: 1 / 1"/>514
</a>515
<div class="card-body p-0 pt-2">516
<a href="#!" class="btn btn-light border px-2 pt-2 float-end icon-hover"><i class="fas fa-heart fa-lg px-1 text-secondary"></i></a>517
<h5 class="card-title">$29.95</h5>518
<p class="card-text mb-0">Modern product name here</p>519
<p class="text-muted">520
Material: Jeans521
</p>522
</div>523
</div>524
</div>525
</div>526
</div>527
</section>528
<!-- Recommended -->529
530
<!-- Footer -->531
<footer class="text-center text-lg-start bg-light text-muted">532
<!-- Section: Social media -->533
<section class="p-4" style="background-color: rgba(0, 0, 0, 0.05);">534
<div class="container">535
<div class="row d-flex">536
<!-- Left -->537
<div class="col-md-6 col-sm-12 mb-2 mb-md-0 d-flex justify-content-center justify-content-md-start">538
<div class="">539
<div class="input-group" style="max-width: 400px;">540
<input type="email" class="form-control border" placeholder="Email" aria-label="Email" aria-describedby="button-addon2" />541
<button class="btn btn-light border" type="button" id="button-addon2" data-mdb-ripple-color="dark">542
Subscribe543
</button>544
</div>545
</div>546
</div>547
<!-- Left -->548
549
<!-- Right -->550
<div class="col-md-6 col-sm-12 float-center">551
<div class="float-md-end">552
<a class="btn btn-icon btn-light text-secondary px-3 border" title="Facebook" target="_blank" href="#"><i class="fab fa-facebook-f fa-lg"></i></a>553
<a class="btn btn-icon btn-light text-secondary px-3 border" title="Instagram" target="_blank" href="#"><i class="fab fa-instagram fa-lg"></i></a>554
<a class="btn btn-icon btn-light text-secondary px-3 border" title="Youtube" target="_blank" href="#"><i class="fab fa-youtube fa-lg"></i></a>555
<a class="btn btn-icon btn-light text-secondary px-3 border" title="Twitter" target="_blank" href="#"><i class="fab fa-twitter fa-lg"></i></a>556
</div>557
</div>558
<!-- Right -->559
</div>560
</div>561
</section>562
<!-- Section: Social media -->563
564
<!-- Section: Links -->565
<section class="">566
<div class="container text-center text-md-start mt-5 mb-4">567
<!-- Grid row -->568
<div class="row mt-3">569
<!-- Grid column -->570
<div class="col-12 col-lg-3 col-sm-12">571
<!-- Content -->572
<a href="https://mdbootstrap.com/" target="_blank" class="ms-md-2">573
<img src="https://mdbootstrap.com/img/logo/mdb-transaprent-noshadows.png" height="35" />574
</a>575
<p class="mt-3">576
© 2023 Copyright: MDBootstrap.com.577
</p>578
</div>579
<!-- Grid column -->580
581
<!-- Grid column -->582
<div class="col-6 col-sm-4 col-lg-2">583
<!-- Links -->584
<h6 class="text-uppercase text-dark fw-bold mb-2">585
Store586
</h6>587
<ul class="list-unstyled mb-4">588
<li><a class="text-muted" href="#">About us</a></li>589
<li><a class="text-muted" href="#">Find store</a></li>590
<li><a class="text-muted" href="#">Categories</a></li>591
<li><a class="text-muted" href="#">Blogs</a></li>592
</ul>593
</div>594
<!-- Grid column -->595
596
<!-- Grid column -->597
<div class="col-6 col-sm-4 col-lg-2">598
<!-- Links -->599
<h6 class="text-uppercase text-dark fw-bold mb-2">600
Information601
</h6>602
<ul class="list-unstyled mb-4">603
<li><a class="text-muted" href="#">Help center</a></li>604
<li><a class="text-muted" href="#">Money refund</a></li>605
<li><a class="text-muted" href="#">Shipping info</a></li>606
<li><a class="text-muted" href="#">Refunds</a></li>607
</ul>608
</div>609
<!-- Grid column -->610
611
<!-- Grid column -->612
<div class="col-6 col-sm-4 col-lg-2">613
<!-- Links -->614
<h6 class="text-uppercase text-dark fw-bold mb-2">615
Support616
</h6>617
<ul class="list-unstyled mb-4">618
<li><a class="text-muted" href="#">Help center</a></li>619
<li><a class="text-muted" href="#">Documents</a></li>620
<li><a class="text-muted" href="#">Account restore</a></li>621
<li><a class="text-muted" href="#">My orders</a></li>622
</ul>623
</div>624
<!-- Grid column -->625
626
<!-- Grid column -->627
<div class="col-12 col-sm-12 col-lg-3">628
<!-- Links -->629
<h6 class="text-uppercase text-dark fw-bold mb-2">Our apps</h6>630
<a href="#" class="mb-2 d-inline-block"> <img src="https://mdbootstrap.com/img/bootstrap-ecommerce/misc/btn-appstore.webp" height="38" /></a>631
<a href="#" class="mb-2 d-inline-block"> <img src="https://mdbootstrap.com/img/bootstrap-ecommerce/misc/btn-market.webp" height="38" /></a>632
</div>633
<!-- Grid column -->634
</div>635
<!-- Grid row -->636
</div>637
</section>638
<!-- Section: Links -->639
<div class="container">640
<div class="py-4 border-top">641
<div class="d-flex justify-content-between">642
<!--- payment --->643
<div class="text-dark">644
<i class="fab fa-lg fa-cc-visa"></i>645
<i class="fab fa-lg fa-cc-amex"></i>646
<i class="fab fa-lg fa-cc-mastercard"></i>647
<i class="fab fa-lg fa-cc-paypal"></i>648
</div>649
<!--- payment --->650
651
<!--- language selector --->652
<div class="dropdown dropup">653
<a class="dropdown-toggle text-dark" href="#" id="Dropdown" role="button" data-mdb-toggle="dropdown" aria-expanded="false"> <i class="flag-united-kingdom flag m-0"></i> English </a>654
655
<ul class="dropdown-menu dropdown-menu-end" aria-labelledby="Dropdown">656
<li>657
<a class="dropdown-item" href="#"><i class="flag-united-kingdom flag"></i>English <i class="fa fa-check text-success ms-2"></i></a>658
</li>659
<li><hr class="dropdown-divider" /></li>660
<li>661
<a class="dropdown-item" href="#"><i class="flag-poland flag"></i>Polski</a>662
</li>663
<li>664
<a class="dropdown-item" href="#"><i class="flag-china flag"></i>中文</a>665
</li>666
<li>667
<a class="dropdown-item" href="#"><i class="flag-japan flag"></i>日本語</a>668
</li>669
<li>670
<a class="dropdown-item" href="#"><i class="flag-germany flag"></i>Deutsch</a>671
</li>672
<li>673
<a class="dropdown-item" href="#"><i class="flag-france flag"></i>Français</a>674
</li>675
<li>676
<a class="dropdown-item" href="#"><i class="flag-spain flag"></i>Español</a>677
</li>678
<li>679
<a class="dropdown-item" href="#"><i class="flag-russia flag"></i>Русский</a>680
</li>681
<li>682
<a class="dropdown-item" href="#"><i class="flag-portugal flag"></i>Português</a>683
</li>684
</ul>685
</div>686
<!--- language selector --->687
</div>688
</div>689
</div>690
</footer>691
<!-- Footer -->xxxxxxxxxx1
.icon-hover:hover {2
border-color: #3b71ca !important;3
background-color: white !important;4
}5
6
.icon-hover:hover i {7
color: #3b71ca !important;8
}1
1
Console errors: 0