Add theme assets;

This commit is contained in:
2024-01-21 17:18:37 +01:00
parent fcc061aeba
commit aa45b6a645
1425 changed files with 430771 additions and 1 deletions

View File

@@ -0,0 +1,953 @@
<!DOCTYPE html>
<!--
Template Name: NobleUI - HTML Bootstrap 5 Admin Dashboard Template
Author: NobleUI
Website: https://www.nobleui.com
Portfolio: https://themeforest.net/user/nobleui/portfolio
Contact: nobleui123@gmail.com
Purchase: https://1.envato.market/nobleui_admin
License: For each use you must have a valid license purchased only from above link in order to legally use the theme for your project.
-->
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta name="description" content="Responsive HTML Admin Dashboard Template based on Bootstrap 5">
<meta name="author" content="NobleUI">
<meta name="keywords" content="nobleui, bootstrap, bootstrap 5, bootstrap5, admin, dashboard, template, responsive, css, sass, html, theme, front-end, ui kit, web">
<title>NobleUI - HTML Bootstrap 5 Admin Dashboard Template</title>
<!-- Fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700;900&display=swap" rel="stylesheet">
<!-- End fonts -->
<!-- core:css -->
<link rel="stylesheet" href="../../../assets/vendors/core/core.css">
<!-- endinject -->
<!-- Plugin css for this page -->
<!-- End plugin css for this page -->
<!-- inject:css -->
<link rel="stylesheet" href="../../../assets/fonts/feather-font/css/iconfont.css">
<link rel="stylesheet" href="../../../assets/vendors/flag-icon-css/css/flag-icon.min.css">
<!-- endinject -->
<!-- Layout styles -->
<link rel="stylesheet" href="../../../assets/css/demo2/style.css">
<!-- End layout styles -->
<link rel="shortcut icon" href="../../../assets/images/favicon.png" />
</head>
<body>
<div class="main-wrapper">
<!-- partial:../../partials/_sidebar.html -->
<nav class="sidebar">
<div class="sidebar-header">
<a href="#" class="sidebar-brand">
Noble<span>UI</span>
</a>
<div class="sidebar-toggler not-active">
<span></span>
<span></span>
<span></span>
</div>
</div>
<div class="sidebar-body">
<ul class="nav">
<li class="nav-item nav-category">Main</li>
<li class="nav-item">
<a href="../../dashboard.html" class="nav-link">
<i class="link-icon" data-feather="box"></i>
<span class="link-title">Dashboard</span>
</a>
</li>
<li class="nav-item nav-category">web apps</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="collapse" href="#emails" role="button" aria-expanded="false" aria-controls="emails">
<i class="link-icon" data-feather="mail"></i>
<span class="link-title">Email</span>
<i class="link-arrow" data-feather="chevron-down"></i>
</a>
<div class="collapse" id="emails">
<ul class="nav sub-menu">
<li class="nav-item">
<a href="../../pages/email/inbox.html" class="nav-link">Inbox</a>
</li>
<li class="nav-item">
<a href="../../pages/email/read.html" class="nav-link">Read</a>
</li>
<li class="nav-item">
<a href="../../pages/email/compose.html" class="nav-link">Compose</a>
</li>
</ul>
</div>
</li>
<li class="nav-item">
<a href="../../pages/apps/chat.html" class="nav-link">
<i class="link-icon" data-feather="message-square"></i>
<span class="link-title">Chat</span>
</a>
</li>
<li class="nav-item">
<a href="../../pages/apps/calendar.html" class="nav-link">
<i class="link-icon" data-feather="calendar"></i>
<span class="link-title">Calendar</span>
</a>
</li>
<li class="nav-item nav-category">Components</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="collapse" href="#uiComponents" role="button" aria-expanded="false" aria-controls="uiComponents">
<i class="link-icon" data-feather="feather"></i>
<span class="link-title">UI Kit</span>
<i class="link-arrow" data-feather="chevron-down"></i>
</a>
<div class="collapse" id="uiComponents">
<ul class="nav sub-menu">
<li class="nav-item">
<a href="../../pages/ui-components/accordion.html" class="nav-link">Accordion</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/alerts.html" class="nav-link">Alerts</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/badges.html" class="nav-link">Badges</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/breadcrumbs.html" class="nav-link">Breadcrumbs</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/buttons.html" class="nav-link">Buttons</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/button-group.html" class="nav-link">Button group</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/cards.html" class="nav-link">Cards</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/carousel.html" class="nav-link">Carousel</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/collapse.html" class="nav-link">Collapse</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/dropdowns.html" class="nav-link">Dropdowns</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/list-group.html" class="nav-link">List group</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/media-object.html" class="nav-link">Media object</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/modal.html" class="nav-link">Modal</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/navs.html" class="nav-link">Navs</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/navbar.html" class="nav-link">Navbar</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/pagination.html" class="nav-link">Pagination</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/popover.html" class="nav-link">Popovers</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/progress.html" class="nav-link">Progress</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/scrollbar.html" class="nav-link">Scrollbar</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/scrollspy.html" class="nav-link">Scrollspy</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/spinners.html" class="nav-link">Spinners</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/tabs.html" class="nav-link">Tabs</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/tooltips.html" class="nav-link">Tooltips</a>
</li>
</ul>
</div>
</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="collapse" href="#advancedUI" role="button" aria-expanded="false" aria-controls="advancedUI">
<i class="link-icon" data-feather="anchor"></i>
<span class="link-title">Advanced UI</span>
<i class="link-arrow" data-feather="chevron-down"></i>
</a>
<div class="collapse" id="advancedUI">
<ul class="nav sub-menu">
<li class="nav-item">
<a href="../../pages/advanced-ui/cropper.html" class="nav-link">Cropper</a>
</li>
<li class="nav-item">
<a href="../../pages/advanced-ui/owl-carousel.html" class="nav-link">Owl carousel</a>
</li>
<li class="nav-item">
<a href="../../pages/advanced-ui/sortablejs.html" class="nav-link">SortableJs</a>
</li>
<li class="nav-item">
<a href="../../pages/advanced-ui/sweet-alert.html" class="nav-link">Sweet Alert</a>
</li>
</ul>
</div>
</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="collapse" href="#forms" role="button" aria-expanded="false" aria-controls="forms">
<i class="link-icon" data-feather="inbox"></i>
<span class="link-title">Forms</span>
<i class="link-arrow" data-feather="chevron-down"></i>
</a>
<div class="collapse" id="forms">
<ul class="nav sub-menu">
<li class="nav-item">
<a href="../../pages/forms/basic-elements.html" class="nav-link">Basic Elements</a>
</li>
<li class="nav-item">
<a href="../../pages/forms/advanced-elements.html" class="nav-link">Advanced Elements</a>
</li>
<li class="nav-item">
<a href="../../pages/forms/editors.html" class="nav-link">Editors</a>
</li>
<li class="nav-item">
<a href="../../pages/forms/wizard.html" class="nav-link">Wizard</a>
</li>
</ul>
</div>
</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="collapse" href="#charts" role="button" aria-expanded="false" aria-controls="charts">
<i class="link-icon" data-feather="pie-chart"></i>
<span class="link-title">Charts</span>
<i class="link-arrow" data-feather="chevron-down"></i>
</a>
<div class="collapse" id="charts">
<ul class="nav sub-menu">
<li class="nav-item">
<a href="../../pages/charts/apex.html" class="nav-link">Apex</a>
</li>
<li class="nav-item">
<a href="../../pages/charts/chartjs.html" class="nav-link">ChartJs</a>
</li>
<li class="nav-item">
<a href="../../pages/charts/flot.html" class="nav-link">Flot</a>
</li>
<li class="nav-item">
<a href="../../pages/charts/morrisjs.html" class="nav-link">Morris</a>
</li>
<li class="nav-item">
<a href="../../pages/charts/peity.html" class="nav-link">Peity</a>
</li>
<li class="nav-item">
<a href="../../pages/charts/sparkline.html" class="nav-link">Sparkline</a>
</li>
</ul>
</div>
</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="collapse" href="#tables" role="button" aria-expanded="false" aria-controls="tables">
<i class="link-icon" data-feather="layout"></i>
<span class="link-title">Table</span>
<i class="link-arrow" data-feather="chevron-down"></i>
</a>
<div class="collapse" id="tables">
<ul class="nav sub-menu">
<li class="nav-item">
<a href="../../pages/tables/basic-table.html" class="nav-link">Basic Tables</a>
</li>
<li class="nav-item">
<a href="../../pages/tables/data-table.html" class="nav-link">Data Table</a>
</li>
</ul>
</div>
</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="collapse" href="#icons" role="button" aria-expanded="false" aria-controls="icons">
<i class="link-icon" data-feather="smile"></i>
<span class="link-title">Icons</span>
<i class="link-arrow" data-feather="chevron-down"></i>
</a>
<div class="collapse" id="icons">
<ul class="nav sub-menu">
<li class="nav-item">
<a href="../../pages/icons/feather-icons.html" class="nav-link">Feather Icons</a>
</li>
<li class="nav-item">
<a href="../../pages/icons/flag-icons.html" class="nav-link">Flag Icons</a>
</li>
<li class="nav-item">
<a href="../../pages/icons/mdi-icons.html" class="nav-link">Mdi Icons</a>
</li>
</ul>
</div>
</li>
<li class="nav-item nav-category">Pages</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="collapse" href="#general-pages" role="button" aria-expanded="false" aria-controls="general-pages">
<i class="link-icon" data-feather="book"></i>
<span class="link-title">Special pages</span>
<i class="link-arrow" data-feather="chevron-down"></i>
</a>
<div class="collapse" id="general-pages">
<ul class="nav sub-menu">
<li class="nav-item">
<a href="../../pages/general/blank-page.html" class="nav-link">Blank page</a>
</li>
<li class="nav-item">
<a href="../../pages/general/faq.html" class="nav-link">Faq</a>
</li>
<li class="nav-item">
<a href="../../pages/general/invoice.html" class="nav-link">Invoice</a>
</li>
<li class="nav-item">
<a href="../../pages/general/profile.html" class="nav-link">Profile</a>
</li>
<li class="nav-item">
<a href="../../pages/general/pricing.html" class="nav-link">Pricing</a>
</li>
<li class="nav-item">
<a href="../../pages/general/timeline.html" class="nav-link">Timeline</a>
</li>
</ul>
</div>
</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="collapse" href="#authPages" role="button" aria-expanded="false" aria-controls="authPages">
<i class="link-icon" data-feather="unlock"></i>
<span class="link-title">Authentication</span>
<i class="link-arrow" data-feather="chevron-down"></i>
</a>
<div class="collapse" id="authPages">
<ul class="nav sub-menu">
<li class="nav-item">
<a href="../../pages/auth/login.html" class="nav-link">Login</a>
</li>
<li class="nav-item">
<a href="../../pages/auth/register.html" class="nav-link">Register</a>
</li>
</ul>
</div>
</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="collapse" href="#errorPages" role="button" aria-expanded="false" aria-controls="errorPages">
<i class="link-icon" data-feather="cloud-off"></i>
<span class="link-title">Error</span>
<i class="link-arrow" data-feather="chevron-down"></i>
</a>
<div class="collapse" id="errorPages">
<ul class="nav sub-menu">
<li class="nav-item">
<a href="../../pages/error/404.html" class="nav-link">404</a>
</li>
<li class="nav-item">
<a href="../../pages/error/500.html" class="nav-link">500</a>
</li>
</ul>
</div>
</li>
<li class="nav-item nav-category">Docs</li>
<li class="nav-item">
<a href="https://www.nobleui.com/html/documentation/docs.html" target="_blank" class="nav-link">
<i class="link-icon" data-feather="hash"></i>
<span class="link-title">Documentation</span>
</a>
</li>
</ul>
</div>
</nav>
<nav class="settings-sidebar">
<div class="sidebar-body">
<a href="#" class="settings-sidebar-toggler">
<i data-feather="settings"></i>
</a>
<div class="theme-wrapper">
<h6 class="text-muted mb-2">Light Theme:</h6>
<a class="theme-item" href="../../../demo1/dashboard.html">
<img src="../../../assets/images/screenshots/light.jpg" alt="light theme">
</a>
<h6 class="text-muted mb-2">Dark Theme:</h6>
<a class="theme-item active" href="../../../demo2/dashboard.html">
<img src="../../../assets/images/screenshots/dark.jpg" alt="light theme">
</a>
</div>
</div>
</nav>
<!-- partial -->
<div class="page-wrapper">
<!-- partial:../../partials/_navbar.html -->
<nav class="navbar">
<a href="#" class="sidebar-toggler">
<i data-feather="menu"></i>
</a>
<div class="navbar-content">
<form class="search-form">
<div class="input-group">
<div class="input-group-text">
<i data-feather="search"></i>
</div>
<input type="text" class="form-control" id="navbarForm" placeholder="Search here...">
</div>
</form>
<ul class="navbar-nav">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="languageDropdown" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="flag-icon flag-icon-us mt-1" title="us"></i> <span class="ms-1 me-1 d-none d-md-inline-block">English</span>
</a>
<div class="dropdown-menu" aria-labelledby="languageDropdown">
<a href="javascript:;" class="dropdown-item py-2"><i class="flag-icon flag-icon-us" title="us" id="us"></i> <span class="ms-1"> English </span></a>
<a href="javascript:;" class="dropdown-item py-2"><i class="flag-icon flag-icon-fr" title="fr" id="fr"></i> <span class="ms-1"> French </span></a>
<a href="javascript:;" class="dropdown-item py-2"><i class="flag-icon flag-icon-de" title="de" id="de"></i> <span class="ms-1"> German </span></a>
<a href="javascript:;" class="dropdown-item py-2"><i class="flag-icon flag-icon-pt" title="pt" id="pt"></i> <span class="ms-1"> Portuguese </span></a>
<a href="javascript:;" class="dropdown-item py-2"><i class="flag-icon flag-icon-es" title="es" id="es"></i> <span class="ms-1"> Spanish </span></a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="appsDropdown" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i data-feather="grid"></i>
</a>
<div class="dropdown-menu p-0" aria-labelledby="appsDropdown">
<div class="px-3 py-2 d-flex align-items-center justify-content-between border-bottom">
<p class="mb-0 fw-bold">Web Apps</p>
<a href="javascript:;" class="text-muted">Edit</a>
</div>
<div class="row g-0 p-1">
<div class="col-3 text-center">
<a href="../../pages/apps/chat.html" class="dropdown-item d-flex flex-column align-items-center justify-content-center wd-70 ht-70"><i data-feather="message-square" class="icon-lg mb-1"></i><p class="tx-12">Chat</p></a>
</div>
<div class="col-3 text-center">
<a href="../../pages/apps/calendar.html" class="dropdown-item d-flex flex-column align-items-center justify-content-center wd-70 ht-70"><i data-feather="calendar" class="icon-lg mb-1"></i><p class="tx-12">Calendar</p></a>
</div>
<div class="col-3 text-center">
<a href="../../pages/email/inbox.html" class="dropdown-item d-flex flex-column align-items-center justify-content-center wd-70 ht-70"><i data-feather="mail" class="icon-lg mb-1"></i><p class="tx-12">Email</p></a>
</div>
<div class="col-3 text-center">
<a href="../../pages/general/profile.html" class="dropdown-item d-flex flex-column align-items-center justify-content-center wd-70 ht-70"><i data-feather="instagram" class="icon-lg mb-1"></i><p class="tx-12">Profile</p></a>
</div>
</div>
<div class="px-3 py-2 d-flex align-items-center justify-content-center border-top">
<a href="javascript:;">View all</a>
</div>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="messageDropdown" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i data-feather="mail"></i>
</a>
<div class="dropdown-menu p-0" aria-labelledby="messageDropdown">
<div class="px-3 py-2 d-flex align-items-center justify-content-between border-bottom">
<p>9 New Messages</p>
<a href="javascript:;" class="text-muted">Clear all</a>
</div>
<div class="p-1">
<a href="javascript:;" class="dropdown-item d-flex align-items-center py-2">
<div class="me-3">
<img class="wd-30 ht-30 rounded-circle" src="https://via.placeholder.com/30x30" alt="userr">
</div>
<div class="d-flex justify-content-between flex-grow-1">
<div class="me-4">
<p>Leonardo Payne</p>
<p class="tx-12 text-muted">Project status</p>
</div>
<p class="tx-12 text-muted">2 min ago</p>
</div>
</a>
<a href="javascript:;" class="dropdown-item d-flex align-items-center py-2">
<div class="me-3">
<img class="wd-30 ht-30 rounded-circle" src="https://via.placeholder.com/30x30" alt="userr">
</div>
<div class="d-flex justify-content-between flex-grow-1">
<div class="me-4">
<p>Carl Henson</p>
<p class="tx-12 text-muted">Client meeting</p>
</div>
<p class="tx-12 text-muted">30 min ago</p>
</div>
</a>
<a href="javascript:;" class="dropdown-item d-flex align-items-center py-2">
<div class="me-3">
<img class="wd-30 ht-30 rounded-circle" src="https://via.placeholder.com/30x30" alt="userr">
</div>
<div class="d-flex justify-content-between flex-grow-1">
<div class="me-4">
<p>Jensen Combs</p>
<p class="tx-12 text-muted">Project updates</p>
</div>
<p class="tx-12 text-muted">1 hrs ago</p>
</div>
</a>
<a href="javascript:;" class="dropdown-item d-flex align-items-center py-2">
<div class="me-3">
<img class="wd-30 ht-30 rounded-circle" src="https://via.placeholder.com/30x30" alt="userr">
</div>
<div class="d-flex justify-content-between flex-grow-1">
<div class="me-4">
<p>Amiah Burton</p>
<p class="tx-12 text-muted">Project deatline</p>
</div>
<p class="tx-12 text-muted">2 hrs ago</p>
</div>
</a>
<a href="javascript:;" class="dropdown-item d-flex align-items-center py-2">
<div class="me-3">
<img class="wd-30 ht-30 rounded-circle" src="https://via.placeholder.com/30x30" alt="userr">
</div>
<div class="d-flex justify-content-between flex-grow-1">
<div class="me-4">
<p>Yaretzi Mayo</p>
<p class="tx-12 text-muted">New record</p>
</div>
<p class="tx-12 text-muted">5 hrs ago</p>
</div>
</a>
</div>
<div class="px-3 py-2 d-flex align-items-center justify-content-center border-top">
<a href="javascript:;">View all</a>
</div>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="notificationDropdown" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i data-feather="bell"></i>
<div class="indicator">
<div class="circle"></div>
</div>
</a>
<div class="dropdown-menu p-0" aria-labelledby="notificationDropdown">
<div class="px-3 py-2 d-flex align-items-center justify-content-between border-bottom">
<p>6 New Notifications</p>
<a href="javascript:;" class="text-muted">Clear all</a>
</div>
<div class="p-1">
<a href="javascript:;" class="dropdown-item d-flex align-items-center py-2">
<div class="wd-30 ht-30 d-flex align-items-center justify-content-center bg-primary rounded-circle me-3">
<i class="icon-sm text-white" data-feather="gift"></i>
</div>
<div class="flex-grow-1 me-2">
<p>New Order Recieved</p>
<p class="tx-12 text-muted">30 min ago</p>
</div>
</a>
<a href="javascript:;" class="dropdown-item d-flex align-items-center py-2">
<div class="wd-30 ht-30 d-flex align-items-center justify-content-center bg-primary rounded-circle me-3">
<i class="icon-sm text-white" data-feather="alert-circle"></i>
</div>
<div class="flex-grow-1 me-2">
<p>Server Limit Reached!</p>
<p class="tx-12 text-muted">1 hrs ago</p>
</div>
</a>
<a href="javascript:;" class="dropdown-item d-flex align-items-center py-2">
<div class="wd-30 ht-30 d-flex align-items-center justify-content-center bg-primary rounded-circle me-3">
<img class="wd-30 ht-30 rounded-circle" src="https://via.placeholder.com/30x30" alt="userr">
</div>
<div class="flex-grow-1 me-2">
<p>New customer registered</p>
<p class="tx-12 text-muted">2 sec ago</p>
</div>
</a>
<a href="javascript:;" class="dropdown-item d-flex align-items-center py-2">
<div class="wd-30 ht-30 d-flex align-items-center justify-content-center bg-primary rounded-circle me-3">
<i class="icon-sm text-white" data-feather="layers"></i>
</div>
<div class="flex-grow-1 me-2">
<p>Apps are ready for update</p>
<p class="tx-12 text-muted">5 hrs ago</p>
</div>
</a>
<a href="javascript:;" class="dropdown-item d-flex align-items-center py-2">
<div class="wd-30 ht-30 d-flex align-items-center justify-content-center bg-primary rounded-circle me-3">
<i class="icon-sm text-white" data-feather="download"></i>
</div>
<div class="flex-grow-1 me-2">
<p>Download completed</p>
<p class="tx-12 text-muted">6 hrs ago</p>
</div>
</a>
</div>
<div class="px-3 py-2 d-flex align-items-center justify-content-center border-top">
<a href="javascript:;">View all</a>
</div>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="profileDropdown" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<img class="wd-30 ht-30 rounded-circle" src="https://via.placeholder.com/30x30" alt="profile">
</a>
<div class="dropdown-menu p-0" aria-labelledby="profileDropdown">
<div class="d-flex flex-column align-items-center border-bottom px-5 py-3">
<div class="mb-3">
<img class="wd-80 ht-80 rounded-circle" src="https://via.placeholder.com/80x80" alt="">
</div>
<div class="text-center">
<p class="tx-16 fw-bolder">Amiah Burton</p>
<p class="tx-12 text-muted">amiahburton@gmail.com</p>
</div>
</div>
<ul class="list-unstyled p-1">
<li class="dropdown-item py-2">
<a href="../../pages/general/profile.html" class="text-body ms-0">
<i class="me-2 icon-md" data-feather="user"></i>
<span>Profile</span>
</a>
</li>
<li class="dropdown-item py-2">
<a href="javascript:;" class="text-body ms-0">
<i class="me-2 icon-md" data-feather="edit"></i>
<span>Edit Profile</span>
</a>
</li>
<li class="dropdown-item py-2">
<a href="javascript:;" class="text-body ms-0">
<i class="me-2 icon-md" data-feather="repeat"></i>
<span>Switch User</span>
</a>
</li>
<li class="dropdown-item py-2">
<a href="javascript:;" class="text-body ms-0">
<i class="me-2 icon-md" data-feather="log-out"></i>
<span>Log Out</span>
</a>
</li>
</ul>
</div>
</li>
</ul>
</div>
</nav>
<!-- partial -->
<div class="page-content">
<nav class="page-breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="#">Icons</a></li>
<li class="breadcrumb-item active" aria-current="page">Feather Icons</li>
</ol>
</nav>
<div class="row">
<div class="col-md-12 stretch-card">
<div class="card">
<div class="card-body">
<h6 class="card-title">Feather Icons</h6>
<p class="text-muted mb-3">Visit the <a href="https://feathericons.com/" target="_blank"> Official Feather Icons Documentation </a>.</p>
<p class="text-muted mb-3">Usage example : &lt;i data-feather="star"&gt;&lt;/i&gt;</p>
<div class="container">
<div class="icons-list row">
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="activity"></i> activity </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="airplay"></i> airplay </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="alert-circle"></i> alert-circle </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="alert-octagon"></i> alert-octagon </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="alert-triangle"></i> alert-triangle </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="align-center"></i> align-center </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="align-justify"></i> align-justify </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="align-left"></i> align-left </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="align-right"></i> align-right </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="anchor"></i> anchor </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="aperture"></i> aperture </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="archive"></i> archive </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="arrow-down-circle"></i> arrow-down-circle </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="arrow-down-left"></i> arrow-down-left </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="arrow-down-right"></i> arrow-down-right </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="arrow-down"></i> arrow-down </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="arrow-left-circle"></i> arrow-left-circle </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="arrow-left"></i> arrow-left </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="arrow-right-circle"></i> arrow-right-circle </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="arrow-right"></i> arrow-right </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="arrow-up-circle"></i> arrow-up-circle </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="arrow-up-left"></i> arrow-up-left </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="arrow-up-right"></i> arrow-up-right </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="arrow-up"></i> arrow-up </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="at-sign"></i> at-sign </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="award"></i> award </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="bar-chart-2"></i> bar-chart-2 </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="bar-chart"></i> bar-chart </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="battery-charging"></i> battery-charging </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="battery"></i> battery </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="bell-off"></i> bell-off </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="bell"></i> bell </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="bluetooth"></i> bluetooth </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="bold"></i> bold </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="book-open"></i> book-open </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="book"></i> book </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="bookmark"></i> bookmark </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="box"></i> box </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="briefcase"></i> briefcase </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="calendar"></i> calendar </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="camera-off"></i> camera-off </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="camera"></i> camera </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="cast"></i> cast </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="check-circle"></i> check-circle </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="check-square"></i> check-square </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="check"></i> check </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="chevron-down"></i> chevron-down </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="chevron-left"></i> chevron-left </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="chevron-right"></i> chevron-right </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="chevron-up"></i> chevron-up </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="chevrons-down"></i> chevrons-down </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="chevrons-left"></i> chevrons-left </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="chevrons-right"></i> chevrons-right </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="chevrons-up"></i> chevrons-up </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="chrome"></i> chrome </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="clipboard"></i> clipboard </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="clock"></i> clock </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="cloud-drizzle"></i> cloud-drizzle </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="cloud-lightning"></i> cloud-lightning </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="cloud-off"></i> cloud-off </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="cloud-rain"></i> cloud-rain </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="cloud-snow"></i> cloud-snow </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="cloud"></i> cloud </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="code"></i> code </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="codepen"></i> codepen </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="codesandbox"></i> codesandbox </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="coffee"></i> coffee </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="columns"></i> columns </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="command"></i> command </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="compass"></i> compass </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="copy"></i> copy </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="corner-down-left"></i> corner-down-left </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="corner-down-right"></i> corner-down-right </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="corner-left-down"></i> corner-left-down </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="corner-left-up"></i> corner-left-up </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="corner-right-down"></i> corner-right-down </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="corner-right-up"></i> corner-right-up </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="corner-up-left"></i> corner-up-left </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="corner-up-right"></i> corner-up-right </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="cpu"></i> cpu </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="credit-card"></i> credit-card </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="crop"></i> crop </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="crosshair"></i> crosshair </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="database"></i> database </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="delete"></i> delete </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="disc"></i> disc </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="dollar-sign"></i> dollar-sign </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="download-cloud"></i> download-cloud </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="download"></i> download </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="droplet"></i> droplet </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="edit-2"></i> edit-2 </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="edit-3"></i> edit-3 </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="edit"></i> edit </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="external-link"></i> external-link </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="eye-off"></i> eye-off </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="eye"></i> eye </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="facebook"></i> facebook </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="fast-forward"></i> fast-forward </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="feather"></i> feather </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="figma"></i> figma </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="file-minus"></i> file-minus </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="file-plus"></i> file-plus </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="file-text"></i> file-text </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="file"></i> file </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="film"></i> film </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="filter"></i> filter </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="flag"></i> flag </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="folder-minus"></i> folder-minus </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="folder-plus"></i> folder-plus </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="folder"></i> folder </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="frown"></i> frown </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="gift"></i> gift </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="git-branch"></i> git-branch </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="git-commit"></i> git-commit </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="git-merge"></i> git-merge </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="git-pull-request"></i> git-pull-request </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="github"></i> github </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="gitlab"></i> gitlab </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="globe"></i> globe </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="grid"></i> grid </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="hard-drive"></i> hard-drive </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="hash"></i> hash </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="headphones"></i> headphones </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="heart"></i> heart </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="help-circle"></i> help-circle </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="hexagon"></i> hexagon </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="home"></i> home </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="image"></i> image </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="inbox"></i> inbox </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="info"></i> info </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="instagram"></i> instagram </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="italic"></i> italic </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="key"></i> key </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="layers"></i> layers </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="layout"></i> layout </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="life-buoy"></i> life-buoy </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="link-2"></i> link-2 </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="link"></i> link </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="linkedin"></i> linkedin </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="list"></i> list </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="loader"></i> loader </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="lock"></i> lock </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="log-in"></i> log-in </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="log-out"></i> log-out </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="mail"></i> mail </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="map-pin"></i> map-pin </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="map"></i> map </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="maximize-2"></i> maximize-2 </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="maximize"></i> maximize </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="minus-circle"></i> minus-circle </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="minus-square"></i> minus-square </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="minus"></i> minus </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="monitor"></i> monitor </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="moon"></i> moon </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="more-horizontal"></i> more-horizontal </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="more-vertical"></i> more-vertical </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="mouse-pointer"></i> mouse-pointer </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="move"></i> move </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="music"></i> music </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="navigation-2"></i> navigation-2 </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="navigation"></i> navigation </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="octagon"></i> octagon </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="package"></i> package </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="paperclip"></i> paperclip </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="pause-circle"></i> pause-circle </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="pause"></i> pause </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="pen-tool"></i> pen-tool </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="percent"></i> percent </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="phone-call"></i> phone-call </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="phone-forwarded"></i> phone-forwarded </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="phone-incoming"></i> phone-incoming </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="phone-missed"></i> phone-missed </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="phone-off"></i> phone-off </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="phone-outgoing"></i> phone-outgoing </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="phone"></i> phone </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="pie-chart"></i> pie-chart </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="play-circle"></i> play-circle </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="play"></i> play </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="plus-circle"></i> plus-circle </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="plus-square"></i> plus-square </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="plus"></i> plus </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="pocket"></i> pocket </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="power"></i> power </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="printer"></i> printer </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="radio"></i> radio </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="refresh-ccw"></i> refresh-ccw </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="rotate-cw"></i> rotate-cw </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="rss"></i> rss </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="save"></i> save </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="scissors"></i> scissors </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="search"></i> search </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="send"></i> send </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="server"></i> server </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="settings"></i> settings </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="share-2"></i> share-2 </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="share"></i> share </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="shield-off"></i> shield-off </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="shield"></i> shield </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="shopping-bag"></i> shopping-bag </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="shopping-cart"></i> shopping-cart </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="shuffle"></i> shuffle </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="sidebar"></i> sidebar </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="skip-back"></i> skip-back </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="skip-forward"></i> skip-forward </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="slack"></i> slack </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="slash"></i> slash </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="sliders"></i> sliders </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="smartphone"></i> smartphone </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="smile"></i> smile </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="speaker"></i> speaker </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="square"></i> square </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="star"></i> star </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="stop-circle"></i> stop-circle </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="sun"></i> sun </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="sunrise"></i> sunrise </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="sunset"></i> sunset </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="table"></i> table </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="tablet"></i> tablet </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="tag"></i> tag </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="target"></i> target </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="terminal"></i> terminal </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="thermometer"></i> thermometer </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="thumbs-down"></i> thumbs-down </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="thumbs-up"></i> thumbs-up </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="toggle-left"></i> toggle-left </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="toggle-right"></i> toggle-right </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="trash-2"></i> trash-2 </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="trash"></i> trash </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="trello"></i> trello </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="trending-down"></i> trending-down </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="trending-up"></i> trending-up </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="triangle"></i> triangle </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="truck"></i> truck </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="tv"></i> tv </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="twitter"></i> twitter </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="type"></i> type </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="umbrella"></i> umbrella </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="underline"></i> underline </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="unlock"></i> unlock </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="upload-cloud"></i> upload-cloud </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="upload"></i> upload </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="user-check"></i> user-check </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="user-plus"></i> user-plus </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="user-minus"></i> user-minus </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="user-x"></i> user-x </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="user"></i> user </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="users"></i> users </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="video-off"></i> video-off </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="video"></i> video </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="voicemail"></i> voicemail </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="volume-1"></i> volume-1 </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="volume-2"></i> volume-2 </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="volume-x"></i> volume-x </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="volume"></i> volume </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="watch"></i> watch </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="wifi-off"></i> wifi-off </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="wifi"></i> wifi </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="wind"></i> wind </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="x-circle"></i> x-circle </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="x-octagon"></i> x-octagon </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="x-square"></i> x-square </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="x"></i> x </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="youtube"></i> youtube </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="zap-off"></i> zap-off </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="zap"></i> zap </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="zoom-in"></i> zoom-in </div>
<div class="col-sm-6 col-md-4 col-lg-3"> <i data-feather="zoom-out"></i> zoom-out </div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- partial:../../partials/_footer.html -->
<footer class="footer d-flex flex-column flex-md-row align-items-center justify-content-between px-4 py-3 border-top small">
<p class="text-muted mb-1 mb-md-0">Copyright © 2022 <a href="https://www.nobleui.com" target="_blank">NobleUI</a>.</p>
<p class="text-muted">Handcrafted With <i class="mb-1 text-primary ms-1 icon-sm" data-feather="heart"></i></p>
</footer>
<!-- partial -->
</div>
</div>
<!-- core:js -->
<script src="../../../assets/vendors/core/core.js"></script>
<!-- endinject -->
<!-- Plugin js for this page -->
<!-- End plugin js for this page -->
<!-- inject:js -->
<script src="../../../assets/vendors/feather-icons/feather.min.js"></script>
<script src="../../../assets/js/template.js"></script>
<!-- endinject -->
<!-- Custom js for this page -->
<!-- End custom js for this page -->
</body>
</html>

