<!-- ========== HEADER ========== -->
<header id="header" class="navbar navbar-expand navbar-dark navbar-fullscreen">
<nav class="container">
<!-- Default Logo -->
<a class="navbar-brand" href="../index.html" aria-label="Front">
<img class="navbar-brand-logo" src="../assets/svg/logos/logo-white.svg" alt="Logo">
</a>
<!-- End Default Logo -->
<!-- Toggler -->
<button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarFullscreenNav" aria-controls="navbarFullscreenNav" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-default">
<i class="bi-list"></i>
</span>
<span class="navbar-toggler-toggled">
<i class="bi-x"></i>
</span>
</button>
<!-- End Toggler -->
<!-- Collapse -->
<div class="collapse navbar-collapse" id="navbarFullscreenNav">
<div class="container">
<div class="navbar-fullscreen-scroller">
<div class="row justify-content-md-between align-items-md-center">
<div class="col-md-6">
<!-- Collapse -->
<ul class="navbar-nav" id="navbarNavCollapse">
<!-- Landings -->
<li class="nav-item">
<a class="nav-link collapsed" href="#" role="button" data-bs-toggle="collapse" data-bs-target="#landingsCollapse" aria-expanded="false" aria-controls="landingsCollapse">Landings</a>
<div id="landingsCollapse" class="navbar-fullscreen-collapse collapse" data-bs-parent="#navbarNavCollapse">
<div id="landingsNavCollapse">
<!-- Classic -->
<div class="nav-item">
<a class="dropdown-item collapsed" href="#" role="button" data-bs-toggle="collapse" data-bs-target="#landingsClassicCollapse" aria-expanded="false" aria-controls="landingsClassicCollapse">Classic</a>
<div id="landingsClassicCollapse" class="navbar-fullscreen-collapse collapse" data-bs-parent="#landingsNavCollapse">
<a class="dropdown-item" href="#">Corporate</a>
<a class="dropdown-item" href="#">Analytics <span class="badge bg-primary rounded-pill ms-1">Hot</span></a>
<a class="dropdown-item" href="#">Studio</a>
<a class="dropdown-item" href="#">Marketing</a>
<a class="dropdown-item" href="#">Advertisement</a>
<a class="dropdown-item" href="#">Consulting</a>
<a class="dropdown-item" href="#">Portfolio</a>
<a class="dropdown-item" href="#">Software</a>
<a class="dropdown-item" href="#">Business</a>
</div>
</div>
<!-- End Classic -->
<!-- App -->
<div class="nav-item">
<a class="dropdown-item collapsed" href="#" role="button" data-bs-toggle="collapse" data-bs-target="#landingsAppCollapse" aria-expanded="false" aria-controls="landingsAppCollapse">App</a>
<div id="landingsAppCollapse" class="navbar-fullscreen-collapse collapse" data-bs-parent="#landingsNavCollapse">
<a class="dropdown-item" href="#">UI Kit</a>
<a class="dropdown-item" href="#">SaaS</a>
<a class="dropdown-item" href="#">Workflow</a>
<a class="dropdown-item" href="#">Payment</a>
<a class="dropdown-item" href="#">Tool</a>
</div>
</div>
<!-- End App -->
<!-- Onepage -->
<div class="nav-item">
<a class="dropdown-item collapsed" href="#" role="button" data-bs-toggle="collapse" data-bs-target="#landingsOnepageCollapse" aria-expanded="false" aria-controls="landingsOnepageCollapse">Onepage</a>
<div id="landingsOnepageCollapse" class="navbar-fullscreen-collapse collapse" data-bs-parent="#landingsNavCollapse">
<a class="dropdown-item" href="#">Corporate</a>
<a class="dropdown-item" href="#">SaaS <span class="badge bg-primary rounded-pill ms-1">Hot</span></a>
</div>
</div>
<!-- End Onepage -->
</div>
</div>
</li>
<!-- End Landings -->
<!-- Company -->
<li class="nav-item">
<a class="nav-link collapsed" href="#" role="button" data-bs-toggle="collapse" data-bs-target="#companyCollapse" aria-expanded="false" aria-controls="companyCollapse">Company</a>
<div id="companyCollapse" class="navbar-fullscreen-collapse collapse" data-bs-parent="#navbarNavCollapse">
<a class="dropdown-item" href="#">About</a>
<a class="dropdown-item" href="#">Services</a>
<a class="dropdown-item" href="#">Customer Stories</a>
<a class="dropdown-item" href="#">Customer Story</a>
<a class="dropdown-item" href="#">Careers</a>
<a class="dropdown-item" href="#">Careers Overview</a>
<a class="dropdown-item" href="#">Hire Us</a>
<a class="dropdown-item" href="#">Pricing</a>
<a class="dropdown-item" href="#">Contacts: Agency</a>
<a class="dropdown-item" href="#">Contacts: Startup</a>
</div>
</li>
<!-- End Company -->
<!-- Account -->
<li class="nav-item">
<a class="nav-link collapsed" href="#" role="button" data-bs-toggle="collapse" data-bs-target="#accountCollapse" aria-expanded="false" aria-controls="accountCollapse">Account</a>
<div id="accountCollapse" class="navbar-fullscreen-collapse collapse" data-bs-parent="#navbarNavCollapse">
<!-- Authentication -->
<div class="nav-item">
<a class="dropdown-item collapsed" href="#" role="button" data-bs-toggle="collapse" data-bs-target="#authenticationCollapse" aria-expanded="false" aria-controls="authenticationCollapse">
Authentication
</a>
<div id="authenticationCollapse" class="navbar-fullscreen-collapse collapse" data-bs-parent="#accountCollapse">
<a class="dropdown-item" href="#">Login</a>
<a class="dropdown-item" href="#">Signup</a>
<a class="dropdown-item" href="#">Reset Password</a>
<a class="dropdown-item" href="#">Login Simple</a>
<a class="dropdown-item" href="#">Signup Simple</a>
<a class="dropdown-item" href="#">Reset Password Simple</a>
</div>
</div>
<!-- End Authentication -->
<a class="dropdown-item" href="#">个人资料</a>
<a class="dropdown-item" href="#">Login & 安全保护</a>
<a class="dropdown-item" href="#">通知</a>
<a class="dropdown-item" href="#">偏好设置</a>
<a class="dropdown-item" href="#">Orders</a>
<a class="dropdown-item" href="#">愿望单</a>
<a class="dropdown-item" href="#">Plans & Payment</a>
<a class="dropdown-item" href="#">地址信息</a>
<a class="dropdown-item" href="#">团队</a>
</div>
</li>
<!-- End Account -->
<!-- Pages -->
<li class="nav-item">
<a class="nav-link collapsed" href="#" role="button" data-bs-toggle="collapse" data-bs-target="#pagesCollapse" aria-expanded="false" aria-controls="pagesCollapse">
Pages
</a>
<div id="pagesCollapse" class="navbar-fullscreen-collapse collapse" data-bs-parent="#navbarNavCollapse">
<div id="pagesNavCollapse">
<a class="dropdown-item" href="#">FAQ</a>
<a class="dropdown-item" href="#">Terms & Conditions</a>
<a class="dropdown-item" href="#">Privacy & Policy</a>
<a class="dropdown-item" href="#">Coming Soon</a>
<a class="dropdown-item" href="#">Maintenance Mode</a>
<a class="dropdown-item" href="#">Status</a>
<a class="dropdown-item" href="#">Invoice</a>
<a class="dropdown-item" href="#">Error 404</a>
</div>
</div>
</li>
<!-- End Pages -->
<!-- Blog -->
<li class="nav-item">
<a class="nav-link collapsed" href="#" role="button" data-bs-toggle="collapse" data-bs-target="#blogCollapse" aria-expanded="false" aria-controls="blogCollapse">Blog</a>
<div id="blogCollapse" class="navbar-fullscreen-collapse collapse" data-bs-parent="#navbarNavCollapse">
<a class="dropdown-item" href="#">Journal</a>
<a class="dropdown-item" href="#">Metro</a>
<a class="dropdown-item" href="#">Newsroom</a>
<a class="dropdown-item" href="#">Article</a>
<a class="dropdown-item" href="#">Author Profile</a>
</div>
</li>
<!-- End Blog -->
<!-- Portfolio -->
<li class="nav-item">
<a class="nav-link collapsed" href="#" role="button" data-bs-toggle="collapse" data-bs-target="#portfolioCollapse" aria-expanded="false" aria-controls="portfolioCollapse">Portfolio</a>
<div id="portfolioCollapse" class="navbar-fullscreen-collapse collapse" data-bs-parent="#navbarNavCollapse">
<a class="dropdown-item" href="#">Grid</a>
<a class="dropdown-item" href="#">Product Article</a>
<a class="dropdown-item" href="#">Case Studies: Branding</a>
<a class="dropdown-item" href="#">Case Studies: Product</a>
</div>
</li>
<!-- End Portfolio -->
<!-- Demos -->
<li class="nav-item">
<a class="nav-link collapsed" href="#" role="button" data-bs-toggle="collapse" data-bs-target="#demosCollapse" aria-expanded="false" aria-controls="demosCollapse">Demos</a>
<div id="demosCollapse" class="navbar-fullscreen-collapse collapse" data-bs-parent="#navbarNavCollapse">
<a class="dropdown-item" href="#">Main</a>
<a class="dropdown-item" href="#">Real Estate</a>
<a class="dropdown-item" href="#">Jobs</a>
<a class="dropdown-item" href="#">Course</a>
<a class="dropdown-item" href="#">E-commerce</a>
<a class="dropdown-item" href="#">App Marketplace</a>
<a class="dropdown-item" href="#">Help Desk</a>
</div>
</li>
<!-- End Demos -->
<!-- Docs -->
<li class="nav-item">
<a class="nav-link collapsed" href="#" role="button" data-bs-toggle="collapse" data-bs-target="#docsCollapse" aria-expanded="false" aria-controls="docsCollapse">Docs</a>
<div id="docsCollapse" class="navbar-fullscreen-collapse collapse" data-bs-parent="#navbarNavCollapse">
<a class="dropdown-item" href="#">Documentation</a>
<a class="dropdown-item" href="#">Snippets</a>
</div>
</li>
<!-- End Docs -->
</ul>
<!-- End Collapse -->
</div>
<!-- End Col -->
<div class="col-md-4 d-none d-md-inline-block">
<!-- 地址信息 -->
<div class="mb-7">
<span class="text-cap text-white">地址信息</span>
<address class="d-grid gap-1 mb-0">
<span class="text-white-70">+1 (062) 109-9222</span>
<span class="text-white-70">hello@example.com</span>
<span class="text-white-70">马吉贝格威廉姆森广场 153 号, MT 09514</span>
</address>
</div>
<!-- End 地址信息 -->
<!-- Socials -->
<span class="text-cap text-white">Social</span>
<ul class="list-inline mb-0">
<li class="list-inline-item">
<a class="btn btn-soft-light btn-sm btn-icon rounded-circle" href="#">
<i class="bi-facebook"></i>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-soft-light btn-sm btn-icon rounded-circle" href="#">
<i class="bi-google"></i>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-soft-light btn-sm btn-icon rounded-circle" href="#">
<i class="bi-twitter"></i>
</a>
</li>
<li class="list-inline-item">
<a class="btn btn-soft-light btn-sm btn-icon rounded-circle" href="#">
<i class="bi-github"></i>
</a>
</li>
</ul>
<!-- End Socials -->
</div>
<!-- End Col -->
</div>
<!-- End Row -->
</div>
</div>
</div>
<!-- End Collapse -->
</nav>
</header>
<!-- ========== END HEADER ========== -->
<!-- JS Implementing Plugins -->
<script src="../assets/vendor/hs-header/dist/hs-header.min.js"></script>
<!-- JS Plugins Init. -->
<script>
(function() {
// INITIALIZATION OF HEADER
// =======================================================
new HSHeader('#header').init()
document.addEventListener('keydown', e => {
if (e.keyCode && e.keyCode === 27) {
const $header = document.querySelector('#navbarFullscreenNav')
if (!$header.classList.contains('show')) return
new bootstrap.Collapse($header).hide()
}
})
})()
</script>