[HTML] menu a discesa

<nav class="animated bounceInDown">
<li>
<a href="#profile">
<div class="fa fa-user"></div>
Profile
</a>
</li><ul>
<li>
<a href="#message">
<div class="fa fa-envelope"></div>
Messages
<span class="badge right">12</span>
</a>
</li>
<li class="sub-menu">
<a href="#settings">
<div class="fa fa-gear"></div>
Settings
<div class="fa right fa-caret-down"></div>
</a>
<ul style="display: none;">
<li>
<a href="#settings">
Account
</a>
</li>
<li>
<a href="#settings">
Profile
</a>
</li>
<li>
<a href="#settings">
Secruity &amp; Privacy
</a>
</li>
<li>
<a href="#settings">
Password
</a>
</li>
<li>
<a href="#settings">
Notification
</a>
</li>
</ul>
</li>
<li class="sub-menu">
<a href="#message">
<div class="fa fa-question-circle"></div>
Help
<div class="fa right fa-caret-down"></div>
</a>
<ul style="display: none;">
<li>
<a href="#settings">
FAQ's
</a>
</li>
<li>
<a href="#settings">
Submit a Ticket
</a>
</li>
<li>
<a href="#settings">
Network Status
</a>
</li>
</ul>
</li>
<li>
<a href="#message">
<div class="fa fa-sign-out"></div>
Logout
</a>
</li>
</ul>
</nav>