<div class="grid grid-cols-5 gap-5 mt-5 lg:grid-cols-2">

    <!-- status -->
    <div class="card col-span-1">
        <div class="card-body">
            <h5 class="uppercase text-xs tracking-wider font-extrabold">today</h5>
            <h1 class="capitalize text-lg mt-1 mb-1">$<span class="num-3"></span>  <span class="text-xs tracking-widest font-extrabold"> / <span class="num-2"></span> orders</span></h1>
            <p class="capitalize text-xs text-gray-500">( $<span class="num-2"></span> in the last year )</p>
        </div>
    </div>
    <!-- status -->

    <!-- status -->
    <div class="card col-span-1">
        <div class="card-body">
            <h5 class="uppercase text-xs tracking-wider font-extrabold">yesterday</h5>
            <h1 class="capitalize text-lg mt-1 mb-1">$<span class="num-3"></span>  <span class="text-xs tracking-widest font-extrabold"> / <span class="num-2"></span> orders</span></h1>
            <p class="capitalize text-xs text-gray-500">( $<span class="num-2"></span> in the last year )</p>
        </div>
    </div>
    <!-- status -->

    <!-- status -->
    <div class="card col-span-1">
        <div class="card-body">
            <h5 class="uppercase text-xs tracking-wider font-extrabold">last week</h5>
            <h1 class="capitalize text-lg mt-1 mb-1">$<span class="num-3"></span>  <span class="text-xs tracking-widest font-extrabold"> / <span class="num-2"></span> orders</span></h1>
            <p class="capitalize text-xs text-gray-500">( $<span class="num-2"></span> in the last year )</p>
        </div>
    </div>
    <!-- status -->

    <!-- status -->
    <div class="card col-span-1">
        <div class="card-body">
            <h5 class="uppercase text-xs tracking-wider font-extrabold">last month</h5>
            <h1 class="capitalize text-lg mt-1 mb-1">$<span class="num-3"></span>  <span class="text-xs tracking-widest font-extrabold"> / <span class="num-2"></span> orders</span></h1>
            <p class="capitalize text-xs text-gray-500">( $<span class="num-2"></span> in the last year )</p>
        </div>
    </div>
    <!-- status -->

    <!-- status -->
    <div class="card col-span-1 lg:col-span-2">
        <div class="card-body">
            <h5 class="uppercase text-xs tracking-wider font-extrabold">last 90-days</h5>
            <h1 class="capitalize text-lg mt-1 mb-1">$<span class="num-3"></span>  <span class="text-xs tracking-widest font-extrabold"> / <span class="num-2"></span> orders</span></h1>
            <p class="capitalize text-xs text-gray-500">( $<span class="num-2"></span> in the last year )</p>
        </div>
    </div>
    <!-- status -->
    
 
</div>