<!--begin:Footer-->
<footer id="footer" class="bg-dark footer position-relative" data-bs-theme="dark">
<div class="container pt-9 pt-lg-11">
<div class="row">
<div class="col-md-12 col-lg-4 mb-5 h-100 me-auto">
<!--Title-->
<h2 class="display-6 text-white mb-0 position-relative">
Work with us
</h2>
<div class="pt-3 mb-6">
<a class="link-underline link-light fs-5" href="mailto:mail@doamin.com">mail@domain.com</a>
</div>
<!--:Dark Mode:-->
<div class="d-inline-flex align-items-center dropup mt-6">
<button class="btn border text-body py-1 px-3 dropdown-toggle d-flex align-items-center"
id="assan-theme" type="button" aria-expanded="false" data-bs-toggle="dropdown"
data-bs-display="static">
<span class="theme-icon-active d-flex align-items-center">
<small>Current theme</small> <i class="bx align-middle ms-2"></i>
</span>
</button>
<!--:Dark Mode Options:-->
<ul class="dropdown-menu" aria-labelledby="assan-theme" style="--bs-dropdown-min-width: 9rem;">
<li class="mb-1">
<button type="button" class="dropdown-item d-flex align-items-center active"
data-bs-theme-value="light">
<span class="theme-icon d-flex align-items-center">
<i class="bx bx-sun align-middle me-2"> </i>
</span>
Light
</button>
</li>
<li class="mb-1">
<button type="button" class="dropdown-item d-flex align-items-center"
data-bs-theme-value="dark">
<span class="theme-icon d-flex align-items-center">
<i class="bx bx-moon align-middle me-2"></i>
</span>
Dark
</button>
</li>
<li>
<button type="button" class="dropdown-item d-flex align-items-center"
data-bs-theme-value="auto">
<span class="theme-icon d-flex align-items-center">
<i class="bx bx-color-fill align-middle me-2"></i>
</span>
Auto
</button>
</li>
</ul>
</div>
</div>
<div class="col-sm-4 col-lg-2 mb-5 mb-md-0 ms-auto h-100">
<!--Title-->
<h6 class="small mb-3 mb-lg-4 text-white-50">Learn</h6>
<!--Nav-->
<ul class="nav flex-column mb-0">
<li class="nav-item"><a class="nav-link" href="#!">Design</a></li>
<li class="nav-item"><a class="nav-link" href="#!">Digital</a></li>
<li class="nav-item"><a class="nav-link" href="#!">Development</a></li>
<li class="nav-item"><a class="nav-link" href="#!">Branding</a></li>
<li class="nav-item"><a class="nav-link" href="#!">Graphics</a></li>
<li class="nav-item"><a class="nav-link" href="#!">Process</a></li>
</ul>
</div>
<!--/.Col-->
<div class="col-sm-4 col-lg-2 mb-5 h-100">
<!--Title-->
<h6 class="small mb-3 mb-lg-4 text-white-50">Resources</h6>
<!--Nav-->
<ul class="nav flex-column mb-0">
<li class="nav-item"><a class="nav-link" href="#!">Elements</a></li>
<li class="nav-item"><a class="nav-link" href="#!">Pricing</a></li>
<li class="nav-item"><a class="nav-link" href="#!">Features</a></li>
<li class="nav-item"><a class="nav-link" href="#!">Blog</a></li>
<li class="nav-item"><a class="nav-link" href="#!">Credits</a></li>
<li class="nav-item"><a class="nav-link" href="#!">Updates</a></li>
<li class="nav-item"><a class="nav-link" href="#!">Help center</a></li>
<li class="nav-item"><a class="nav-link" href="#!">Events</a></li>
</ul>
</div>
<!--/.Col-->
<div class="col-sm-4 col-lg-3 col-xl-2 mb-5 mb-sm-0 h-100">
<!--Title-->
<h6 class="small mb-3 mb-lg-4 text-white-50">Company</h6>
<!--Nav-->
<ul class="nav flex-column mb-0">
<li class="nav-item"><a class="nav-link" href="#!">About</a></li>
<li class="nav-item"><a class="nav-link" href="#!">Awwards</a></li>
<li class="nav-item">
<a class="nav-link" href="#!">Careers
<span class="badge badge-pill ms-1 bg-primary">Hiring</span>
</a>
</li>
<li class="nav-item"><a class="nav-link" href="#!">Customers</a></li>
<li class="nav-item"><a class="nav-link" href="#!">Affiliate</a></li>
<li class="nav-item"><a class="nav-link" href="#!">Contact us</a></li>
<li class="nav-item"><a class="nav-link" href="#!">Terms of use</a></li>
<li class="nav-item"><a class="nav-link" href="#!">Privacy policy</a></li>
</ul>
</div>
<!--/.Col-->
</div>
<hr class="mb-5 mt-0 text-white">
</div> <!-- / .container -->
<div class="pb-5">
<div class="container">
<div class="row justify-content-md-between align-items-center">
<div class="d-flex mb-3 mb-md-0 col-sm-6 col-md-4">
<!-- Social button -->
<a href="#!" class="d-inline-block text-white mb-1 me-2 si rounded-pill si-hover-facebook">
<i class="bx bxl-facebook fs-5"></i>
<i class="bx bxl-facebook fs-5"></i>
</a>
<!-- Social button -->
<a href="#!" class="d-inline-block text-white mb-1 me-2 si rounded-pill si-hover-twitter">
<i class="bx bxl-twitter fs-5"></i>
<i class="bx bxl-twitter fs-5"></i>
</a>
<!-- Social button -->
<a href="#!" class="d-inline-block text-white mb-1 me-2 si rounded-pill si-hover-linkedin">
<i class="bx bxl-linkedin fs-5"></i>
<i class="bx bxl-linkedin fs-5"></i>
</a>
<!-- Social button -->
<a href="#!" class="d-inline-block text-white mb-1 si rounded-pill si-hover-instagram">
<i class="bx bxl-instagram fs-5"></i>
<i class="bx bxl-instagram fs-5"></i>
</a>
</div>
<div class="col-sm-6 col-md-4 text-sm-end">
<span class="d-block lh-sm small text-white-50">© Copyright
<script>
document.write(new Date().getFullYear())
</script>. Assan
</span>
</div>
</div>
</div>
</div>
</footer>
<!--end:Footer-->