<div class="masonry-item col-md-6">
    <div class="bd bgc-white">
        <div class="layers">
            <div class="layer w-100 p-20">
                <h6 class="lh-1">Sales Report</h6></div>
            <div class="layer w-100">
                <div class="bgc-light-blue-500 c-white p-20">
                    <div class="peers ai-c jc-sb gap-40">
                        <div class="peer peer-greed">
                            <h5>November 2017</h5>
                            <p class="mB-0">Sales Report</p>
                        </div>
                        <div class="peer">
                            <h3 class="text-right">$6,000</h3></div>
                    </div>
                </div>
                <div class="table-responsive p-20">
                    <table class="table">
                        <thead>
                            <tr>
                                <th class="bdwT-0">Name</th>
                                <th class="bdwT-0">Status</th>
                                <th class="bdwT-0">Date</th>
                                <th class="bdwT-0">Price</th>
                            </tr>
                        </thead>
                        <tbody>
                            <tr>
                                <td class="fw-600">Item #1 Name</td>
                                <td><span class="badge bgc-red-50 c-red-700 p-10 lh-0 tt-c badge-pill">Unavailable</span></td>
                                <td>Nov 18</td>
                                <td><span class="text-success">$12</span></td>
                            </tr>
                            <tr>
                                <td class="fw-600">Item #2 Name</td>
                                <td><span class="badge bgc-deep-purple-50 c-deep-purple-700 p-10 lh-0 tt-c badge-pill">New</span></td>
                                <td>Nov 19</td>
                                <td><span class="text-info">$34</span></td>
                            </tr>
                            <tr>
                                <td class="fw-600">Item #3 Name</td>
                                <td><span class="badge bgc-pink-50 c-pink-700 p-10 lh-0 tt-c badge-pill">New</span></td>
                                <td>Nov 20</td>
                                <td><span class="text-danger">-$45</span></td>
                            </tr>
                            <tr>
                                <td class="fw-600">Item #4 Name</td>
                                <td><span class="badge bgc-green-50 c-green-700 p-10 lh-0 tt-c badge-pill">Unavailable</span></td>
                                <td>Nov 21</td>
                                <td><span class="text-success">$65</span></td>
                            </tr>
                            <tr>
                                <td class="fw-600">Item #5 Name</td>
                                <td><span class="badge bgc-red-50 c-red-700 p-10 lh-0 tt-c badge-pill">Used</span></td>
                                <td>Nov 22</td>
                                <td><span class="text-success">$78</span></td>
                            </tr>
                            <tr>
                                <td class="fw-600">Item #6 Name</td>
                                <td><span class="badge bgc-orange-50 c-orange-700 p-10 lh-0 tt-c badge-pill">Used</span></td>
                                <td>Nov 23</td>
                                <td><span class="text-danger">-$88</span></td>
                            </tr>
                            <tr>
                                <td class="fw-600">Item #7 Name</td>
                                <td><span class="badge bgc-yellow-50 c-yellow-700 p-10 lh-0 tt-c badge-pill">Old</span></td>
                                <td>Nov 22</td>
                                <td><span class="text-success">$56</span></td>
                            </tr>
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
        <div class="ta-c bdT w-100 p-20"><a href="#">Check all the sales</a></div>
    </div>
</div>
