<div class="card">
    <div class="card-body">
        <h4 class="card-title">Earning Report</h4>
        <h6 class="card-subtitle">Emplyee earning report</h6>
    </div>
    <div class="bg-light p-20">
        <div class="d-flex">
            <div class="align-self-center">
                <h3 class="m-b-0">July 2017</h3>
                <small>Total Earning</small>
            </div>
            <div class="ml-auto align-self-center">
                <h2 class="text-success">$5470</h2>
            </div>
        </div>
    </div>
    <div class="card-body">
        <div class="table-responsive">
            <table class="table table-hover earning-box">
                <thead>
                    <tr>
                        <th colspan="2">Name</th>
                        <th>Priority</th>
                        <th>Earnings</th>
                    </tr>
                </thead>
                <tbody>
                    <tr>
                        <td style="width:50px;">
                            <span class="round">
                                <img src="assets/images/users/8.jpg" alt="user" width="50">
                            </span>
                        </td>
                        <td>
                            <h6>Sunil Joshi</h6>
                            <small class="text-muted">Web Designer</small>
                        </td>
                        <td>
                            <span class="label label-success">Low</span>
                        </td>
                        <td>$3.9K</td>
                    </tr>
                    <tr class="active">
                        <td>
                            <span class="round">
                                <img src="assets/images/users/2.jpg" alt="user" width="50">
                            </span>
                        </td>
                        <td>
                            <h6>Andrew</h6>
                            <small class="text-muted">Project Manager</small>
                        </td>
                        <td>
                            <span class="label label-info">Medium</span>
                        </td>
                        <td>$23.9K</td>
                    </tr>
                    <tr>
                        <td>
                            <span class="round round-success">
                                <img src="assets/images/users/1.jpg" alt="user" width="50">
                            </span>
                        </td>
                        <td>
                            <h6>Bhavesh patel</h6>
                            <small class="text-muted">Developer</small>
                        </td>
                        <td>
                            <span class="label label-primary">High</span>
                        </td>
                        <td>$12.9K</td>
                    </tr>
                    <tr>
                        <td>
                            <span class="round round-primary">
                                <img src="assets/images/users/4.jpg" alt="user" width="50">
                            </span>
                        </td>
                        <td>
                            <h6>Nirav Joshi</h6>
                            <small class="text-muted">Frontend Eng</small>
                        </td>
                        <td>
                            <span class="label label-danger">Low</span>
                        </td>
                        <td>$10.9K</td>
                    </tr>

                    <tr>
                        <td>
                            <span class="round round-danger">
                                <img src="assets/images/users/1.jpg" alt="user" width="50">
                            </span>
                        </td>
                        <td>
                            <h6>Johnathan</h6>
                            <small class="text-muted">Graphic</small>
                        </td>
                        <td>
                            <span class="label label-info">High</span>
                        </td>
                        <td>$2.6K</td>
                    </tr>
                    <tr>
                        <td>
                            <span class="round round-success">M</span>
                        </td>
                        <td>
                            <h6>Vishal Doe</h6>
                            <small class="text-muted">Content Writer</small>
                        </td>
                        <td>
                            <span class="label label-warning">High</span>
                        </td>
                        <td>$12.9K</td>
                    </tr>
                </tbody>
            </table>
        </div>
    </div>
</div>