{% load static %}

<div class="ap-po-details ap-po-details--3 radius-xl d-flex py-25">
    <div class="overview-content overview-content3 b-none bg-none mb-lg-0 mb-20">
        <div class="d-flex">
            <div class="revenue-chart-box__Icon me-20 bg-primary color-white rounded-circle">
                <img src="{% static 'img/svg/profit2.svg' %}" alt="img" class="svg">
            </div>
            <div class="d-flex align-items-start flex-wrap">
                <div class="me-10">
                    <h1>$70K</h2>
                        <p class="mt-1 mb-0">Revenue</p>
                </div>

                <div class="ap-po-details bg-none">
                    <span class="color-success fs-14  d-inline-block mt-2"><i class="las la-arrow-up"></i>
                        <strong>25.36%</strong></span>
                </div>
            </div>
        </div>
    </div>

    <div class="overview-content overview-content3 bg-none b-none mb-lg-0 mb-20">
        <div class="d-flex">
            <div class="revenue-chart-box__Icon me-20 bg-info color-white rounded-circle">
                <i class="uil uil-arrow-growth"></i>
            </div>
            <div class="d-flex align-items-start flex-wrap">
                <div class="me-10">
                    <h1>28.50%</h1>
                    <p class="mt-1 mb-0">Growth</p>
                </div>

                <div class="ap-po-details bg-none">
                    <span class="color-success fs-14 d-inline-block mt-2"><i class="las la-arrow-up"></i>
                        <strong>25.36%</strong></span>
                </div>
            </div>
        </div>
    </div>

    <div class="overview-content overview-content3 bg-none b-none mb-lg-0 mb-20">
        <div class="d-flex">
            <div class="revenue-chart-box__Icon me-20 bg-success color-white rounded-circle">
                <i class="uil uil-shopping-cart"></i>
            </div>
            <div class="d-flex align-items-start flex-wrap">
                <div class="me-10">
                    <h1>8,750</h1>
                    <p class="mt-1 mb-0">Orders</p>
                </div>

                <div class="ap-po-details bg-none">
                    <span class="color-success fs-14 d-inline-block mt-2"><i class="las la-arrow-up"></i>
                        <strong>25.36%</strong></span>
                </div>
            </div>
        </div>
    </div>

    <div class="overview-content overview-content3 bg-none b-none mb-lg-0 mb-20">
        <div class="d-flex">
            <div class="revenue-chart-box__Icon me-20 bg-warning color-white rounded-circle">
                <i class="uil uil-usd-circle"></i>
            </div>
            <div class="d-flex align-items-start flex-wrap">
                <div class="me-10">
                    <h1>$40K</h1>
                    <p class="mt-1 mb-0">Sales</p>
                </div>

                <div class="ap-po-details bg-none">
                    <span class="color-danger fs-14 d-inline-block mt-2"><i class="las la-arrow-down"></i>
                        <strong>25.36%</strong></span>
                </div>
            </div>
        </div>
    </div>
</div>