
Footer
The bottom section of a webpage. Typically contains navigation, widgets and relevant copyright information.
Cartzilla component
Light version
<!-- Light footer -->
<footer class="bg-secondary pt-5">
<div class="container">
<div class="row pb-2">
<div class="col-md-4 col-sm-6">
<div class="widget widget-links pb-2 mb-4">
<h3 class="widget-title">Shop departments</h3>
<ul class="widget-list">
<li class="widget-list-item">
<a href="#" class="widget-list-link">Sneakers & Athletic</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Athletic Apparel</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Sandals</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Jeans</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Shirts & Tops</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Shorts</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">T-Shirts</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Swimwear</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Clogs & Mules</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Bags & Wallets</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Accessories</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Sunglasses & Eyewear</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Watches</a>
</li>
</ul>
</div>
</div>
<div class="col-md-4 col-sm-6">
<div class="widget widget-links pb-2 mb-4">
<h3 class="widget-title">Account & shipping info</h3>
<ul class="widget-list">
<li class="widget-list-item">
<a href="#" class="widget-list-link">Your account</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Shipping rates & policies</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Refunds & replacements</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Order tracking</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Delivery info</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Taxes & fees</a>
</li>
</ul>
</div>
<div class="widget widget-links pb-2 mb-4">
<h3 class="widget-title">About us</h3>
<ul class="widget-list">
<li class="widget-list-item">
<a href="#" class="widget-list-link">About company</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Our team</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Careers</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">News</a>
</li>
</ul>
</div>
</div>
<div class="col-md-4">
<div class="widget pb-2 mb-4">
<h3 class="widget-title pb-1">Stay informed</h3>
<form class="input-group input-group-overlay flex-nowrap">
<div class="input-group-prepend-overlay">
<span class="input-group-text text-muted font-size-base">
<i class="czi-mail"></i>
</span>
</div>
<input class="form-control prepended-form-control" type="email" placeholder="Your email">
<div class="input-group-append">
<button class="btn btn-primary" type="submit">Subscribe*</button>
</div>
</form>
<small class="form-text text-muted">*Subscribe to our newsletter to receive early discount offers, updates and new products info.</small>
</div>
<div class="widget pb-2 mb-4">
<h3 class="widget-title pb-1">Download our app</h3>
<div class="d-flex flex-wrap">
<div class="mr-2 mb-2">
<a class="btn-market btn-apple" href="#" role="button">
<span class="btn-market-subtitle">Download on the</span>
<span class="btn-market-title">App Store</span>
</a>
</div>
<div class="mb-2">
<a class="btn-market btn-google" href="#" role="button">
<span class="btn-market-subtitle">Download on the</span>
<span class="btn-market-title">Google Play</span>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="pt-5" style="background-color: #ecf2f7;">
<div class="container">
<div class="row pb-3">
<div class="col-md-3 col-sm-6 mb-4">
<div class="media">
<i class="czi-rocket text-primary" style="font-size: 2.25rem;"></i>
<div class="media-body pl-3">
<h6 class="font-size-base mb-1">Fast and free delivery</h6>
<p class="mb-0 font-size-ms text-muted">Free delivery for all orders over $200</p>
</div>
</div>
</div>
<div class="col-md-3 col-sm-6 mb-4">
<div class="media">
<i class="czi-currency-exchange text-primary" style="font-size: 2.25rem;"></i>
<div class="media-body pl-3">
<h6 class="font-size-base mb-1">Money back guarantee</h6>
<p class="mb-0 font-size-ms text-muted">We return money within 30 days</p>
</div>
</div>
</div>
<div class="col-md-3 col-sm-6 mb-4">
<div class="media">
<i class="czi-support text-primary" style="font-size: 2.25rem;"></i>
<div class="media-body pl-3">
<h6 class="font-size-base mb-1">24/7 customer support</h6>
<p class="mb-0 font-size-ms text-muted">Friendly 24/7 customer support</p>
</div>
</div>
</div>
<div class="col-md-3 col-sm-6 mb-4">
<div class="media">
<i class="czi-card text-primary" style="font-size: 2.25rem;"></i>
<div class="media-body pl-3">
<h6 class="font-size-base mb-1">Secure online payment</h6>
<p class="mb-0 font-size-ms text-muted">We possess SSL / Secure сertificate</p>
</div>
</div>
</div>
</div>
<hr class="pb-4 mb-3">
<div class="row pb-2">
<div class="col-md-6 text-center text-md-left mb-4">
<div class="text-nowrap mb-4">
<a class="d-inline-block align-middle mt-n1 mr-3" href="#">
<img class="d-block" width="117" src="path-to-logo" alt="Cartzilla"/>
</a>
<div class="btn-group dropdown disable-autohide">
<button class="btn btn-outline-secondary btn-sm dropdown-toggle px-2" type="button" data-toggle="dropdown">
<img class="mr-2" width="20" src="path-to-image" alt="English"/>
Eng / $
</button>
<ul class="dropdown-menu">
<li class="dropdown-item">
<select class="custom-select custom-select-sm">
<option value="usd">$ USD</option>
<option value="eur">€ EUR</option>
<option value="ukp">£ UKP</option>
<option value="jpy">¥ JPY</option>
</select>
</li>
<li>
<a class="dropdown-item pb-1" href="#">
<img class="mr-2" width="20" src="path-to-image" alt="Français"/>
Français
</a>
</li>
<li>
<a class="dropdown-item pb-1" href="#">
<img class="mr-2" width="20" src="path-to-image" alt="Deutsch"/>
Deutsch
</a>
</li>
<li>
<a class="dropdown-item" href="#">
<img class="mr-2" width="20" src="path-to-image" alt="Italiano"/>
Italiano
</a>
</li>
</ul>
</div>
</div>
<div class="widget widget-links">
<ul class="widget-list d-flex flex-wrap justify-content-center justify-content-md-start">
<li class="widget-list-item mr-4">
<a href="#" class="widget-list-link">Outlets</a>
</li>
<li class="widget-list-item mr-4">
<a href="#" class="widget-list-link">Affiliates</a>
</li>
<li class="widget-list-item mr-4">
<a href="#" class="widget-list-link">Support</a>
</li>
<li class="widget-list-item mr-4">
<a href="#" class="widget-list-link">Privacy</a>
</li>
<li class=" widget-list-itemmr-4">
<a href="#" class="widget-list-link">Terms of use</a>
</li>
</ul>
</div>
</div>
<div class="col-md-6 text-center text-md-right mb-4">
<div class="mb-3">
<a class="social-btn sb-outline sb-twitter ml-2 mb-2" href="#"><i class="czi-twitter"></i></a>
<a class="social-btn sb-outline sb-facebook ml-2 mb-2" href="#"><i class="czi-facebook"></i></a>
<a class="social-btn sb-outline sb-instagram ml-2 mb-2" href="#"><i class="czi-instagram"></i></a>
<a class="social-btn sb-outline sb-pinterest ml-2 mb-2" href="#"><i class="czi-pinterest"></i></a>
<a class="social-btn sb-outline sb-youtube ml-2 mb-2" href="#"><i class="czi-youtube"></i></a>
</div>
<img class="d-inline-block" width="187" src="path-to-image" alt="Payment methods"/>
</div>
</div>
<div class="pb-4 font-size-xs text-muted text-center text-md-left">© All rights reserved. Made by <a class="text-muted" href="#">Createx Studio</a></div>
</div>
</div>
</footer>
// Light footer
footer.bg-secondary.pt-5
.container
.row.pb-2
.col-md-4.col-sm-6
.widget.widget-links.pb-2.mb-4
h3.widget-title Shop departments
ul.widget-list
li.widget-list-item
a.widget-list-link(href="#") Sneakers & Athletic
li.widget-list-item
a.widget-list-link(href="#") Athletic Apparel
li.widget-list-item
a.widget-list-link(href="#") Sandals
li.widget-list-item
a.widget-list-link(href="#") Jeans
li.widget-list-item
a.widget-list-link(href="#") Shirts & Tops
li.widget-list-item
a.widget-list-link(href="#") Shorts
li.widget-list-item
a.widget-list-link(href="#") T-Shirts
li.widget-list-item
a.widget-list-link(href="#") Swimwear
li.widget-list-item
a.widget-list-link(href="#") Clogs & Mules
li.widget-list-item
a.widget-list-link(href="#") Bags & Wallets
li.widget-list-item
a.widget-list-link(href="#") Accessories
li.widget-list-item
a.widget-list-link(href="#") Sunglasses & Eyewear
li.widget-list-item
a.widget-list-link(href="#") Watches
.col-md-4.col-sm-6
.widget.widget-links.pb-2.mb-4
h3.widget-title Account & shipping info
ul.widget-list
li.widget-list-item
a.widget-list-link(href="#") Your account
li.widget-list-item
a.widget-list-link(href="#") Shipping rates & policies
li.widget-list-item
a.widget-list-link(href="#") Refunds & replacements
li.widget-list-item
a.widget-list-link(href="#") Order tracking
li.widget-list-item
a.widget-list-link(href="#") Delivery info
li.widget-list-item
a.widget-list-link(href="#") Taxes & fees
.widget.widget-links.pb-2.mb-4
h3.widget-title About us
ul.widget-list
li.widget-list-item
a.widget-list-link(href="#") About company
li.widget-list-item
a.widget-list-link(href="#") Our team
li.widget-list-item
a.widget-list-link(href="#") Careers
li.widget-list-item
a.widget-list-link(href="#") News
.col-md-4
.widget.pb-2.mb-4
h3.widget-title.pb-1 Stay informed
form.input-group.input-group-overlay.flex-nowrap
.input-group-prepend-overlay
span.input-group-text.text-muted.font-size-base
i.czi-mail
input(type="email", placeholder="Your email").form-control.prepended-form-control
.input-group-append
button(type="submit").btn.btn-primary
| Subscribe*
small.form-text.text-muted *Subscribe to our newsletter to receive early discount offers, updates and new products info.
.widget.pb-2.mb-4
h3.widget-title.pb-1 Download our app
.d-flex.flex-wrap
.mr-2.mb-2
a(href="#", role="button").btn-market.btn-apple
span.btn-market-subtitle Download on the
span.btn-market-title App Store
.mb-2
a(href="#", role="button").btn-market.btn-google
span.btn-market-subtitle Download on the
span.btn-market-title Google Play
.pt-5(style="background-color: #ecf2f7;")
.container
.row.pb-3
.col-md-3.col-sm-6.mb-4
.media
i.czi-rocket.text-primary(style="font-size: 2.25rem;")
.media-body.pl-3
h6.font-size-base.mb-1 Fast and free delivery
p.mb-0.font-size-ms.text-muted Free delivery for all orders over $200
.col-md-3.col-sm-6.mb-4
.media
i.czi-currency-exchange.text-primary(style="font-size: 2.25rem;")
.media-body.pl-3
h6.font-size-base.mb-1 Money back guarantee
p.mb-0.font-size-ms.text-muted We return money within 30 days
.col-md-3.col-sm-6.mb-4
.media
i.czi-support.text-primary(style="font-size: 2.25rem;")
.media-body.pl-3
h6.font-size-base.mb-1 24/7 customer support
p.mb-0.font-size-ms.text-muted Friendly 24/7 customer support
.col-md-3.col-sm-6.mb-4
.media
i.czi-card.text-primary(style="font-size: 2.25rem;")
.media-body.pl-3
h6.font-size-base.mb-1 Secure online payment
p.mb-0.font-size-ms.text-muted We possess SSL / Secure сertificate
hr.pb-4.mb-3
.row.pb-2
.col-md-6.text-center.text-md-left.mb-4
.text-nowrap.mb-4
a(href="#").d-inline-block.align-middle.mt-n1.mr-3
+image("path-to-logo", "Cartzilla")(width="117").d-block
.btn-group.dropdown.disable-autohide
button(type="button", data-toggle="dropdown").btn.btn-outline-secondary.btn-sm.dropdown-toggle.px-2
+image("path-to-image", "English")(width="20").mr-2
| Eng / $
ul.dropdown-menu
li.dropdown-item
select.custom-select.custom-select-sm
option(value="usd") $ USD
option(value="eur") € EUR
option(value="ukp") £ UKP
option(value="jpy") ¥ JPY
li
a(href="#").dropdown-item.pb-1
+image("path-to-image", "Français")(width="20").mr-2
| Français
li
a(href="#").dropdown-item.pb-1
+image("path-to-image", "Deutsch")(width="20").mr-2
| Deutsch
li
a(href="#").dropdown-item
+image("path-to-image", "Italiano")(width="20").mr-2
| Italiano
.widget.widget-links
ul.widget-list.d-flex.flex-wrap.justify-content-center.justify-content-md-start
li.widget-list-item.mr-4
a.widget-list-link(href="#") Outlets
li.widget-list-item.mr-4
a.widget-list-link(href="#") Affiliates
li.widget-list-item.mr-4
a.widget-list-link(href="#") Support
li.widget-list-item.mr-4
a.widget-list-link(href="#") Privacy
li.widget-list-item.mr-4
a.widget-list-link(href="#") Terms of use
.col-md-6.text-center.text-md-right.mb-4
.mb-3
a(href="#").social-btn.sb-outline.sb-twitter.ml-2.mb-2
i.czi-twitter
a(href="#").social-btn.sb-outline.sb-facebook.ml-2.mb-2
i.czi-facebook
a(href="#").social-btn.sb-outline.sb-instagram.ml-2.mb-2
i.czi-instagram
a(href="#").social-btn.sb-outline.sb-pinterest.ml-2.mb-2
i.czi-pinterest
a(href="#").social-btn.sb-outline.sb-youtube.ml-2.mb-2
i.czi-youtube
+image("path-to-image", "Payment methods")(width="187").d-inline-block
.pb-4.font-size-xs.text-muted.text-center.text-md-left
| © All rights reserved. Made by
a.text-muted(href="#") Createx Studio
Dark version
<!-- Dark footer -->
<footer class="bg-dark pt-5">
<div class="container">
<div class="row pb-2">
<div class="col-md-4 col-sm-6">
<div class="widget widget-links widget-light pb-2 mb-4">
<h3 class="widget-title text-light">Shop departments</h3>
<ul class="widget-list">
<li class="widget-list-item">
<a href="#" class="widget-list-link">Sneakers & Athletic</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Athletic Apparel</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Sandals</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Jeans</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Shirts & Tops</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Shorts</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">T-Shirts</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Swimwear</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Clogs & Mules</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Bags & Wallets</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Accessories</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Sunglasses & Eyewear</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Watches</a>
</li>
</ul>
</div>
</div>
<div class="col-md-4 col-sm-6">
<div class="widget widget-links widget-light pb-2 mb-4">
<h3 class="widget-title text-light">Account & shipping info</h3>
<ul class="widget-list">
<li class="widget-list-item">
<a href="#" class="widget-list-link">Your account</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Shipping rates & policies</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Refunds & replacements</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Order tracking</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Delivery info</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Taxes & fees</a>
</li>
</ul>
</div>
<div class="widget widget-links widget-light pb-2 mb-4">
<h3 class="widget-title">About us</h3>
<ul class="widget-list">
<li class="widget-list-item">
<a href="#" class="widget-list-link">About company</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Our team</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">Careers</a>
</li>
<li class="widget-list-item">
<a href="#" class="widget-list-link">News</a>
</li>
</ul>
</div>
</div>
<div class="col-md-4">
<div class="widget pb-2 mb-4">
<h3 class="widget-title text-light pb-1">Stay informed</h3>
<form class="input-group input-group-overlay flex-nowrap">
<div class="input-group-prepend-overlay">
<span class="input-group-text text-muted font-size-base">
<i class="czi-mail"></i>
</span>
</div>
<input class="form-control prepended-form-control" type="email" placeholder="Your email">
<div class="input-group-append">
<button class="btn btn-primary" type="submit">Subscribe*</button>
</div>
</form>
<small class="form-text text-light opacity-50">*Subscribe to our newsletter to receive early discount offers, updates and new products info.</small>
</div>
<div class="widget pb-2 mb-4">
<h3 class="widget-title text-light pb-1">Download our app</h3>
<div class="d-flex flex-wrap">
<div class="mr-2 mb-2">
<a class="btn-market btn-apple" href="#" role="button">
<span class="btn-market-subtitle">Download on the</span>
<span class="btn-market-title">App Store</span>
</a>
</div>
<div class="mb-2">
<a class="btn-market btn-google" href="#" role="button">
<span class="btn-market-subtitle">Download on the</span>
<span class="btn-market-title">Google Play</span>
</a>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="pt-5 bg-darker">
<div class="container">
<div class="row pb-3">
<div class="col-md-3 col-sm-6 mb-4">
<div class="media">
<i class="czi-rocket text-primary" style="font-size: 2.25rem;"></i>
<div class="media-body pl-3">
<h6 class="font-size-base text-light mb-1">Fast and free delivery</h6>
<p class="mb-0 font-size-ms text-light opacity-50">Free delivery for all orders over $200</p>
</div>
</div>
</div>
<div class="col-md-3 col-sm-6 mb-4">
<div class="media">
<i class="czi-currency-exchange text-primary" style="font-size: 2.25rem;"></i>
<div class="media-body pl-3">
<h6 class="font-size-base text-light mb-1">Money back guarantee</h6>
<p class="mb-0 font-size-ms text-light opacity-50">We return money within 30 days</p>
</div>
</div>
</div>
<div class="col-md-3 col-sm-6 mb-4">
<div class="media">
<i class="czi-support text-primary" style="font-size: 2.25rem;"></i>
<div class="media-body pl-3">
<h6 class="font-size-base text-light mb-1">24/7 customer support</h6>
<p class="mb-0 font-size-ms text-light opacity-50">Friendly 24/7 customer support</p>
</div>
</div>
</div>
<div class="col-md-3 col-sm-6 mb-4">
<div class="media">
<i class="czi-card text-primary" style="font-size: 2.25rem;"></i>
<div class="media-body pl-3">
<h6 class="font-size-base text-light mb-1">Secure online payment</h6>
<p class="mb-0 font-size-ms text-light opacity-50">We possess SSL / Secure сertificate</p>
</div>
</div>
</div>
</div>
<hr class="hr-light pb-4 mb-3">
<div class="row pb-2">
<div class="col-md-6 text-center text-md-left mb-4">
<div class="text-nowrap mb-4">
<a class="d-inline-block align-middle mt-n1 mr-3" href="#">
<img class="d-block" width="117" src="path-to-logo" alt="Cartzilla"/>
</a>
<div class="btn-group dropdown disable-autohide">
<button class="btn btn-outline-light border-light btn-sm dropdown-toggle px-2" type="button" data-toggle="dropdown">
<img class="mr-2" width="20" src="path-to-image" alt="English"/>
Eng / $
</button>
<ul class="dropdown-menu">
<li class="dropdown-item">
<select class="custom-select custom-select-sm">
<option value="usd">$ USD</option>
<option value="eur">€ EUR</option>
<option value="ukp">£ UKP</option>
<option value="jpy">¥ JPY</option>
</select>
</li>
<li>
<a class="dropdown-item pb-1" href="#">
<img class="mr-2" width="20" src="path-to-image" alt="Français"/>
Français
</a>
</li>
<li>
<a class="dropdown-item pb-1" href="#">
<img class="mr-2" width="20" src="path-to-image" alt="Deutsch"/>
Deutsch
</a>
</li>
<li>
<a class="dropdown-item" href="#">
<img class="mr-2" width="20" src="path-to-image" alt="Italiano"/>
Italiano
</a>
</li>
</ul>
</div>
</div>
<div class="widget widget-links widget-light">
<ul class="widget-list d-flex flex-wrap justify-content-center justify-content-md-start">
<li class="widget-list-item mr-4">
<a href="#" class="widget-list-link">Outlets</a>
</li>
<li class="widget-list-item mr-4">
<a href="#" class="widget-list-link">Affiliates</a>
</li>
<li class="widget-list-item mr-4">
<a href="#" class="widget-list-link">Support</a>
</li>
<li class="widget-list-item mr-4">
<a href="#" class="widget-list-link">Privacy</a>
</li>
<li class=" widget-list-itemmr-4">
<a href="#" class="widget-list-link">Terms of use</a>
</li>
</ul>
</div>
</div>
<div class="col-md-6 text-center text-md-right mb-4">
<div class="mb-3">
<a class="social-btn sb-light sb-twitter ml-2 mb-2" href="#"><i class="czi-twitter"></i></a>
<a class="social-btn sb-light sb-facebook ml-2 mb-2" href="#"><i class="czi-facebook"></i></a>
<a class="social-btn sb-light sb-instagram ml-2 mb-2" href="#"><i class="czi-instagram"></i></a>
<a class="social-btn sb-light sb-pinterest ml-2 mb-2" href="#"><i class="czi-pinterest"></i></a>
<a class="social-btn sb-light sb-youtube ml-2 mb-2" href="#"><i class="czi-youtube"></i></a>
</div>
<img class="d-inline-block" width="187" src="path-to-image" alt="Payment methods"/>
</div>
</div>
<div class="pb-4 font-size-xs text-light opacity-50 text-center text-md-left">© All rights reserved. Made by <a class="text-light" href="#">Createx Studio</a></div>
</div>
</div>
</footer>
// Dark footer
footer.bg-dark.pt-5
.container
.row.pb-2
.col-md-4.col-sm-6
.widget.widget-links.widget-light.pb-2.mb-4
h3.widget-title.text-light Shop departments
ul.widget-list
li.widget-list-item
a.widget-list-link(href="#") Sneakers & Athletic
li.widget-list-item
a.widget-list-link(href="#") Athletic Apparel
li.widget-list-item
a.widget-list-link(href="#") Sandals
li.widget-list-item
a.widget-list-link(href="#") Jeans
li.widget-list-item
a.widget-list-link(href="#") Shirts & Tops
li.widget-list-item
a.widget-list-link(href="#") Shorts
li.widget-list-item
a.widget-list-link(href="#") T-Shirts
li.widget-list-item
a.widget-list-link(href="#") Swimwear
li.widget-list-item
a.widget-list-link(href="#") Clogs & Mules
li.widget-list-item
a.widget-list-link(href="#") Bags & Wallets
li.widget-list-item
a.widget-list-link(href="#") Accessories
li.widget-list-item
a.widget-list-link(href="#") Sunglasses & Eyewear
li.widget-list-item
a.widget-list-link(href="#") Watches
.col-md-4.col-sm-6
.widget.widget-links.widget-light.pb-2.mb-4
h3.widget-title.text-light Account & shipping info
ul.widget-list
li.widget-list-item
a.widget-list-link(href="#") Your account
li.widget-list-item
a.widget-list-link(href="#") Shipping rates & policies
li.widget-list-item
a.widget-list-link(href="#") Refunds & replacements
li.widget-list-item
a.widget-list-link(href="#") Order tracking
li.widget-list-item
a.widget-list-link(href="#") Delivery info
li.widget-list-item
a.widget-list-link(href="#") Taxes & fees
.widget.widget-links.widget-light.pb-2.mb-4
h3.widget-title.text-light About us
ul.widget-list
li.widget-list-item
a.widget-list-link(href="#") About company
li.widget-list-item
a.widget-list-link(href="#") Our team
li.widget-list-item
a.widget-list-link(href="#") Careers
li.widget-list-item
a.widget-list-link(href="#") News
.col-md-4
.widget.pb-2.mb-4
h3.widget-title.text-light.pb-1 Stay informed
form.input-group.input-group-overlay.flex-nowrap
.input-group-prepend-overlay
span.input-group-text.text-muted.font-size-base
i.czi-mail
input(type="email", placeholder="Your email").form-control.prepended-form-control
.input-group-append
button(type="submit").btn.btn-primary
| Subscribe*
small.form-text.text-light.opacity-50 *Subscribe to our newsletter to receive early discount offers, updates and new products info.
.widget.pb-2.mb-4
h3.widget-title.text-light.pb-1 Download our app
.d-flex.flex-wrap
.mr-2.mb-2
a(href="#", role="button").btn-market.btn-apple
span.btn-market-subtitle Download on the
span.btn-market-title App Store
.mb-2
a(href="#", role="button").btn-market.btn-google
span.btn-market-subtitle Download on the
span.btn-market-title Google Play
.pt-5.bg-darker
.container
.row.pb-3
.col-md-3.col-sm-6.mb-4
.media
i.czi-rocket.text-primary(style="font-size: 2.25rem;")
.media-body.pl-3
h6.font-size-base.text-light.mb-1 Fast and free delivery
p.mb-0.font-size-ms.text-light.opacity-50 Free delivery for all orders over $200
.col-md-3.col-sm-6.mb-4
.media
i.czi-currency-exchange.text-primary(style="font-size: 2.25rem;")
.media-body.pl-3
h6.font-size-base.text-light.mb-1 Money back guarantee
p.mb-0.font-size-ms.text-light.opacity-50 We return money within 30 days
.col-md-3.col-sm-6.mb-4
.media
i.czi-support.text-primary(style="font-size: 2.25rem;")
.media-body.pl-3
h6.font-size-base.text-light.mb-1 24/7 customer support
p.mb-0.font-size-ms.text-light.opacity-50 Friendly 24/7 customer support
.col-md-3.col-sm-6.mb-4
.media
i.czi-card.text-primary(style="font-size: 2.25rem;")
.media-body.pl-3
h6.font-size-base.text-light.mb-1 Secure online payment
p.mb-0.font-size-ms.text-light.opacity-50 We possess SSL / Secure сertificate
hr.hr-light.pb-4.mb-3
.row.pb-2
.col-md-6.text-center.text-md-left.mb-4
.text-nowrap.mb-4
a(href="#").d-inline-block.align-middle.mt-n1.mr-3
+image("path-to-logo", "Cartzilla")(width="117").d-block
.btn-group.dropdown.disable-autohide
button(type="button", data-toggle="dropdown").btn.btn-outline-light.border-light.btn-sm.dropdown-toggle.px-2
+image("path-to-image", "English")(width="20").mr-2
| Eng / $
ul.dropdown-menu
li.dropdown-item
select.custom-select.custom-select-sm
option(value="usd") $ USD
option(value="eur") € EUR
option(value="ukp") £ UKP
option(value="jpy") ¥ JPY
li
a(href="#").dropdown-item.pb-1
+image("path-to-image", "Français")(width="20").mr-2
| Français
li
a(href="#").dropdown-item.pb-1
+image("path-to-image", "Deutsch")(width="20").mr-2
| Deutsch
li
a(href="#").dropdown-item
+image("path-to-image", "Italiano")(width="20").mr-2
| Italiano
.widget.widget-links.widget-light
ul.widget-list.d-flex.flex-wrap.justify-content-center.justify-content-md-start
li.widget-list-item.mr-4
a.widget-list-link(href="#") Outlets
li.widget-list-item.mr-4
a.widget-list-link(href="#") Affiliates
li.widget-list-item.mr-4
a.widget-list-link(href="#") Support
li.widget-list-item.mr-4
a.widget-list-link(href="#") Privacy
li.widget-list-item.mr-4
a.widget-list-link(href="#") Terms of use
.col-md-6.text-center.text-md-right.mb-4
.mb-3
a(href="#").social-btn.sb-light.sb-twitter.ml-2.mb-2
i.czi-twitter
a(href="#").social-btn.sb-light.sb-facebook.ml-2.mb-2
i.czi-facebook
a(href="#").social-btn.sb-light.sb-instagram.ml-2.mb-2
i.czi-instagram
a(href="#").social-btn.sb-light.sb-pinterest.ml-2.mb-2
i.czi-pinterest
a(href="#").social-btn.sb-light.sb-youtube.ml-2.mb-2
i.czi-youtube
+image("path-to-image", "Payment methods")(width="187").d-inline-block
.pb-4.font-size-xs.text-light.opacity-50.text-center.text-md-left
| © All rights reserved. Made by
a.text-light(href="#") Createx Studio