Your IP : 3.144.117.52
<!doctype html>
<html lang="en" dir="ltr">
<head>
<!-- META DATA -->
<meta charset="UTF-8">
<meta name='viewport' content='width=device-width, initial-scale=1.0, user-scalable=0'>
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="description" content="Zanex – Bootstrap Admin & Dashboard Template">
<meta name="author" content="Spruko Technologies Private Limited">
<meta name="keywords" content="admin, dashboard, dashboard ui, admin dashboard template, admin panel dashboard, admin panel html, admin panel html template, admin panel template, admin ui templates, administrative templates, best admin dashboard, best admin templates, bootstrap 4 admin template, bootstrap admin dashboard, bootstrap admin panel, html css admin templates, html5 admin template, premium bootstrap templates, responsive admin template, template admin bootstrap 4, themeforest html">
<!-- FAVICON -->
<link rel="shortcut icon" type="image/x-icon" href="../assets/images/brand/favicon.ico" />
<!-- TITLE -->
<title>Zanex – Bootstrap Admin & Dashboard Template</title>
<!-- BOOTSTRAP CSS -->
<link id="style" href="../assets/plugins/bootstrap/css/bootstrap.min.css" rel="stylesheet" />
<!-- STYLE CSS -->
<link href="../assets/css/style.css" rel="stylesheet"/>
<link href="../assets/css/plugins.css" rel="stylesheet"/>
<!--- FONT-ICONS CSS -->
<link href="../assets/css/icons.css" rel="stylesheet"/>
</head>
<body class="app sidebar-mini ltr light-mode">
<!-- GLOBAL-LOADER -->
<div id="global-loader">
<img src="../assets/images/loader.svg" class="loader-img" alt="Loader">
</div>
<!-- /GLOBAL-LOADER -->
<!-- PAGE -->
<div class="page">
<div class="page-main">
<!-- app-Header -->
<div class="app-header header sticky">
<div class="container-fluid main-container">
<div class="d-flex align-items-center">
<a aria-label="Hide Sidebar" class="app-sidebar__toggle" data-bs-toggle="sidebar" href="javascript:void(0);"></a>
<div class="responsive-logo">
<a href="index.html" class="header-logo">
<img src="../assets/images/brand/logo-3.png" class="mobile-logo logo-1" alt="logo">
<img src="../assets/images/brand/logo.png" class="mobile-logo dark-logo-1" alt="logo">
</a>
</div>
<!-- sidebar-toggle-->
<a class="logo-horizontal " href="index.html">
<img src="../assets/images/brand/logo.png" class="header-brand-img desktop-logo" alt="logo">
<img src="../assets/images/brand/logo-3.png" class="header-brand-img light-logo1"
alt="logo">
</a>
<!-- LOGO -->
<div class="main-header-center ms-3 d-none d-lg-block">
<input class="form-control" placeholder="Search for anything..." type="search"> <button class="btn"><i class="fa fa-search" aria-hidden="true"></i></button>
</div>
<div class="d-flex order-lg-2 ms-auto header-right-icons">
<!-- SEARCH -->
<button class="navbar-toggler navresponsive-toggler d-lg-none ms-auto" type="button" data-bs-toggle="collapse" data-bs-target="#navbarSupportedContent-4" aria-controls="navbarSupportedContent-4" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon fe fe-more-vertical text-dark"></span>
</button>
<div class="navbar navbar-collapse responsive-navbar p-0">
<div class="collapse navbar-collapse" id="navbarSupportedContent-4">
<div class="d-flex order-lg-2">
<div class="dropdown d-block d-lg-none">
<a href="javascript:void(0);" class="nav-link icon" data-bs-toggle="dropdown">
<i class="fe fe-search"></i>
</a>
<div class="dropdown-menu header-search dropdown-menu-start">
<div class="input-group w-100 p-2">
<input type="text" class="form-control" placeholder="Search....">
<div class="input-group-text btn btn-primary">
<i class="fa fa-search" aria-hidden="true"></i>
</div>
</div>
</div>
</div>
<div class="dropdown d-md-flex">
<a class="nav-link icon theme-layout nav-link-bg layout-setting">
<span class="dark-layout"><i class="fe fe-moon"></i></span>
<span class="light-layout"><i class="fe fe-sun"></i></span>
</a>
</div>
<!-- Theme-Layout -->
<div class="dropdown d-md-flex">
<a class="nav-link icon full-screen-link nav-link-bg">
<i class="fe fe-minimize fullscreen-button"></i>
</a>
</div>
<!-- FULL-SCREEN -->
<div class="dropdown d-md-flex notifications">
<a class="nav-link icon" data-bs-toggle="dropdown"><i class="fe fe-bell"></i><span class=" pulse"></span>
</a>
<div class="dropdown-menu dropdown-menu-end dropdown-menu-arrow ">
<div class="drop-heading border-bottom">
<div class="d-flex">
<h6 class="mt-1 mb-0 fs-16 fw-semibold">You have Notification</h6>
<div class="ms-auto">
<span class="badge bg-success rounded-pill">3</span>
</div>
</div>
</div>
<div class="notifications-menu">
<a class="dropdown-item d-flex" href="chat.html">
<div class="me-3 notifyimg bg-primary-gradient brround box-shadow-primary">
<i class="fe fe-message-square"></i>
</div>
<div class="mt-1 wd-80p">
<h5 class="notification-label mb-1">New review received</h5>
<span class="notification-subtext">2 hours ago</span>
</div>
</a>
<a class="dropdown-item d-flex" href="chat.html">
<div class="me-3 notifyimg bg-secondary-gradient brround box-shadow-primary">
<i class="fe fe-mail"></i>
</div>
<div class="mt-1 wd-80p">
<h5 class="notification-label mb-1">New Mails Received</h5>
<span class="notification-subtext">1 week ago</span>
</div>
</a>
<a class="dropdown-item d-flex" href="cart.html">
<div class="me-3 notifyimg bg-success-gradient brround box-shadow-primary">
<i class="fe fe-shopping-cart"></i>
</div>
<div class="mt-1 wd-80p">
<h5 class="notification-label mb-1">New Order Received</h5>
<span class="notification-subtext">1 day ago</span>
</div>
</a>
</div>
<div class="dropdown-divider m-0"></div>
<a href="javascript:void(0);" class="dropdown-item text-center p-3 text-muted">View all Notification</a>
</div>
</div>
<!-- NOTIFICATIONS -->
<div class="dropdown d-md-flex message">
<a class="nav-link icon text-center" data-bs-toggle="dropdown">
<i class="fe fe-message-square"></i><span class=" pulse-danger"></span>
</a>
<div class="dropdown-menu dropdown-menu-end dropdown-menu-arrow">
<div class="drop-heading border-bottom">
<div class="d-flex">
<h6 class="mt-1 mb-0 fs-16 fw-semibold">You have Messages</h6>
<div class="ms-auto">
<span class="badge bg-danger rounded-pill">4</span>
</div>
</div>
</div>
<div class="message-menu">
<a class="dropdown-item d-flex" href="chat.html">
<span class="avatar avatar-md brround me-3 align-self-center cover-image" data-bs-image-src="../assets/images/users/1.jpg"></span>
<div class="wd-90p">
<div class="d-flex">
<h5 class="mb-1">Madeleine</h5>
<small class="text-muted ms-auto text-end">
3 hours ago
</small>
</div>
<span>Hey! there I' am available....</span>
</div>
</a>
<a class="dropdown-item d-flex" href="chat.html">
<span class="avatar avatar-md brround me-3 align-self-center cover-image" data-bs-image-src="../assets/images/users/12.jpg"></span>
<div class="wd-90p">
<div class="d-flex">
<h5 class="mb-1">Anthony</h5>
<small class="text-muted ms-auto text-end">
5 hour ago
</small>
</div>
<span>New product Launching...</span>
</div>
</a>
<a class="dropdown-item d-flex" href="chat.html">
<span class="avatar avatar-md brround me-3 align-self-center cover-image" data-bs-image-src="../assets/images/users/4.jpg"></span>
<div class="wd-90p">
<div class="d-flex">
<h5 class="mb-1">Olivia</h5>
<small class="text-muted ms-auto text-end">
45 mintues ago
</small>
</div>
<span>New Schedule Realease......</span>
</div>
</a>
<a class="dropdown-item d-flex" href="chat.html">
<span class="avatar avatar-md brround me-3 align-self-center cover-image" data-bs-image-src="../assets/images/users/15.jpg"></span>
<div class="wd-90p">
<div class="d-flex">
<h5 class="mb-1">Sanderson</h5>
<small class="text-muted ms-auto text-end">
2 days ago
</small>
</div>
<span>New Schedule Realease......</span>
</div>
</a>
</div>
<div class="dropdown-divider m-0"></div>
<a href="javascript:void(0);" class="dropdown-item text-center p-3 text-muted">See all Messages</a>
</div>
</div>
<!-- MESSAGE-BOX -->
<div class="dropdown d-md-flex profile-1">
<a href="javascript:void(0);" data-bs-toggle="dropdown" class="nav-link leading-none d-flex px-1">
<span>
<img src="../assets/images/users/8.jpg" alt="profile-user" class="avatar profile-user brround cover-image">
</span>
</a>
<div class="dropdown-menu dropdown-menu-end dropdown-menu-arrow">
<div class="drop-heading">
<div class="text-center">
<h5 class="text-dark mb-0">Elizabeth Dyer</h5>
<small class="text-muted">Administrator</small>
</div>
</div>
<div class="dropdown-divider m-0"></div>
<a class="dropdown-item" href="profile.html">
<i class="dropdown-icon fe fe-user"></i> Profile
</a>
<a class="dropdown-item" href="email.html">
<i class="dropdown-icon fe fe-mail"></i> Inbox
<span class="badge bg-secondary float-end">3</span>
</a>
<a class="dropdown-item" href="emailservices.html">
<i class="dropdown-icon fe fe-settings"></i> Settings
</a>
<a class="dropdown-item" href="faq.html">
<i class="dropdown-icon fe fe-alert-triangle"></i> Need help?
</a>
<a class="dropdown-item" href="login.html">
<i class="dropdown-icon fe fe-alert-circle"></i> Sign out
</a>
</div>
</div>
<div class="dropdown d-md-flex header-settings">
<a href="javascript:void(0);" class="nav-link icon " data-bs-toggle="sidebar-right" data-target=".sidebar-right">
<i class="fe fe-menu"></i>
</a>
</div>
<!-- SIDE-MENU -->
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- /app-Header -->
<!--APP-SIDEBAR-->
<div class="sticky">
<div class="app-sidebar__overlay" data-bs-toggle="sidebar"></div>
<aside class="app-sidebar">
<div class="side-header">
<a class="header-brand1" href="index.html">
<img src="../assets/images/brand/logo.png" class="header-brand-img desktop-logo" alt="logo">
<img src="../assets/images/brand/logo-1.png" class="header-brand-img toggle-logo" alt="logo">
<img src="../assets/images/brand/logo-2.png" class="header-brand-img light-logo" alt="logo">
<img src="../assets/images/brand/logo-3.png" class="header-brand-img light-logo1" alt="logo">
</a>
<!-- LOGO -->
</div>
<div class="main-sidemenu">
<div class="slide-left disabled" id="slide-left"><svg xmlns="http://www.w3.org/2000/svg"
fill="#7b8191" width="24" height="24" viewBox="0 0 24 24">
<path d="M13.293 6.293 7.586 12l5.707 5.707 1.414-1.414L10.414 12l4.293-4.293z" />
</svg></div>
<ul class="side-menu">
<li class="sub-category">
<h3>Main</h3>
</li>
<li class="slide">
<a class="side-menu__item" data-bs-toggle="slide" href="index.html"><i class="side-menu__icon fe fe-home"></i><span class="side-menu__label">Dashboard</span></a>
</li>
<li class="sub-category">
<h3>Widgets</h3>
</li>
<li>
<a class="side-menu__item" href="widgets.html"><i class="side-menu__icon fe fe-grid"></i><span class="side-menu__label">Widgets</span></a>
</li>
<li class="sub-category">
<h3>Elements</h3>
</li>
<li class="slide">
<a class="side-menu__item" data-bs-toggle="slide" href="javascript:void(0);"><i class="side-menu__icon fe fe-database"></i><span class="side-menu__label">Components</span><i class="angle fa fa-angle-right"></i></a>
<ul class="slide-menu">
<li class="side-menu-label1"><a href="javascript:void(0)">Components</a></li>
<li><a href="cards.html" class="slide-item"> Cards design</a></li>
<li><a href="calendar.html" class="slide-item"> Default calendar</a></li>
<li><a href="calendar2.html" class="slide-item"> Full calendar</a></li>
<li><a href="chat.html" class="slide-item"> Default Chat</a></li>
<li><a href="notify.html" class="slide-item"> Notifications</a></li>
<li><a href="sweetalert.html" class="slide-item"> Sweet alerts</a></li>
<li><a href="rangeslider.html" class="slide-item"> Range slider</a></li>
<li><a href="scroll.html" class="slide-item"> Content Scroll bar</a></li>
<li><a href="loaders.html" class="slide-item"> Loaders</a></li>
<li><a href="counters.html" class="slide-item"> Counters</a></li>
<li><a href="rating.html" class="slide-item"> Rating</a></li>
<li><a href="timeline.html" class="slide-item"> Timeline</a></li>
<li><a href="treeview.html" class="slide-item"> Treeview</a></li>
</ul>
</li>
<li class="slide">
<a class="side-menu__item" data-bs-toggle="slide" href="javascript:void(0);"><i class="side-menu__icon fe fe-package"></i><span class="side-menu__label">Elements</span><i class="angle fa fa-angle-right"></i></a>
<ul class="slide-menu">
<li class="side-menu-label1"><a href="javascript:void(0)">Elements</a></li>
<li><a href="alerts.html" class="slide-item"> Alerts</a></li>
<li><a href="buttons.html" class="slide-item"> Buttons</a></li>
<li><a href="colors.html" class="slide-item"> Colors</a></li>
<li><a href="avatarsquare.html" class="slide-item"> Avatar-Square</a></li>
<li><a href="avatar-round.html" class="slide-item"> Avatar-Rounded</a></li>
<li><a href="avatar-radius.html" class="slide-item"> Avatar-Radius</a></li>
<li><a href="dropdown.html" class="slide-item"> Drop downs</a></li>
<li><a href="list.html" class="slide-item"> List</a></li>
<li><a href="tags.html" class="slide-item"> Tags</a></li>
<li><a href="pagination.html" class="slide-item"> Pagination</a></li>
<li><a href="navigation.html" class="slide-item"> Navigation</a></li>
<li><a href="typography.html" class="slide-item"> Typography</a></li>
<li><a href="breadcrumbs.html" class="slide-item"> Breadcrumbs</a></li>
<li><a href="badge.html" class="slide-item"> Badges</a></li>
<li><a href="panels.html" class="slide-item"> Panels</a></li>
<li><a href="thumbnails.html" class="slide-item"> Thumbnails</a></li>
</ul>
</li>
<li class="slide">
<a class="side-menu__item" data-bs-toggle="slide" href="javascript:void(0);"><i class="side-menu__icon fe fe-file"></i><span class="side-menu__label">Advanced Elements</span><i class="angle fa fa-angle-right"></i></a>
<ul class="slide-menu">
<li class="side-menu-label1"><a href="javascript:void(0)">Advanced Elements</a></li>
<li><a href="mediaobject.html" class="slide-item"> Media Object</a></li>
<li><a href="accordion.html" class="slide-item"> Accordions</a></li>
<li><a href="tabs.html" class="slide-item"> Tabs</a></li>
<li><a href="chart.html" class="slide-item"> Charts</a></li>
<li><a href="modal.html" class="slide-item"> Modal</a></li>
<li><a href="tooltipandpopover.html" class="slide-item"> Tooltip and popover</a></li>
<li><a href="progress.html" class="slide-item"> Progress</a></li>
<li><a href="carousel.html" class="slide-item"> Carousels</a></li>
<li><a href="headers.html" class="slide-item"> Headers</a></li>
<li><a href="footers.html" class="slide-item"> Footers</a></li>
<li><a href="users-list.html" class="slide-item"> User List</a></li>
<li><a href="search.html" class="slide-item">Search</a></li>
<li><a href="crypto-currencies.html" class="slide-item"> Crypto-currencies</a></li>
</ul>
</li>
<li class="sub-category">
<h3>Charts & Tables</h3>
</li>
<li class="slide">
<a class="side-menu__item" data-bs-toggle="slide" href="javascript:void(0);"><i class="side-menu__icon fe fe-pie-chart"></i><span class="side-menu__label">Charts</span><i class="angle fa fa-angle-right"></i></a>
<ul class="slide-menu">
<li class="side-menu-label1"><a href="javascript:void(0)">Charts</a></li>
<li><a href="chart-chartist.html" class="slide-item">Chart Js</a></li>
<li><a href="chart-flot.html" class="slide-item"> Flot Charts</a></li>
<li><a href="chart-echart.html" class="slide-item"> ECharts</a></li>
<li><a href="chart-morris.html" class="slide-item"> Morris Charts</a></li>
<li><a href="chart-nvd3.html" class="slide-item"> Nvd3 Charts</a></li>
<li><a href="charts.html" class="slide-item"> C3 Bar Charts</a></li>
<li><a href="chart-line.html" class="slide-item"> C3 Line Charts</a></li>
<li><a href="chart-donut.html" class="slide-item"> C3 Donut Charts</a></li>
<li><a href="chart-pie.html" class="slide-item"> C3 Pie charts</a></li>
</ul>
</li>
<li class="slide">
<a class="side-menu__item" data-bs-toggle="slide" href="javascript:void(0);"><i class="side-menu__icon fe fe-clipboard"></i><span class="side-menu__label">Tables</span><span class="badge bg-secondary side-badge">2</span><i class="angle fa fa-angle-right hor-rightangle"></i></a>
<ul class="slide-menu">
<li class="side-menu-label1"><a href="javascript:void(0)">Tables</a></li>
<li><a href="tables.html" class="slide-item">Default table</a></li>
<li><a href="datatable.html" class="slide-item"> Data Tables</a></li>
</ul>
</li>
<li class="sub-category">
<h3>Pages</h3>
</li>
<li class="slide">
<a class="side-menu__item" data-bs-toggle="slide" href="javascript:void(0);"><i class="side-menu__icon fe fe-layers"></i><span class="side-menu__label">Pages</span><i class="angle fa fa-angle-right"></i></a>
<ul class="slide-menu">
<li class="side-menu-label1"><a href="javascript:void(0)">Pages</a></li>
<li><a href="profile.html" class="slide-item"> Profile</a></li>
<li><a href="editprofile.html" class="slide-item"> Edit Profile</a></li>
<li><a href="email.html" class="slide-item"> Mail-Inbox</a></li>
<li><a href="emailservices.html" class="slide-item"> Mail-Compose</a></li>
<li><a href="gallery.html" class="slide-item"> Gallery</a></li>
<li><a href="about.html" class="slide-item"> About Company</a></li>
<li><a href="services.html" class="slide-item"> Services</a></li>
<li><a href="faq.html" class="slide-item"> FAQS</a></li>
<li><a href="terms.html" class="slide-item"> Terms</a></li>
<li><a href="invoice.html" class="slide-item"> Invoice</a></li>
<li><a href="pricing.html" class="slide-item"> Pricing Tables</a></li>
<li><a href="empty.html" class="slide-item"> Empty Page</a></li>
<li><a href="construction.html" class="slide-item"> Under Construction</a></li>
<li><a href="switcher.html" class="slide-item"> Theme Style</a></li>
<li class="sub-slide">
<a class="sub-side-menu__item" data-bs-toggle="sub-slide" href="javascript:void(0);"><span class="sub-side-menu__label">Blog</span><i class="sub-angle fa fa-angle-right"></i></a>
<ul class="sub-slide-menu">
<li><a href="blog.html" class="sub-slide-item">Blog</a></li>
<li><a href="blog-details.html" class="sub-slide-item">Blog Details</a></li>
<li><a href="blog-post.html" class="sub-slide-item">Blog Post</a></li>
</ul>
</li>
<li class="sub-slide">
<a class="sub-side-menu__item" data-bs-toggle="sub-slide" href="javascript:void(0);"><span class="sub-side-menu__label">Maps</span><i class="sub-angle fa fa-angle-right"></i></a>
<ul class="sub-slide-menu">
<li><a href="maps1.html" class="sub-slide-item">Leaflet Maps</a></li>
<li><a href="maps2.html" class="sub-slide-item">Mapel Maps</a></li>
<li><a href="maps.html" class="sub-slide-item">Vector Maps</a></li>
</ul>
</li>
<li class="sub-slide">
<a class="sub-side-menu__item" data-bs-toggle="sub-slide" href="javascript:void(0);"><span class="sub-side-menu__label">E-Commerce</span><i class="sub-angle fa fa-angle-right"></i></a>
<ul class="sub-slide-menu">
<li><a href="shop.html" class="sub-slide-item">Shop</a></li>
<li><a href="shop-description.html" class="sub-slide-item">Shopping Details</a></li>
<li><a href="cart.html" class="sub-slide-item">Shopping Cart</a></li>
<li><a href="wishlist.html" class="sub-slide-item">Wishlist</a></li>
<li><a href="checkout.html" class="sub-slide-item">Checkout</a></li>
</ul>
</li>
<li class="sub-slide">
<a class="sub-side-menu__item" data-bs-toggle="sub-slide" href="javascript:void(0);"><span class="sub-side-menu__label">File Manager</span><i class="sub-angle fa fa-angle-right"></i></a>
<ul class="sub-slide-menu">
<li><a href="file-manager.html" class="sub-slide-item">File Manager</a></li>
<li><a href="filemanager-list.html" class="sub-slide-item">File Manager List</a></li>
<li><a href="filemanager-details.html" class="sub-slide-item">File Details</a></li>
<li><a href="file-attachments.html" class="sub-slide-item">File Attachments</a></li>
</ul>
</li>
</ul>
</li>
<li class="sub-category">
<h3>Custom & Error Pages</h3>
</li>
<li class="slide">
<a class="side-menu__item" data-bs-toggle="slide" href="javascript:void(0);"><i class="side-menu__icon fe fe-settings"></i><span class="side-menu__label">Custom Pages</span><i class="angle fa fa-angle-right"></i></a>
<ul class="slide-menu">
<li class="side-menu-label1"><a href="javascript:void(0)">Custom Pages</a></li>
<li><a href="login.html" class="slide-item"> Login</a></li>
<li><a href="register.html" class="slide-item"> Register</a></li>
<li><a href="forgot-password.html" class="slide-item"> Forgot Password</a></li>
<li><a href="lockscreen.html" class="slide-item"> Lock screen</a></li>
<li class="sub-slide">
<a class="sub-side-menu__item" data-bs-toggle="sub-slide" href="javascript:void(0);"><span class="sub-side-menu__label">Error Pages</span><i class="sub-angle fa fa-angle-right"></i></a>
<ul class="sub-slide-menu">
<li><a class="sub-slide-item" href="400.html">400</a></li>
<li><a class="sub-slide-item" href="401.html">401</a></li>
<li><a class="sub-slide-item" href="403.html">403</a></li>
<li><a class="sub-slide-item" href="404.html">404</a></li>
<li><a class="sub-slide-item" href="500.html">500</a></li>
<li><a class="sub-slide-item" href="503.html">503</a></li>
</ul>
</li>
</ul>
</li>
<li class="slide">
<a class="side-menu__item" data-bs-toggle="slide" href="javascript:void(0);">
<i class="side-menu__icon fe fe-sliders"></i>
<span class="side-menu__label">Submenus</span><i class="angle fa fa-angle-right"></i></a>
<ul class="slide-menu">
<li class="side-menu-label1"><a href="javascript:void(0)">Submenus</a></li>
<li><a href="javascript:void(0);" class="slide-item">Level-1</a></li>
<li class="sub-slide">
<a class="sub-side-menu__item" data-bs-toggle="sub-slide" href="javascript:void(0);"><span class="sub-side-menu__label">Level-2</span><i class="sub-angle fa fa-angle-right"></i></a>
<ul class="sub-slide-menu">
<li><a class="sub-slide-item" href="javascript:void(0);">Level-2.1</a></li>
<li><a class="sub-slide-item" href="javascript:void(0);">Level-2.2</a></li>
<li class="sub-slide2">
<a class="sub-side-menu__item2" href="javascript:void(0);" data-bs-toggle="sub-slide2"><span class="sub-side-menu__label2">Level-2.3</span><i class="sub-angle2 fa fa-angle-right"></i></a>
<ul class="sub-slide-menu2">
<li><a href="javascript:void(0);" class="sub-slide-item2">Level-2.3.1</a></li>
<li><a href="javascript:void(0);" class="sub-slide-item2">Level-2.3.2</a></li>
<li><a href="javascript:void(0);" class="sub-slide-item2">Level-2.3.3</a></li>
</ul>
</li>
<li><a class="sub-slide-item" href="javascript:void(0);">Level-2.4</a></li>
<li><a class="sub-slide-item" href="javascript:void(0);">Level-2.5</a></li>
</ul>
</li>
</ul>
</li>
<li class="sub-category">
<h3>Forms & Icons</h3>
</li>
<li class="slide">
<a class="side-menu__item" data-bs-toggle="slide" href="javascript:void(0);"><i class="side-menu__icon fe fe-file-text"></i><span class="side-menu__label">Forms</span><span class="badge bg-success side-badge">5</span><i class="angle fa fa-angle-right hor-rightangle"></i></a>
<ul class="slide-menu">
<li class="side-menu-label1"><a href="javascript:void(0)">Forms</a></li>
<li><a href="form-elements.html" class="slide-item"> Form Elements</a></li>
<li><a href="form-advanced.html" class="slide-item"> Form Advanced</a></li>
<li><a href="wysiwyag.html" class="slide-item"> Form Editor</a></li>
<li><a href="form-wizard.html" class="slide-item"> Form Wizard</a></li>
<li><a href="form-validation.html" class="slide-item"> Form Validation</a></li>
</ul>
</li>
<li class="slide">
<a class="side-menu__item" data-bs-toggle="slide" href="javascript:void(0);"><i class="side-menu__icon fe fe-command"></i><span class="side-menu__label">Icons</span><i class="angle fa fa-angle-right"></i></a>
<ul class="slide-menu">
<li class="side-menu-label1"><a href="javascript:void(0)">Icons</a></li>
<li><a href="icons.html" class="slide-item"> Font Awesome</a></li>
<li><a href="icons2.html" class="slide-item"> Material Design Icons</a></li>
<li><a href="icons3.html" class="slide-item"> Simple Line Icons</a></li>
<li><a href="icons4.html" class="slide-item"> Feather Icons</a></li>
<li><a href="icons5.html" class="slide-item"> Ionic Icons</a></li>
<li><a href="icons6.html" class="slide-item"> Flag Icons</a></li>
<li><a href="icons7.html" class="slide-item"> pe7 Icons</a></li>
<li><a href="icons8.html" class="slide-item"> Themify Icons</a></li>
<li><a href="icons9.html" class="slide-item">Typicons Icons</a></li>
<li><a href="icons10.html" class="slide-item">Weather Icons</a></li>
<li><a href="icons11.html" class="slide-item">Bootstrap Icons</a></li>
</ul>
</li>
</ul>
<div class="slide-right" id="slide-right"><svg xmlns="http://www.w3.org/2000/svg" fill="#7b8191"
width="24" height="24" viewBox="0 0 24 24">
<path d="M10.707 17.707 16.414 12l-5.707-5.707-1.414 1.414L13.586 12l-4.293 4.293z" />
</svg></div>
</div>
</aside>
</div>
<!--/APP-SIDEBAR-->
<!--app-content open-->
<div class="main-content app-content mt-0">
<div class="side-app">
<!-- CONTAINER -->
<div class="main-container container-fluid">
<!-- PAGE-HEADER -->
<div class="page-header">
<div>
<h1 class="page-title">MaterialDesign</h1>
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="javascript:void(0);">Icons</a></li>
<li class="breadcrumb-item active" aria-current="page">MaterialDesign</li>
</ol>
</div>
<div class="ms-auto pageheader-btn">
<a href="javascript:void(0);" class="btn btn-primary btn-icon text-white me-2">
<span>
<i class="fe fe-plus"></i>
</span> Add Account
</a>
<a href="javascript:void(0);" class="btn btn-success btn-icon text-white">
<span>
<i class="fe fe-log-in"></i>
</span> Export
</a>
</div>
</div>
<!-- PAGE-HEADER END -->
<!-- ROW OPEN -->
<div class="row row-cards">
<div class="col">
<div class="card">
<div class="card-header">
<div class="card-title">MaterialDesignIcons</div>
</div>
<div class="card-body">
<div class="row">
<div class="col-lg-12 col-sm-12">
<p>Simply beautiful open source icons. For more info <a href="https://materialdesignicons.com/" target="_blank">click here</a>.</p>
<p><code><i class="mdi mdi-ICON_NAME"></i></code></p>
</div>
<div class="col-lg-12 col-sm-12">
<div class="icons-list-wrap">
<ul class="icons-list">
<li class="icons-list-item"><i class="mdi mdi-access-point" data-bs-toggle="tooltip" title="mdi-access-point"></i></li>
<li class="icons-list-item"><i class="mdi mdi-access-point-network" data-bs-toggle="tooltip" title="mdi-access-point-network"></i></li>
<li class="icons-list-item"><i class="mdi mdi-account" data-bs-toggle="tooltip" title="mdi-account"></i></li>
<li class="icons-list-item"><i class="mdi mdi-account-alert" data-bs-toggle="tooltip" title="mdi-account-alert"></i></li>
<li class="icons-list-item"><i class="mdi mdi-account-box" data-bs-toggle="tooltip" title="mdi-account-box"></i></li>
<li class="icons-list-item"><i class="mdi mdi-account-box-outline" data-bs-toggle="tooltip" title="mdi-account-box-outline"></i></li>
<li class="icons-list-item"><i class="mdi mdi-account-card-details" data-bs-toggle="tooltip" title="mdi-account-card-details"></i></li>
<li class="icons-list-item"><i class="mdi mdi-account-check" data-bs-toggle="tooltip" title="mdi-account-check"></i></li>
<li class="icons-list-item"><i class="mdi mdi-account-circle" data-bs-toggle="tooltip" title="mdi-account-circle"></i></li>
<li class="icons-list-item"><i class="mdi mdi-account-convert" data-bs-toggle="tooltip" title="mdi-account-convert"></i></li>
<li class="icons-list-item"><i class="mdi mdi-account-edit" data-bs-toggle="tooltip" title="mdi-account-edit"></i></li>
<li class="icons-list-item"><i class="mdi mdi-account-key" data-bs-toggle="tooltip" title="mdi-account-key"></i></li>
<li class="icons-list-item"><i class="mdi mdi-account-location" data-bs-toggle="tooltip" title="mdi-account-location"></i></li>
<li class="icons-list-item"><i class="mdi mdi-account-minus" data-bs-toggle="tooltip" title="mdi-account-minus"></i></li>
<li class="icons-list-item"><i class="mdi mdi-account-multiple" data-bs-toggle="tooltip" title="mdi-account-multiple"></i></li>
<li class="icons-list-item"><i class="mdi mdi-account-multiple-minus" data-bs-toggle="tooltip" title="mdi-account-multiple-minus"></i></li>
<li class="icons-list-item"><i class="mdi mdi-account-multiple-outline" data-bs-toggle="tooltip" title="mdi-account-multiple-outline"></i></li>
<li class="icons-list-item"><i class="mdi mdi-account-multiple-plus" data-bs-toggle="tooltip" title="mdi-account-multiple-plus"></i></li>
<li class="icons-list-item"><i class="mdi mdi-account-network" data-bs-toggle="tooltip" title="mdi-account-network"></i></li>
<li class="icons-list-item"><i class="mdi mdi-account-off" data-bs-toggle="tooltip" title="mdi-account-off"></i></li>
<li class="icons-list-item"><i class="mdi mdi-account-outline" data-bs-toggle="tooltip" title="mdi-account-outline"></i></li>
<li class="icons-list-item"><i class="mdi mdi-account-plus" data-bs-toggle="tooltip" title="mdi-account-plus"></i></li>
<li class="icons-list-item"><i class="mdi mdi-account-remove" data-bs-toggle="tooltip" title="mdi-account-remove"></i></li>
<li class="icons-list-item"><i class="mdi mdi-account-search" data-bs-toggle="tooltip" title="mdi-account-search"></i></li>
<li class="icons-list-item"><i class="mdi mdi-account-settings" data-bs-toggle="tooltip" title="mdi-account-settings"></i></li>
<li class="icons-list-item"><i class="mdi mdi-account-settings-variant" data-bs-toggle="tooltip" title="mdi-account-settings-variant"></i></li>
<li class="icons-list-item"><i class="mdi mdi-account-star" data-bs-toggle="tooltip" title="mdi-account-star"></i></li>
<li class="icons-list-item"><i class="mdi mdi-account-switch" data-bs-toggle="tooltip" title="mdi-account-switch"></i></li>
<li class="icons-list-item"><i class="mdi mdi-adjust" data-bs-toggle="tooltip" title="mdi-adjust"></i></li>
<li class="icons-list-item"><i class="mdi mdi-air-conditioner" data-bs-toggle="tooltip" title="mdi-air-conditioner"></i></li>
<li class="icons-list-item"><i class="mdi mdi-airballoon" data-bs-toggle="tooltip" title="mdi-airballoon"></i></li>
<li class="icons-list-item"><i class="mdi mdi-airplane" data-bs-toggle="tooltip" title="mdi-airplane"></i></li>
<li class="icons-list-item"><i class="mdi mdi-airplane-landing" data-bs-toggle="tooltip" title="mdi-airplane-landing"></i></li>
<li class="icons-list-item"><i class="mdi mdi-airplane-off" data-bs-toggle="tooltip" title="mdi-airplane-off"></i></li>
<li class="icons-list-item"><i class="mdi mdi-airplane-takeoff" data-bs-toggle="tooltip" title="mdi-airplane-takeoff"></i></li>
<li class="icons-list-item"><i class="mdi mdi-airplay" data-bs-toggle="tooltip" title="mdi-airplay"></i></li>
<li class="icons-list-item"><i class="mdi mdi-alarm" data-bs-toggle="tooltip" title="mdi-alarm"></i></li>
<li class="icons-list-item"><i class="mdi mdi-alarm-bell" data-bs-toggle="tooltip" title="mdi-alarm-bell"></i></li>
<li class="icons-list-item"><i class="mdi mdi-alarm-check" data-bs-toggle="tooltip" title="mdi-alarm-check"></i></li>
<li class="icons-list-item"><i class="mdi mdi-alarm-light" data-bs-toggle="tooltip" title="mdi-alarm-light"></i></li>
<li class="icons-list-item"><i class="mdi mdi-alarm-multiple" data-bs-toggle="tooltip" title="mdi-alarm-multiple"></i></li>
<li class="icons-list-item"><i class="mdi mdi-alarm-off" data-bs-toggle="tooltip" title="mdi-alarm-off"></i></li>
<li class="icons-list-item"><i class="mdi mdi-alarm-plus" data-bs-toggle="tooltip" title="mdi-alarm-plus"></i></li>
<li class="icons-list-item"><i class="mdi mdi-alarm-snooze" data-bs-toggle="tooltip" title="mdi-alarm-snooze"></i></li>
<li class="icons-list-item"><i class="mdi mdi-album" data-bs-toggle="tooltip" title="mdi-album"></i></li>
<li class="icons-list-item"><i class="mdi mdi-alert" data-bs-toggle="tooltip" title="mdi-alert"></i></li>
<li class="icons-list-item"><i class="mdi mdi-alert-box" data-bs-toggle="tooltip" title="mdi-alert-box"></i></li>
<li class="icons-list-item"><i class="mdi mdi-alert-circle" data-bs-toggle="tooltip" title="mdi-alert-circle"></i></li>
<li class="icons-list-item"><i class="mdi mdi-alert-circle-outline" data-bs-toggle="tooltip" title="mdi-alert-circle-outline"></i></li>
<li class="icons-list-item"><i class="mdi mdi-alert-decagram" data-bs-toggle="tooltip" title="mdi-alert-decagram"></i></li>
<li class="icons-list-item"><i class="mdi mdi-alert-octagon" data-bs-toggle="tooltip" title="mdi-alert-octagon"></i></li>
<li class="icons-list-item"><i class="mdi mdi-alert-octagram" data-bs-toggle="tooltip" title="mdi-alert-octagram"></i></li>
<li class="icons-list-item"><i class="mdi mdi-alert-outline" data-bs-toggle="tooltip" title="mdi-alert-outline"></i></li>
<li class="icons-list-item"><i class="mdi mdi-all-inclusive" data-bs-toggle="tooltip" title="mdi-all-inclusive"></i></li>
<li class="icons-list-item"><i class="mdi mdi-alpha" data-bs-toggle="tooltip" title="mdi-alpha"></i></li>
<li class="icons-list-item"><i class="mdi mdi-alphabetical" data-bs-toggle="tooltip" title="mdi-alphabetical"></i></li>
<li class="icons-list-item"><i class="mdi mdi-altimeter" data-bs-toggle="tooltip" title="mdi-altimeter"></i></li>
<li class="icons-list-item"><i class="mdi mdi-amazon" data-bs-toggle="tooltip" title="mdi-amazon"></i></li>
<li class="icons-list-item"><i class="mdi mdi-amazon-clouddrive" data-bs-toggle="tooltip" title="mdi-amazon-clouddrive"></i></li>
<li class="icons-list-item"><i class="mdi mdi-ambulance" data-bs-toggle="tooltip" title="mdi-ambulance"></i></li>
<li class="icons-list-item"><i class="mdi mdi-amplifier" data-bs-toggle="tooltip" title="mdi-amplifier"></i></li>
<li class="icons-list-item"><i class="mdi mdi-anchor" data-bs-toggle="tooltip" title="mdi-anchor"></i></li>
<li class="icons-list-item"><i class="mdi mdi-android" data-bs-toggle="tooltip" title="mdi-android"></i></li>
<li class="icons-list-item"><i class="mdi mdi-android-debug-bridge" data-bs-toggle="tooltip" title="mdi-android-debug-bridge"></i></li>
<li class="icons-list-item"><i class="mdi mdi-android-head" data-bs-toggle="tooltip" title="mdi-android-head"></i></li>
<li class="icons-list-item"><i class="mdi mdi-android-studio" data-bs-toggle="tooltip" title="mdi-android-studio"></i></li>
<li class="icons-list-item"><i class="mdi mdi-angular" data-bs-toggle="tooltip" title="mdi-angular"></i></li>
<li class="icons-list-item"><i class="mdi mdi-angularjs" data-bs-toggle="tooltip" title="mdi-angularjs"></i></li>
<li class="icons-list-item"><i class="mdi mdi-animation" data-bs-toggle="tooltip" title="mdi-animation"></i></li>
<li class="icons-list-item"><i class="mdi mdi-apple" data-bs-toggle="tooltip" title="mdi-apple"></i></li>
<li class="icons-list-item"><i class="mdi mdi-apple-finder" data-bs-toggle="tooltip" title="mdi-apple-finder"></i></li>
<li class="icons-list-item"><i class="mdi mdi-apple-ios" data-bs-toggle="tooltip" title="mdi-apple-ios"></i></li>
<li class="icons-list-item"><i class="mdi mdi-apple-keyboard-caps" data-bs-toggle="tooltip" title="mdi-apple-keyboard-caps"></i></li>
<li class="icons-list-item"><i class="mdi mdi-apple-keyboard-command" data-bs-toggle="tooltip" title="mdi-apple-keyboard-command"></i></li>
<li class="icons-list-item"><i class="mdi mdi-apple-keyboard-control" data-bs-toggle="tooltip" title="mdi-apple-keyboard-control"></i></li>
<li class="icons-list-item"><i class="mdi mdi-apple-keyboard-option" data-bs-toggle="tooltip" title="mdi-apple-keyboard-option"></i></li>
<li class="icons-list-item"><i class="mdi mdi-apple-keyboard-shift" data-bs-toggle="tooltip" title="mdi-apple-keyboard-shift"></i></li>
<li class="icons-list-item"><i class="mdi mdi-apple-mobileme" data-bs-toggle="tooltip" title="mdi-apple-mobileme"></i></li>
<li class="icons-list-item"><i class="mdi mdi-apple-safari" data-bs-toggle="tooltip" title="mdi-apple-safari"></i></li>
<li class="icons-list-item"><i class="mdi mdi-application" data-bs-toggle="tooltip" title="mdi-application"></i></li>
<li class="icons-list-item"><i class="mdi mdi-approval" data-bs-toggle="tooltip" title="mdi-approval"></i></li>
<li class="icons-list-item"><i class="mdi mdi-apps" data-bs-toggle="tooltip" title="mdi-apps"></i></li>
<li class="icons-list-item"><i class="mdi mdi-archive" data-bs-toggle="tooltip" title="mdi-archive"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrange-bring-forward" data-bs-toggle="tooltip" title="mdi-arrange-bring-forward"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrange-send-to-back" data-bs-toggle="tooltip" title="mdi-arrange-send-to-back"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrange-bring-to-front" data-bs-toggle="tooltip" title="mdi-arrange-bring-to-front"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrange-send-backward" data-bs-toggle="tooltip" title="mdi-arrange-send-backward"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-all" data-bs-toggle="tooltip" title="mdi-arrow-all"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-bottom-left" data-bs-toggle="tooltip" title="mdi-arrow-bottom-left"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-bottom-right" data-bs-toggle="tooltip" title="mdi-arrow-bottom-right"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-collapse" data-bs-toggle="tooltip" title="mdi-arrow-collapse"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-collapse-all" data-bs-toggle="tooltip" title="mdi-arrow-collapse-all"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-collapse-down" data-bs-toggle="tooltip" title="mdi-arrow-collapse-down"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-collapse-left" data-bs-toggle="tooltip" title="mdi-arrow-collapse-left"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-collapse-right" data-bs-toggle="tooltip" title="mdi-arrow-collapse-right"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-collapse-up" data-bs-toggle="tooltip" title="mdi-arrow-collapse-up"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-down" data-bs-toggle="tooltip" title="mdi-arrow-down"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-down-bold" data-bs-toggle="tooltip" title="mdi-arrow-down-bold"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-down-bold-box" data-bs-toggle="tooltip" title="mdi-arrow-down-bold-box"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-down-bold-box-outline" data-bs-toggle="tooltip" title="mdi-arrow-down-bold-box-outline"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-down-bold-circle" data-bs-toggle="tooltip" title="mdi-arrow-down-bold-circle"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-down-bold-circle-outline" data-bs-toggle="tooltip" title="mdi-arrow-down-bold-circle-outline"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-down-bold-hexagon-outline" data-bs-toggle="tooltip" title="mdi-arrow-down-bold-hexagon-outline"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-down-box" data-bs-toggle="tooltip" title="mdi-arrow-down-box"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-down-drop-circle" data-bs-toggle="tooltip" title="mdi-arrow-down-drop-circle"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-down-drop-circle-outline" data-bs-toggle="tooltip" title="mdi-arrow-down-drop-circle-outline"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-down-thick" data-bs-toggle="tooltip" title="mdi-arrow-down-thick"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-expand" data-bs-toggle="tooltip" title="mdi-arrow-expand"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-expand-all" data-bs-toggle="tooltip" title="mdi-arrow-expand-all"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-expand-down" data-bs-toggle="tooltip" title="mdi-arrow-expand-down"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-expand-left" data-bs-toggle="tooltip" title="mdi-arrow-expand-left"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-expand-right" data-bs-toggle="tooltip" title="mdi-arrow-expand-right"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-expand-up" data-bs-toggle="tooltip" title="mdi-arrow-expand-up"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-left" data-bs-toggle="tooltip" title="mdi-arrow-left"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-left-bold" data-bs-toggle="tooltip" title="mdi-arrow-left-bold"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-left-bold-box" data-bs-toggle="tooltip" title="mdi-arrow-left-bold-box"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-left-bold-box-outline" data-bs-toggle="tooltip" title="mdi-arrow-left-bold-box-outline"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-left-bold-circle" data-bs-toggle="tooltip" title="mdi-arrow-left-bold-circle"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-left-bold-circle-outline" data-bs-toggle="tooltip" title="mdi-arrow-left-bold-circle-outline"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-left-bold-hexagon-outline" data-bs-toggle="tooltip" title="mdi-arrow-left-bold-hexagon-outline"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-left-box" data-bs-toggle="tooltip" title="mdi-arrow-left-box"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-left-drop-circle" data-bs-toggle="tooltip" title="mdi-arrow-left-drop-circle"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-left-drop-circle-outline" data-bs-toggle="tooltip" title="mdi-arrow-left-drop-circle-outline"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-left-thick" data-bs-toggle="tooltip" title="mdi-arrow-left-thick"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-right" data-bs-toggle="tooltip" title="mdi-arrow-right"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-right-bold" data-bs-toggle="tooltip" title="mdi-arrow-right-bold"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-right-bold-box" data-bs-toggle="tooltip" title="mdi-arrow-right-bold-box"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-right-bold-box-outline" data-bs-toggle="tooltip" title="mdi-arrow-right-bold-box-outline"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-right-bold-circle" data-bs-toggle="tooltip" title="mdi-arrow-right-bold-circle"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-right-bold-circle-outline" data-bs-toggle="tooltip" title="mdi-arrow-right-bold-circle-outline"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-right-bold-hexagon-outline" data-bs-toggle="tooltip" title="mdi-arrow-right-bold-hexagon-outline"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-right-box" data-bs-toggle="tooltip" title="mdi-arrow-right-box"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-right-drop-circle" data-bs-toggle="tooltip" title="mdi-arrow-right-drop-circle"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-right-drop-circle-outline" data-bs-toggle="tooltip" title="mdi-arrow-right-drop-circle-outline"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-right-thick" data-bs-toggle="tooltip" title="mdi-arrow-right-thick"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-top-left" data-bs-toggle="tooltip" title="mdi-arrow-top-left"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-top-right" data-bs-toggle="tooltip" title="mdi-arrow-top-right"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-up" data-bs-toggle="tooltip" title="mdi-arrow-up"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-up-bold" data-bs-toggle="tooltip" title="mdi-arrow-up-bold"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-up-bold-box" data-bs-toggle="tooltip" title="mdi-arrow-up-bold-box"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-up-bold-box-outline" data-bs-toggle="tooltip" title="mdi-arrow-up-bold-box-outline"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-up-bold-circle" data-bs-toggle="tooltip" title="mdi-arrow-up-bold-circle"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-up-bold-circle-outline" data-bs-toggle="tooltip" title="mdi-arrow-up-bold-circle-outline"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-up-bold-hexagon-outline" data-bs-toggle="tooltip" title="mdi-arrow-up-bold-hexagon-outline"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-up-box" data-bs-toggle="tooltip" title="mdi-arrow-up-box"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-up-drop-circle" data-bs-toggle="tooltip" title="mdi-arrow-up-drop-circle"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-up-drop-circle-outline" data-bs-toggle="tooltip" title="mdi-arrow-up-drop-circle-outline"></i></li>
<li class="icons-list-item"><i class="mdi mdi-arrow-up-thick" data-bs-toggle="tooltip" title="mdi-arrow-up-thick"></i></li>
<li class="icons-list-item"><i class="mdi mdi-assistant" data-bs-toggle="tooltip" title="mdi-assistant"></i></li>
<li class="icons-list-item"><i class="mdi mdi-asterisk" data-bs-toggle="tooltip" title="mdi-asterisk"></i></li>
<li class="icons-list-item"><i class="mdi mdi-at" data-bs-toggle="tooltip" title="mdi-at"></i></li>
<li class="icons-list-item"><i class="mdi mdi-atom" data-bs-toggle="tooltip" title="mdi-atom"></i></li>
<li class="icons-list-item"><i class="mdi mdi-attachment" data-bs-toggle="tooltip" title="mdi-attachment"></i></li>
<li class="icons-list-item"><i class="mdi mdi-audiobook" data-bs-toggle="tooltip" title="mdi-audiobook"></i></li>
<li class="icons-list-item"><i class="mdi mdi-auto-fix" data-bs-toggle="tooltip" title="mdi-auto-fix"></i></li>
<li class="icons-list-item"><i class="mdi mdi-auto-upload" data-bs-toggle="tooltip" title="mdi-auto-upload"></i></li>
<li class="icons-list-item"><i class="mdi mdi-autorenew" data-bs-toggle="tooltip" title="mdi-autorenew"></i></li>
<li class="icons-list-item"><i class="mdi mdi-av-timer" data-bs-toggle="tooltip" title="mdi-av-timer"></i></li>
<li class="icons-list-item"><i class="mdi mdi-baby" data-bs-toggle="tooltip" title="mdi-baby"></i></li>
<li class="icons-list-item"><i class="mdi mdi-baby-buggy" data-bs-toggle="tooltip" title="mdi-baby-buggy"></i></li>
<li class="icons-list-item"><i class="mdi mdi-backburger" data-bs-toggle="tooltip" title="mdi-backburger"></i></li>
<li class="icons-list-item"><i class="mdi mdi-backspace" data-bs-toggle="tooltip" title="mdi-backspace"></i></li>
<li class="icons-list-item"><i class="mdi mdi-backup-restore" data-bs-toggle="tooltip" title="mdi-backup-restore"></i></li>
<li class="icons-list-item"><i class="mdi mdi-bandcamp" data-bs-toggle="tooltip" title="mdi-bandcamp"></i></li>
<li class="icons-list-item"><i class="mdi mdi-bank" data-bs-toggle="tooltip" title="mdi-bank"></i></li>
<li class="icons-list-item"><i class="mdi mdi-barcode" data-bs-toggle="tooltip" title="mdi-barcode"></i></li>
<li class="icons-list-item"><i class="mdi mdi-barcode-scan" data-bs-toggle="tooltip" title="mdi-barcode-scan"></i></li>
<li class="icons-list-item"><i class="mdi mdi-barley" data-bs-toggle="tooltip" title="mdi-barley"></i></li>
<li class="icons-list-item"><i class="mdi mdi-barrel" data-bs-toggle="tooltip" title="mdi-barrel"></i></li>
<li class="icons-list-item"><i class="mdi mdi-basecamp" data-bs-toggle="tooltip" title="mdi-basecamp"></i></li>
<li class="icons-list-item"><i class="mdi mdi-basket" data-bs-toggle="tooltip" title="mdi-basket"></i></li>
<li class="icons-list-item"><i class="mdi mdi-basket-fill" data-bs-toggle="tooltip" title="mdi-basket-fill"></i></li>
<li class="icons-list-item"><i class="mdi mdi-basket-unfill" data-bs-toggle="tooltip" title="mdi-basket-unfill"></i></li>
<li class="icons-list-item"><i class="mdi mdi-battery" data-bs-toggle="tooltip" title="mdi-battery"></i></li>
<li class="icons-list-item"><i class="mdi mdi-battery-10" data-bs-toggle="tooltip" title="mdi-battery-10"></i></li>
<li class="icons-list-item"><i class="mdi mdi-battery-20" data-bs-toggle="tooltip" title="mdi-battery-20"></i></li>
<li class="icons-list-item"><i class="mdi mdi-battery-30" data-bs-toggle="tooltip" title="mdi-battery-30"></i></li>
<li class="icons-list-item"><i class="mdi mdi-battery-40" data-bs-toggle="tooltip" title="mdi-battery-40"></i></li>
<li class="icons-list-item"><i class="mdi mdi-battery-50" data-bs-toggle="tooltip" title="mdi-battery-50"></i></li>
<li class="icons-list-item"><i class="mdi mdi-battery-60" data-bs-toggle="tooltip" title="mdi-battery-60"></i></li>
<li class="icons-list-item"><i class="mdi mdi-battery-70" data-bs-toggle="tooltip" title="mdi-battery-70"></i></li>
<li class="icons-list-item"><i class="mdi mdi-battery-80" data-bs-toggle="tooltip" title="mdi-battery-80"></i></li>
<li class="icons-list-item"><i class="mdi mdi-battery-90" data-bs-toggle="tooltip" title="mdi-battery-90"></i></li>
<li class="icons-list-item"><i class="mdi mdi-battery-alert" data-bs-toggle="tooltip" title="mdi-battery-alert"></i></li>
<li class="icons-list-item"><i class="mdi mdi-battery-charging" data-bs-toggle="tooltip" title="mdi-battery-charging"></i></li>
<li class="icons-list-item"><i class="mdi mdi-battery-charging-100" data-bs-toggle="tooltip" title="mdi-battery-charging-100"></i></li>
<li class="icons-list-item"><i class="mdi mdi-battery-charging-20" data-bs-toggle="tooltip" title="mdi-battery-charging-20"></i></li>
<li class="icons-list-item"><i class="mdi mdi-battery-charging-30" data-bs-toggle="tooltip" title="mdi-battery-charging-30"></i></li>
<li class="icons-list-item"><i class="mdi mdi-battery-charging-40" data-bs-toggle="tooltip" title="mdi-battery-charging-40"></i></li>
<li class="icons-list-item"><i class="mdi mdi-battery-charging-60" data-bs-toggle="tooltip" title="mdi-battery-charging-60"></i></li>
<li class="icons-list-item"><i class="mdi mdi-battery-charging-80" data-bs-toggle="tooltip" title="mdi-battery-charging-80"></i></li>
<li class="icons-list-item"><i class="mdi mdi-battery-charging-90" data-bs-toggle="tooltip" title="mdi-battery-charging-90"></i></li>
<li class="icons-list-item"><i class="mdi mdi-battery-minus" data-bs-toggle="tooltip" title="mdi-battery-minus"></i></li>
<li class="icons-list-item"><i class="mdi mdi-battery-negative" data-bs-toggle="tooltip" title="mdi-battery-negative"></i></li>
<li class="icons-list-item"><i class="mdi mdi-battery-outline" data-bs-toggle="tooltip" title="mdi-battery-outline"></i></li>
<li class="icons-list-item"><i class="mdi mdi-battery-plus" data-bs-toggle="tooltip" title="mdi-battery-plus"></i></li>
<li class="icons-list-item"><i class="mdi mdi-battery-unknown" data-bs-toggle="tooltip" title="mdi-battery-unknown"></i></li>
<li class="icons-list-item"><i class="mdi mdi-beach" data-bs-toggle="tooltip" title="mdi-beach"></i></li>
<li class="icons-list-item"><i class="mdi mdi-zip-box" data-bs-toggle="tooltip" title="mdi-zip-box"></i></li>
<li class="icons-list-item"><i class="mdi mdi-youtube-play" data-bs-toggle="tooltip" title="mdi-youtube-play"></i></li>
<li class="icons-list-item"><i class="mdi mdi-yin-yang" data-bs-toggle="tooltip" title="mdi-yin-yang"></i></li>
<li class="icons-list-item"><i class="mdi mdi-yelp" data-bs-toggle="tooltip" title="mdi-yelp"></i></li>
<li class="icons-list-item"><i class="mdi mdi-yammer" data-bs-toggle="tooltip" title="mdi-yammer"></i></li>
<li class="icons-list-item"><i class="mdi mdi-xmpp" data-bs-toggle="tooltip" title="mdi-xmpp"></i></li>
<li class="icons-list-item"><i class="mdi mdi-xml" data-bs-toggle="tooltip" title="mdi-xml"></i></li>
<li class="icons-list-item"><i class="mdi mdi-wrench" data-bs-toggle="tooltip" title="mdi-wrench"></i></li>
<li class="icons-list-item"><i class="mdi mdi-wrap" data-bs-toggle="tooltip" title="mdi-wrap"></i></li>
<li class="icons-list-item"><i class="mdi mdi-wunderlist" data-bs-toggle="tooltip" title="mdi-wunderlist"></i></li>
<li class="icons-list-item"><i class="mdi mdi-wrench" data-bs-toggle="tooltip" title="mdi-wrench"></i></li>
<li class="icons-list-item"><i class="mdi mdi-vpn" data-bs-toggle="tooltip" title="mdi-vpn"></i></li>
<li class="icons-list-item"><i class="mdi mdi-volume-off" data-bs-toggle="tooltip" title="mdi-volume-off"></i></li>
<li class="icons-list-item"><i class="mdi mdi-volume-mute" data-bs-toggle="tooltip" title="mdi-volume-mute"></i></li>
<li class="icons-list-item"><i class="mdi mdi-vlc" data-bs-toggle="tooltip" title="mdi-vlc"></i></li>
<li class="icons-list-item"><i class="mdi mdi-video" data-bs-toggle="tooltip" title="mdi-video"></i></li>
<li class="icons-list-item"><i class="mdi mdi-usb" data-bs-toggle="tooltip" title="mdi-usb"></i></li>
<li class="icons-list-item"><i class="mdi mdi-upload-network" data-bs-toggle="tooltip" title="mdi-upload-network"></i></li>
<li class="icons-list-item"><i class="mdi mdi-update" data-bs-toggle="tooltip" title="mdi-update"></i></li>
<li class="icons-list-item"><i class="mdi mdi-unity" data-bs-toggle="tooltip" title="mdi-unity"></i></li>
<li class="icons-list-item"><i class="mdi mdi-undo" data-bs-toggle="tooltip" title="mdi-undo"></i></li>
<li class="icons-list-item"><i class="mdi mdi-ubuntu" data-bs-toggle="tooltip" title="mdi-ubuntu"></i></li>
<li class="icons-list-item"><i class="mdi mdi-tune" data-bs-toggle="tooltip" title="mdi-tune"></i></li>
<li class="icons-list-item"><i class="mdi mdi-truck-trailer" data-bs-toggle="tooltip" title="mdi-truck-trailer"></i></li>
<li class="icons-list-item"><i class="mdi mdi-truck" data-bs-toggle="tooltip" title="mdi-truck"></i></li>
<li class="icons-list-item"><i class="mdi mdi-svg" data-bs-toggle="tooltip" title="mdi-svg"></i></li>
<li class="icons-list-item"><i class="mdi mdi-subway" data-bs-toggle="tooltip" title="mdi-subway"></i></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
</div>
</div>
</div>
</div>
<div class="card">
<div class="card-header">
<div class="card-title">Material Design Icons</div>
</div>
<div class="card-body">
<div class="row">
<div class="col-lg-12 col-sm-12">
<p>Simply beautiful open source icons. For more info <a href="https://materialdesignicons.com/" target="_blank">click here</a>.</p>
<p><code><i class="zmdi zmdi-NAME"></i></code></p>
</div>
<div class="col-lg-12 col-sm-12">
<div class="icons-list-wrap">
<ul class="icons-list">
<li class="icons-list-item"><i class="zmdi zmdi-group" data-bs-toggle="tooltip" title="zmdi zmdi-group"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-rss" data-bs-toggle="tooltip" title="zmdi zmdi-rss"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-shape" data-bs-toggle="tooltip" title="zmdi zmdi-shape"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-spinner" data-bs-toggle="tooltip" title="zmdi zmdi-spinner"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-ungroup" data-bs-toggle="tooltip" title="zmdi zmdi-ungroup"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-500px" data-bs-toggle="tooltip" title="zmdi zmdi-500px"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-8tracks" data-bs-toggle="tooltip" title="zmdi zmdi-8tracks"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-amazon" data-bs-toggle="tooltip" title="zmdi zmdi-amazon"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-blogger" data-bs-toggle="tooltip" title="zmdi zmdi-blogger"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-delicious" data-bs-toggle="tooltip" title="zmdi zmdi-delicious"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-disqus" data-bs-toggle="tooltip" title="zmdi zmdi-disqus"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-flattr" data-bs-toggle="tooltip" title="zmdi zmdi-flattr"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-flickr" data-bs-toggle="tooltip" title="zmdi zmdi-flickr"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-github-alt" data-bs-toggle="tooltip" title="zmdi zmdi-github-alt"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-google-old" data-bs-toggle="tooltip" title="zmdi zmdi-google-old"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-linkedin" data-bs-toggle="tooltip" title="zmdi zmdi-linkedin"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-odnoklassniki" data-bs-toggle="tooltip" title="zmdi zmdi-odnoklassniki"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-outlook" data-bs-toggle="tooltip" title="zmdi zmdi-outlook"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-paypal-alt" data-bs-toggle="tooltip" title="zmdi zmdi-paypal-alt"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-pinterest" data-bs-toggle="tooltip" title="zmdi zmdi-pinterest"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-playstation" data-bs-toggle="tooltip" title="zmdi zmdi-playstation"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-reddit" data-bs-toggle="tooltip" title="zmdi zmdi-reddit"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-skype" data-bs-toggle="tooltip" title="zmdi zmdi-skype"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-slideshare" data-bs-toggle="tooltip" title="zmdi zmdi-slideshare"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-soundcloud" data-bs-toggle="tooltip" title="zmdi zmdi-soundcloud"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-tumblr" data-bs-toggle="tooltip" title="zmdi zmdi-tumblr"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-twitch" data-bs-toggle="tooltip" title="zmdi zmdi-twitch"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-vimeo" data-bs-toggle="tooltip" title="zmdi zmdi-vimeo"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-whatsapp" data-bs-toggle="tooltip" title="zmdi zmdi-whatsapp"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-xbox" data-bs-toggle="tooltip" title="zmdi zmdi-xbox"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-yahoo" data-bs-toggle="tooltip" title="zmdi zmdi-yahoo"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-youtube-play" data-bs-toggle="tooltip" title="zmdi zmdi-youtube-play"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-youtube" data-bs-toggle="tooltip" title="zmdi zmdi-youtube"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-3d-rotation" data-bs-toggle="tooltip" title="zmdi zmdi-3d-rotation"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-airplane-off" data-bs-toggle="tooltip" title="zmdi zmdi-airplane-off"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-airplane" data-bs-toggle="tooltip" title="zmdi zmdi-airplane"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-album" data-bs-toggle="tooltip" title="zmdi zmdi-album"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-archive" data-bs-toggle="tooltip" title="zmdi zmdi-archive"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-assignment-account" data-bs-toggle="tooltip" title="zmdi zmdi-assignment-account"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-assignment-alert" data-bs-toggle="tooltip" title="zmdi zmdi-assignment-alert"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-assignment-check" data-bs-toggle="tooltip" title="zmdi zmdi-assignment-check"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-assignment-o" data-bs-toggle="tooltip" title="zmdi zmdi-assignment-o"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-assignment-return" data-bs-toggle="tooltip" title="zmdi zmdi-assignment-return"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-assignment-returned" data-bs-toggle="tooltip" title="zmdi zmdi-assignment-returned"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-assignment" data-bs-toggle="tooltip" title="zmdi zmdi-assignment"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-attachment-alt" data-bs-toggle="tooltip" title="zmdi zmdi-attachment-alt"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-attachment" data-bs-toggle="tooltip" title="zmdi zmdi-attachment"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-audio" data-bs-toggle="tooltip" title="zmdi zmdi-audio"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-badge-check" data-bs-toggle="tooltip" title="zmdi zmdi-badge-check"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-balance-wallet" data-bs-toggle="tooltip" title="zmdi zmdi-balance-wallet"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-balance" data-bs-toggle="tooltip" title="zmdi zmdi-balance"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-battery-alert" data-bs-toggle="tooltip" title="zmdi zmdi-battery-alert"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-battery-flash" data-bs-toggle="tooltip" title="zmdi zmdi-battery-flash"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-battery-unknown" data-bs-toggle="tooltip" title="zmdi zmdi-battery-unknown"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-battery" data-bs-toggle="tooltip" title="zmdi zmdi-battery"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-bike" data-bs-toggle="tooltip" title="zmdi zmdi-bike"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-block-alt" data-bs-toggle="tooltip" title="zmdi zmdi-block-alt"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-block" data-bs-toggle="tooltip" title="zmdi zmdi-block"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-boat" data-bs-toggle="tooltip" title="zmdi zmdi-boat"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-book-image" data-bs-toggle="tooltip" title="zmdi zmdi-book-image"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-book" data-bs-toggle="tooltip" title="zmdi zmdi-book"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-bookmark-outline" data-bs-toggle="tooltip" title="zmdi zmdi-bookmark-outline"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-bookmark" data-bs-toggle="tooltip" title="zmdi zmdi-bookmark"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-brush" data-bs-toggle="tooltip" title="zmdi zmdi-brush"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-bug" data-bs-toggle="tooltip" title="zmdi zmdi-bug"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-bus" data-bs-toggle="tooltip" title="zmdi zmdi-bus"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-cake" data-bs-toggle="tooltip" title="zmdi zmdi-cake"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-car-taxi" data-bs-toggle="tooltip" title="zmdi zmdi-car-taxi"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-car-wash" data-bs-toggle="tooltip" title="zmdi zmdi-car-wash"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-car" data-bs-toggle="tooltip" title="zmdi zmdi-car"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-card-giftcard" data-bs-toggle="tooltip" title="zmdi zmdi-card-giftcard"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-card-membership" data-bs-toggle="tooltip" title="zmdi zmdi-card-membership"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-card-travel" data-bs-toggle="tooltip" title="zmdi zmdi-card-travel"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-card" data-bs-toggle="tooltip" title="zmdi zmdi-card"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-case-check" data-bs-toggle="tooltip" title="zmdi zmdi-case-check"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-case-download" data-bs-toggle="tooltip" title="zmdi zmdi-case-download"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-case-play" data-bs-toggle="tooltip" title="zmdi zmdi-case-play"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-case" data-bs-toggle="tooltip" title="zmdi zmdi-case"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-cast-connected" data-bs-toggle="tooltip" title="zmdi zmdi-cast-connected"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-cast" data-bs-toggle="tooltip" title="zmdi zmdi-cast"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-chart-donut" data-bs-toggle="tooltip" title="zmdi zmdi-chart-donut"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-chart" data-bs-toggle="tooltip" title="zmdi zmdi-chart"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-city-alt" data-bs-toggle="tooltip" title="zmdi zmdi-city-alt"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-city" data-bs-toggle="tooltip" title="zmdi zmdi-city"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-close-circle-o" data-bs-toggle="tooltip" title="zmdi zmdi-close-circle-o"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-close-circle" data-bs-toggle="tooltip" title="zmdi zmdi-close-circle"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-close" data-bs-toggle="tooltip" title="zmdi zmdi-close"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-cocktail" data-bs-toggle="tooltip" title="zmdi zmdi-cocktail"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-code-setting" data-bs-toggle="tooltip" title="zmdi zmdi-code-setting"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-code-smartphone" data-bs-toggle="tooltip" title="zmdi zmdi-code-smartphone"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-code" data-bs-toggle="tooltip" title="zmdi zmdi-code"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-coffee" data-bs-toggle="tooltip" title="zmdi zmdi-coffee"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-collection-bookmark" data-bs-toggle="tooltip" title="zmdi zmdi-collection-bookmark"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-collection-case-play" data-bs-toggle="tooltip" title="zmdi zmdi-collection-case-play"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-collection-folder-image" data-bs-toggle="tooltip" title="zmdi zmdi-collection-folder-image"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-collection-image-o" data-bs-toggle="tooltip" title="zmdi zmdi-collection-image-o"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-collection-image" data-bs-toggle="tooltip" title="zmdi zmdi-collection-image"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-collection-item-1" data-bs-toggle="tooltip" title="zmdi zmdi-collection-item-1"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-collection-item-2" data-bs-toggle="tooltip" title="zmdi zmdi-collection-item-2"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-collection-item-3" data-bs-toggle="tooltip" title="zmdi zmdi-collection-item-3"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-collection-item-4" data-bs-toggle="tooltip" title="zmdi zmdi-collection-item-4"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-collection-item-5" data-bs-toggle="tooltip" title="zmdi zmdi-collection-item-5"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-collection-item-6" data-bs-toggle="tooltip" title="zmdi zmdi-collection-item-6"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-collection-item-7" data-bs-toggle="tooltip" title="zmdi zmdi-collection-item-7"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-collection-item-8" data-bs-toggle="tooltip" title="zmdi zmdi-collection-item-8"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-collection-item-9-plus" data-bs-toggle="tooltip" title="zmdi zmdi-collection-item-9"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-collection-item-9" data-bs-toggle="tooltip" title="ion-unlocked"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-collection-item" data-bs-toggle="tooltip" title="zmdi zmdi-collection-item"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-collection-music" data-bs-toggle="tooltip" title="zmdi zmdi-collection-music"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-collection-pdf" data-bs-toggle="tooltip" title="zmdi zmdi-collection-pdf"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-collection-plus" data-bs-toggle="tooltip" title="zmdi zmdi-collection-plus"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-collection-speaker" data-bs-toggle="tooltip" title="zmdi zmdi-collection-speaker"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-collection-text" data-bs-toggle="tooltip" title="zmdi zmdi-collection-text"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-collection-video" data-bs-toggle="tooltip" title="zmdi zmdi-collection-video"></i></li>
<li class="icons-list-item"><i class="fa fa-bandcamp" data-bs-toggle="tooltip" title="fa fa-bandcamp"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-cutlery" data-bs-toggle="tooltip" title="zmdi zmdi-cutlery"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-delete" data-bs-toggle="tooltip" title="zmdi zmdi-delete"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-dialpad" data-bs-toggle="tooltip" title="zmdi zmdi-dialpad"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-dns" data-bs-toggle="tooltip" title="zmdi zmdi-dns"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-drink" data-bs-toggle="tooltip" title="zmdi zmdi-drink"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-edit" data-bs-toggle="tooltip" title="zmdi zmdi-edit"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-email-open" data-bs-toggle="tooltip" title="zmdi zmdi-email-open"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-email" data-bs-toggle="tooltip" title="zmdi zmdi-email"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-eye-off" data-bs-toggle="tooltip" title="zmdi zmdi-eye-off"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-eye" data-bs-toggle="tooltip" title="zmdi zmdi-eye"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-eyedropper" data-bs-toggle="tooltip" title="zmdi zmdi-eyedropper"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-favorite-outline" data-bs-toggle="tooltip" title="zmdi zmdi-favorite-outline"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-favorite" data-bs-toggle="tooltip" title="zmdi zmdi-favorite"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-filter-list" data-bs-toggle="tooltip" title="zmdi zmdi-filter-list"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-fire" data-bs-toggle="tooltip" title="zmdi zmdi-fire"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-flag" data-bs-toggle="tooltip" title="zmdi zmdi-flag"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-flare" data-bs-toggle="tooltip" title="zmdi zmdi-flare"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-flash-auto" data-bs-toggle="tooltip" title="zmdi zmdi-flash-auto"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-flash-off" data-bs-toggle="tooltip" title="zmdi zmdi-flash-off"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-flash" data-bs-toggle="tooltip" title="zmdi zmdi-flash"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-flip" data-bs-toggle="tooltip" title="zmdi zmdi-flip"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-flower-alt" data-bs-toggle="tooltip" title="zmdi zmdi-flower-alt"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-flower" data-bs-toggle="tooltip" title="zmdi zmdi-flower"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-font" data-bs-toggle="tooltip" title="zmdi zmdi-font"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-fullscreen-alt" data-bs-toggle="tooltip" title="zmdi zmdi-fullscreen-alt"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-fullscreen-exit" data-bs-toggle="tooltip" title="zmdi zmdi-fullscreen-exit"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-fullscreen" data-bs-toggle="tooltip" title="zmdi zmdi-fullscreen"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-functions" data-bs-toggle="tooltip" title="zmdi zmdi-functions"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-gas-station" data-bs-toggle="tooltip" title="zmdi zmdi-gas-station"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-gesture" data-bs-toggle="tooltip" title="zmdi zmdi-gesture"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-globe-alt" data-bs-toggle="tooltip" title="zmdi zmdi-globe-alt"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-globe-lock" data-bs-toggle="tooltip" title="zmdi zmdi-globe-lock"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-globe" data-bs-toggle="tooltip" title="zmdi zmdi-globe"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-graduation-cap" data-bs-toggle="tooltip" title="zmdi zmdi-graduation-cap"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-group" data-bs-toggle="tooltip" title="zmdi zmdi-group"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-home" data-bs-toggle="tooltip" title="zmdi zmdi-home"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-hospital-alt" data-bs-toggle="tooltip" title="zmdi zmdi-hospital-alt"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-hospital" data-bs-toggle="tooltip" title="zmdi zmdi-hospital"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-hotel" data-bs-toggle="tooltip" title="zmdi zmdi-hotel"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-hourglass-alt" data-bs-toggle="tooltip" title="zmdi zmdi-hourglass-alt"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-hourglass-outline" data-bs-toggle="tooltip" title="zmdi zmdi-hourglass-outline"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-hourglass" data-bs-toggle="tooltip" title="zmdi zmdi-hourglass"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-http" data-bs-toggle="tooltip" title="zmdi zmdi-http"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-image-alt" data-bs-toggle="tooltip" title="zmdi zmdi-image-alt"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-image-o" data-bs-toggle="tooltip" title="zmdi zmdi-image-o"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-image" data-bs-toggle="tooltip" title="zmdi zmdi-image"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-inbox" data-bs-toggle="tooltip" title="zmdi zmdi-inbox"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-invert-colors-off" data-bs-toggle="tooltip" title="zmdi zmdi-invert-colors-off"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-invert-colors" data-bs-toggle="tooltip" title="zmdi zmdi-invert-colors"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-key" data-bs-toggle="tooltip" title="zmdi zmdi-key"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-label-alt-outline" data-bs-toggle="tooltip" title="zmdi zmdi-label-alt-outline"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-label-alt" data-bs-toggle="tooltip" title="zmdi zmdi-label-alt"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-label-heart" data-bs-toggle="tooltip" title="zmdi zmdi-label-heart"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-label" data-bs-toggle="tooltip" title="zmdi zmdi-label"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-labels" data-bs-toggle="tooltip" title="zmdi zmdi-labels"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-lamp" data-bs-toggle="tooltip" title="zmdi zmdi-lamp"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-landscape" data-bs-toggle="tooltip" title="zmdi zmdi-landscape"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-layers-off" data-bs-toggle="tooltip" title="zmdi zmdi-layers-off"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-layers" data-bs-toggle="tooltip" title="zmdi zmdi-layers"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-library" data-bs-toggle="tooltip" title="zmdi zmdi-library"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-link" data-bs-toggle="tooltip" title="zmdi zmdi-link"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-lock-open" data-bs-toggle="tooltip" title="zmdi zmdi-lock-open"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-lock-outline" data-bs-toggle="tooltip" title="zmdi zmdi-lock-outline"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-lock" data-bs-toggle="tooltip" title="zmdi zmdi-lock"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-mail-reply-all" data-bs-toggle="tooltip" title="zmdi zmdi-mail-reply-all"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-mail-reply" data-bs-toggle="tooltip" title="zmdi zmdi-mail-reply"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-mail-send" data-bs-toggle="tooltip" title="zmdi zmdi-mail-send"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-mall" data-bs-toggle="tooltip" title="zmdi zmdi-mall"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-map" data-bs-toggle="tooltip" title="zmdi zmdi-map"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-menu" data-bs-toggle="tooltip" title="zmdi zmdi-menu"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-money-box" data-bs-toggle="tooltip" title="zmdi zmdi-money-box"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-money-off" data-bs-toggle="tooltip" title="zmdi zmdi-money-off"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-money" data-bs-toggle="tooltip" title="zmdi zmdi-money"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-more-vert" data-bs-toggle="tooltip" title="zmdi zmdi-more-vert"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-more" data-bs-toggle="tooltip" title="zmdi zmdi-more"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-movie-alt" data-bs-toggle="tooltip" title="zmdi zmdi-movie-alt"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-nature-people" data-bs-toggle="tooltip" title="zmdi zmdi-nature-people"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-nature" data-bs-toggle="tooltip" title="zmdi zmdi-nature"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-navigation" data-bs-toggle="tooltip" title="zmdi zmdi-navigation"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-open-in-browser" data-bs-toggle="tooltip" title="zmdi zmdi-open-in-browser"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-open-in-new" data-bs-toggle="tooltip" title="zmdi zmdi-open-in-new"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-palette" data-bs-toggle="tooltip" title="zmdi zmdi-palette"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-parking" data-bs-toggle="tooltip" title="zmdi zmdi-parking"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-pin-account" data-bs-toggle="tooltip" title="zmdi zmdi-pin-account"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-pin-assistant" data-bs-toggle="tooltip" title="zmdi zmdi-pin-assistant"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-pin-drop" data-bs-toggle="tooltip" title="zmdi zmdi-pin-drop"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-pin-help" data-bs-toggle="tooltip" title="zmdi zmdi-pin-help"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-pin-off" data-bs-toggle="tooltip" title="zmdi zmdi-pin-off"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-pin" data-bs-toggle="tooltip" title="zmdi zmdi-pin"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-pizza" data-bs-toggle="tooltip" title="zmdi zmdi-pizza"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-plaster" data-bs-toggle="tooltip" title="zmdi zmdi-plaster"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-power-setting" data-bs-toggle="tooltip" title="zmdi zmdi-power-setting"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-power" data-bs-toggle="tooltip" title="zmdi zmdi-power"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-print" data-bs-toggle="tooltip" title="zmdi zmdi-print"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-puzzle-piece" data-bs-toggle="tooltip" title="zmdi zmdi-puzzle-piece"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-quote" data-bs-toggle="tooltip" title="zmdi zmdi-quote"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-railway" data-bs-toggle="tooltip" title="zmdi zmdi-railway"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-receipt" data-bs-toggle="tooltip" title="zmdi zmdi-receipt"></i></li>
<li class="icons-list-item"><i class="zmdi zmdi-refresh-alt" data-bs-toggle="tooltip" title="zmdi zmdi-refresh-alt"></i></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- ROW CLOSED -->
</div>
</div>
</div>
<!-- CONATINER CLOSED -->
</div>
<!-- Sidebar-right -->
<div class="sidebar sidebar-right sidebar-animate">
<div class="panel panel-primary card mb-0 shadow-none border-0">
<div class="tab-menu-heading border-0 d-flex p-3">
<div class="card-title mb-0">Notifications</div>
<div class="card-options ms-auto">
<a href="javascript:void(0);" class="sidebar-icon text-end float-end me-1" data-bs-toggle="sidebar-right" data-target=".sidebar-right"><i class="fe fe-x text-white"></i></a>
</div>
</div>
<div class="panel-body tabs-menu-body latest-tasks p-0 border-0">
<div class="tabs-menu border-bottom">
<!-- Tabs -->
<ul class="nav panel-tabs">
<li class=""><a href="#side1" class="active" data-bs-toggle="tab"><i class="fe fe-user me-1"></i> Profile</a></li>
<li><a href="#side2" data-bs-toggle="tab"><i class="fe fe-users me-1"></i> Contacts</a></li>
<li><a href="#side3" data-bs-toggle="tab"><i class="fe fe-settings me-1"></i> Settings</a></li>
</ul>
</div>
<div class="tab-content">
<div class="tab-pane active" id="side1">
<div class="card-body text-center">
<div class="dropdown user-pro-body">
<div class="">
<img alt="user-img" class="avatar avatar-xl brround mx-auto text-center" src="../assets/images/faces/6.jpg"><span class="avatar-status profile-status bg-green"></span>
</div>
<div class="user-info mg-t-20">
<h6 class="fw-semibold mt-2 mb-0">Mintrona Pechon</h6>
<span class="mb-0 text-muted fs-12">Premium Member</span>
</div>
</div>
</div>
<a class="dropdown-item d-flex border-bottom border-top" href="profile.html">
<div class="d-flex"><i class="fe fe-user me-3 tx-20 text-muted"></i>
<div class="pt-1">
<h6 class="mb-0">My Profile</h6>
<p class="tx-12 mb-0 text-muted">Profile Personal information</p>
</div>
</div>
</a>
<a class="dropdown-item d-flex border-bottom" href="chat.html">
<div class="d-flex"><i class="fe fe-message-square me-3 tx-20 text-muted"></i>
<div class="pt-1">
<h6 class="mb-0">My Messages</h6>
<p class="tx-12 mb-0 text-muted">Person message information</p>
</div>
</div>
</a>
<a class="dropdown-item d-flex border-bottom" href="emailservices.html">
<div class="d-flex"><i class="fe fe-mail me-3 tx-20 text-muted"></i>
<div class="pt-1">
<h6 class="mb-0">My Mails</h6>
<p class="tx-12 mb-0 text-muted">Persons mail information</p>
</div>
</div>
</a>
<a class="dropdown-item d-flex border-bottom" href="editprofile.html">
<div class="d-flex"><i class="fe fe-settings me-3 tx-20 text-muted"></i>
<div class="pt-1">
<h6 class="mb-0">Account Settings</h6>
<p class="tx-12 mb-0 text-muted">Settings Information</p>
</div>
</div>
</a>
<a class="dropdown-item d-flex border-bottom" href="login.html">
<div class="d-flex"><i class="fe fe-power me-3 tx-20 text-muted"></i>
<div class="pt-1">
<h6 class="mb-0">Sign Out</h6>
<p class="tx-12 mb-0 text-muted">Account Signout</p>
</div>
</div>
</a>
</div>
<div class="tab-pane" id="side2">
<div class="list-group list-group-flush ">
<div class="list-group-item d-flex align-items-center">
<div class="me-2">
<span class="avatar avatar-md brround cover-image" data-bs-image-src="../assets/images/faces/9.jpg"><span class="avatar-status bg-success"></span></span>
</div>
<div class="">
<div class="fw-semibold" data-bs-toggle="modal" data-target="#chatmodel">Mozelle Belt</div>
<p class="mb-0 tx-12 text-muted">mozellebelt@gmail.com</p>
</div>
</div>
<div class="list-group-item d-flex align-items-center">
<div class="me-2">
<span class="avatar avatar-md brround cover-image" data-bs-image-src="../assets/images/faces/11.jpg"></span>
</div>
<div class="">
<div class="fw-semibold" data-bs-toggle="modal" data-target="#chatmodel">Florinda Carasco</div>
<p class="mb-0 tx-12 text-muted">florindacarasco@gmail.com</p>
</div>
</div>
<div class="list-group-item d-flex align-items-center">
<div class="me-2">
<span class="avatar avatar-md brround cover-image" data-bs-image-src="../assets/images/faces/10.jpg"><span class="avatar-status bg-success"></span></span>
</div>
<div class="">
<div class="fw-semibold" data-bs-toggle="modal" data-target="#chatmodel">Alina Bernier</div>
<p class="mb-0 tx-12 text-muted">alinaaernier@gmail.com</p>
</div>
</div>
<div class="list-group-item d-flex align-items-center">
<div class="me-2">
<span class="avatar avatar-md brround cover-image" data-bs-image-src="../assets/images/faces/2.jpg"><span class="avatar-status bg-success"></span></span>
</div>
<div class="">
<div class="fw-semibold" data-bs-toggle="modal" data-target="#chatmodel">Zula Mclaughin</div>
<p class="mb-0 tx-12 text-muted">zulamclaughin@gmail.com</p>
</div>
</div>
<div class="list-group-item d-flex align-items-center">
<div class="me-2">
<span class="avatar avatar-md brround cover-image" data-bs-image-src="../assets/images/faces/13.jpg"></span>
</div>
<div class="">
<div class="fw-semibold" data-bs-toggle="modal" data-target="#chatmodel">Isidro Heide</div>
<p class="mb-0 tx-12 text-muted">isidroheide@gmail.com</p>
</div>
</div>
<div class="list-group-item d-flex align-items-center">
<div class="me-2">
<span class="avatar avatar-md brround cover-image" data-bs-image-src="../assets/images/faces/12.jpg"><span class="avatar-status bg-success"></span></span>
</div>
<div class="">
<div class="fw-semibold" data-bs-toggle="modal" data-target="#chatmodel">Mozelle Belt</div>
<p class="mb-0 tx-12 text-muted">mozellebelt@gmail.com</p>
</div>
</div>
<div class="list-group-item d-flex align-items-center">
<div class="me-2">
<span class="avatar avatar-md brround cover-image" data-bs-image-src="../assets/images/faces/4.jpg"></span>
</div>
<div class="">
<div class="fw-semibold" data-bs-toggle="modal" data-target="#chatmodel">Florinda Carasco</div>
<p class="mb-0 tx-12 text-muted">florindacarasco@gmail.com</p>
</div>
</div>
<div class="list-group-item d-flex align-items-center">
<div class="me-2">
<span class="avatar avatar-md brround cover-image" data-bs-image-src="../assets/images/faces/7.jpg"></span>
</div>
<div class="">
<div class="fw-semibold" data-bs-toggle="modal" data-target="#chatmodel">Alina Bernier</div>
<p class="mb-0 tx-12 text-muted">alinabernier@gmail.com</p>
</div>
</div>
<div class="list-group-item d-flex align-items-center">
<div class="me-2">
<span class="avatar avatar-md brround cover-image" data-bs-image-src="../assets/images/faces/2.jpg"></span>
</div>
<div class="">
<div class="fw-semibold" data-bs-toggle="modal" data-target="#chatmodel">Zula Mclaughin</div>
<p class="mb-0 tx-12 text-muted">zulamclaughin@gmail.com</p>
</div>
</div>
<div class="list-group-item d-flex align-items-center">
<div class="me-2">
<span class="avatar avatar-md brround cover-image" data-bs-image-src="../assets/images/faces/14.jpg"><span class="avatar-status bg-success"></span></span>
</div>
<div class="">
<div class="fw-semibold" data-bs-toggle="modal" data-target="#chatmodel">Isidro Heide</div>
<p class="mb-0 tx-12 text-muted">isidroheide@gmail.com</p>
</div>
</div>
<div class="list-group-item d-flex align-items-center">
<div class="me-2">
<span class="avatar avatar-md brround cover-image" data-bs-image-src="../assets/images/faces/11.jpg"></span>
</div>
<div class="">
<div class="fw-semibold" data-bs-toggle="modal" data-target="#chatmodel">Florinda Carasco</div>
<p class="mb-0 tx-12 text-muted">florindacarasco@gmail.com</p>
</div>
</div>
<div class="list-group-item d-flex align-items-center">
<div class="me-2">
<span class="avatar avatar-md brround cover-image" data-bs-image-src="../assets/images/faces/9.jpg"></span>
</div>
<div class="">
<div class="fw-semibold" data-bs-toggle="modal" data-target="#chatmodel">Alina Bernier</div>
<p class="mb-0 tx-12 text-muted">alinabernier@gmail.com</p>
</div>
</div>
<div class="list-group-item d-flex align-items-center">
<div class="me-2">
<span class="avatar avatar-md brround cover-image" data-bs-image-src="../assets/images/faces/15.jpg"><span class="avatar-status bg-success"></span></span>
</div>
<div class="">
<div class="fw-semibold" data-bs-toggle="modal" data-target="#chatmodel">Zula Mclaughin</div>
<p class="mb-0 tx-12 text-muted">zulamclaughin@gmail.com</p>
</div>
</div>
<div class="list-group-item d-flex align-items-center">
<div class="me-2">
<span class="avatar avatar-md brround cover-image" data-bs-image-src="../assets/images/faces/4.jpg"></span>
</div>
<div class="">
<div class="fw-semibold" data-bs-toggle="modal" data-target="#chatmodel">Isidro Heide</div>
<p class="mb-0 tx-12 text-muted">isidroheide@gmail.com</p>
</div>
</div>
</div>
</div>
<div class="tab-pane" id="side3">
<a class="dropdown-item bg-gray-100 pd-y-10" href="javascript:void(0);">
Account Settings
</a>
<div class="card-body">
<div class="form-group mg-b-10">
<label class="custom-switch ps-0">
<input type="checkbox" name="custom-switch-checkbox" class="custom-switch-input" checked>
<span class="custom-switch-indicator"></span>
<span class="custom-switch-description mg-l-10">Updates Automatically</span>
</label>
</div>
<div class="form-group mg-b-10">
<label class="custom-switch ps-0">
<input type="checkbox" name="custom-switch-checkbox" class="custom-switch-input">
<span class="custom-switch-indicator"></span>
<span class="custom-switch-description mg-l-10">Allow Location Map</span>
</label>
</div>
<div class="form-group mg-b-10">
<label class="custom-switch ps-0">
<input type="checkbox" name="custom-switch-checkbox" class="custom-switch-input" checked>
<span class="custom-switch-indicator"></span>
<span class="custom-switch-description mg-l-10">Show Contacts</span>
</label>
</div>
<div class="form-group mg-b-10">
<label class="custom-switch ps-0">
<input type="checkbox" name="custom-switch-checkbox" class="custom-switch-input" checked>
<span class="custom-switch-indicator"></span>
<span class="custom-switch-description mg-l-10">Show Notication</span>
</label>
</div>
<div class="form-group mg-b-10">
<label class="custom-switch ps-0">
<input type="checkbox" name="custom-switch-checkbox" class="custom-switch-input">
<span class="custom-switch-indicator"></span>
<span class="custom-switch-description mg-l-10">Show Tasks Statistics</span>
</label>
</div>
<div class="form-group mg-b-10">
<label class="custom-switch ps-0">
<input type="checkbox" name="custom-switch-checkbox" class="custom-switch-input" checked>
<span class="custom-switch-indicator"></span>
<span class="custom-switch-description mg-l-10">Show Email Notification</span>
</label>
</div>
</div>
<a class="dropdown-item bg-gray-100 pd-y-10" href="javascript:void(0);">
General Settings
</a>
<div class="card-body">
<div class="form-group mg-b-10">
<label class="custom-switch ps-0">
<input type="checkbox" name="custom-switch-checkbox" class="custom-switch-input" checked>
<span class="custom-switch-indicator"></span>
<span class="custom-switch-description mg-l-10">Show User Online</span>
</label>
</div>
<div class="form-group mg-b-10">
<label class="custom-switch ps-0">
<input type="checkbox" name="custom-switch-checkbox" class="custom-switch-input">
<span class="custom-switch-indicator"></span>
<span class="custom-switch-description mg-l-10">Website Notication</span>
</label>
</div>
<div class="form-group mg-b-10">
<label class="custom-switch ps-0">
<input type="checkbox" name="custom-switch-checkbox" class="custom-switch-input">
<span class="custom-switch-indicator"></span>
<span class="custom-switch-description mg-l-10">Show Recent activity</span>
</label>
</div>
<div class="form-group mg-b-10">
<label class="custom-switch ps-0">
<input type="checkbox" name="custom-switch-checkbox" class="custom-switch-input">
<span class="custom-switch-indicator"></span>
<span class="custom-switch-description mg-l-10">Logout Automatically</span>
</label>
</div>
<div class="form-group mg-b-10">
<label class="custom-switch ps-0">
<input type="checkbox" name="custom-switch-checkbox" class="custom-switch-input" checked>
<span class="custom-switch-indicator"></span>
<span class="custom-switch-description mg-l-10">Allow All Notifications</span>
</label>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!--/Sidebar-right-->
<!-- FOOTER -->
<footer class="footer">
<div class="container">
<div class="row align-items-center flex-row-reverse">
<div class="col-md-12 col-sm-12 text-center">
Copyright © <span id="year"></span> <a href="javascript:void(0);">Zanex</a>. Designed with <span class="fa fa-heart text-danger"></span> by <a href="javascript:void(0);"> Spruko </a> All rights reserved
</div>
</div>
</div>
</footer>
<!-- FOOTER CLOSED -->
</div>
<!-- BACK-TO-TOP -->
<a href="#top" id="back-to-top"><i class="fa fa-angle-up"></i></a>
<!-- JQUERY JS -->
<script src="../assets/js/jquery.min.js"></script>
<!-- BOOTSTRAP JS -->
<script src="../assets/plugins/bootstrap/js/popper.min.js"></script>
<script src="../assets/plugins/bootstrap/js/bootstrap.min.js"></script>
<!-- SPARKLINE JS-->
<script src="../assets/js/jquery.sparkline.min.js"></script>
<!-- CHART-CIRCLE JS-->
<script src="../assets/js/circle-progress.min.js"></script>
<!-- C3 CHART JS -->
<script src="../assets/plugins/charts-c3/d3.v5.min.js"></script>
<script src="../assets/plugins/charts-c3/c3-chart.js"></script>
<!-- INPUT MASK JS-->
<script src="../assets/plugins/input-mask/jquery.mask.min.js"></script>
<!-- SIDE-MENU JS -->
<script src="../assets/plugins/sidemenu/sidemenu.js"></script>
<!-- Sticky js -->
<script src="../assets/js/sticky.js"></script>
<!-- SIDEBAR JS -->
<script src="../assets/plugins/sidebar/sidebar.js"></script>
<!-- Perfect SCROLLBAR JS-->
<script src="../assets/plugins/p-scroll/perfect-scrollbar.js"></script>
<script src="../assets/plugins/p-scroll/pscroll.js"></script>
<script src="../assets/plugins/p-scroll/pscroll-1.js"></script>
<!-- Color Theme js -->
<script src="../assets/js/themeColors.js"></script>
<!-- swither styles js -->
<script src="../assets/js/swither-styles.js"></script>
<!-- CUSTOM JS -->
<script src="../assets/js/custom.js"></script>
</body>
</html>