Menus

<nav class="nav-menu">
    <ul>
        <li class="active">
            <i class="icon text-sm zenicon-person up-2"></i>
            <div class="menu-item pl-2">
                <span class="main-text">Account</span>
                <span class="sub-text">Your personal profile and information</span>
            </div>
        </li>
        <li>
            <i class="icon text-sm zenicon-shield up-2"></i>
            <div class="menu-item pl-2">
                <span class="main-text">Billing</span>
                <span class="sub-text">Manage payments and transactions</span>
            </div>
        </li>
        <li>
            <i class="icon text-sm zenicon-https up-2"></i>
            <div class="menu-item pl-2">
                <span class="main-text">Security</span>
                <span class="sub-text">Enhance account safety</span>
            </div>
        </li>
        <li>
            <i class="icon text-sm zenicon-notifications-off up-2"></i>
            <div class="menu-item pl-2">
                <span class="main-text">Notifications</span>
                <span class="sub-text">Customize your site alerts</span>
            </div>
        </li>
        <li>
            <i class="icon text-sm zenicon-ind-in-page up-2"></i>
            <div class="menu-item pl-2">
                <span class="main-text">Preferences</span>
                <span class="sub-text">Personalize your experience</span>
            </div>
        </li>
        <li>
            <i class="icon text-sm zenicon-settings up-2"></i>
            <div class="menu-item pl-2">
                <span class="main-text">Settings</span>
                <span class="sub-text">Access account options</span>
            </div>
        </li>
    </ul>
</nav>