Dark footer
Dark style of footer layouts.
Dark footer #1 #
<footer class="main-footer main-footer-style-02 pt-13 pb-42 bg-lighter-dark">
<div class="footer-second">
<div class="container">
<div class="row">
<div class="col-sm-6 col-lg-4 mb-6 mb-lg-0">
<h5 class="mb-4 text-white">Thedir.com</h5>
<p class="text-gray mb-0">
Thedir making dining smoother and<br> more enjoyable with services
like<br> online ordering and table<br>
reservations.</p>
</div>
<div class="col-sm-6 col-lg mb-6 mb-lg-0">
<h5 class="mb-4 text-white">
Company
</h5>
<ul class="list-group list-group-flush list-group-borderless">
<li class="list-group-item px-0 lh-14 bg-transparent py-1">
<a href="../page-about.html" class="link-hover-gray-white">About</a>
</li>
<li class="list-group-item px-0 lh-14 bg-transparent py-1">
<a href="../page-contact.html" class="link-hover-gray-white">Contact</a>
</li>
<li class="list-group-item px-0 lh-14 bg-transparent py-1">
<a href="#" class="link-hover-gray-white">Testimonials</a>
</li>
<li class="list-group-item px-0 lh-14 bg-transparent py-1">
<a href="../blog-listing-grid.html" class="link-hover-gray-white">Blog</a>
</li>
<li class="list-group-item px-0 lh-14 bg-transparent py-1">
<a href="#" class="link-hover-gray-white">Careers</a>
</li>
</ul>
</div>
<div class="col-sm-6 col-lg mb-6 mb-lg-0">
<h5 class="mb-4 text-white">
Help Center
</h5>
<ul class="list-group list-group-flush list-group-borderless">
<li class="list-group-item px-0 lh-14 bg-transparent py-1">
<a href="../page-faqs.html" class="link-hover-gray-white">FAQS</a>
</li>
<li class="list-group-item px-0 lh-14 bg-transparent py-1">
<a href="../page-pricing-plan.html" class="link-hover-gray-white">Pricing Plan</a>
</li>
<li class="list-group-item px-0 lh-14 bg-transparent py-1">
<a href="../page-privacy-policy.html" class="link-hover-gray-white">Policy</a>
</li>
<li class="list-group-item px-0 lh-14 bg-transparent py-1">
<a href="../page-terms-and-condition.html" class="link-hover-gray-white">Terms & Condition</a>
</li>
<li class="list-group-item px-0 lh-14 bg-transparent py-1">
<a href="#" class="link-hover-gray-white">Affiliate Program</a>
</li>
<li class="list-group-item px-0 lh-14 bg-transparent py-1">
<a href="#" class="link-hover-gray-white">Merchandise</a>
</li>
<li class="list-group-item px-0 lh-14 bg-transparent py-1">
<a href="../page-how-it-work.html" class="link-hover-gray-white">How It Works</a>
</li>
</ul>
</div>
<div class="col-sm-6 col-lg-3">
<h5 class="mb-4 text-white">Connect</h5>
<div class="text-gray">5th Floor, 90 Orchard St, New York,<br>
Ny 10020, United States<br>
hello@thedir.co<br>
(0031) - 2568 - 375
</div>
</div>
</div>
</div>
</div>
<div class="footer-last mt-12">
<div class="container">
<div class="footer-last-container row ">
<div class="col-lg-8">
<div class="copy-right text-gray">
© 2020 <a href="../index.html" class="text-white font-weight-semibold">The Dir.</a> All Rights Resevered. Design by <a
href="http://g5plus.net/" class="text-white font-weight-semibold">G5Theme</a>
</div>
</div>
<div class="col-lg-4">
<div class="social-icon light-color ml-0 ml-lg-auto mt-4 mt-lg-0 d-flex align-items-center flex-wrap">
<span class="d-inline-block mr-4">Follow us on:</span>
<ul class="list-inline">
<li class="list-inline-item mr-5">
<a target="_blank" title="Twitter" href="#">
<i class="fab fa-twitter">
</i>
<span>Twitter</span>
</a>
</li>
<li class="list-inline-item mr-5">
<a target="_blank" title="Facebook" href="#">
<i class="fab fa-facebook-f">
</i>
<span>Facebook</span>
</a>
</li>
<li class="list-inline-item mr-5">
<a target="_blank" title="Google plus" href="#">
<svg class="icon icon-google-plus-symbol">
<use xlink:href="#icon-google-plus-symbol"></use>
</svg>
<span>Google plus</span>
</a>
</li>
<li class="list-inline-item mr-5">
<a target="_blank" title="Instagram" href="#">
<svg class="icon icon-instagram">
<use xlink:href="#icon-instagram"></use>
</svg>
<span>Instagram</span>
</a>
</li>
<li class="list-inline-item mr-5">
<a target="_blank" title="Rss" href="#">
<i class="fas fa-rss"></i>
<span>Rss</span>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="back-top text-left text-md-right">
<a href="#" class="gtf-back-to-top"><i class="fal fa-chevron-circle-up"></i></a>
</div>
</div>
</footer>
Dark footer #2 #
<footer class="main-footer main-footer-style-02 pt-9 pb-42 bg-lighter-dark">
<div class="footer-second">
<div class="container">
<div class="row">
<div class="item">
<h5 class="mb-4 text-white">Network</h5>
<ul class="list-group list-group-flush list-group-borderless">
<li class="list-group-item px-0 bg-transparent py-0 lh-lg">
<a href="#" class="link-hover-gray-white">Jobs By Categories</a>
</li>
<li class="list-group-item px-0 bg-transparent py-0 lh-lg">
<a href="#" class="link-hover-gray-white">Jobs By Location</a>
</li>
<li class="list-group-item px-0 bg-transparent py-0 lh-lg">
<a href="#" class="link-hover-gray-white">Submit Resume</a>
</li>
<li class="list-group-item px-0 bg-transparent py-0 lh-lg">
<a href="#" class="link-hover-gray-white">Sitemap</a>
</li>
<li class="list-group-item px-0 bg-transparent py-0 lh-lg">
<a href="#" class="link-hover-gray-white">Candicate Dashboard</a>
</li>
<li class="list-group-item px-0 bg-transparent py-0 lh-lg">
<a href="#" class="link-hover-gray-white">My Bookmarks</a>
</li>
</ul>
</div>
<div class="item">
<h5 class="mb-4 text-white">
Company
</h5>
<ul class="list-group list-group-flush list-group-borderless">
<li class="list-group-item px-0 bg-transparent py-0 lh-lg">
<a href="../page-about.html" class="link-hover-gray-white">About</a>
</li>
<li class="list-group-item px-0 bg-transparent py-0 lh-lg">
<a href="../page-contact.html" class="link-hover-gray-white">Contact</a>
</li>
<li class="list-group-item px-0 bg-transparent py-0 lh-lg">
<a href="#" class="link-hover-gray-white">Testimonials</a>
</li>
<li class="list-group-item px-0 bg-transparent py-0 lh-lg">
<a href="../blog-listing-grid.html" class="link-hover-gray-white">Blog</a>
</li>
<li class="list-group-item px-0 bg-transparent py-0 lh-lg">
<a href="#" class="link-hover-gray-white">Careers</a>
</li>
</ul>
</div>
<div class="item">
<h5 class="mb-4 text-white">
Help Center
</h5>
<ul class="list-group list-group-flush list-group-borderless">
<li class="list-group-item px-0 bg-transparent py-0 lh-lg">
<a href="../page-faqs.html" class="link-hover-gray-white">FAQS</a>
</li>
<li class="list-group-item px-0 bg-transparent py-0 lh-lg">
<a href="../page-pricing-plan.html" class="link-hover-gray-white">Pricing Plan</a>
</li>
<li class="list-group-item px-0 bg-transparent py-0 lh-lg">
<a href="../page-privacy-policy.html" class="link-hover-gray-white">Policy</a>
</li>
<li class="list-group-item px-0 bg-transparent py-0 lh-lg">
<a href="../page-terms-and-condition.html" class="link-hover-gray-white">Terms & Condition</a>
</li>
<li class="list-group-item px-0 bg-transparent py-0 lh-lg">
<a href="#" class="link-hover-gray-white">Affiliate Program</a>
</li>
<li class="list-group-item px-0 bg-transparent py-0 lh-lg">
<a href="#" class="link-hover-gray-white">Merchandise</a>
</li>
<li class="list-group-item px-0 bg-transparent py-0 lh-lg">
<a href="../page-how-it-work.html" class="link-hover-gray-white">How It Works</a>
</li>
</ul>
</div>
<div class="col-md-6 col-lg-4 mb-6 mb-lg-0">
<h5 class="mb-4 text-white">Newsletter</h5>
<div class="text-gray mb-6">Subscribe to our newsletter to get the latest jobs
posted, candidates ,and other latest news stay updated.
</div>
<div class="form-newsletter">
<form>
<div class="input-group">
<input type="text"
class="form-control bg-secondary"
placeholder="Email Address... ">
<button type="button" class="input-group-append btn btn-primary font-size-lg px-4 lh-1">
<i class="fal fa-chevron-right"></i>
</button>
</div>
</form>
</div>
</div>
</div>
</div>
</div>
<div class="footer-last mt-12">
<div class="container">
<div class="row align-items-center">
<div class="col-lg-8 mb-3 mb-lg-0">
<div >
© 2020 <a href="../index.html" class="text-white font-weight-semibold">The Dir.</a> All Rights Resevered. Design by <a
href="http://g5plus.net/" class="text-white font-weight-semibold">G5Theme</a>
</div>
</div>
<div class="col-lg-4">
<div class="social-icon light-color d-flex align-items-center flex-wrap">
<span class="d-inline-block mr-4 mb-0 text-gray">Follow us on:</span>
<ul class="list-inline">
<li class="list-inline-item mr-5">
<a target="_blank" title="Twitter" href="#">
<i class="fab fa-twitter">
</i>
<span>Twitter</span>
</a>
</li>
<li class="list-inline-item mr-5">
<a target="_blank" title="Facebook" href="#">
<i class="fab fa-facebook-f">
</i>
<span>Facebook</span>
</a>
</li>
<li class="list-inline-item mr-5">
<a target="_blank" title="Google plus" href="#">
<svg class="icon icon-google-plus-symbol">
<use xlink:href="#icon-google-plus-symbol"></use>
</svg>
<span>Google plus</span>
</a>
</li>
<li class="list-inline-item mr-5">
<a target="_blank" title="Instagram" href="#">
<svg class="icon icon-instagram">
<use xlink:href="#icon-instagram"></use>
</svg>
<span>Instagram</span>
</a>
</li>
<li class="list-inline-item mr-5">
<a target="_blank" title="Rss" href="#">
<i class="fas fa-rss"></i>
<span>Rss</span>
</a>
</li>
</ul>
</div>
</div>
</div>
</div>
<div class="back-top text-left text-md-right">
<a href="#" class="gtf-back-to-top"><i class="fal fa-chevron-circle-up"></i></a>
</div>
</div>
</footer>