Search icon
<header class="navbar" role="banner">
<div class="container-center">
<div class="navbar-content">
<div class="navbar-brand">
<a class="brand" href="/" role="">
<span class="sr-only">
AIcrowd
</span>
</a>
</div>
<div class="navbar-search">
<input class="textbox-search" id="" name="" type="search" placeholder="Search">
</div>
<div class="navbar-options">
<ul class="navbar-navigation">
<li class="navbar-navigation-item">
<a class="navbar-navigation-link" href="/">Challenges</a>
</li>
<li class="navbar-navigation-item">
<a class="navbar-navigation-link" href="/">Practice</a>
</li>
<li class="navbar-navigation-item">
<a class="navbar-navigation-link" href="/">Blog</a>
</li>
<li class="navbar-navigation-item">
<button class="btn-dropdown">
More<i class="las la-angle-down"></i>
</button>
<div class="dropdown-menu">
<ul class="dropdown-menu-list">
<li class="dropdown-menu-item">
<a class="dropdown-menu-link" href="/">
Organize a Challenge
</a>
</li>
<li class="dropdown-menu-item">
<a class="dropdown-menu-link" href="/">
User Rankings
</a>
</li>
<li class="dropdown-menu-item">
<a class="dropdown-menu-link" href="/">
FAQ
</a>
</li>
<li class="dropdown-menu-item">
<a class="dropdown-menu-link" href="/">
Our Team
</a>
</li>
<li class="dropdown-menu-item">
<a class="dropdown-menu-link" href="/">
Jobs
</a>
</li>
<hr class="dropdown-menu-divider">
<li class="dropdown-menu-item">
<a class="dropdown-menu-link" href="/">
Contact
</a>
</li>
</ul>
<hr class="dropdown-menu-divider">
<div class="dropdown-menu-follow">
<h4 class="dropdown-menu-title">Follow Us</h4>
<div class="btn-group">
<a class="btn-facebook" href="/" role="button">
<i class="lab la-facebook-f">
<span class="sr-only">
Share on Facebook
</span>
</i>
</a>
<a class="btn-twitter" href="/" role="button">
<i class="lab la-twitter">
<span class="sr-only">
Share on Twitter
</span>
</i>
</a>
<a class="btn-facebook" href="/" role="button">
<i class="lab la-facebook-f">
<span class="sr-only">
Share on Facebook
</span>
</i>
</a>
</div>
</div>
</div>
<!-- /dropdown-menu -->
</li>
</ul>
<a class="btn-search" href="/" role="button">
<i class="las la-search"></i>
<span class="sr-only">
Search icon
</span>
</a>
<button class="btn-menu">
<i class="las la-bars">
<span class="sr-only">
Menu icon
</span>
</button>
<div class="notifications-container">
<button class="btn-notifications">
<i class="las la-bell"></i>
<span class="alert-notification"></span>
<span class="sr-only">
Notifications icon
</span>
</button>
<div class="dropdown-notifications">
<h3 class="dropdown-title">
Notifications
</h3>
<div class="dropdown-notifications-content">
<div class="notification-item-user">
<a class="notification-item-overlay" href="/"></a>
<div class="notification-item-content">
<div class="notification-item-image user-rating-1">
<img class="avatar" src="./../../assets/images/placeholder-user-avatar-1.jpg" alt="User avatar">
</div>
<div class="notification-item-text">
<span class="notification-item-description">
<strong>username</strong> followed you
</span>
<span class="notification-item-time">
2 hours ago
</span>
</div>
</div>
</div>
<div class="notification-item-challenge">
<a class="notification-item-overlay" href="/"></a>
<div class="notification-item-content">
<div class="notification-item-image">
<img class="avatar" src="./../../assets/images/placeholder-challenge-1.png" alt="User avatar">
</div>
<div class="notification-item-text">
<span class="notification-item-description">
You have moved from X to X place in the <strong>Challenge_title</strong> leaderboard
</span>
<span class="notification-item-time">
Yesterday
</span>
</div>
</div>
</div>
<div class="notification-item-user">
<a class="notification-item-overlay" href="/"></a>
<div class="notification-item-content">
<div class="notification-item-image user-rating-4">
<img class="avatar" src="./../../assets/images/placeholder-user-avatar-2.jpg" alt="User avatar">
</div>
<div class="notification-item-text">
<span class="notification-item-description">
<strong>username</strong> followed you
</span>
<span class="notification-item-time">
1 week ago
</span>
</div>
</div>
</div>
<div class="notification-item-challenge">
<a class="notification-item-overlay" href="/"></a>
<div class="notification-item-content">
<div class="notification-item-image">
<img class="avatar" src="./../../assets/images/placeholder-challenge-2.png" alt="User avatar">
</div>
<div class="notification-item-text">
<span class="notification-item-description">
You have moved from X to X place in the <strong>Challenge_title</strong> leaderboard
</span>
<span class="notification-item-time">
2 weeks ago
</span>
</div>
</div>
</div>
</div>
<hr class="dropdown-divider">
<div class="dropdown-link">
<a href="/" class="dropdown-link-content">
<span>View all</span>
<i class="las la-arrow-right"></i>
</a>
</div>
</div>
<!-- /dropdown-notifications -->
</div>
<div class="user-container">
<button class="btn-user">
<div class="user-rating-4">
<img class="avatar" src="./../../assets/images/placeholder-user-avatar-1.jpg" alt="User avatar">
</div>
</button>
<div class="dropdown-menu-user">
<div class="preview-user-detail">
<a class="user-overlay" href="/"></a>
<div class="user-content">
<div class="user-avatar user-rating-1">
<img class="avatar" src="./../../assets/images/placeholder-user-avatar-3.jpg" alt="User avatar">
</div>
<div class="user-text">
<span class="user-name">
Username
</span>
<span class="user-details">
View profile
</span>
</div>
</div>
</div>
<ul class="dropdown-menu-list">
<li class="dropdown-menu-item">
<a class="dropdown-menu-link" href="/">
Edit Profile
</a>
</li>
<li class="dropdown-menu-item">
<a class="dropdown-menu-link" href="/">
Account Settings
</a>
</li>
<hr class="dropdown-menu-divider">
<li class="dropdown-menu-item">
<a class="dropdown-menu-link" href="/">
Log Out
</a>
</li>
</ul>
</div>
<!-- /dropdown-menu-user -->
</div>
</div>
</div>
</div>
</header>