<div class="body d-flex py-3"> 
                <div class="container-xxl">

                    <div class="row g-3 mb-3">
                        <div class="col-lg-12">
                            <div class="card">
                                <div class="card-body">
                                    <div class="row g-3 align-items-center">
                                        <div class="col-md-6 col-lg-6 col-xl-3">
                                            <div class="d-flex">
                                                <img class="avatar rounded-circle" src="<?php echo base_url();?>uassets/images/profile_av.svg" alt="profile">
                                                <div class="flex-fill ms-3">
                                                    <p class="mb-0"><span class="font-weight-bold">John	Quinn</span></p>
                                                    <small class="">Johnquinn@gmail.com</small>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col-md-6 col-lg-6 col-xl-3">
                                            <div class="d-flex flex-column">
                                                <span class="text-muted mb-1">User ID:164647708</span>
                                                <span class="small text-muted flex-fill text-truncate">Last login time 2021-09-29 10:56:22</span>
                                            </div>
                                        </div>
                                        <div class="col-md-6 col-lg-6 col-xl-2">
                                            <div class="d-flex-inline">
                                                <span class="badge bg-careys-pink mb-1">Personal</span>
                                                <span class="small text-muted d-flex align-items-center"><i class="icofont-diamond px-1 fs-5 color-lightyellow "></i> VIP</span>
                                            </div>
                                        </div>
                                        <div class="col-md-6 col-lg-6 col-xl-4">
                                            <a href="referral.html" title="invite" class="btn btn-primary text-dark mb-1">40% commission:Invite friends now!</a>
                                            <a href="#" title="invite" class="d-block"><i class="icofont-twitter px-1 fs-6 color-lightblue"></i>not linked</a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div><!-- Row End -->

                    <!-- Row End -->

                    <div class="row g-3 mb-3 row-deck">
                        <div class="col-xl-12 col-xxl-7">
                            <div class="card">
                                <div class="card-header py-3 d-flex justify-content-between bg-transparent border-bottom align-items-center flex-wrap">
                                    <h6 class="mb-0 fw-bold">Balance Details</h6> 
                                    <ul class="nav nav-tabs tab-body-header rounded d-inline-flex mt-2 mt-md-0" role="tablist">
                                        <li class="nav-item"><a class="nav-link active" data-bs-toggle="tab" href="#Spot" role="tab">Spot</a></li>
                                        <li class="nav-item"><a class="nav-link" data-bs-toggle="tab" href="#P2P" role="tab">P2P</a></li>
                                        <li class="nav-item"><a class="nav-link" data-bs-toggle="tab" href="#Margin" role="tab">Margin</a></li>
                                        <li class="nav-item"><a class="nav-link" data-bs-toggle="tab" href="#Future" role="tab">Future</a></li>
                                        <li class="nav-item"><a class="nav-link" data-bs-toggle="tab" href="#Earn" role="tab">Earn</a></li>
                                    </ul>
                                </div>
                                <div class="card-body">
                                    <div class="tab-content">
                                        <div class="tab-pane fade show active" id="Spot">
                                            <div class="row g-3">
                                                <div class="col-lg-6">
                                                    <div>Account balance:</div>
                                                    <h3>0.18005388 BTC</h3>
                                                    <div class="mt-3 pt-3 text-uppercase text-muted pt-2 small">Buy this month</div>
                                                    <h5>3.0675432 BTC</h5>
                                                    <div class="mt-3 text-uppercase text-muted small">Sell this month</div>
                                                    <h5>2.0345618 BTC</h5>
                                                    <div class="mt-3 text-uppercase text-muted small">Estimated Value:</div>
                                                    <h5>$22000.29</h5>
                                                </div>
                                                <div class="col-lg-6">
                                                    <div id="apex-simple-donut"></div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="tab-pane fade" id="P2P">
                                            <div class="row g-3">
                                                <div class="col-lg-6">
                                                    <div>Account balance:</div>
                                                    <h3>0.00005388 BTC</h3>
                                                    <div class="mt-3 pt-3 text-uppercase text-muted pt-2 small">Buy this month</div>
                                                    <h5>0.00005388 BTC</h5>
                                                    <div class="mt-3 text-uppercase text-muted small">Sell this month</div>
                                                    <h5>2.0345618 BTC</h5>
                                                    <div class="mt-3 text-uppercase text-muted small">Estimated Value:</div>
                                                    <h5>$2000.29</h5>
                                                </div>
                                                <div class="col-lg-6">
                                                    <div id="apex-simple-donutp2p"></div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="tab-pane fade" id="Margin">
                                            <div class="row g-3">
                                                <div class="col-lg-6">
                                                    <div>Total balance:</div>
                                                    <h3>0.00095000 BTC≈$3570</h3>
                                                    <div class="mt-3 pt-3 text-uppercase text-muted pt-2 small">Total Debt:</div>
                                                    <h5>0.00005388 BTC</h5>
                                                    <div class="mt-3 text-uppercase text-muted small">Account Equity:</div>
                                                    <h5>2.0345618 BTC</h5>
                                                    <div class="mt-3 text-uppercase text-muted small">Profit & Loss:</div>
                                                    <h5>0.95 BTC(1.6.00%) $25 (8.00%)</h5>
                                                </div>
                                                <div class="col-lg-6">
                                                    <div id="apex-circle-chart-multiplemargin"></div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="tab-pane fade" id="Future">
                                            <div class="row g-3">
                                                <div class="col-lg-6">
                                                    <div>Total Margin Balance:</div>
                                                    <h3>0.00095000 BTC≈$3570</h3>
                                                    <div class="mt-3 pt-3 text-uppercase text-muted pt-2 small">Total Wallet Balance:</div>
                                                    <h5>0.00005388 BTC</h5>
                                                    <div class="mt-3 text-uppercase text-muted small">Total Unrealized PNL:</div>
                                                    <h5>2.0345618 BTC</h5>
                                                </div>
                                                <div class="col-lg-6">
                                                    <div id="apex-circle-gradientfuture"></div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="tab-pane fade" id="Earn">
                                            <div class="row g-3">
                                                <div class="col-lg-6">
                                                    <div>Total Margin Balance:</div>
                                                    <h3>0.00095000 BTC≈$3570</h3>
                                                    <div class="mt-3 pt-3 text-uppercase text-muted pt-2 small">Locked:</div>
                                                    <h5>0.00000388 BTC</h5>
                                                    <div class="mt-3 text-uppercase text-muted small">Flexible:</div>
                                                    <h5>0.0000018 BTC</h5>
                                                </div>
                                                <div class="col-lg-6">
                                                    <div id="apex-circle-chartearn"></div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xl-12 col-xxl-5">
                            <div class="card">
                                <div class="card-header py-3 d-flex justify-content-between bg-transparent align-items-center">
                                    <h6 class="mb-0 fw-bold">Increase your account security</h6> 
                                    <a href="security.html" title="security" class="d-inline-flex"><i class="icofont-caret-right fs-5"></i></a>
                                </div>
                                <div class="card-body">
                                    <div class="row row-cols-2 g-0">
                                        <div class="col">
                                            <div class="security border-bottom border-end">
                                                <div class="d-flex align-items-start px-2 py-3">
                                                    <div class="dot-green mx-2 my-2"></div>
                                                    <div class="d-flex flex-column">
                                                        <span class="flex-fill text-truncate">Enable 2FA</span>
                                                        <span>Enabled</span>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col">
                                            <div class="security border-bottom">
                                                <div class="d-flex align-items-start px-2 py-3">
                                                    <div class="dot-green mx-2 my-2"></div>
                                                    <div class="d-flex flex-column">
                                                        <span class="flex-fill text-truncate">Identity Verification</span>
                                                        <span>Verified</span>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col">
                                            <div class="security border-bottom border-end">
                                                <div class="d-flex align-items-start px-2 py-3">
                                                    <div class="dot-red mx-2 my-2"></div>
                                                    <div class="d-flex flex-column">
                                                        <span class="flex-fill text-truncate">Anti-phishing Code</span>
                                                        <a href="security.html" title="setup" class="text-decoration-underline">Setup</a>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col">
                                            <div class="security border-bottom">
                                                <div class="d-flex align-items-start px-2 py-3">
                                                    <div class="dot-red mx-2 my-2"></div>
                                                    <div class="d-flex flex-column">
                                                        <span class="flex-fill text-truncate">Withdrawal Whitelist</span>
                                                        <a href="security.html" title="setup" class="text-decoration-underline">Turn on</a>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col">
                                            <div class="security border-bottom border-end">
                                                <div class="d-flex align-items-start px-2 py-3">
                                                    <div class="dot-red mx-2 my-2"></div>
                                                    <div class="d-flex flex-column">
                                                        <span class="flex-fill text-truncate">Security Key</span>
                                                        <a href="security.html" title="setup" class="text-decoration-underline">Setup</a>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col">
                                            <div class="security border-bottom">
                                                <div class="d-flex align-items-start px-2 py-3">
                                                    <div class="dot-red mx-2 my-2"></div>
                                                    <div class="d-flex flex-column">
                                                        <span class="flex-fill text-truncate">Google Authenticator</span>
                                                        <a href="security.html" title="setup" class="text-decoration-underline">Setup</a>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col">
                                            <div class="security  border-end">
                                                <div class="d-flex align-items-start px-2 py-3">
                                                    <div class="dot-green mx-2 my-2"></div>
                                                    <div class="d-flex flex-column">
                                                        <span class="flex-fill text-truncate">Phone Number</span>
                                                        <span>74****57</span>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                        <div class="col">
                                            <div class="security ">
                                                <div class="d-flex align-items-start px-2 py-3">
                                                    <div class="dot-green mx-2 my-2"></div>
                                                    <div class="d-flex flex-column">
                                                        <span class="flex-fill text-truncate">Email Address </span>
                                                        <span>ni***@gmail.com</span>
                                                    </div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div><!-- Row End -->

                    <div class="row g-3 mb-3 row-deck">
                        <div class="col-xl-4 col-xxl-5">
                            <div class="card">
                                <div class="card-header py-3 d-flex flex-wrap justify-content-between align-items-center bg-transparent border-bottom-0">
                                    <h6 class="mb-0 fw-bold">Top Coin Volume</h6>
                                </div>
                                <div class="card-body">
                                    <span class="h3 d-block mb-2">$97,431.14 USD</span>
                                    <!-- Progress -->
                                    <div class="progress rounded-pill mb-1" style="height: 5px;">
                                        <div class="progress-bar chart-color1" role="progressbar" style="width: 32%" aria-valuenow="32" aria-valuemin="0" aria-valuemax="100"></div>
                                        <div class="progress-bar chart-color2" role="progressbar" style="width: 23%" aria-valuenow="23" aria-valuemin="0" aria-valuemax="100"></div>
                                        <div class="progress-bar chart-color3" role="progressbar" style="width: 13%" aria-valuenow="13" aria-valuemin="0" aria-valuemax="100"></div>
                                        <div class="progress-bar chart-color4" role="progressbar" style="width: 7%" aria-valuenow="7" aria-valuemin="0" aria-valuemax="100"></div>
                                    </div>
                                    <div class="d-flex justify-content-between mb-4">
                                        <span>0%</span>
                                        <span>100%</span>
                                    </div>
                                    <!-- End Progress -->
                                    <div class="table-responsive">
                                        <table class="table  table-nowrap mb-0">
                                            <tbody>
                                                <tr>
                                                    <td><i class="fa fa-square chart-text-color1"></i> BTC</td>
                                                    <td>5.71095643</td>
                                                    <td><span class="badge bg-success">+12.1%</span></td>
                                                </tr>
                                                <tr>
                                                    <td><i class="fa fa-square chart-text-color2"></i> LTC</td>
                                                    <td>2.409425</td>
                                                    <td><span class="badge bg-warning">+6.9%</span></td>
                                                </tr>
                                                <tr>
                                                    <td><i class="fa fa-square chart-text-color3"></i> XRP</td>
                                                    <td>0.0906654</td>
                                                    <td><span class="badge bg-danger">-1.5%</span></td>
                                                </tr>
                                                <tr>
                                                    <td><i class="fa fa-square chart-text-color4"></i> DASH</td>
                                                    <td>0.007653</td>
                                                    <td><span class="badge bg-success">1.9%</span></td>
                                                </tr>
                                            </tbody>
                                        </table>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="col-xl-8 col-xxl-7">
                           <div class="card">
                                <div class="card-header py-3 d-flex justify-content-between bg-transparent border-bottom align-items-center flex-wrap">
                                    <h6 class="mb-0 fw-bold">Login Activity</h6> 
                                    <ul class="nav nav-tabs tab-body-header rounded d-inline-flex mt-2 mt-md-0" role="tablist">
                                        <li class="nav-item"><a class="nav-link" data-bs-toggle="tab" href="#Activity" role="tab">Activity</a></li>
                                        <li class="nav-item"><a class="nav-link active" data-bs-toggle="tab" href="#Devices" role="tab">Devices</a></li>
                                    </ul>
                                </div>
                               <div class="card-body">
                                    <div class="tab-content">
                                        <div class="tab-pane fade" id="Activity">
                                            <ul class="list-unstyled list mb-0">
                                                <li class="d-flex align-items-center py-2">
                                                    <div class="avatar rounded no-thumbnail chart-text-color1"><i class="fa fa-globe" aria-hidden="true"></i></div>
                                                    <div class="flex-fill ms-3">
                                                        <div class="h6 mb-0">web</div>
                                                        <small class="text-muted">Mumbai India</small>
                                                    </div>
                                                    <div class="flex-end">
                                                        <span class="d-block text-end">122.170.109.22</span>
                                                        <span class="text-muted d-block small">2021-09-30 11:00:52</span>
                                                    </div>
                                                </li>
                                                <li class="d-flex align-items-center py-2">
                                                    <div class="avatar rounded no-thumbnail chart-text-color2"><i class="fa fa-globe" aria-hidden="true"></i></div>
                                                    <div class="flex-fill ms-3">
                                                        <div class="h6 mb-0">web</div>
                                                        <small class="text-muted">Mumbai India</small>
                                                    </div>
                                                    <div class="flex-end">
                                                        <span class="d-block text-end">122.170.109.22</span>
                                                        <span class="text-muted d-block small">2021-09-30 11:00:20</span>
                                                    </div>
                                                </li>
                                                <li class="d-flex align-items-center py-2">
                                                    <div class="avatar rounded no-thumbnail chart-text-color3"><i class="fa fa-globe" aria-hidden="true"></i></div>
                                                    <div class="flex-fill ms-3">
                                                        <div class="h6 mb-0">web</div>
                                                        <small class="text-muted">Mumbai India</small>
                                                    </div>
                                                    <div class="flex-end">
                                                        <span class="d-block text-end">122.170.109.21</span>
                                                        <span class="text-muted d-block small">2021-09-29 10:56:22</span>
                                                    </div>
                                                </li>
                                                <li class="d-flex align-items-center py-2">
                                                    <div class="avatar rounded no-thumbnail chart-text-color4"><i class="fa fa-globe" aria-hidden="true"></i></div>
                                                    <div class="flex-fill ms-3">
                                                        <div class="h6 mb-0">web</div>
                                                        <small class="text-muted">Pune India</small>
                                                    </div>
                                                    <div class="flex-end">
                                                        <span class="d-block text-end">198.182.109.22</span>
                                                        <span class="text-muted d-block small">2021-09-30 12:50:52</span>
                                                    </div>
                                                </li>
                                                <li class="d-flex align-items-center py-2">
                                                    <div class="avatar rounded no-thumbnail chart-text-color2"><i class="fa fa-globe" aria-hidden="true"></i></div>
                                                    <div class="flex-fill ms-3">
                                                        <div class="h6 mb-0">web</div>
                                                        <small class="text-muted">Banglor India</small>
                                                    </div>
                                                    <div class="flex-end">
                                                        <span class="d-block text-end">126.150.109.22</span>
                                                        <span class="text-muted d-block small">2021-09-30 10:00:20</span>
                                                    </div>
                                                </li>
                                            </ul>
                                        </div>
                                        <div class="tab-pane fade show active" id="Devices">
                                            <ul class="list-unstyled list mb-0">
                                                <li class="d-flex align-items-center py-2">
                                                    <div class="avatar rounded no-thumbnail chart-text-color1"><i class="fa fa-chrome" aria-hidden="true"></i></div>
                                                    <div class="flex-fill ms-3">
                                                        <div class="h6 mb-0">Chrome V94.0.4606.61 (Windows)</div>
                                                        <small class="text-muted">Mumbai India</small>
                                                    </div>
                                                    <div class="flex-end">
                                                        <span class="d-block text-end">122.170.109.22</span>
                                                        <span class="text-muted d-block small">2021-09-30 11:00:52</span>
                                                    </div>
                                                </li>
                                                <li class="d-flex align-items-center py-2">
                                                    <div class="avatar rounded no-thumbnail chart-text-color2"><i class="fa fa-mobile" aria-hidden="true"></i></div>
                                                    <div class="flex-fill ms-3">
                                                        <div class="h6 mb-0">iPhone</div>
                                                        <small class="text-muted">Mumbai India</small>
                                                    </div>
                                                    <div class="flex-end">
                                                        <span class="d-block text-end">27.57.172.87</span>
                                                        <span class="text-muted d-block small">2021-09-23 09:03:35</span>
                                                    </div>
                                                </li>
                                                <li class="d-flex align-items-center py-2">
                                                    <div class="avatar rounded no-thumbnail chart-text-color3"><i class="fa fa-firefox" aria-hidden="true"></i></div>
                                                    <div class="flex-fill ms-3">
                                                        <div class="h6 mb-0">Mozila V92.0.4515.159 (Windows)</div>
                                                        <small class="text-muted">Mumbai India</small>
                                                    </div>
                                                    <div class="flex-end">
                                                        <span class="d-block text-end">117.99.104.150</span>
                                                        <span class="text-muted d-block small">2021-08-19 08:01:44</span>
                                                    </div>
                                                </li>
                                                <li class="d-flex align-items-center py-2">
                                                    <div class="avatar rounded no-thumbnail chart-text-color4"><i class="fa fa-mobile" aria-hidden="true"></i></div>
                                                    <div class="flex-fill ms-3">
                                                        <div class="h6 mb-0">Android</div>
                                                        <small class="text-muted">Pune India</small>
                                                    </div>
                                                    <div class="flex-end">
                                                        <span class="d-block text-end">118.99.104.150</span>
                                                        <span class="text-muted d-block small">2021-09-30 12:50:52</span>
                                                    </div>
                                                </li>
                                                <li class="d-flex align-items-center py-2">
                                                    <div class="avatar rounded no-thumbnail chart-text-color3"><i class="fa fa-safari" aria-hidden="true"></i></div>
                                                    <div class="flex-fill ms-3">
                                                        <div class="h6 mb-0">Safari V84.0.4515.159 (Mac)</div>
                                                        <small class="text-muted">Banglor India</small>
                                                    </div>
                                                    <div class="flex-end">
                                                        <span class="d-block text-end">177.192.104.150</span>
                                                        <span class="text-muted d-block small">2021-08-19 07:01:44</span>
                                                    </div>
                                                </li>
                                            </ul>
                                        </div>
                                    </div>
                               </div>
                           </div>   
                        </div>
                    </div><!-- Row End -->

                    <div class="row g-3 mb-3 row-deck">
                        <div class="col-xl-12">
                            <div class="card">
                                <div class="card-header py-3 d-flex justify-content-between">
                                    <h6 class="mb-0 fw-bold">Recent Transactions</h6> 
                                </div>
                                <div class="card-body">
                                    <table id="ordertabthree" class="priceTable table table-hover custom-table-2 table-bordered align-middle mb-0" style="width:100%">
                                        <thead>
                                            <tr>
                                                <th>Date</th>
                                                <th>Pair</th>
                                                <th>Side</th>
                                                <th>Price</th>
                                                <th>Executed</th>
                                                <th>Fee</th>
                                                <th>Total</th>
                                            </tr>
                                        </thead>
                                        <tbody>
                                            <tr>
                                                <td>09-18 17:32:15</td>
                                                <td><img src="<?php echo base_url();?>uassets/images/coin/ETH.png" alt="" class="img-fluid avatar mx-1">ETH/USDT</td>
                                                <td><span class="color-price-down">Sell</span></td>
                                                <td>3,487.50</td>
                                                <td>0.0110</td>
                                                <td>0.03836250 USDT</td>
                                                <td>38.36250000 USDT</td>
                                            </tr>
                                            <tr>
                                                <td>09-18 17:31:11</td>
                                                <td><img src="<?php echo base_url();?>uassets/images/coin/SOL.png" alt="" class="img-fluid avatar mx-1">SOL/USDT</td>
                                                <td><span class="color-price-down">Sell</span></td>
                                                <td>160.33</td>
                                                <td>0.75</td>
                                                <td>0.12024750 USDT</td>
                                                <td>120.24750000 USDT</td>
                                            </tr>
                                            <tr>
                                                <td>09-18 08:52:04</td>
                                                <td><img src="<?php echo base_url();?>uassets/images/coin/ETH.png" alt="" class="img-fluid avatar mx-1">ETH/USDT</td>
                                                <td><span class="color-price-up">Buy</span></td>
                                                <td>3,439.20</td>
                                                <td>0.0111</td>
                                                <td>0.00001110 ETH</td>
                                                <td>38.17512000 USDT</td>
                                            </tr>
                                            <tr>
                                                <td>09-17 08:34:14</td>
                                                <td><img src="<?php echo base_url();?>uassets/images/coin/SOL.png" alt="" class="img-fluid avatar mx-1">SOL/USDT</td>
                                                <td><span class="color-price-up">Buy</span></td>
                                                <td>147.04</td>
                                                <td>0.76</td>
                                                <td>0.00076000 SOL</td>
                                                <td>111.75040000 USDT</td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                    </div><!-- Row End -->

                </div>
            </div>
            
              
        
            <!-- Modal Custom Settings-->
                    
            
        </div>     
    
    </div>

    <!-- Jquery Core Js -->
    <script src="<?php echo base_url();?>uassets/bundles/libscripts.bundle.js"></script>

    <!-- Plugin Js -->
    <script src="<?php echo base_url();?>uassets/bundles/dataTables.bundle.js"></script>
    <script src="<?php echo base_url();?>uassets/bundles/apexcharts.bundle.js"></script>

    <!-- Jquery Page Js -->
    <script src="../js/template.js"></script>
    <script src="../js/page/index.js"></script>
</body>
</html> 