View File

@@ -0,0 +1,936 @@
<!DOCTYPE html>
<!--
Template Name: NobleUI - HTML Bootstrap 5 Admin Dashboard Template
Author: NobleUI
Website: https://www.nobleui.com
Portfolio: https://themeforest.net/user/nobleui/portfolio
Contact: nobleui123@gmail.com
Purchase: https://1.envato.market/nobleui_admin
License: For each use you must have a valid license purchased only from above link in order to legally use the theme for your project.
-->
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<meta name="description" content="Responsive HTML Admin Dashboard Template based on Bootstrap 5">
<meta name="author" content="NobleUI">
<meta name="keywords" content="nobleui, bootstrap, bootstrap 5, bootstrap5, admin, dashboard, template, responsive, css, sass, html, theme, front-end, ui kit, web">
<title>NobleUI - HTML Bootstrap 5 Admin Dashboard Template</title>
<!-- Fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700;900&display=swap" rel="stylesheet">
<!-- End fonts -->
<!-- core:css -->
<link rel="stylesheet" href="../../../assets/vendors/core/core.css">
<!-- endinject -->
<!-- Plugin css for this page -->
<link rel="stylesheet" href="../../../assets/vendors/flag-icon-css/css/flag-icon.min.css">
<!-- End plugin css for this page -->
<!-- inject:css -->
<link rel="stylesheet" href="../../../assets/fonts/feather-font/css/iconfont.css">
<link rel="stylesheet" href="../../../assets/vendors/flag-icon-css/css/flag-icon.min.css">
<!-- endinject -->
<!-- Layout styles -->
<link rel="stylesheet" href="../../../assets/css/demo2/style.css">
<!-- End layout styles -->
<link rel="shortcut icon" href="../../../assets/images/favicon.png" />
</head>
<body>
<div class="main-wrapper">
<!-- partial:../../partials/_sidebar.html -->
<nav class="sidebar">
<div class="sidebar-header">
<a href="#" class="sidebar-brand">
Noble<span>UI</span>
</a>
<div class="sidebar-toggler not-active">
<span></span>
<span></span>
<span></span>
</div>
</div>
<div class="sidebar-body">
<ul class="nav">
<li class="nav-item nav-category">Main</li>
<li class="nav-item">
<a href="../../dashboard.html" class="nav-link">
<i class="link-icon" data-feather="box"></i>
<span class="link-title">Dashboard</span>
</a>
</li>
<li class="nav-item nav-category">web apps</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="collapse" href="#emails" role="button" aria-expanded="false" aria-controls="emails">
<i class="link-icon" data-feather="mail"></i>
<span class="link-title">Email</span>
<i class="link-arrow" data-feather="chevron-down"></i>
</a>
<div class="collapse" id="emails">
<ul class="nav sub-menu">
<li class="nav-item">
<a href="../../pages/email/inbox.html" class="nav-link">Inbox</a>
</li>
<li class="nav-item">
<a href="../../pages/email/read.html" class="nav-link">Read</a>
</li>
<li class="nav-item">
<a href="../../pages/email/compose.html" class="nav-link">Compose</a>
</li>
</ul>
</div>
</li>
<li class="nav-item">
<a href="../../pages/apps/chat.html" class="nav-link">
<i class="link-icon" data-feather="message-square"></i>
<span class="link-title">Chat</span>
</a>
</li>
<li class="nav-item">
<a href="../../pages/apps/calendar.html" class="nav-link">
<i class="link-icon" data-feather="calendar"></i>
<span class="link-title">Calendar</span>
</a>
</li>
<li class="nav-item nav-category">Components</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="collapse" href="#uiComponents" role="button" aria-expanded="false" aria-controls="uiComponents">
<i class="link-icon" data-feather="feather"></i>
<span class="link-title">UI Kit</span>
<i class="link-arrow" data-feather="chevron-down"></i>
</a>
<div class="collapse" id="uiComponents">
<ul class="nav sub-menu">
<li class="nav-item">
<a href="../../pages/ui-components/accordion.html" class="nav-link">Accordion</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/alerts.html" class="nav-link">Alerts</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/badges.html" class="nav-link">Badges</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/breadcrumbs.html" class="nav-link">Breadcrumbs</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/buttons.html" class="nav-link">Buttons</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/button-group.html" class="nav-link">Button group</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/cards.html" class="nav-link">Cards</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/carousel.html" class="nav-link">Carousel</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/collapse.html" class="nav-link">Collapse</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/dropdowns.html" class="nav-link">Dropdowns</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/list-group.html" class="nav-link">List group</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/media-object.html" class="nav-link">Media object</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/modal.html" class="nav-link">Modal</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/navs.html" class="nav-link">Navs</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/navbar.html" class="nav-link">Navbar</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/pagination.html" class="nav-link">Pagination</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/popover.html" class="nav-link">Popovers</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/progress.html" class="nav-link">Progress</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/scrollbar.html" class="nav-link">Scrollbar</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/scrollspy.html" class="nav-link">Scrollspy</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/spinners.html" class="nav-link">Spinners</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/tabs.html" class="nav-link">Tabs</a>
</li>
<li class="nav-item">
<a href="../../pages/ui-components/tooltips.html" class="nav-link">Tooltips</a>
</li>
</ul>
</div>
</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="collapse" href="#advancedUI" role="button" aria-expanded="false" aria-controls="advancedUI">
<i class="link-icon" data-feather="anchor"></i>
<span class="link-title">Advanced UI</span>
<i class="link-arrow" data-feather="chevron-down"></i>
</a>
<div class="collapse" id="advancedUI">
<ul class="nav sub-menu">
<li class="nav-item">
<a href="../../pages/advanced-ui/cropper.html" class="nav-link">Cropper</a>
</li>
<li class="nav-item">
<a href="../../pages/advanced-ui/owl-carousel.html" class="nav-link">Owl carousel</a>
</li>
<li class="nav-item">
<a href="../../pages/advanced-ui/sortablejs.html" class="nav-link">SortableJs</a>
</li>
<li class="nav-item">
<a href="../../pages/advanced-ui/sweet-alert.html" class="nav-link">Sweet Alert</a>
</li>
</ul>
</div>
</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="collapse" href="#forms" role="button" aria-expanded="false" aria-controls="forms">
<i class="link-icon" data-feather="inbox"></i>
<span class="link-title">Forms</span>
<i class="link-arrow" data-feather="chevron-down"></i>
</a>
<div class="collapse" id="forms">
<ul class="nav sub-menu">
<li class="nav-item">
<a href="../../pages/forms/basic-elements.html" class="nav-link">Basic Elements</a>
</li>
<li class="nav-item">
<a href="../../pages/forms/advanced-elements.html" class="nav-link">Advanced Elements</a>
</li>
<li class="nav-item">
<a href="../../pages/forms/editors.html" class="nav-link">Editors</a>
</li>
<li class="nav-item">
<a href="../../pages/forms/wizard.html" class="nav-link">Wizard</a>
</li>
</ul>
</div>
</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="collapse" href="#charts" role="button" aria-expanded="false" aria-controls="charts">
<i class="link-icon" data-feather="pie-chart"></i>
<span class="link-title">Charts</span>
<i class="link-arrow" data-feather="chevron-down"></i>
</a>
<div class="collapse" id="charts">
<ul class="nav sub-menu">
<li class="nav-item">
<a href="../../pages/charts/apex.html" class="nav-link">Apex</a>
</li>
<li class="nav-item">
<a href="../../pages/charts/chartjs.html" class="nav-link">ChartJs</a>
</li>
<li class="nav-item">
<a href="../../pages/charts/flot.html" class="nav-link">Flot</a>
</li>
<li class="nav-item">
<a href="../../pages/charts/morrisjs.html" class="nav-link">Morris</a>
</li>
<li class="nav-item">
<a href="../../pages/charts/peity.html" class="nav-link">Peity</a>
</li>
<li class="nav-item">
<a href="../../pages/charts/sparkline.html" class="nav-link">Sparkline</a>
</li>
</ul>
</div>
</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="collapse" href="#tables" role="button" aria-expanded="false" aria-controls="tables">
<i class="link-icon" data-feather="layout"></i>
<span class="link-title">Table</span>
<i class="link-arrow" data-feather="chevron-down"></i>
</a>
<div class="collapse" id="tables">
<ul class="nav sub-menu">
<li class="nav-item">
<a href="../../pages/tables/basic-table.html" class="nav-link">Basic Tables</a>
</li>
<li class="nav-item">
<a href="../../pages/tables/data-table.html" class="nav-link">Data Table</a>
</li>
</ul>
</div>
</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="collapse" href="#icons" role="button" aria-expanded="false" aria-controls="icons">
<i class="link-icon" data-feather="smile"></i>
<span class="link-title">Icons</span>
<i class="link-arrow" data-feather="chevron-down"></i>
</a>
<div class="collapse" id="icons">
<ul class="nav sub-menu">
<li class="nav-item">
<a href="../../pages/icons/feather-icons.html" class="nav-link">Feather Icons</a>
</li>
<li class="nav-item">
<a href="../../pages/icons/flag-icons.html" class="nav-link">Flag Icons</a>
</li>
<li class="nav-item">
<a href="../../pages/icons/mdi-icons.html" class="nav-link">Mdi Icons</a>
</li>
</ul>
</div>
</li>
<li class="nav-item nav-category">Pages</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="collapse" href="#general-pages" role="button" aria-expanded="false" aria-controls="general-pages">
<i class="link-icon" data-feather="book"></i>
<span class="link-title">Special pages</span>
<i class="link-arrow" data-feather="chevron-down"></i>
</a>
<div class="collapse" id="general-pages">
<ul class="nav sub-menu">
<li class="nav-item">
<a href="../../pages/general/blank-page.html" class="nav-link">Blank page</a>
</li>
<li class="nav-item">
<a href="../../pages/general/faq.html" class="nav-link">Faq</a>
</li>
<li class="nav-item">
<a href="../../pages/general/invoice.html" class="nav-link">Invoice</a>
</li>
<li class="nav-item">
<a href="../../pages/general/profile.html" class="nav-link">Profile</a>
</li>
<li class="nav-item">
<a href="../../pages/general/pricing.html" class="nav-link">Pricing</a>
</li>
<li class="nav-item">
<a href="../../pages/general/timeline.html" class="nav-link">Timeline</a>
</li>
</ul>
</div>
</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="collapse" href="#authPages" role="button" aria-expanded="false" aria-controls="authPages">
<i class="link-icon" data-feather="unlock"></i>
<span class="link-title">Authentication</span>
<i class="link-arrow" data-feather="chevron-down"></i>
</a>
<div class="collapse" id="authPages">
<ul class="nav sub-menu">
<li class="nav-item">
<a href="../../pages/auth/login.html" class="nav-link">Login</a>
</li>
<li class="nav-item">
<a href="../../pages/auth/register.html" class="nav-link">Register</a>
</li>
</ul>
</div>
</li>
<li class="nav-item">
<a class="nav-link" data-bs-toggle="collapse" href="#errorPages" role="button" aria-expanded="false" aria-controls="errorPages">
<i class="link-icon" data-feather="cloud-off"></i>
<span class="link-title">Error</span>
<i class="link-arrow" data-feather="chevron-down"></i>
</a>
<div class="collapse" id="errorPages">
<ul class="nav sub-menu">
<li class="nav-item">
<a href="../../pages/error/404.html" class="nav-link">404</a>
</li>
<li class="nav-item">
<a href="../../pages/error/500.html" class="nav-link">500</a>
</li>
</ul>
</div>
</li>
<li class="nav-item nav-category">Docs</li>
<li class="nav-item">
<a href="https://www.nobleui.com/html/documentation/docs.html" target="_blank" class="nav-link">
<i class="link-icon" data-feather="hash"></i>
<span class="link-title">Documentation</span>
</a>
</li>
</ul>
</div>
</nav>
<nav class="settings-sidebar">
<div class="sidebar-body">
<a href="#" class="settings-sidebar-toggler">
<i data-feather="settings"></i>
</a>
<div class="theme-wrapper">
<h6 class="text-muted mb-2">Light Theme:</h6>
<a class="theme-item" href="../../../demo1/dashboard.html">
<img src="../../../assets/images/screenshots/light.jpg" alt="light theme">
</a>
<h6 class="text-muted mb-2">Dark Theme:</h6>
<a class="theme-item active" href="../../../demo2/dashboard.html">
<img src="../../../assets/images/screenshots/dark.jpg" alt="light theme">
</a>
</div>
</div>
</nav>
<!-- partial -->
<div class="page-wrapper">
<!-- partial:../../partials/_navbar.html -->
<nav class="navbar">
<a href="#" class="sidebar-toggler">
<i data-feather="menu"></i>
</a>
<div class="navbar-content">
<form class="search-form">
<div class="input-group">
<div class="input-group-text">
<i data-feather="search"></i>
</div>
<input type="text" class="form-control" id="navbarForm" placeholder="Search here...">
</div>
</form>
<ul class="navbar-nav">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="languageDropdown" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="flag-icon flag-icon-us mt-1" title="us"></i> <span class="ms-1 me-1 d-none d-md-inline-block">English</span>
</a>
<div class="dropdown-menu" aria-labelledby="languageDropdown">
<a href="javascript:;" class="dropdown-item py-2"><i class="flag-icon flag-icon-us" title="us" id="us"></i> <span class="ms-1"> English </span></a>
<a href="javascript:;" class="dropdown-item py-2"><i class="flag-icon flag-icon-fr" title="fr" id="fr"></i> <span class="ms-1"> French </span></a>
<a href="javascript:;" class="dropdown-item py-2"><i class="flag-icon flag-icon-de" title="de" id="de"></i> <span class="ms-1"> German </span></a>
<a href="javascript:;" class="dropdown-item py-2"><i class="flag-icon flag-icon-pt" title="pt" id="pt"></i> <span class="ms-1"> Portuguese </span></a>
<a href="javascript:;" class="dropdown-item py-2"><i class="flag-icon flag-icon-es" title="es" id="es"></i> <span class="ms-1"> Spanish </span></a>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="appsDropdown" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i data-feather="grid"></i>
</a>
<div class="dropdown-menu p-0" aria-labelledby="appsDropdown">
<div class="px-3 py-2 d-flex align-items-center justify-content-between border-bottom">
<p class="mb-0 fw-bold">Web Apps</p>
<a href="javascript:;" class="text-muted">Edit</a>
</div>
<div class="row g-0 p-1">
<div class="col-3 text-center">
<a href="../../pages/apps/chat.html" class="dropdown-item d-flex flex-column align-items-center justify-content-center wd-70 ht-70"><i data-feather="message-square" class="icon-lg mb-1"></i><p class="tx-12">Chat</p></a>
</div>
<div class="col-3 text-center">
<a href="../../pages/apps/calendar.html" class="dropdown-item d-flex flex-column align-items-center justify-content-center wd-70 ht-70"><i data-feather="calendar" class="icon-lg mb-1"></i><p class="tx-12">Calendar</p></a>
</div>
<div class="col-3 text-center">
<a href="../../pages/email/inbox.html" class="dropdown-item d-flex flex-column align-items-center justify-content-center wd-70 ht-70"><i data-feather="mail" class="icon-lg mb-1"></i><p class="tx-12">Email</p></a>
</div>
<div class="col-3 text-center">
<a href="../../pages/general/profile.html" class="dropdown-item d-flex flex-column align-items-center justify-content-center wd-70 ht-70"><i data-feather="instagram" class="icon-lg mb-1"></i><p class="tx-12">Profile</p></a>
</div>
</div>
<div class="px-3 py-2 d-flex align-items-center justify-content-center border-top">
<a href="javascript:;">View all</a>
</div>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="messageDropdown" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i data-feather="mail"></i>
</a>
<div class="dropdown-menu p-0" aria-labelledby="messageDropdown">
<div class="px-3 py-2 d-flex align-items-center justify-content-between border-bottom">
<p>9 New Messages</p>
<a href="javascript:;" class="text-muted">Clear all</a>
</div>
<div class="p-1">
<a href="javascript:;" class="dropdown-item d-flex align-items-center py-2">
<div class="me-3">
<img class="wd-30 ht-30 rounded-circle" src="https://via.placeholder.com/30x30" alt="userr">
</div>
<div class="d-flex justify-content-between flex-grow-1">
<div class="me-4">
<p>Leonardo Payne</p>
<p class="tx-12 text-muted">Project status</p>
</div>
<p class="tx-12 text-muted">2 min ago</p>
</div>
</a>
<a href="javascript:;" class="dropdown-item d-flex align-items-center py-2">
<div class="me-3">
<img class="wd-30 ht-30 rounded-circle" src="https://via.placeholder.com/30x30" alt="userr">
</div>
<div class="d-flex justify-content-between flex-grow-1">
<div class="me-4">
<p>Carl Henson</p>
<p class="tx-12 text-muted">Client meeting</p>
</div>
<p class="tx-12 text-muted">30 min ago</p>
</div>
</a>
<a href="javascript:;" class="dropdown-item d-flex align-items-center py-2">
<div class="me-3">
<img class="wd-30 ht-30 rounded-circle" src="https://via.placeholder.com/30x30" alt="userr">
</div>
<div class="d-flex justify-content-between flex-grow-1">
<div class="me-4">
<p>Jensen Combs</p>
<p class="tx-12 text-muted">Project updates</p>
</div>
<p class="tx-12 text-muted">1 hrs ago</p>
</div>
</a>
<a href="javascript:;" class="dropdown-item d-flex align-items-center py-2">
<div class="me-3">
<img class="wd-30 ht-30 rounded-circle" src="https://via.placeholder.com/30x30" alt="userr">
</div>
<div class="d-flex justify-content-between flex-grow-1">
<div class="me-4">
<p>Amiah Burton</p>
<p class="tx-12 text-muted">Project deatline</p>
</div>
<p class="tx-12 text-muted">2 hrs ago</p>
</div>
</a>
<a href="javascript:;" class="dropdown-item d-flex align-items-center py-2">
<div class="me-3">
<img class="wd-30 ht-30 rounded-circle" src="https://via.placeholder.com/30x30" alt="userr">
</div>
<div class="d-flex justify-content-between flex-grow-1">
<div class="me-4">
<p>Yaretzi Mayo</p>
<p class="tx-12 text-muted">New record</p>
</div>
<p class="tx-12 text-muted">5 hrs ago</p>
</div>
</a>
</div>
<div class="px-3 py-2 d-flex align-items-center justify-content-center border-top">
<a href="javascript:;">View all</a>
</div>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="notificationDropdown" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i data-feather="bell"></i>
<div class="indicator">
<div class="circle"></div>
</div>
</a>
<div class="dropdown-menu p-0" aria-labelledby="notificationDropdown">
<div class="px-3 py-2 d-flex align-items-center justify-content-between border-bottom">
<p>6 New Notifications</p>
<a href="javascript:;" class="text-muted">Clear all</a>
</div>
<div class="p-1">
<a href="javascript:;" class="dropdown-item d-flex align-items-center py-2">
<div class="wd-30 ht-30 d-flex align-items-center justify-content-center bg-primary rounded-circle me-3">
<i class="icon-sm text-white" data-feather="gift"></i>
</div>
<div class="flex-grow-1 me-2">
<p>New Order Recieved</p>
<p class="tx-12 text-muted">30 min ago</p>
</div>
</a>
<a href="javascript:;" class="dropdown-item d-flex align-items-center py-2">
<div class="wd-30 ht-30 d-flex align-items-center justify-content-center bg-primary rounded-circle me-3">
<i class="icon-sm text-white" data-feather="alert-circle"></i>
</div>
<div class="flex-grow-1 me-2">
<p>Server Limit Reached!</p>
<p class="tx-12 text-muted">1 hrs ago</p>
</div>
</a>
<a href="javascript:;" class="dropdown-item d-flex align-items-center py-2">
<div class="wd-30 ht-30 d-flex align-items-center justify-content-center bg-primary rounded-circle me-3">
<img class="wd-30 ht-30 rounded-circle" src="https://via.placeholder.com/30x30" alt="userr">
</div>
<div class="flex-grow-1 me-2">
<p>New customer registered</p>
<p class="tx-12 text-muted">2 sec ago</p>
</div>
</a>
<a href="javascript:;" class="dropdown-item d-flex align-items-center py-2">
<div class="wd-30 ht-30 d-flex align-items-center justify-content-center bg-primary rounded-circle me-3">
<i class="icon-sm text-white" data-feather="layers"></i>
</div>
<div class="flex-grow-1 me-2">
<p>Apps are ready for update</p>
<p class="tx-12 text-muted">5 hrs ago</p>
</div>
</a>
<a href="javascript:;" class="dropdown-item d-flex align-items-center py-2">
<div class="wd-30 ht-30 d-flex align-items-center justify-content-center bg-primary rounded-circle me-3">
<i class="icon-sm text-white" data-feather="download"></i>
</div>
<div class="flex-grow-1 me-2">
<p>Download completed</p>
<p class="tx-12 text-muted">6 hrs ago</p>
</div>
</a>
</div>
<div class="px-3 py-2 d-flex align-items-center justify-content-center border-top">
<a href="javascript:;">View all</a>
</div>
</div>
</li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" id="profileDropdown" role="button" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<img class="wd-30 ht-30 rounded-circle" src="https://via.placeholder.com/30x30" alt="profile">
</a>
<div class="dropdown-menu p-0" aria-labelledby="profileDropdown">
<div class="d-flex flex-column align-items-center border-bottom px-5 py-3">
<div class="mb-3">
<img class="wd-80 ht-80 rounded-circle" src="https://via.placeholder.com/80x80" alt="">
</div>
<div class="text-center">
<p class="tx-16 fw-bolder">Amiah Burton</p>
<p class="tx-12 text-muted">amiahburton@gmail.com</p>
</div>
</div>
<ul class="list-unstyled p-1">
<li class="dropdown-item py-2">
<a href="../../pages/general/profile.html" class="text-body ms-0">
<i class="me-2 icon-md" data-feather="user"></i>
<span>Profile</span>
</a>
</li>
<li class="dropdown-item py-2">
<a href="javascript:;" class="text-body ms-0">
<i class="me-2 icon-md" data-feather="edit"></i>
<span>Edit Profile</span>
</a>
</li>
<li class="dropdown-item py-2">
<a href="javascript:;" class="text-body ms-0">
<i class="me-2 icon-md" data-feather="repeat"></i>
<span>Switch User</span>
</a>
</li>
<li class="dropdown-item py-2">
<a href="javascript:;" class="text-body ms-0">
<i class="me-2 icon-md" data-feather="log-out"></i>
<span>Log Out</span>
</a>
</li>
</ul>
</div>
</li>
</ul>
</div>
</nav>
<!-- partial -->
<div class="page-content">
<nav class="page-breadcrumb">
<ol class="breadcrumb">
<li class="breadcrumb-item"><a href="#">Icons</a></li>
<li class="breadcrumb-item active" aria-current="page">Flag Icons</li>
</ol>
</nav>
<div class="row">
<div class="col-md-12 stretch-card">
<div class="card">
<div class="card-body">
<h6 class="card-title">Flag Icons</h6>
<p class="text-muted mb-3">Visit the <a href="http://flag-icon-css.lip.is/" target="_blank"> Official Flag Icons Documentation </a>.</p>
<p class="text-muted mb-3">Usage example : &lt;i class="flag-icon flag-icon-aw"&gt;&lt;/i&gt;</p>
<div class="container">
<div class="icons-list row">
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ad" title="ad" id="ad"></i> AD</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ae" title="ae" id="ae"></i> AE</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-af" title="af" id="af"></i> AF</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ag" title="ag" id="ag"></i> AG</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ai" title="ai" id="ai"></i> AU</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-al" title="al" id="al"></i> AL</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-am" title="am" id="am"></i> AM</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ao" title="ao" id="ao"></i> AO</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-aq" title="aq" id="aq"></i> AQ</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ar" title="ar" id="ar"></i> AR</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-as" title="as" id="as"></i> AS</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-at" title="at" id="at"></i> AT</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-au" title="au" id="au"></i> AU</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-aw" title="aw" id="aw"></i> AW</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ax" title="ax" id="ax"></i> AX</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-az" title="az" id="az"></i> AZ</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ba" title="ba" id="ba"></i> BA</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-bb" title="bb" id="bb"></i> BB</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-bd" title="bd" id="bd"></i> BD</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-be" title="be" id="be"></i> BE</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-bf" title="bf" id="bf"></i> BF</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-bg" title="bg" id="bg"></i> BG</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-bh" title="bh" id="bh"></i> BH</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-bi" title="bi" id="bi"></i> BI</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-bj" title="bj" id="bj"></i> BJ</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-bl" title="bl" id="bl"></i> BL</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-bm" title="bm" id="bm"></i> BM</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-bn" title="bn" id="bn"></i> BN</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-bo" title="bo" id="bo"></i> BO</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-bq" title="bq" id="bq"></i> BQ</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-br" title="br" id="br"></i> BR</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-bs" title="bs" id="bs"></i> BS</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-bt" title="bt" id="bt"></i> BT</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-bv" title="bv" id="bv"></i> BV</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-bw" title="bw" id="bw"></i> BW</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-by" title="by" id="by"></i> BY</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-bz" title="bz" id="bz"></i> BZ</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ca" title="ca" id="ca"></i> CA</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-cc" title="cc" id="cc"></i> CC</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-cd" title="cd" id="cd"></i> CD</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-cf" title="cf" id="cf"></i> CF</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-cg" title="cg" id="cg"></i> CG</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ch" title="ch" id="ch"></i> CH</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ci" title="ci" id="ci"></i> CI</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ck" title="ck" id="ck"></i> CK</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-cl" title="cl" id="cl"></i> CL</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-cm" title="cm" id="cm"></i> CM</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-cn" title="cn" id="cn"></i> CN</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-co" title="co" id="co"></i> CO</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-cr" title="cr" id="cr"></i> CR</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-cu" title="cu" id="cu"></i> CU</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-cv" title="cv" id="cv"></i> CV</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-cw" title="cw" id="cw"></i> CW</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-cx" title="cx" id="cx"></i> CX</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-cy" title="cy" id="cy"></i> CY</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-cz" title="cz" id="cz"></i> CZ</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-de" title="de" id="de"></i> DE</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-dj" title="dj" id="dj"></i> DJ</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-dk" title="dk" id="dk"></i> DK</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-dm" title="dm" id="dm"></i> DM</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-do" title="do" id="do"></i> DO</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-dz" title="dz" id="dz"></i> DZ</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ec" title="ec" id="ec"></i> EC</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ee" title="ee" id="ee"></i> EE</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-eg" title="eg" id="eg"></i> EG</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-eh" title="eh" id="eh"></i> EH</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-er" title="er" id="er"></i> ER</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-es" title="es" id="es"></i> ES</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-et" title="et" id="et"></i> ET</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-fi" title="fi" id="fi"></i> FI</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-fj" title="fj" id="fj"></i> FJ</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-fk" title="fk" id="fk"></i> FK</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-fm" title="fm" id="fm"></i> FM</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-fo" title="fo" id="fo"></i> FO</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-fr" title="fr" id="fr"></i> FR</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ga" title="ga" id="ga"></i> GA</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-gb" title="gb" id="gb"></i> GB</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-gd" title="gd" id="gd"></i> GD</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ge" title="ge" id="ge"></i> GE</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-gf" title="gf" id="gf"></i> GF</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-gg" title="gg" id="gg"></i> GG</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-gh" title="gh" id="gh"></i> GH</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-gi" title="gi" id="gi"></i> GI</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-gl" title="gl" id="gl"></i> GL</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-gm" title="gm" id="gm"></i> GM</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-gn" title="gn" id="gn"></i> GN</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-gp" title="gp" id="gp"></i> GP</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-gq" title="gq" id="gq"></i> GQ</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-gr" title="gr" id="gr"></i> GR</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-gs" title="gs" id="gs"></i> GS</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-gt" title="gt" id="gt"></i> GT</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-gu" title="gu" id="gu"></i> GU</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-gw" title="gw" id="gw"></i> GW</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-gy" title="gy" id="gy"></i> GY</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-hk" title="hk" id="hk"></i> HK</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-hm" title="hm" id="hm"></i> HM</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-hn" title="hn" id="hn"></i> HN</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-hr" title="hr" id="hr"></i> HR</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ht" title="ht" id="ht"></i> HT</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-hu" title="hu" id="hu"></i> HU</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-id" title="id" id="id"></i> ID</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ie" title="ie" id="ie"></i> IE</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-il" title="il" id="il"></i> IL</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-im" title="im" id="im"></i> IM</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-in" title="in" id="in"></i> IN</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-io" title="io" id="io"></i> IO</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-iq" title="iq" id="iq"></i> IQ</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ir" title="ir" id="ir"></i> IR</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-is" title="is" id="is"></i> IS</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-it" title="it" id="it"></i> IT</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-je" title="je" id="je"></i> JE</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-jm" title="jm" id="jm"></i> JM</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-jo" title="jo" id="jo"></i> JO</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-jp" title="jp" id="jp"></i> JP</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ke" title="ke" id="ke"></i> KE</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-kg" title="kg" id="kg"></i> KG</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-kh" title="kh" id="kh"></i> KH</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ki" title="ki" id="ki"></i> KI</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-km" title="km" id="km"></i> KM</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-kn" title="kn" id="kn"></i> KN</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-kp" title="kp" id="kp"></i> KP</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-kr" title="kr" id="kr"></i> KR</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-kw" title="kw" id="kw"></i> KW</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ky" title="ky" id="ky"></i> KY</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-kz" title="kz" id="kz"></i> KZ</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-la" title="la" id="la"></i> LA</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-lb" title="lb" id="lb"></i> LB</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-lc" title="lc" id="lc"></i> LC</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-li" title="li" id="li"></i> LI</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-lk" title="lk" id="lk"></i> LK</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-lr" title="lr" id="lr"></i> LR</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ls" title="ls" id="ls"></i> LS</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-lt" title="lt" id="lt"></i> LT</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-lu" title="lu" id="lu"></i> LU</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-lv" title="lv" id="lv"></i> LV</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ly" title="ly" id="ly"></i> LY</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ma" title="ma" id="ma"></i> MA</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-mc" title="mc" id="mc"></i> MC</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-md" title="md" id="md"></i> MD</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-me" title="me" id="me"></i> ME</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-mf" title="mf" id="mf"></i> MF</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-mg" title="mg" id="mg"></i> MG</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-mh" title="mh" id="mh"></i> MH</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-mk" title="mk" id="mk"></i> MK</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ml" title="ml" id="ml"></i> ML</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-mm" title="mm" id="mm"></i> MM</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-mn" title="mn" id="mn"></i> MN</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-mo" title="mo" id="mo"></i> MO</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-mp" title="mp" id="mp"></i> MP</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-mq" title="mq" id="mq"></i> MQ</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-mr" title="mr" id="mr"></i> MR</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ms" title="ms" id="ms"></i> MS</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-mt" title="mt" id="mt"></i> MT</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-mu" title="mu" id="mu"></i> MU</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-mv" title="mv" id="mv"></i> MV</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-mw" title="mw" id="mw"></i> MW</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-mx" title="mx" id="mx"></i> MX</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-my" title="my" id="my"></i> MY</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-mz" title="mz" id="mz"></i> MZ</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-na" title="na" id="na"></i> NA</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-nc" title="nc" id="nc"></i> NC</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ne" title="ne" id="ne"></i> NE</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-nf" title="nf" id="nf"></i> NF</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ng" title="ng" id="ng"></i> NG</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ni" title="ni" id="ni"></i> NI</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-nl" title="nl" id="nl"></i> NL</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-no" title="no" id="no"></i> NO</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-np" title="np" id="np"></i> NP</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-nr" title="nr" id="nr"></i> NR</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-nu" title="nu" id="nu"></i> NU</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-nz" title="nz" id="nz"></i> NZ</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-om" title="om" id="om"></i> OM</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-pa" title="pa" id="pa"></i> PA</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-pe" title="pe" id="pe"></i> PE</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-pf" title="pf" id="pf"></i> PF</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-pg" title="pg" id="pg"></i> PG</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ph" title="ph" id="ph"></i> PH</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-pk" title="pk" id="pk"></i> PK</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-pl" title="pl" id="pl"></i> PL</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-pm" title="pm" id="pm"></i> PM</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-pn" title="pn" id="pn"></i> PN</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-pr" title="pr" id="pr"></i> PR</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ps" title="ps" id="ps"></i> PS</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-pt" title="pt" id="pt"></i> PT</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-pw" title="pw" id="pw"></i> PW</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-py" title="py" id="py"></i> PY</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-qa" title="qa" id="qa"></i> QA</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-re" title="re" id="re"></i> RE</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ro" title="ro" id="ro"></i> RO</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-rs" title="rs" id="rs"></i> RS</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ru" title="ru" id="ru"></i> RU</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-rw" title="rw" id="rw"></i> RW</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-sa" title="sa" id="sa"></i> SA</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-sb" title="sb" id="sb"></i> SB</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-sc" title="sc" id="sc"></i> SC</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-sd" title="sd" id="sd"></i> SD</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-se" title="se" id="se"></i> SE</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-sg" title="sg" id="sg"></i> SG</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-sh" title="sh" id="sh"></i> SH</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-si" title="si" id="si"></i> SI</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-sj" title="sj" id="sj"></i> SJ</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-sk" title="sk" id="sk"></i> SK</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-sl" title="sl" id="sl"></i> SL</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-sm" title="sm" id="sm"></i> SM</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-sn" title="sn" id="sn"></i> SN</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-so" title="so" id="so"></i> SO</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-sr" title="sr" id="sr"></i> SR</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ss" title="ss" id="ss"></i> SS</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-st" title="st" id="st"></i> ST</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-sv" title="sv" id="sv"></i> SV</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-sx" title="sx" id="sx"></i> SX</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-sy" title="sy" id="sy"></i> SY</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-sz" title="sz" id="sz"></i> SZ</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-tc" title="tc" id="tc"></i> TC</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-td" title="td" id="td"></i> TD</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-tf" title="tf" id="tf"></i> TF</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-tg" title="tg" id="tg"></i> TG</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-th" title="th" id="th"></i> TH</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-tj" title="tj" id="tj"></i> TJ</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-tk" title="tk" id="tk"></i> TK</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-tl" title="tl" id="tl"></i> TL</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-tm" title="tm" id="tm"></i> TM</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-tn" title="tn" id="tn"></i> TN</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-to" title="to" id="to"></i> TO</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-tr" title="tr" id="tr"></i> TR</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-tt" title="tt" id="tt"></i> TT</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-tv" title="tv" id="tv"></i> TV</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-tw" title="tw" id="tw"></i> TW</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-tz" title="tz" id="tz"></i> TZ</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ua" title="ua" id="ua"></i> UA</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ug" title="ug" id="ug"></i> UG</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-um" title="um" id="um"></i> UM</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-us" title="us" id="us"></i> US</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-uy" title="uy" id="uy"></i> UY</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-uz" title="uz" id="uz"></i> UZ</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-va" title="va" id="va"></i> VA</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-vc" title="vc" id="vc"></i> VC</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ve" title="ve" id="ve"></i> VE</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-vg" title="vg" id="vg"></i> VG</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-vi" title="vi" id="vi"></i> VI</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-vn" title="vn" id="vn"></i> VN</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-vu" title="vu" id="vu"></i> VU</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-wf" title="wf" id="wf"></i> WF</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ws" title="ws" id="ws"></i> WS</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-ye" title="ye" id="ye"></i> YE</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-yt" title="yt" id="yt"></i> YT</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-za" title="za" id="za"></i> ZA</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-zm" title="zm" id="zm"></i> ZM</div>
<div class="col-6 col-md-3"><i class="flag-icon flag-icon-zw" title="zw" id="zw"></i> ZW</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<!-- partial:../../partials/_footer.html -->
<footer class="footer d-flex flex-column flex-md-row align-items-center justify-content-between px-4 py-3 border-top small">
<p class="text-muted mb-1 mb-md-0">Copyright © 2022 <a href="https://www.nobleui.com" target="_blank">NobleUI</a>.</p>
<p class="text-muted">Handcrafted With <i class="mb-1 text-primary ms-1 icon-sm" data-feather="heart"></i></p>
</footer>
<!-- partial -->
</div>
</div>
<!-- core:js -->
<script src="../../../assets/vendors/core/core.js"></script>
<!-- endinject -->
<!-- Plugin js for this page -->
<!-- End plugin js for this page -->
<!-- inject:js -->
<script src="../../../assets/vendors/feather-icons/feather.min.js"></script>
<script src="../../../assets/js/template.js"></script>
<!-- endinject -->
<!-- Custom js for this page -->
<!-- End custom js for this page -->
</body>
</html>

File diff suppressed because it is too large Load Diff