<!DOCTYPE html>
<html lang="en" dir="ltr" data-startbar="dark" data-bs-theme="light">
<head>
<meta charset="utf-8" />
<title>Forexo | Forexo - Admin & Dashboard Template</title>
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<meta content="Premium Multipurpose Admin & Dashboard Template" name="description" />
<meta content="" name="author" />
<meta http-equiv="X-UA-Compatible" content="IE=edge" />
<!-- App favicon -->
<link rel="shortcut icon" href="assets/images/favicon.ico">
<!-- App css -->
<link href="assets/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<link href="assets/css/icons.min.css" rel="stylesheet" type="text/css" />
<link href="assets/css/app.min.css" rel="stylesheet" type="text/css" />
</head>
<!-- Top Bar Start -->
<body>
<!-- Top Bar Start -->
<div class="topbar d-print-none">
<div class="container-fluid">
<nav class="topbar-custom d-flex justify-content-between" id="topbar-custom">
<ul class="topbar-item list-unstyled d-inline-flex align-items-center mb-0">
<li>
<button class="nav-link mobile-menu-btn nav-icon" id="togglemenu">
<i class="iconoir-menu-scale"></i>
</button>
</li>
<li class="hide-phone app-search">
<form role="search" action="#" method="get">
<input type="search" name="search" class="form-control top-search mb-0" placeholder="Search here...">
<button type="submit"><i class="iconoir-search"></i></button>
</form>
</li>
</ul>
<ul class="topbar-item list-unstyled d-inline-flex align-items-center mb-0">
<li class="topbar-item">
<a class="btn btn-soft-primary" href="javascript:void(0);" data-bs-toggle="offcanvas" data-bs-target="#watchlist" aria-controls="watchlist">
Watchlist
</a>
</li>
<!-- <li class="topbar-item">
<a class=" btn btn-primary" href="javascript:void(0);" data-bs-toggle="offcanvas" data-bs-target="#watchlist" aria-controls="watchlist">
Watchlist
</a>
</li> -->
<li class="dropdown">
<a class="nav-link dropdown-toggle arrow-none nav-icon" data-bs-toggle="dropdown" href="#" role="button"
aria-haspopup="false" aria-expanded="false">
<img src="assets/images/flags/us_flag.jpg" alt="" class="thumb-sm rounded-circle">
</a>
<div class="dropdown-menu">
<a class="dropdown-item" href="#"><img src="assets/images/flags/us_flag.jpg" alt="" height="15" class="me-2">English</a>
<a class="dropdown-item" href="#"><img src="assets/images/flags/spain_flag.jpg" alt="" height="15" class="me-2">Spanish</a>
<a class="dropdown-item" href="#"><img src="assets/images/flags/germany_flag.jpg" alt="" height="15" class="me-2">German</a>
<a class="dropdown-item" href="#"><img src="assets/images/flags/french_flag.jpg" alt="" height="15" class="me-2">French</a>
</div>
</li><!--end topbar-language-->
<li class="topbar-item">
<a class="nav-link nav-icon" href="javascript:void(0);" id="light-dark-mode">
<i class="icofont-moon dark-mode"></i>
<i class="icofont-sun light-mode"></i>
</a>
</li>
<li class="dropdown topbar-item">
<a class="nav-link dropdown-toggle arrow-none nav-icon" data-bs-toggle="dropdown" href="#" role="button"
aria-haspopup="false" aria-expanded="false">
<i class="icofont-bell-alt"></i>
<span class="alert-badge"></span>
</a>
<div class="dropdown-menu stop dropdown-menu-end dropdown-lg py-0">
<h5 class="dropdown-item-text m-0 py-3 d-flex justify-content-between align-items-center">
Notifications <a href="#" class="badge text-body-tertiary badge-pill">
<i class="iconoir-plus-circle fs-4"></i>
</a>
</h5>
<ul class="nav nav-tabs nav-tabs-custom nav-success nav-justified mb-1" role="tablist">
<li class="nav-item" role="presentation">
<a class="nav-link mx-0 active" data-bs-toggle="tab" href="#All" role="tab" aria-selected="true">
All <span class="badge bg-primary-subtle text-primary badge-pill ms-1">24</span>
</a>
</li>
<li class="nav-item" role="presentation">
<a class="nav-link mx-0" data-bs-toggle="tab" href="#Projects" role="tab" aria-selected="false" tabindex="-1">
Projects
</a>
</li>
<li class="nav-item" role="presentation">
<a class="nav-link mx-0" data-bs-toggle="tab" href="#Teams" role="tab" aria-selected="false" tabindex="-1">
Team
</a>
</li>
</ul>
<div class="ms-0" style="max-height:230px;" data-simplebar>
<div class="tab-content" id="myTabContent">
<div class="tab-pane fade show active" id="All" role="tabpanel" aria-labelledby="all-tab" tabindex="0">
<!-- item-->
<a href="#" class="dropdown-item py-3">
<small class="float-end text-muted ps-2">2 min ago</small>
<div class="d-flex align-items-center">
<div class="flex-shrink-0 bg-primary-subtle text-primary thumb-md rounded-circle">
<i class="iconoir-wolf fs-4"></i>
</div>
<div class="flex-grow-1 ms-2 text-truncate">
<h6 class="my-0 fw-normal text-dark fs-13">Your order is placed</h6>
<small class="text-muted mb-0">Dummy text of the printing and industry.</small>
</div><!--end media-body-->
</div><!--end media-->
</a><!--end-item-->
<!-- item-->
<a href="#" class="dropdown-item py-3">
<small class="float-end text-muted ps-2">10 min ago</small>
<div class="d-flex align-items-center">
<div class="flex-shrink-0 bg-primary-subtle text-primary thumb-md rounded-circle">
<i class="iconoir-apple-swift fs-4"></i>
</div>
<div class="flex-grow-1 ms-2 text-truncate">
<h6 class="my-0 fw-normal text-dark fs-13">Meeting with designers</h6>
<small class="text-muted mb-0">It is a long established fact that a reader.</small>
</div><!--end media-body-->
</div><!--end media-->
</a><!--end-item-->
<!-- item-->
<a href="#" class="dropdown-item py-3">
<small class="float-end text-muted ps-2">40 min ago</small>
<div class="d-flex align-items-center">
<div class="flex-shrink-0 bg-primary-subtle text-primary thumb-md rounded-circle">
<i class="iconoir-birthday-cake fs-4"></i>
</div>
<div class="flex-grow-1 ms-2 text-truncate">
<h6 class="my-0 fw-normal text-dark fs-13">UX 3 Task complete.</h6>
<small class="text-muted mb-0">Dummy text of the printing.</small>
</div><!--end media-body-->
</div><!--end media-->
</a><!--end-item-->
<!-- item-->
<a href="#" class="dropdown-item py-3">
<small class="float-end text-muted ps-2">1 hr ago</small>
<div class="d-flex align-items-center">
<div class="flex-shrink-0 bg-primary-subtle text-primary thumb-md rounded-circle">
<i class="iconoir-drone fs-4"></i>
</div>
<div class="flex-grow-1 ms-2 text-truncate">
<h6 class="my-0 fw-normal text-dark fs-13">Your order is placed</h6>
<small class="text-muted mb-0">It is a long established fact that a reader.</small>
</div><!--end media-body-->
</div><!--end media-->
</a><!--end-item-->
<!-- item-->
<a href="#" class="dropdown-item py-3">
<small class="float-end text-muted ps-2">2 hrs ago</small>
<div class="d-flex align-items-center">
<div class="flex-shrink-0 bg-primary-subtle text-primary thumb-md rounded-circle">
<i class="iconoir-user fs-4"></i>
</div>
<div class="flex-grow-1 ms-2 text-truncate">
<h6 class="my-0 fw-normal text-dark fs-13">Payment Successfull</h6>
<small class="text-muted mb-0">Dummy text of the printing.</small>
</div><!--end media-body-->
</div><!--end media-->
</a><!--end-item-->
</div>
<div class="tab-pane fade" id="Projects" role="tabpanel" aria-labelledby="projects-tab" tabindex="0">
<!-- item-->
<a href="#" class="dropdown-item py-3">
<small class="float-end text-muted ps-2">40 min ago</small>
<div class="d-flex align-items-center">
<div class="flex-shrink-0 bg-primary-subtle text-primary thumb-md rounded-circle">
<i class="iconoir-birthday-cake fs-4"></i>
</div>
<div class="flex-grow-1 ms-2 text-truncate">
<h6 class="my-0 fw-normal text-dark fs-13">UX 3 Task complete.</h6>
<small class="text-muted mb-0">Dummy text of the printing.</small>
</div><!--end media-body-->
</div><!--end media-->
</a><!--end-item-->
<!-- item-->
<a href="#" class="dropdown-item py-3">
<small class="float-end text-muted ps-2">1 hr ago</small>
<div class="d-flex align-items-center">
<div class="flex-shrink-0 bg-primary-subtle text-primary thumb-md rounded-circle">
<i class="iconoir-drone fs-4"></i>
</div>
<div class="flex-grow-1 ms-2 text-truncate">
<h6 class="my-0 fw-normal text-dark fs-13">Your order is placed</h6>
<small class="text-muted mb-0">It is a long established fact that a reader.</small>
</div><!--end media-body-->
</div><!--end media-->
</a><!--end-item-->
<!-- item-->
<a href="#" class="dropdown-item py-3">
<small class="float-end text-muted ps-2">2 hrs ago</small>
<div class="d-flex align-items-center">
<div class="flex-shrink-0 bg-primary-subtle text-primary thumb-md rounded-circle">
<i class="iconoir-user fs-4"></i>
</div>
<div class="flex-grow-1 ms-2 text-truncate">
<h6 class="my-0 fw-normal text-dark fs-13">Payment Successfull</h6>
<small class="text-muted mb-0">Dummy text of the printing.</small>
</div><!--end media-body-->
</div><!--end media-->
</a><!--end-item-->
</div>
<div class="tab-pane fade" id="Teams" role="tabpanel" aria-labelledby="teams-tab" tabindex="0">
<!-- item-->
<a href="#" class="dropdown-item py-3">
<small class="float-end text-muted ps-2">1 hr ago</small>
<div class="d-flex align-items-center">
<div class="flex-shrink-0 bg-primary-subtle text-primary thumb-md rounded-circle">
<i class="iconoir-drone fs-4"></i>
</div>
<div class="flex-grow-1 ms-2 text-truncate">
<h6 class="my-0 fw-normal text-dark fs-13">Your order is placed</h6>
<small class="text-muted mb-0">It is a long established fact that a reader.</small>
</div><!--end media-body-->
</div><!--end media-->
</a><!--end-item-->
<!-- item-->
<a href="#" class="dropdown-item py-3">
<small class="float-end text-muted ps-2">2 hrs ago</small>
<div class="d-flex align-items-center">
<div class="flex-shrink-0 bg-primary-subtle text-primary thumb-md rounded-circle">
<i class="iconoir-user fs-4"></i>
</div>
<div class="flex-grow-1 ms-2 text-truncate">
<h6 class="my-0 fw-normal text-dark fs-13">Payment Successfull</h6>
<small class="text-muted mb-0">Dummy text of the printing.</small>
</div><!--end media-body-->
</div><!--end media-->
</a><!--end-item-->
</div>
</div>
</div>
<!-- All-->
<a href="pages-notifications.html" class="dropdown-item text-center text-dark fs-13 py-2">
View All <i class="fi-arrow-right"></i>
</a>
</div>
</li>
<li class="dropdown topbar-item">
<a class="nav-link dropdown-toggle arrow-none nav-icon" data-bs-toggle="dropdown" href="#" role="button"
aria-haspopup="false" aria-expanded="false">
<img src="assets/images/users/avatar-1.jpg" alt="" class="thumb-lg rounded-circle">
</a>
<div class="dropdown-menu dropdown-menu-end py-0">
<div class="d-flex align-items-center dropdown-item py-2 bg-secondary-subtle">
<div class="flex-shrink-0">
<img src="assets/images/users/avatar-1.jpg" alt="" class="thumb-md rounded-circle">
</div>
<div class="flex-grow-1 ms-2 text-truncate align-self-center">
<h6 class="my-0 fw-medium text-dark fs-13">William Martin</h6>
<small class="text-muted mb-0">Front End Developer</small>
</div><!--end media-body-->
</div>
<div class="dropdown-divider mt-0"></div>
<small class="text-muted px-2 pb-1 d-block">Account</small>
<a class="dropdown-item" href="pages-profile.html"><i class="las la-user fs-18 me-1 align-text-bottom"></i> Profile</a>
<a class="dropdown-item" href="pages-faq.html"><i class="las la-wallet fs-18 me-1 align-text-bottom"></i> Earning</a>
<small class="text-muted px-2 py-1 d-block">Settings</small>
<a class="dropdown-item" href="pages-profile.html"><i class="las la-cog fs-18 me-1 align-text-bottom"></i>Account Settings</a>
<a class="dropdown-item" href="pages-profile.html"><i class="las la-lock fs-18 me-1 align-text-bottom"></i> Security</a>
<a class="dropdown-item" href="pages-faq.html"><i class="las la-question-circle fs-18 me-1 align-text-bottom"></i> Help Center</a>
<div class="dropdown-divider mb-0"></div>
<a class="dropdown-item text-danger" href="auth-login.html"><i class="las la-power-off fs-18 me-1 align-text-bottom"></i> Logout</a>
</div>
</li>
</ul><!--end topbar-nav-->
</nav>
<!-- end navbar-->
</div>
</div>
<!-- Top Bar End -->
<!-- leftbar-tab-menu -->
<div class="startbar d-print-none">
<!--start brand-->
<div class="brand">
<a href="index.html" class="logo">
<span>
<img src="assets/images/logo-sm.png" alt="logo-small" class="logo-sm">
</span>
<span class="">
<img src="assets/images/logo-light.png" alt="logo-large" class="logo-lg logo-light">
<img src="assets/images/logo-dark.png" alt="logo-large" class="logo-lg logo-dark">
</span>
</a>
</div>
<!--end brand-->
<!--start startbar-menu-->
<div class="startbar-menu" >
<div class="startbar-collapse" id="startbarCollapse" data-simplebar>
<div class="d-flex align-items-start flex-column w-100">
<!-- Navigation -->
<ul class="navbar-nav mb-auto w-100">
<li class="menu-label pt-0 mt-0">
<span>Main Menu</span>
</li>
<li class="nav-item">
<a class="nav-link" href="#sidebarForex" data-bs-toggle="collapse" role="button"
aria-expanded="false" aria-controls="sidebarForex">
<i class="iconoir-dollar-circle menu-icon"></i>
<span>Forex</span>
</a>
<div class="collapse " id="sidebarForex">
<ul class="nav flex-column">
<li class="nav-item">
<a class="nav-link" href="index.html">Dashboard</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="forex-accounts.html">My Accounts</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="forex-copy-accounts.html">Copy Accounts</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="forex-withdrawal.html">Withdrawal Request</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="forex-transactions.html">Transactions</a>
</li><!--end nav-item-->
</ul><!--end nav-->
</div><!--end startbarForex-->
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="#sidebarCrypto" data-bs-toggle="collapse" role="button"
aria-expanded="false" aria-controls="sidebarCrypto">
<i class="iconoir-bitcoin-circle menu-icon"></i>
<span>Crypto</span>
</a>
<div class="collapse " id="sidebarCrypto">
<ul class="nav flex-column">
<li class="nav-item">
<a class="nav-link" href="crypto-index.html">Dashboard</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="crypto-exchange.html">Exchange</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="crypto-portfolio.html">Portfolio</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="crypto-wallet.html">Wallet</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="crypto-news.html">Crypto News</a>
</li><!--end nav-item-->
</ul><!--end nav-->
</div><!--end startbarCrypto-->
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="apps-chat.html">
<i class="iconoir-chat-lines menu-icon"></i>
<span>Chat</span>
</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="apps-contact-list.html">
<i class="iconoir-list menu-icon"></i>
<span>Contact List</span>
</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="apps-calendar.html">
<i class="iconoir-calendar menu-icon"></i>
<span>Calendar</span>
</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="apps-invoice.html">
<i class="iconoir-page menu-icon"></i>
<span>Ivoice</span>
</a>
</li><!--end nav-item-->
<li class="menu-label mt-2">
<small class="label-border">
<div class="border_left hidden-xs"></div>
<div class="border_right"></div>
</small>
<span>Components</span>
</li>
<li class="nav-item">
<a class="nav-link" href="#sidebarElements" data-bs-toggle="collapse" role="button"
aria-expanded="false" aria-controls="sidebarElements">
<i class="iconoir-compact-disc menu-icon"></i>
<span>UI Elements</span>
</a>
<div class="collapse " id="sidebarElements">
<ul class="nav flex-column">
<li class="nav-item">
<a class="nav-link" href="ui-alerts.html">Alerts</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="ui-avatar.html">Avatar</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="ui-buttons.html">Buttons</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="ui-badges.html">Badges</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="ui-cards.html">Cards</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="ui-carousels.html">Carousels</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="ui-dropdowns.html">Dropdowns</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="ui-grids.html">Grids</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="ui-images.html">Images</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="ui-list.html">List</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="ui-modals.html">Modals</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="ui-navs.html">Navs</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="ui-navbar.html">Navbar</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="ui-paginations.html">Paginations</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="ui-popover-tooltips.html">Popover & Tooltips</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="ui-progress.html">Progress</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="ui-spinners.html">Spinners</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="ui-tabs-accordions.html">Tabs & Accordions</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="ui-typography.html">Typography</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="ui-videos.html">Videos</a>
</li><!--end nav-item-->
</ul><!--end nav-->
</div><!--end startbarElements-->
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="#sidebarAdvancedUI" data-bs-toggle="collapse" role="button"
aria-expanded="false" aria-controls="sidebarAdvancedUI">
<i class="iconoir-peace-hand menu-icon"></i>
<span>Advanced UI</span><span class="badge rounded text-success bg-success-subtle ms-1">New</span>
</a>
<div class="collapse " id="sidebarAdvancedUI">
<ul class="nav flex-column">
<li class="nav-item">
<a class="nav-link" href="advanced-animation.html">Animation</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="advanced-clipboard.html">Clip Board</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="advanced-dragula.html">Dragula</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="advanced-files.html">File Manager</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="advanced-highlight.html">Highlight</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="advanced-rangeslider.html">Range Slider</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="advanced-ratings.html">Ratings</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="advanced-ribbons.html">Ribbons</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="advanced-sweetalerts.html">Sweet Alerts</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="advanced-toasts.html">Toasts</a>
</li><!--end nav-item-->
</ul><!--end nav-->
</div><!--end startbarAdvancedUI-->
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="#sidebarForms" data-bs-toggle="collapse" role="button"
aria-expanded="false" aria-controls="sidebarForms">
<i class="iconoir-journal-page menu-icon"></i>
<span>Forms</span>
</a>
<div class="collapse " id="sidebarForms">
<ul class="nav flex-column">
<li class="nav-item">
<a class="nav-link" href="forms-elements.html">Basic Elements</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="forms-advanced.html">Advance Elements</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="forms-validation.html">Validation</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="forms-wizard.html">Wizard</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="forms-editors.html">Editors</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="forms-uploads.html">File Upload</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="forms-img-crop.html">Image Crop</a>
</li><!--end nav-item-->
</ul><!--end nav-->
</div><!--end startbarForms-->
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="#sidebarCharts" data-bs-toggle="collapse" role="button"
aria-expanded="false" aria-controls="sidebarCharts">
<i class="iconoir-candlestick-chart menu-icon"></i>
<span>Charts</span>
</a>
<div class="collapse " id="sidebarCharts">
<ul class="nav flex-column">
<li class="nav-item">
<a class="nav-link" href="charts-apex.html">Apex</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="charts-justgage.html">JustGage</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="charts-chartjs.html">Chartjs</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="charts-toast-ui.html">Toast</a>
</li><!--end nav-item-->
</ul><!--end nav-->
</div><!--end startbarCharts-->
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="#sidebarTables" data-bs-toggle="collapse" role="button"
aria-expanded="false" aria-controls="sidebarTables">
<i class="iconoir-table-rows menu-icon"></i>
<span>Tables</span>
</a>
<div class="collapse " id="sidebarTables">
<ul class="nav flex-column">
<li class="nav-item">
<a class="nav-link" href="tables-basic.html">Basic</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="tables-datatable.html">Datatables</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="tables-editable.html">Editable</a>
</li><!--end nav-item-->
</ul><!--end nav-->
</div><!--end startbarTables-->
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="#sidebarIcons" data-bs-toggle="collapse" role="button"
aria-expanded="false" aria-controls="sidebarIcons">
<i class="iconoir-trophy menu-icon"></i>
<span>Icons</span>
</a>
<div class="collapse " id="sidebarIcons">
<ul class="nav flex-column">
<li class="nav-item">
<a class="nav-link" href="icons-fontawesome.html">Font Awesome</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="icons-lineawesome.html">Line Awesome</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="icons-icofont.html">Icofont</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="icons-iconoir.html">Iconoir</a>
</li><!--end nav-item-->
</ul><!--end nav-->
</div><!--end startbarIcons-->
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="#sidebarMaps" data-bs-toggle="collapse" role="button"
aria-expanded="false" aria-controls="sidebarMaps">
<i class="iconoir-navigator-alt menu-icon"></i>
<span>Maps</span>
</a>
<div class="collapse " id="sidebarMaps">
<ul class="nav flex-column">
<li class="nav-item">
<a class="nav-link" href="maps-google.html">Google Maps</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="maps-leaflet.html">Leaflet Maps</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="maps-vector.html">Vector Maps</a>
</li><!--end nav-item-->
</ul><!--end nav-->
</div><!--end startbarMaps-->
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="#sidebarEmailTemplates" data-bs-toggle="collapse" role="button"
aria-expanded="false" aria-controls="sidebarEmailTemplates">
<i class="iconoir-send-mail menu-icon"></i>
<span>Email Templates</span>
</a>
<div class="collapse " id="sidebarEmailTemplates">
<ul class="nav flex-column">
<li class="nav-item">
<a class="nav-link" href="email-templates-basic.html">Basic Action Email</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="email-templates-alert.html">Alert Email</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="email-templates-billing.html">Billing Email</a>
</li><!--end nav-item-->
</ul><!--end nav-->
</div><!--end startbarEmailTemplates-->
</li><!--end nav-item-->
<li class="menu-label mt-2">
<small class="label-border">
<div class="border_left hidden-xs"></div>
<div class="border_right"></div>
</small>
<span>Crafted</span>
</li>
<li class="nav-item">
<a class="nav-link" href="#sidebarPages" data-bs-toggle="collapse" role="button"
aria-expanded="false" aria-controls="sidebarPages">
<i class="iconoir-page-star menu-icon"></i>
<span>Pages</span>
</a>
<div class="collapse " id="sidebarPages">
<ul class="nav flex-column">
<li class="nav-item">
<a class="nav-link" href="pages-profile.html">Profile</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="pages-notifications.html">Notifications</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="pages-timeline.html">Timeline</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="pages-treeview.html">Treeview</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="pages-starter.html">Starter Page</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="pages-pricing.html">Pricing</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="pages-blogs.html">Blogs</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="pages-faq.html">FAQs</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="pages-gallery.html">Gallery</a>
</li><!--end nav-item-->
</ul><!--end nav-->
</div><!--end startbarPages-->
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="#sidebarAuthentication" data-bs-toggle="collapse" role="button"
aria-expanded="false" aria-controls="sidebarAuthentication">
<i class="iconoir-fingerprint-lock-circle menu-icon"></i>
<span>Authentication</span>
</a>
<div class="collapse " id="sidebarAuthentication">
<ul class="nav flex-column">
<li class="nav-item">
<a class="nav-link" href="auth-login.html">Log in</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="auth-register.html">Register</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="auth-recover-pw.html">Re-Password</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="auth-lock-screen.html">Lock Screen</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="auth-maintenance.html">Maintenance</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="auth-404.html">Error 404</a>
</li><!--end nav-item-->
<li class="nav-item">
<a class="nav-link" href="auth-500.html">Error 500</a>
</li><!--end nav-item-->
</ul><!--end nav-->
</div><!--end startbarAuthentication-->
</li><!--end nav-item-->
</ul><!--end navbar-nav--->
<div class="update-msg text-center">
<div class="d-flex justify-content-center align-items-center thumb-lg update-icon-box rounded-circle mx-auto">
<i class="iconoir-peace-hand h3 align-self-center mb-0 text-primary"></i>
</div>
<h5 class="mt-3">Mannat Themes</h5>
<p class="mb-3 text-muted">Forexo is a high quality web applications.</p>
<a href="javascript: void(0);" class="btn text-primary shadow-sm rounded-pill">Upgrade your plan</a>
</div>
</div>
</div><!--end startbar-collapse-->
</div><!--end startbar-menu-->
</div><!--end startbar-->
<div class="startbar-overlay d-print-none"></div>
<!-- end leftbar-tab-menu-->
<div class="page-wrapper">
<!-- Page Content-->
<div class="page-content">
<div class="container-fluid">
<div class="row">
<div class="col-12">
<div class="card">
<div class="card-body p-1">
<script defer src="https://www.livecoinwatch.com/static/lcw-widget.js"></script>
<div class="livecoinwatch-widget-5" lcw-base="USD" lcw-color-tx="#95aac9" lcw-marquee-1="coins" lcw-marquee-2="movers" lcw-marquee-items="10" ></div>
</div><!--end card-body-->
</div><!--end card-->
</div><!--end col-->
<div class="col-md-12 col-lg-4">
<div class="card">
<div class="card-body border-dashed-bottom pb-3">
<div class="d-flex justify-content-between">
<div class="">
<div class="d-flex justify-content-center align-items-center thumb-xl border border-warning rounded-circle">
<i class="icofont-bitcoin h1 align-self-center mb-0 text-warning"></i>
</div>
<h5 class="mt-2 mb-0 fs-14">Total Balance</h5>
</div><!--end col-->
<div class="align-self-center">
<h2 class="fs-22 mt-0 mb-1 fw-bold">122.00125503 BTC</h2>
<span class="badge rounded-pill text-success bg-success-subtle fs-12"><i class="fa-solid fa-circle-arrow-up"></i> $1121.25 (1.8%)</span>
<!-- <p class="mb-0 text-truncate text-muted"><span class="text-success">Total Balance</p> -->
</div><!--end col-->
</div><!--end row-->
</div><!--end card-body-->
<div class="card-body">
<div class="d-flex justify-content-between ">
<div class=" align-self-center">
<p class="m-0 fs-12 fst-italic ps-2 text-muted">Last Transaction - 3 July 2024 <span class="text-primary fw-medium ms-1 ">$45000.00</span></p>
</div><!--end col-->
<div class="align-self-center text-start text-md-end">
<button type="button" class="btn btn-danger btn-sm px-2 mt-2 mt-md-0 ">Send</button>
<button type="button" class="btn btn-primary btn-sm px-2 mt-2 mt-md-0 ">Request</button>
</div><!--end col-->
</div><!--end row-->
</div><!--end card-body-->
</div><!--end card-->
<div class="card">
<ul class="nav nav-tabs nav-justified" id="myTab" role="tablist">
<li class="nav-item" role="presentation">
<a class="nav-link py-2 active" id="buy_trade_tab" data-bs-toggle="tab" href="#buy_trade" role="tab" aria-selected="false" tabindex="-1">Buy</a>
</li>
<li class="nav-item" role="presentation">
<a class="nav-link py-2 " id="sell_trade_tab" data-bs-toggle="tab" href="#sell_trade" role="tab" aria-selected="true">Sell</a>
</li>
</ul>
<div class="tab-content p-3" id="pills-tabContent" >
<div class="tab-pane fade show active" id="buy_trade">
<form>
<div class="input-group mb-3">
<span class="input-group-text">Amount</span>
<input type="text" class="form-control" aria-label="Amount (to the nearest dollar)">
<span class="input-group-text">BTC</span>
</div>
<div class="input-group mb-3">
<select class="form-select w-25" aria-label="Default select example">
<option selected>Last Trade Price</option>
<option value="1">Last Buy Price</option>
<option value="2">Last Sell Price</option>
</select>
<input type="text" class="form-control" aria-label="Amount" placeholder="$25,000">
<span class="input-group-text">$ Dollor</span>
</div>
<div class="input-group mb-3">
<span class="input-group-text">Total</span>
<input type="text" class="form-control" aria-label="Amount (to the nearest dollar)">
<span class="input-group-text">$ Dollor</span>
</div>
<div class=" mt-3 ms-auto">
<a href="#" class="btn btn-success btn-sm">Buy Coins</a>
</div>
</form> <!--end form-->
</div><!--end general chat-->
<div class="tab-pane fade" id="sell_trade">
<form>
<div class="input-group mb-3">
<span class="input-group-text">Amount</span>
<input type="text" class="form-control" aria-label="Amount (to the nearest dollar)">
<span class="input-group-text">BTC</span>
</div>
<div class="input-group mb-3">
<select class="form-select w-25" aria-label="Default select example">
<option selected>Last Trade Price</option>
<option value="1">Last Buy Price</option>
<option value="2">Last Sell Price</option>
</select>
<input type="text" class="form-control" aria-label="Amount" placeholder="$25,000">
<span class="input-group-text">$ Dollor</span>
</div>
<div class="input-group mb-3">
<span class="input-group-text">Total</span>
<input type="text" class="form-control" aria-label="Amount (to the nearest dollar)">
<span class="input-group-text">$ Dollor</span>
</div>
<div class=" mt-3 ms-auto">
<a href="#" class="btn btn-danger btn-sm">Sell Coins</a>
</div>
</form> <!--end form-->
</div><!--end general chat-->
</div><!--end tab-content-->
<div class="card-body pt-0">
<div class="crypto-calcy w-100">
<crypto-converter-widget
live
shadow
symbol
fiat="united-states-dollar"
crypto="bitcoin"
amount="1"
border-radius="0.60rem"
background-color="#202221"
decimal-places="2"></crypto-converter-widget>
<script src="https://cdn.jsdelivr.net/gh/dejurin/crypto-converter-widget@1.5.2/dist/latest.min.js" async></script>
</div>
</div><!--end card-body-->
</div><!--end card-->
</div> <!--end col-->
<div class="col-md-12 col-lg-8">
<div class="card">
<div class="card-body">
<div class="row h-100">
<div class="col-lg-4">
<div class="card-body bg-gradient-purple rounded mb-3">
<p class="text-muted fw-medium mb-2">Bitcoin Price (BTC)</p>
<div class="d-flex align-items-center mb-2">
<h4 class="fs-22 m-0 fw-bold">$64,291.45</h4>
<span class="badge rounded text-white bg-danger fs-12 ms-2">1.8%</span>
</div>
<p class="text-muted fw-medium mb-1">14.88 (ETH)</p>
<div class="d-flex justify-content-between">
<p class="text-muted fw-medium mb-1">Low:$18,768.00</p>
<p class="text-muted fw-medium mb-1">High:$19,054.00</p>
</div>
<div class="progress bg-secondary-subtle" style="height:5px;">
<div class="progress-bar bg-success rounded-pill" role="progressbar" style="margin-right:2px; width: 15% " aria-valuenow="15" aria-valuemin="0" aria-valuemax="100"></div>
<div class="progress-bar bg-success rounded-pill" role="progressbar" style="margin-right:2px; width: 15%" aria-valuenow="30" aria-valuemin="0" aria-valuemax="100"></div>
<div class="progress-bar bg-danger rounded-pill" role="progressbar" style="margin-right:2px; width: 20%" aria-valuenow="20" aria-valuemin="0" aria-valuemax="100"></div>
</div>
</div><!--end card-body-->
</div><!--end col-->
<div class="col-lg-4">
<div class="card-body bg-gradient-warning rounded mb-3">
<p class="text-muted fw-medium mb-1">Market Cap</p>
<h4 class="fs-13 m-0 fw-bold">$1,226,884,659,331</h4>
<hr class="hr-dashed">
<p class="text-muted fw-medium mb-1">Volume <span class="badge rounded text-white bg-purple ms-1">24h</span></p>
<h4 class="fs-13 m-0 fw-bold">$17,424,738,826</h4>
</div><!--end card-body-->
</div><!--end col-->
<div class="col-lg-4">
<div class="card-body bg-gradient-success rounded mb-3">
<p class="text-muted fw-medium mb-1">Circulating Supply</p>
<h4 class="fs-13 m-0 fw-bold">19,715,887 BTC</h4>
<hr class="hr-dashed">
<p class="text-muted fw-medium mb-1">Max Supply</p>
<h4 class="fs-13 m-0 fw-bold">21,000,000 BTC</h4>
</div><!--end card-body-->
</div><!--end col-->
</div><!--end row-->
<div class="tradingview-widget-container">
<div id="tradingview_123" data-bs-theme="light"></div>
<script src="https://s3.tradingview.com/tv.js"></script>
<script>
new TradingView.widget({
"width": "100%",
"height": 495,
"symbol": "BITSTAMP:BTCUSD",
"interval": "D",
"timezone": "Etc/UTC",
"theme": "Light",
"style": "1",
"locale": "en",
"toolbar_bg": "#000",
"enable_publishing": false,
"withdateranges": true,
"hide_side_toolbar": false,
"allow_symbol_change": true,
"show_popup_button": true,
"popup_width": "1000",
"popup_height": "650",
"container_id": "tradingview_123",
"overrides": {
"mainSeriesProperties.barStyle.upColor": "#00a96a",
"mainSeriesProperties.barStyle.downColor": "#706bf9",
"mainSeriesProperties.candleStyle.upColor": "#00a96a",
"mainSeriesProperties.candleStyle.downColor": '#706bf9',
"mainSeriesProperties.candleStyle.borderColor": "#378658",
"mainSeriesProperties.candleStyle.borderUpColor": "#00a96a",
"mainSeriesProperties.candleStyle.borderDownColor": "#706bf9",
"mainSeriesProperties.candleStyle.wickUpColor": '#00a96a',
"mainSeriesProperties.candleStyle.wickDownColor": '#706bf9',
}
});
</script>
</div>
</div><!--end card-body-->
</div><!--end card-->
</div> <!--end col-->
</div><!--end row-->
<div class="row justify-content-center">
<div class="col-12">
<div class="card">
<div class="card-header">
<div class="row align-items-center">
<div class="col">
<h4 class="card-title">Top Selling by Country</h4>
</div><!--end col-->
<div class="col-auto">
<div class="dropdown">
<a href="#" class="btn bt btn-light dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="icofont-calendar fs-5 me-1"></i> This Month<i class="las la-angle-down ms-1"></i>
</a>
<div class="dropdown-menu dropdown-menu-end">
<a class="dropdown-item" href="#">Today</a>
<a class="dropdown-item" href="#">Last Week</a>
<a class="dropdown-item" href="#">Last Month</a>
<a class="dropdown-item" href="#">This Year</a>
</div>
</div>
</div><!--end col-->
</div> <!--end row-->
</div><!--end card-header-->
<div class="card-body pt-0">
<div class="table-responsive">
<table class="table mb-0">
<thead class="table-light">
<tr>
<th>Name</th>
<th class="text-end">Market cap</th>
<th class="text-end">Avail Coins</th>
<th class="text-end">Volume(24h)</th>
<th class="text-end">Change %</th>
</tr>
</thead>
<tbody>
<tr>
<td>
<div class="d-flex align-items-center">
<div class="flex-shrink-0">
<img src="assets/images/logos/crypto/btc.png" class="thumb-md align-self-center rounded-circle" alt="...">
</div>
<div class="flex-grow-1 ms-1 text-truncate">
<h6 class="my-0 fw-medium text-dark fs-14">$7289.45</h6>
<p class="text-muted mb-0">Bitcoin
<span class="text-muted font-12">(BTC)</span>
<span class="text-success">0.45% <i class="mdi mdi-arrow-up"></i></span>
</p>
</div><!--end div-->
</div> <!--end div-->
</td>
<td class="text-end">$1,198,033,079,188</td>
<td class="text-end">19.718 M</td>
<td class="text-end">$218,401,256,68</td>
<td class="text-end text-danger">0.10%</td>
</tr><!--end tr-->
<tr>
<td>
<div class="d-flex align-items-center">
<div class="flex-shrink-0">
<img src="assets/images/logos/crypto/eth.png" class="thumb-md align-self-center rounded-circle" alt="...">
</div>
<div class="flex-grow-1 ms-1 text-truncate">
<h6 class="my-0 fw-medium text-dark fs-14">$3,369.31</h6>
<p class="text-muted mb-0">Ethereum
<span class="text-muted font-12">(ETH)</span>
<span class="text-success">0.75% <i class="mdi mdi-arrow-up"></i></span>
</p>
</div><!--end div-->
</div> <!--end div-->
</td>
<td class="text-end">$405,452,419,318</td>
<td class="text-end">120.178 M</td>
<td class="text-end">$11,462,252,104</td>
<td class="text-end text-success">0.07%</td>
</tr><!--end tr-->
<tr>
<td>
<div class="d-flex align-items-center">
<div class="flex-shrink-0">
<img src="assets/images/logos/crypto/lite.png" class="thumb-md align-self-center rounded-circle" alt="...">
</div>
<div class="flex-grow-1 ms-1 text-truncate">
<h6 class="my-0 fw-medium text-dark fs-14">$70.60</h6>
<p class="text-muted mb-0">Litecoin
<span class="text-muted font-12">(LTC)</span>
<span class="text-success">0.35% <i class="mdi mdi-arrow-up"></i></span>
</p>
</div><!--end div-->
</div> <!--end div-->
</td>
<td class="text-end">$5,272,868,714</td>
<td class="text-end">55.688 B</td>
<td class="text-end">$267,007,196</td>
<td class="text-end text-danger">0.02%</td>
</tr><!--end tr-->
<tr>
<td>
<div class="d-flex align-items-center">
<div class="flex-shrink-0">
<img src="assets/images/logos/crypto/mon.png" class="thumb-md align-self-center rounded-circle" alt="...">
</div>
<div class="flex-grow-1 ms-1 text-truncate">
<h6 class="my-0 fw-medium text-dark fs-14">$164.45</h6>
<p class="text-muted mb-0">Monero
<span class="text-muted font-12">(XMR)</span>
<span class="text-success">0.15% <i class="mdi mdi-arrow-up"></i></span>
</p>
</div><!--end div-->
</div> <!--end div-->
</td>
<td class="text-end">$3,034,554,307</td>
<td class="text-end">35.748 B</td>
<td class="text-end">$32,611,417</td>
<td class="text-end text-success">0.09%</td>
</tr><!--end tr-->
<tr>
<td>
<div class="d-flex align-items-center">
<div class="flex-shrink-0">
<img src="assets/images/logos/crypto/btc.png" class="thumb-md align-self-center rounded-circle" alt="...">
</div>
<div class="flex-grow-1 ms-1 text-truncate">
<h6 class="my-0 fw-medium text-dark fs-14">$7289.45</h6>
<p class="text-muted mb-0">Bitcoin
<span class="text-muted font-12">(BTC)</span>
<span class="text-success">0.45% <i class="mdi mdi-arrow-up"></i></span>
</p>
</div><!--end div-->
</div> <!--end div-->
</td>
<td class="text-end">$1,198,033,079,188</td>
<td class="text-end">19.718 M</td>
<td class="text-end">$218,401,256,68</td>
<td class="text-end text-danger">0.10%</td>
</tr><!--end tr-->
<tr>
<td>
<div class="d-flex align-items-center">
<div class="flex-shrink-0">
<img src="assets/images/logos/crypto/eth.png" class="thumb-md align-self-center rounded-circle" alt="...">
</div>
<div class="flex-grow-1 ms-1 text-truncate">
<h6 class="my-0 fw-medium text-dark fs-14">$3,369.31</h6>
<p class="text-muted mb-0">Ethereum
<span class="text-muted font-12">(ETH)</span>
<span class="text-success">0.75% <i class="mdi mdi-arrow-up"></i></span>
</p>
</div><!--end div-->
</div> <!--end div-->
</td>
<td class="text-end">$405,452,419,318</td>
<td class="text-end">120.178 M</td>
<td class="text-end">$11,462,252,104</td>
<td class="text-end text-success">0.07%</td>
</tr><!--end tr-->
<tr>
<td>
<div class="d-flex align-items-center">
<div class="flex-shrink-0">
<img src="assets/images/logos/crypto/lite.png" class="thumb-md align-self-center rounded-circle" alt="...">
</div>
<div class="flex-grow-1 ms-1 text-truncate">
<h6 class="my-0 fw-medium text-dark fs-14">$70.60</h6>
<p class="text-muted mb-0">Litecoin
<span class="text-muted font-12">(LTC)</span>
<span class="text-success">0.35% <i class="mdi mdi-arrow-up"></i></span>
</p>
</div><!--end div-->
</div> <!--end div-->
</td>
<td class="text-end">$5,272,868,714</td>
<td class="text-end">55.688 B</td>
<td class="text-end">$267,007,196</td>
<td class="text-end text-danger">0.02%</td>
</tr><!--end tr-->
<tr>
<td>
<div class="d-flex align-items-center">
<div class="flex-shrink-0">
<img src="assets/images/logos/crypto/mon.png" class="thumb-md align-self-center rounded-circle" alt="...">
</div>
<div class="flex-grow-1 ms-1 text-truncate">
<h6 class="my-0 fw-medium text-dark fs-14">$164.45</h6>
<p class="text-muted mb-0">Monero
<span class="text-muted font-12">(XMR)</span>
<span class="text-success">0.15% <i class="mdi mdi-arrow-up"></i></span>
</p>
</div><!--end div-->
</div> <!--end div-->
</td>
<td class="text-end">$3,034,554,307</td>
<td class="text-end">35.748 B</td>
<td class="text-end">$32,611,417</td>
<td class="text-end text-success">0.09%</td>
</tr><!--end tr-->
</tbody>
</table><!--end /table-->
</div><!--end /tableresponsive-->
</div><!--end div-->
</div><!--end card-->
</div> <!--end col-->
</div><!--end row-->
<div class="row justify-content-center">
<div class="col-md-6 col-lg-4">
<div class="card">
<div class="card-header">
<div class="row align-items-center">
<div class="col">
<h4 class="card-title">Most Profitable Currency</h4>
</div><!--end col-->
<div class="col-auto">
<div class="dropdown">
<a href="#" class="btn bt btn-light dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="icofont-calendar fs-5 me-1"></i> This Month<i class="las la-angle-down ms-1"></i>
</a>
<div class="dropdown-menu dropdown-menu-end">
<a class="dropdown-item" href="#">Today</a>
<a class="dropdown-item" href="#">Last Week</a>
<a class="dropdown-item" href="#">Last Month</a>
<a class="dropdown-item" href="#">This Year</a>
</div>
</div>
</div><!--end col-->
</div> <!--end row-->
</div><!--end card-header-->
<div class="card-body pt-0">
<div class="table-responsive">
<table class="table mb-0">
<tbody>
<tr class="">
<td class="px-0">
<div class="d-flex align-items-center">
<div class="flex-shrink-0 bg-success-subtle text-success thumb-md rounded-circle me-2">
<i class="fa-solid fa-sack-dollar fs-4"></i>
</div>
<div class="flex-grow-1 text-truncate">
<h6 class="m-0 text-truncate">US Dollar</h6>
<div class="d-flex align-items-center">
<div class="progress bg-primary-subtle w-100" style="height:5px;" role="progressbar" aria-label="Success example" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">
<div class="progress-bar bg-primary" style="width: 85%"></div>
</div>
<small class="flex-shrink-1 ms-1">85%</small>
</div>
</div><!--end media body-->
</div><!--end media-->
</td>
<td class="px-0 text-end"><span class="text-body ps-2 align-self-center text-end">$5860.00</span></td>
</tr><!--end tr-->
<tr class="">
<td class="px-0">
<div class="d-flex align-items-center">
<div class="flex-shrink-0 bg-primary-subtle text-primary thumb-md rounded-circle me-2">
<i class="fa-solid fa-euro-sign fs-4"></i>
</div>
<div class="flex-grow-1 text-truncate">
<h6 class="m-0 text-truncate">Euro</h6>
<div class="d-flex align-items-center">
<div class="progress bg-primary-subtle w-100" style="height:5px;" role="progressbar" aria-label="Success example" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">
<div class="progress-bar bg-primary" style="width: 78%"></div>
</div>
<small class="flex-shrink-1 ms-1">78%</small>
</div>
</div><!--end media body-->
</div><!--end media-->
</td>
<td class="px-0 text-end"><span class="text-body ps-2 align-self-center text-end">$5422.00</span></td>
</tr><!--end tr-->
<tr class="">
<td class="px-0">
<div class="d-flex align-items-center">
<div class="flex-shrink-0 bg-warning-subtle text-warning thumb-md rounded-circle me-2">
<i class="fa-solid fa-coins fs-4"></i>
</div>
<div class="flex-grow-1 text-truncate">
<h6 class="m-0 text-truncate">Gold</h6>
<div class="d-flex align-items-center">
<div class="progress bg-primary-subtle w-100" style="height:5px;" role="progressbar" aria-label="Success example" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">
<div class="progress-bar bg-primary" style="width: 71%"></div>
</div>
<small class="flex-shrink-1 ms-1">71%</small>
</div>
</div><!--end media body-->
</div><!--end media-->
</td>
<td class="px-0 text-end"><span class="text-body ps-2 align-self-center text-end">$4587.00</span></td>
</tr><!--end tr-->
<tr class="">
<td class="px-0">
<div class="d-flex align-items-center">
<div class="flex-shrink-0 bg-info-subtle text-info thumb-md rounded-circle me-2">
<i class="fa-solid fa-sterling-sign fs-4"></i>
</div>
<div class="flex-grow-1 text-truncate">
<h6 class="m-0 text-truncate">Great Britain Pound</h6>
<div class="d-flex align-items-center">
<div class="progress bg-primary-subtle w-100" style="height:5px;" role="progressbar" aria-label="Success example" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">
<div class="progress-bar bg-primary" style="width: 65%"></div>
</div>
<small class="flex-shrink-1 ms-1">65%</small>
</div>
</div><!--end media body-->
</div><!--end media-->
</td>
<td class="px-0 text-end"><span class="text-body ps-2 align-self-center text-end">$3655.00</span></td>
</tr><!--end tr-->
<tr class="">
<td class="px-0">
<div class="d-flex align-items-center">
<div class="flex-shrink-0 bg-danger-subtle text-danger thumb-md rounded-circle me-2">
<i class="fa-solid fa-yen-sign fs-4"></i>
</div>
<div class="flex-grow-1 text-truncate">
<h6 class="m-0 text-truncate">Japanese Yen</h6>
<div class="d-flex align-items-center">
<div class="progress bg-primary-subtle w-100" style="height:5px;" role="progressbar" aria-label="Success example" aria-valuenow="25" aria-valuemin="0" aria-valuemax="100">
<div class="progress-bar bg-primary" style="width: 48%"></div>
</div>
<small class="flex-shrink-1 ms-1">48%</small>
</div>
</div><!--end media body-->
</div><!--end media-->
</td>
<td class="px-0 text-end"><span class="text-body ps-2 align-self-center text-end">$3325.00</span></td>
</tr><!--end tr-->
</tbody>
</table> <!--end table-->
</div><!--end /div-->
<p class="m-0 fs-11 fst-italic ps-2 text-muted">Last Trade - 13min ago <a href="#!" class="link-primary ms-1 ">2 Order Pending</a></p>
</div><!--end card-body-->
</div><!--end card-->
</div> <!--end col-->
<div class="col-md-6 col-lg-4">
<div class="card">
<div class="card-header">
<div class="row align-items-center">
<div class="col">
<h4 class="card-title">Profitable Users</h4>
</div><!--end col-->
<div class="col-auto">
<div class="img-group d-flex">
<a class="user-avatar position-relative d-inline-block" href="#">
<img src="assets/images/users/avatar-1.jpg" alt="avatar" class="thumb-md shadow-sm rounded-circle">
</a>
<a class="user-avatar position-relative d-inline-block ms-n2" href="#">
<img src="assets/images/users/avatar-2.jpg" alt="avatar" class="thumb-md shadow-sm rounded-circle">
</a>
<a class="user-avatar position-relative d-inline-block ms-n2" href="#">
<img src="assets/images/users/avatar-4.jpg" alt="avatar" class="thumb-md shadow-sm rounded-circle">
</a>
<a class="user-avatar position-relative d-inline-block ms-n2" href="#">
<img src="assets/images/users/avatar-3.jpg" alt="avatar" class="thumb-md shadow-sm rounded-circle">
</a>
<a href="" class="user-avatar position-relative d-inline-block ms-1">
<span class="thumb-md shadow-sm justify-content-center d-flex align-items-center bg-info-subtle rounded-circle fw-semibold fs-6">+6</span>
</a>
</div>
</div><!--end col-->
</div> <!--end row-->
</div>
<div class="card-body pt-0">
<div id="customers" class="apex-charts"></div>
<div class="bg-light py-3 px-2 mb-0 mt-2 text-center rounded">
<h6 class="mb-0"><i class="icofont-calendar fs-5 me-1"></i> 01 January 2024 to 31 December 2024</h6>
</div>
<!-- <p class="text-secondary text-truncate mb-0 rounded mt-2 text-center">To review the new order by Jems. <a href="#" class="text-primary text-decoration-underline">detail</a> </p> -->
</div><!--end card-body-->
</div><!--end card-->
</div> <!--end col-->
<div class="col-md-6 col-lg-4">
<div class="card">
<div class="card-header">
<div class="row align-items-center">
<div class="col">
<h4 class="card-title">New Copy Traders</h4>
</div><!--end col-->
<div class="col-auto">
<div class="dropdown">
<a href="#" class="btn bt btn-light dropdown-toggle" data-bs-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
<i class="icofont-calendar fs-5 me-1"></i> This Month<i class="las la-angle-down ms-1"></i>
</a>
<div class="dropdown-menu dropdown-menu-end">
<a class="dropdown-item" href="#">Today</a>
<a class="dropdown-item" href="#">Last Week</a>
<a class="dropdown-item" href="#">Last Month</a>
<a class="dropdown-item" href="#">This Year</a>
</div>
</div>
</div><!--end col-->
</div> <!--end row-->
</div><!--end card-header-->
<div class="card-body pt-0">
<div class="table-responsive">
<table class="table mb-0">
<tbody>
<tr class="">
<td class="px-0">
<div class="d-flex align-items-center">
<img src="assets/images/users/avatar-1.jpg" height="36" class="me-2 align-self-center rounded" alt="...">
<div class="flex-grow-1 text-truncate">
<a href="#" class="font-15 text-dark fw-medium d-block">Ac.#3652235</a>
<a href="#" class="font-12 text-muted text-decoration-underline">MT5</a>
</div><!--end media body-->
</div><!--end media-->
</td>
<td class="px-0 text-end"><span class="text-primary ps-2 align-self-center text-end">$3500.00</span></td>
</tr><!--end tr-->
<tr class="">
<td class="px-0">
<div class="d-flex align-items-center">
<img src="assets/images/users/avatar-2.jpg" height="36" class="me-2 align-self-center rounded" alt="...">
<div class="flex-grow-1 text-truncate">
<a href="#" class="font-15 text-dark fw-medium d-block">Ac.#552288</a>
<a href="#" class="font-12 text-muted text-decoration-underline">MT5</a>
</div><!--end media body-->
</div><!--end media-->
</td>
<td class="px-0 text-end"><span class="text-primary ps-2 align-self-center text-end">$25000.00</span></td>
</tr><!--end tr-->
<tr class="">
<td class="px-0">
<div class="d-flex align-items-center">
<img src="assets/images/users/avatar-3.jpg" height="36" class="me-2 align-self-center rounded" alt="...">
<div class="flex-grow-1 text-truncate">
<a href="#" class="font-15 text-dark fw-medium d-block">Ac.#695847</a>
<a href="#" class="font-12 text-muted text-decoration-underline">MT4</a>
</div><!--end media body-->
</div><!--end media-->
</td>
<td class="px-0 text-end"><span class="text-primary ps-2 align-self-center text-end">$1500.00</span></td>
</tr><!--end tr-->
<tr class="">
<td class="px-0">
<div class="d-flex align-items-center">
<img src="assets/images/users/avatar-4.jpg" height="36" class="me-2 align-self-center rounded" alt="...">
<div class="flex-grow-1 text-truncate">
<a href="#" class="font-15 text-dark fw-medium d-block">Ac.#325698</a>
<a href="#" class="font-12 text-muted text-decoration-underline">MT5</a>
</div><!--end media body-->
</div><!--end media-->
</td>
<td class="px-0 text-end"><span class="text-primary ps-2 align-self-center text-end">$2000.00</span></td>
</tr><!--end tr-->
<tr>
<td class="px-0">
<div class="d-flex align-items-center">
<img src="assets/images/users/avatar-5.jpg" height="36" class="me-2 align-self-center rounded" alt="...">
<div class="flex-grow-1 text-truncate">
<a href="#" class="font-15 text-dark fw-medium d-block">Ac.#159753</a>
<a href="#" class="font-12 text-muted text-decoration-underline">MT5</a>
</div><!--end media body-->
</div><!--end media-->
</td>
<td class="px-0 text-end"><span class="text-primary ps-2 align-self-center text-end">$1500.00</span></td>
</tr><!--end tr-->
</tbody>
</table> <!--end table-->
</div><!--end /div-->
</div><!--end card-body-->
</div><!--end card-->
</div> <!--end col-->
</div><!--end row-->
</div><!-- container -->
<!--Start Rightbar-->
<!--Start Rightbar/offcanvas-->
<div class="offcanvas offcanvas-end" tabindex="-1" id="Appearance" aria-labelledby="AppearanceLabel">
<div class="offcanvas-header border-bottom justify-content-between">
<h5 class="m-0 font-14" id="AppearanceLabel">Appearance</h5>
<button type="button" class="btn-close text-reset p-0 m-0 align-self-center" data-bs-dismiss="offcanvas" aria-label="Close"></button>
</div>
<div class="offcanvas-body">
<h6>Account Settings</h6>
<div class="p-2 text-start mt-3">
<div class="form-check form-switch mb-2">
<input class="form-check-input" type="checkbox" id="settings-switch1">
<label class="form-check-label" for="settings-switch1">Auto updates</label>
</div><!--end form-switch-->
<div class="form-check form-switch mb-2">
<input class="form-check-input" type="checkbox" id="settings-switch2" checked>
<label class="form-check-label" for="settings-switch2">Location Permission</label>
</div><!--end form-switch-->
<div class="form-check form-switch">
<input class="form-check-input" type="checkbox" id="settings-switch3">
<label class="form-check-label" for="settings-switch3">Show offline Contacts</label>
</div><!--end form-switch-->
</div><!--end /div-->
<h6>General Settings</h6>
<div class="p-2 text-start mt-3">
<div class="form-check form-switch mb-2">
<input class="form-check-input" type="checkbox" id="settings-switch4">
<label class="form-check-label" for="settings-switch4">Show me Online</label>
</div><!--end form-switch-->
<div class="form-check form-switch mb-2">
<input class="form-check-input" type="checkbox" id="settings-switch5" checked>
<label class="form-check-label" for="settings-switch5">Status visible to all</label>
</div><!--end form-switch-->
<div class="form-check form-switch">
<input class="form-check-input" type="checkbox" id="settings-switch6">
<label class="form-check-label" for="settings-switch6">Notifications Popup</label>
</div><!--end form-switch-->
</div><!--end /div-->
</div><!--end offcanvas-body-->
</div>
<!--end Rightbar/offcanvas-->
<!--end Rightbar-->
<!--Start Footer-->
<footer class="footer text-center text-sm-start d-print-none">
<div class="container-fluid">
<div class="row">
<div class="col-12">
<div class="card mb-0 rounded-bottom-0">
<div class="card-body">
<p class="text-muted mb-0">
©
<script> document.write(new Date().getFullYear()) </script>
Forexo
<span
class="text-muted d-none d-sm-inline-block float-end">
Crafted with
<i class="iconoir-heart text-danger"></i>
by Mannatthemes</span>
</p>
</div>
</div>
</div>
</div>
</div>
</footer>
<!--end footer-->
</div>
<!-- end page content -->
</div>
<!-- end page-wrapper -->
<!-- Javascript -->
<!-- vendor js -->
<script src="assets/libs/bootstrap/js/bootstrap.bundle.min.js"></script>
<script src="assets/libs/iconify-icon/iconify-icon.min.js"></script>
<script src="assets/libs/simplebar/simplebar.min.js"></script>
<script src="assets/libs/apexcharts/apexcharts.min.js"></script>
<script src="assets/js/pages/crypto-index.init.js"></script>
<script src="assets/js/app.js"></script>
</body>
<!--end body-->
</html>