Header sticky boxed

Build stunning website faster than ever


<header class="z-fixed pt-3 header-absolute-top header-boxed header-sticky">
 <div class="container text-white position-relative d-none d-lg-block">
  <div class="row">
   <div class="col-md-8 ms-auto">
    <div class="d-flex justify-content-end">
     <a href="tel:+011234567890" class="text-white small me-4">
       <i class="bx bx-devices me-1"></i>+01 1234 567 890
     </a>
     <a href="mailto:consult@company.com" class="text-white small">
      <i class="bx bx-envelope me-1"></i>
     consult@company.com
     </a>
    </div>
   </div>
  </div>
 </div>
 <!--Navbar boxed-->
 <div class="navbar-boxed">
 <div class="container">
 <!--Navbar-->
 <nav class="navbar navbar-expand-lg navbar-light navbar-link-white rounded-3">
   <a class="navbar-brand" href="index.html">
      <img src="assets/img/logo/logo.svg" alt="" class="img-fluid navbar-brand-sticky">
      <img src="assets/img/logo/logo-white.svg" alt="" class="img-fluid navbar-brand-transparent">
   </a>
 <div class="d-flex align-items-center navbar-no-collapse-items order-lg-last">
   <button class="navbar-toggler order-last" type="button"
    data-bs-toggle="collapse" data-bs-target="#mainNavbarTheme" aria-controls="mainNavbarTheme"
    aria-expanded="false" aria-label="Toggle navigation">
     <span class="navbar-toggler-icon"> <i></i> </span>
   </button>
  <div class="nav-item me-2 me-lg-0">
     <a href="#" class="btn btn-primary py-1 px-3">Get started
     </a>
  </div>
 </div>
 <!--Navbar Collapse-->
  <div class="collapse navbar-collapse" id="mainNavbarTheme">
   <!--Navbar items-->
    <ul class="navbar-nav ms-auto">
      <li class="nav-item">
       <a class="nav-link" href="#">Home</a>
      </li>
      <li class="nav-item">
        <a class="nav-link" href="#">About</a>
      </li>
      <li class="nav-item dropdown">
         <a class="nav-link dropdown-toggle" href="#" data-bs-toggle="dropdown">Dropdown Nav</a>
         <div class="dropdown-menu dropdown-menu-end">
         <a href="#" class="dropdown-item">Dropdown item</a>
         <a href="#" class="dropdown-item">Dropdown item</a>
         <a href="#" class="dropdown-item">Dropdown item</a>
          <a href="#" class="dropdown-item">Dropdown item</a>
       </div>
       </li>
       <li class="nav-item">
           <a class="nav-link" href="#">Projects</a>
       </li>
       <li class="nav-item">
           <a class="nav-link" href="#">Contact</a>
       </li>
     </ul>  
    </div>
   </nav>
  </div>
 </div>
</header>

                
  <!-- Bootstrap + Vendor + Theme -->
  <link href="assets/css/theme.min.css" rel="stylesheet">

                
  <!-- Bootstrap + Vendor + Theme -->
  <script src="assets/css/theme.bundle.js"></script>

Let's start building

Stunning websites ease