---
title: Invoices - Done
slug: invoices-done
createdAt: 2025-01-20T23:10:06.944Z
---

#

# HTML

```html
<h2>Invoices</h2>
<div class="subheading">
    View and Manage Your Invoices
</div>

<form name="Invoices" method="get" aria-label="Invoices">
    <div class="table-outline">
        <div class="table-scroll-container">
            <table class="table">
                <thead class="table-head">
                    <tr class="table-header-row">
                        <!-- Checkbox Column -->
                        <th class="table-checkbox-column">
                            <label class="w-checkbox table-checkbox-field">
                                <div class="w-checkbox-input w-checkbox-input--inputType-custom table-checkbox"></div>
                                <input type="checkbox" name="" data-name="" style="opacity:0; position:absolute; z-index:-1">
                            </label>
                        </th>
                        <!-- Invoice Column -->
                        <th>
                            <div class="table-cell-content">
                                <div class="table-heading">Invoice</div>
                                <div class="table-sort-button w-embed">
                                    <svg fill="currentColor" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
                                        <defs>
                                            <style>.cls-1 { fill: none; }</style>
                                        </defs>
                                        <polygon points="16 28 9 21 10.41 19.59 16 25.17 21.59 19.59 23 21 16 28"></polygon>
                                        <polygon points="16 4 23 11 21.59 12.41 16 6.83 10.41 12.41 9 11 16 4"></polygon>
                                        <rect id="Transparent_Rectangle" data-name="Transparent Rectangle" class="cls-1"></rect>
                                    </svg>
                                </div>
                            </div>
                        </th>
                        <!-- Invoice Month Column -->
                        <th>
                            <div class="table-cell-content">
                                <div class="table-heading">Invoice Month</div>
                                <div class="table-sort-button w-embed">
                                    <svg fill="currentColor" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
                                        <defs>
                                            <style>.cls-1 { fill: none; }</style>
                                        </defs>
                                        <title>chevron--sort</title>
                                        <polygon points="16 28 9 21 10.41 19.59 16 25.17 21.59 19.59 23 21 16 28"></polygon>
                                        <polygon points="16 4 23 11 21.59 12.41 16 6.83 10.41 12.41 9 11 16 4"></polygon>
                                        <rect id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>" class="cls-1"></rect>
                                    </svg>
                                </div>
                            </div>
                        </th>
                        <!-- Status Column -->
                        <th class="table-heading-status">
                            <div class="table-cell-content grow">
                                <div class="table-heading">Status</div>
                                <div class="table-sort-button w-embed">
                                    <svg fill="currentColor" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
                                        <defs>
                                            <style>.cls-1 { fill: none; }</style>
                                        </defs>
                                        <title>chevron--sort</title>
                                        <polygon points="16 28 9 21 10.41 19.59 16 25.17 21.59 19.59 23 21 16 28"></polygon>
                                        <polygon points="16 4 23 11 21.59 12.41 16 6.83 10.41 12.41 9 11 16 4"></polygon>
                                        <rect id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>" class="cls-1"></rect>
                                    </svg>
                                </div>
                            </div>
                        </th>
                        <!-- PO Number Column -->
                        <th>
                            <div class="table-cell-content">
                                <div class="table-heading">PO&nbsp;Number</div>
                                <div class="table-sort-button w-embed">
                                    <svg fill="currentColor" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
                                        <defs>
                                            <style>.cls-1 { fill: none; }</style>
                                        </defs>
                                        <title>chevron--sort</title>
                                        <polygon points="16 28 9 21 10.41 19.59 16 25.17 21.59 19.59 23 21 16 28"></polygon>
                                        <polygon points="16 4 23 11 21.59 12.41 16 6.83 10.41 12.41 9 11 16 4"></polygon>
                                        <rect id="_Transparent_Rectangle_" data-name="<Transparent Rectangle>" class="cls-1"></rect>
                                    </svg>
                                </div>
                            </div>
                        </th>
                        <!-- Action Column -->
                        <th class="action-column">
                            <div class="table-header-icon-container">
                                <div data-delay="0" data-hover="false" class="table-menu-container w-dropdown">
                                    <div
                                         class="table-menu-button w-dropdown-toggle"
                                         id="w-dropdown-toggle-8"
                                         aria-controls="w-dropdown-list-8"
                                         aria-haspopup="menu"
                                         aria-expanded="false"
                                         role="button"
                                         tabindex="0"
                                         >
                                        <div class="table-header-button">
                                            <div class="table-button-icon w-embed">
                                                <svg
                                                     version="1.1"
                                                     fill="currentColor"
                                                     xmlns="http://www.w3.org/2000/svg"
                                                     width="32px"
                                                     height="32px"
                                                     viewBox="0 0 32 32"
                                                     >
                                                    <circle cx="16" cy="8" r="2"></circle>
                                                    <circle cx="16" cy="16" r="2"></circle>
                                                    <circle cx="16" cy="24" r="2"></circle>
                                                </svg>
                                            </div>
                                        </div>
                                    </div>
                                    <nav
                                         class="table-menu w-dropdown-list"
                                         id="w-dropdown-list-8"
                                         aria-labelledby="w-dropdown-toggle-8"
                                         >
                                        <button class="table-menu-item w-inline-block" aria-label="Export to CSV">
                                            <span class="table-menu-item-icon w-embed">
                                                <!-- Export Icon SVG -->
                                                <svg fill="currentColor" xmlns="http://www.w3.org/2000/svg" width="32" height="32" viewBox="0 0 32 32">
                                                    <polygon points="5 18 5 20 10.586 20 3 27.586 4.414 29 12 21.414 12 27 14 27 14 18 5 18"></polygon>
                                                    <path d="M27,3H5A2,2,0,0,0,3,5V15H5V11H15v4h2V11H27v7H17v2H27v7H17v2H27a2,2,0,0,0,2-2V5A2,2,0,0,0,27,3Zm0,6H5V5H27Z"></path>
                                                </svg>
                                            </span>
                                            <span>Export to CSV</span>
                                        </button>
                                    </nav>
                                </div>
                            </div>
                        </th>
                    </tr>
                    <!-- Filter Row -->
                    <tr class="table-filter-row">
                        <!-- Checkbox Filter Column (Empty) -->
                        <th class="table-checkbox-column">&nbsp;</th>
                        <!-- Invoice Filter -->
                        <th>
                            <div class="table-filter-cell-content">
                                <input
                                       class="input-filter w-input"
                                       maxlength="256"
                                       name="Filter-Col1"
                                       data-name="Filter-Col1"
                                       placeholder="Filter"
                                       type="text"
                                       id="Filter-Col"
                                       >
                            </div>
                        </th>
                        <!-- Invoice Month Filter -->
                        <th>
                            <div class="table-filter-cell-content">
                                <div class="date-filter">
                                    <input
                                           class="input-filter date-picker w-input"
                                           maxlength="256"
                                           name="Invoice-Month"
                                           data-name="Invoice-Month"
                                           placeholder="Filter"
                                           type="text"
                                           id="Invoice-Month"
                                           data-datepicker="daterange"
                                           >
                                    <div id="dateFilterButton" class="date-filter-icon-container">
                                        <div class="date-filter-icon w-embed">
                                            <svg
                                                 xmlns="http://www.w3.org/2000/svg"
                                                 fill="currentColor"
                                                 width="32"
                                                 height="32"
                                                 viewBox="0 0 32 32"
                                                 >
                                                <path d="M26,4H22V2H20V4H12V2H10V4H6A2.0025,2.0025,0,0,0,4,6V26a2.0025,2.0025,0,0,0,2,2H26a2.0025,2.0025,0,0,0,2-2V6A2.0025,2.0025,0,0,0,26,4ZM6,6h4V8h2V6h8V8h2V6h4l0,4H6Zm0,6h5v6H6ZM19,26H13V20h6Zm0-8H13V12h6Zm2,8V20h5l.0012,6Z"></path>
                                            </svg>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </th>
                        <!-- Status Filter -->
                        <th>
                            <div class="table-filter-cell-content">
                                <div data-hover="false" data-delay="0" class="dropdown w-dropdown">
                                    <div
                                         class="dropdown-closed table-filter w-dropdown-toggle"
                                         id="w-dropdown-toggle-9"
                                         aria-controls="w-dropdown-list-9"
                                         aria-haspopup="menu"
                                         aria-expanded="false"
                                         role="button"
                                         tabindex="0"
                                         >
                                        <div class="filter-dropdown-arrow w-icon-dropdown-toggle" aria-hidden="true"></div>
                                        <div class="dropdown-text-content placeholder">Filter</div>
                                    </div>
                                    <nav
                                         class="dropdown-open w-dropdown-list"
                                         id="w-dropdown-list-9"
                                         aria-labelledby="w-dropdown-toggle-9"
                                         >
                                        <div class="dropdown-option-container">
                                            <a href="#" class="dropdown-option-simple w-inline-block" tabindex="0">
                                                <div class="dropdown-option-selected-icon-container">
                                                    <div class="dropdown-option-selected-icon w-embed">
                                                        <svg
                                                             xmlns="http://www.w3.org/2000/svg"
                                                             width="24"
                                                             height="24"
                                                             viewBox="0 0 24 24"
                                                             fill="none"
                                                             stroke="currentColor"
                                                             stroke-width="2"
                                                             stroke-linecap="round"
                                                             stroke-linejoin="round"
                                                             >
                                                            <polyline points="20 6 9 17 4 12"></polyline>
                                                        </svg>
                                                    </div>
                                                </div>
                                                <div class="dropdown-option-text">Canada</div>
                                            </a>
                                            <a href="#" class="dropdown-option-simple w-inline-block" tabindex="0">
                                                <div class="dropdown-option-selected-icon-container">
                                                    <div class="dropdown-option-selected-icon selected w-embed">
                                                        <svg
                                                             xmlns="http://www.w3.org/2000/svg"
                                                             width="24"
                                                             height="24"
                                                             viewBox="0 0 24 24"
                                                             fill="none"
                                                             stroke="currentColor"
                                                             stroke-width="4"
                                                             stroke-linecap="round"
                                                             stroke-linejoin="round"
                                                             >
                                                            <polyline points="20 6 9 17 4 12"></polyline>
                                                        </svg>
                                                    </div>
                                                </div>
                                                <div class="dropdown-option-text">United States</div>
                                            </a>
                                            <a href="#" class="dropdown-option-simple w-inline-block" tabindex="0">
                                                <div class="dropdown-option-selected-icon-container">
                                                    <div class="dropdown-option-selected-icon w-embed">
                                                        <svg
                                                             xmlns="http://www.w3.org/2000/svg"
                                                             width="24"
                                                             height="24"
                                                             viewBox="0 0 24 24"
                                                             fill="none"
                                                             stroke="currentColor"
                                                             stroke-width="4"
                                                             stroke-linecap="round"
                                                             stroke-linejoin="round"
                                                             >
                                                            <polyline points="20 6 9 17 4 12"></polyline>
                                                        </svg>
                                                    </div>
                                                </div>
                                                <div class="dropdown-option-text">United Kingdom</div>
                                            </a>
                                            <a href="#" class="dropdown-option-simple w-inline-block" tabindex="0">
                                                <div class="dropdown-option-selected-icon-container">
                                                    <div class="dropdown-option-selected-icon w-embed">
                                                        <svg
                                                             xmlns="http://www.w3.org/2000/svg"
                                                             width="24"
                                                             height="24"
                                                             viewBox="0 0 24 24"
                                                             fill="none"
                                                             stroke="currentColor"
                                                             stroke-width="4"
                                                             stroke-linecap="round"
                                                             stroke-linejoin="round"
                                                             >
                                                            <polyline points="20 6 9 17 4 12"></polyline>
                                                        </svg>
                                                    </div>
                                                </div>
                                                <div class="dropdown-option-text">Italy</div>
                                            </a>
                                            <!-- Additional Long Options for Testing -->
                                            <a href="#" class="dropdown-option-simple w-inline-block" tabindex="0">
                                                <div class="dropdown-option-selected-icon-container">
                                                    <div class="dropdown-option-selected-icon w-embed">
                                                        <svg
                                                             xmlns="http://www.w3.org/2000/svg"
                                                             width="24"
                                                             height="24"
                                                             viewBox="0 0 24 24"
                                                             fill="none"
                                                             stroke="currentColor"
                                                             stroke-width="4"
                                                             stroke-linecap="round"
                                                             stroke-linejoin="round"
                                                             >
                                                            <polyline points="20 6 9 17 4 12"></polyline>
                                                        </svg>
                                                    </div>
                                                </div>
                                                <div class="dropdown-option-text">This is a really long one to test with.</div>
                                            </a>
                                            <!-- Repeat as Needed -->
                                            <a href="#" class="dropdown-option-simple w-inline-block" tabindex="0">
                                                <div class="dropdown-option-selected-icon-container">
                                                    <div class="dropdown-option-selected-icon w-embed">
                                                        <svg
                                                             xmlns="http://www.w3.org/2000/svg"
                                                             width="24"
                                                             height="24"
                                                             viewBox="0 0 24 24"
                                                             fill="none"
                                                             stroke="currentColor"
                                                             stroke-width="4"
                                                             stroke-linecap="round"
                                                             stroke-linejoin="round"
                                                             >
                                                            <polyline points="20 6 9 17 4 12"></polyline>
                                                        </svg>
                                                    </div>
                                                </div>
                                                <div class="dropdown-option-text">This is a really long one to test with.</div>
                                            </a>
                                            <!-- Add more as needed -->
                                        </div>
                                    </nav>
                                </div>
                            </div>
                        </th>
                        <!-- PO Number Filter -->
                        <th>
                            <div class="table-filter-cell-content">
                                <input
                                       class="input-filter w-input"
                                       maxlength="256"
                                       name="Filter-Col1"
                                       data-name="Filter-Col1"
                                       placeholder="Filter"
                                       type="text"
                                       id="Filter-Col"
                                       >
                            </div>
                        </th>
                        <!-- Action Filter Column (Empty) -->
                        <th>&nbsp;</th>
                    </tr>
                </thead>
                <tbody class="table-body">
                    <!-- First Table Row -->
                    <tr class="table-row">
                        <!-- Checkbox Column -->
                        <td class="table-checkbox-column">
                            <label class="w-checkbox table-checkbox-field">
                                <div class="w-checkbox-input w-checkbox-input--inputType-custom table-checkbox"></div>
                                <input type="checkbox" name="" data-name="" style="opacity:0; position:absolute; z-index:-1">
                            </label>
                        </td>
                        <!-- Invoice Cell -->
                        <td class="table-cell">
                            <div class="table-cell-content">
                                <div class="table-cell-left">
                                    <div class="table-data">EA-12465546546</div>
                                </div>
                            </div>
                        </td>
                        <!-- Invoice Month Cell -->
                        <td class="table-cell">
                            <div class="table-cell-content">
                                <div class="table-cell-left">
                                    <div class="table-data">November 2024</div>
                                </div>
                            </div>
                        </td>
                        <!-- Status Cell -->
                        <td class="table-cell">
                            <div class="table-cell-content">
                                <div class="table-cell-left">
                                    <div class="table-data danger">Payment Due</div>
                                    <button type="button" class="button small w-inline-block" data-wait="Loading">
                                        <span class="button-icon w-embed">
                                            <svg
                                                 fill="currentColor"
                                                 xmlns="http://www.w3.org/2000/svg"
                                                 viewBox="0 0 32 32"
                                                 >
                                                <path d="M28,6H4A2,2,0,0,0,2,8V24a2,2,0,0,0,2,2H28a2,2,0,0,0,2-2V8A2,2,0,0,0,28,6Zm0,2v3H4V8ZM4,24V13H28V24Z" transform="translate(0 0)"></path>
                                                <rect x="6" y="20" width="10" height="2"></rect>
                                            </svg>
                                        </span>
                                        <span>Update Card</span>
                                    </button>
                                </div>
                            </div>
                        </td>
                        <!-- PO Number Cell -->
                        <td class="table-cell">
                            <div class="table-cell-content">
                                <div class="table-cell-left">
                                    <div class="table-data">123456</div>
                                </div>
                            </div>
                        </td>
                        <!-- Action Cell -->
                        <td class="table-cell">
                            <div class="table-row-action-button-container">
                                <div data-tippy-content="Download PDF" class="table-row-action-button">
                                    <div class="table-row-action-button-icon w-embed">
                                        <svg
                                             fill="currentColor"
                                             xmlns="http://www.w3.org/2000/svg"
                                             width="32"
                                             height="32"
                                             viewBox="0 0 32 32"
                                             >
                                            <polygon points="4 20 4 22 8.586 22 2 28.586 3.414 30 10 23.414 10 28 12 28 12 20 4 20"></polygon>
                                            <polygon points="22 16 24 16 24 10 29 10 29 8 24 8 24 4 30 4 30 2 22 2 22 16"></polygon>
                                            <path d="M16,2H12V16h4a4,4,0,0,0,4-4V6A4,4,0,0,0,16,2Zm2,10a2,2,0,0,1-2,2H14V4h2a2,2,0,0,1,2,2Z"></path>
                                            <path d="M8,2H2V16H4V11H8a2,2,0,0,0,2-2V4A2,2,0,0,0,8,2ZM8,9H4V4H8Z"></path>
                                        </svg>
                                    </div>
                                </div>
                            </div>
                        </td>
                    </tr>
                    <!-- Second Table Row (Last Row) -->
                    <tr class="table-row last-row">
                        <!-- Checkbox Column -->
                        <td class="table-checkbox-column">
                            <label class="w-checkbox table-checkbox-field">
                                <div class="w-checkbox-input w-checkbox-input--inputType-custom table-checkbox"></div>
                                <input type="checkbox" name="" data-name="" style="opacity:0; position:absolute; z-index:-1">
                            </label>
                        </td>
                        <!-- Invoice Cell -->
                        <td class="table-cell">
                            <div class="table-cell-content">
                                <div class="table-cell-left">
                                    <div class="table-data overflow">EA-12465546546</div>
                                </div>
                            </div>
                        </td>
                        <!-- Invoice Month Cell -->
                        <td class="table-cell">
                            <div class="table-cell-content">
                                <div class="table-cell-left">
                                    <div class="table-data">December 2024</div>
                                </div>
                            </div>
                        </td>
                        <!-- Status Cell -->
                        <td class="table-cell">
                            <div class="table-cell-content">
                                <div class="table-cell-left overflow">
                                    <div class="table-data success">Paid</div>
                                </div>
                            </div>
                        </td>
                        <!-- PO Number Cell -->
                        <td class="table-cell">
                            <div class="table-cell-content">
                                <div class="table-cell-left">
                                    <div class="table-data disabled">n/a</div>
                                </div>
                            </div>
                        </td>
                        <!-- Action Cell -->
                        <td class="table-cell">
                            <div class="table-row-action-button-container">
                                <div data-tippy-content="Download PDF" class="table-row-action-button">
                                    <div class="table-row-action-button-icon w-embed">
                                        <svg
                                             fill="currentColor"
                                             xmlns="http://www.w3.org/2000/svg"
                                             width="32"
                                             height="32"
                                             viewBox="0 0 32 32"
                                             >
                                            <polygon points="4 20 4 22 8.586 22 2 28.586 3.414 30 10 23.414 10 28 12 28 12 20 4 20"></polygon>
                                            <polygon points="22 16 24 16 24 10 29 10 29 8 24 8 24 4 30 4 30 2 22 2 22 16"></polygon>
                                            <path d="M16,2H12V16h4a4,4,0,0,0,4-4V6A4,4,0,0,0,16,2Zm2,10a2,2,0,0,1-2,2H14V4h2a2,2,0,0,1,2,2Z"></path>
                                            <path d="M8,2H2V16H4V11H8a2,2,0,0,0,2-2V4A2,2,0,0,0,8,2ZM8,9H4V4H8Z"></path>
                                        </svg>
                                    </div>
                                </div>
                            </div>
                        </td>
                    </tr>
                </tbody>
            </table>
        </div>
        <!-- Pagination Controls -->
        <div class="table-pagination">
            <div class="pagination-left">
                <div class="items-per-page-container">
                    <div>Items per page:</div>
                    <div data-hover="false" data-delay="0" class="dropdown w-dropdown">
                        <div
                             class="dropdown-closed table-filter w-dropdown-toggle"
                             id="w-dropdown-toggle-10"
                             aria-controls="w-dropdown-list-10"
                             aria-haspopup="menu"
                             aria-expanded="false"
                             role="button"
                             tabindex="0"
                             >
                            <div class="filter-dropdown-arrow w-icon-dropdown-toggle" aria-hidden="true"></div>
                            <div class="dropdown-text-content">10</div>
                        </div>
                        <nav
                             class="dropdown-open top-left w-dropdown-list"
                             id="w-dropdown-list-10"
                             aria-labelledby="w-dropdown-toggle-10"
                             >
                            <div class="dropdown-option-container">
                                <a href="#" class="dropdown-option-simple w-inline-block" tabindex="0">
                                    <div class="dropdown-option-selected-icon-container">
                                        <div class="dropdown-option-selected-icon w-embed">
                                            <svg
                                                 xmlns="http://www.w3.org/2000/svg"
                                                 width="24"
                                                 height="24"
                                                 viewBox="0 0 24 24"
                                                 fill="none"
                                                 stroke="currentColor"
                                                 stroke-width="2"
                                                 stroke-linecap="round"
                                                 stroke-linejoin="round"

                                                 >
                                                <polyline points="20 6 9 17 4 12"></polyline>
                                            </svg>
                                        </div>
                                    </div>
                                    <div class="dropdown-option-text">10</div>
                                </a>
                                <a href="#" class="dropdown-option-simple w-inline-block" tabindex="0">
                                    <div class="dropdown-option-selected-icon-container">
                                        <div class="dropdown-option-selected-icon selected w-embed">
                                            <svg
                                                 xmlns="http://www.w3.org/2000/svg"
                                                 width="24"
                                                 height="24"
                                                 viewBox="0 0 24 24"
                                                 fill="none"
                                                 stroke="currentColor"
                                                 stroke-width="4"
                                                 stroke-linecap="round"
                                                 stroke-linejoin="round"

                                                 >
                                                <polyline points="20 6 9 17 4 12"></polyline>
                                            </svg>
                                        </div>
                                    </div>
                                    <div class="dropdown-option-text">25</div>
                                </a>
                                <a href="#" class="dropdown-option-simple w-inline-block" tabindex="0">
                                    <div class="dropdown-option-selected-icon-container">
                                        <div class="dropdown-option-selected-icon w-embed">
                                            <svg
                                                 xmlns="http://www.w3.org/2000/svg"
                                                 width="24"
                                                 height="24"
                                                 viewBox="0 0 24 24"
                                                 fill="none"
                                                 stroke="currentColor"
                                                 stroke-width="4"
                                                 stroke-linecap="round"
                                                 stroke-linejoin="round"

                                                 >
                                                <polyline points="20 6 9 17 4 12"></polyline>
                                            </svg>
                                        </div>
                                    </div>
                                    <div class="dropdown-option-text">50</div>
                                </a>
                                <a href="#" class="dropdown-option-simple w-inline-block" tabindex="0">
                                    <div class="dropdown-option-selected-icon-container">
                                        <div class="dropdown-option-selected-icon w-embed">
                                            <svg
                                                 xmlns="http://www.w3.org/2000/svg"
                                                 width="24"
                                                 height="24"
                                                 viewBox="0 0 24 24"
                                                 fill="none"
                                                 stroke="currentColor"
                                                 stroke-width="4"
                                                 stroke-linecap="round"
                                                 stroke-linejoin="round"

                                                 >
                                                <polyline points="20 6 9 17 4 12"></polyline>
                                            </svg>
                                        </div>
                                    </div>
                                    <div class="dropdown-option-text">100</div>
                                </a>
                            </div>
                        </nav>
                    </div>
                    <div class="paginaton-total-items">
                        <div>1–10 of 103 items<br></div>
                    </div>
                </div>
            </div>
            <div class="pagination-right">
                <div class="pagination-pages-dropdown">
                    <div data-hover="false" data-delay="0" class="dropdown w-dropdown">
                        <div
                             class="dropdown-closed table-filter w-dropdown-toggle"
                             id="w-dropdown-toggle-11"
                             aria-controls="w-dropdown-list-11"
                             aria-haspopup="menu"
                             aria-expanded="false"
                             role="button"
                             tabindex="0"
                             >
                            <div class="filter-dropdown-arrow w-icon-dropdown-toggle" aria-hidden="true"></div>
                            <div class="dropdown-text-content">1</div>
                        </div>
                        <nav
                             class="dropdown-open top-right w-dropdown-list"
                             id="w-dropdown-list-11"
                             aria-labelledby="w-dropdown-toggle-11"
                             >
                            <div class="dropdown-option-container">
                                <a href="#" class="dropdown-option-simple w-inline-block" tabindex="0">
                                    <div class="dropdown-option-selected-icon-container">
                                        <div class="dropdown-option-selected-icon w-embed">
                                            <svg
                                                 xmlns="http://www.w3.org/2000/svg"
                                                 width="24"
                                                 height="24"
                                                 viewBox="0 0 24 24"
                                                 fill="none"
                                                 stroke="currentColor"
                                                 stroke-width="2"
                                                 stroke-linecap="round"
                                                 stroke-linejoin="round"

                                                 >
                                                <polyline points="20 6 9 17 4 12"></polyline>
                                            </svg>
                                        </div>
                                    </div>
                                    <div class="dropdown-option-text">1</div>
                                </a>
                                <a href="#" class="dropdown-option-simple w-inline-block" tabindex="0">
                                    <div class="dropdown-option-selected-icon-container">
                                        <div class="dropdown-option-selected-icon selected w-embed">
                                            <svg
                                                 xmlns="http://www.w3.org/2000/svg"
                                                 width="24"
                                                 height="24"
                                                 viewBox="0 0 24 24"
                                                 fill="none"
                                                 stroke="currentColor"
                                                 stroke-width="4"
                                                 stroke-linecap="round"
                                                 stroke-linejoin="round"

                                                 >
                                                <polyline points="20 6 9 17 4 12"></polyline>
                                            </svg>
                                        </div>
                                    </div>
                                    <div class="dropdown-option-text">2</div>
                                </a>
                                <a href="#" class="dropdown-option-simple w-inline-block" tabindex="0">
                                    <div class="dropdown-option-selected-icon-container">
                                        <div class="dropdown-option-selected-icon w-embed">
                                            <svg
                                                 xmlns="http://www.w3.org/2000/svg"
                                                 width="24"
                                                 height="24"
                                                 viewBox="0 0 24 24"
                                                 fill="none"
                                                 stroke="currentColor"
                                                 stroke-width="4"
                                                 stroke-linecap="round"
                                                 stroke-linejoin="round"

                                                 >
                                                <polyline points="20 6 9 17 4 12"></polyline>
                                            </svg>
                                        </div>
                                    </div>
                                    <div class="dropdown-option-text">3</div>
                                </a>
                                <a href="#" class="dropdown-option-simple w-inline-block" tabindex="0">
                                    <div class="dropdown-option-selected-icon-container">
                                        <div class="dropdown-option-selected-icon w-embed">
                                            <svg
                                                 xmlns="http://www.w3.org/2000/svg"
                                                 width="24"
                                                 height="24"
                                                 viewBox="0 0 24 24"
                                                 fill="none"
                                                 stroke="currentColor"
                                                 stroke-width="4"
                                                 stroke-linecap="round"
                                                 stroke-linejoin="round"

                                                 >
                                                <polyline points="20 6 9 17 4 12"></polyline>
                                            </svg>
                                        </div>
                                    </div>
                                    <div class="dropdown-option-text">3</div>
                                </a>
                            </div>
                        </nav>
                    </div>
                    <div>of 11 pages</div>
                </div>
                <div class="pagination-button">
                    <div class="pagination-icon w-embed">
                        <svg
                             fill="currentColor"
                             xmlns="http://www.w3.org/2000/svg"
                             width="32"
                             height="32"
                             viewBox="0 0 32 32"
                             xml:space="preserve"
                             >
                            <polygon points="20,24 10,16 20,8 "></polygon>
                        </svg>
                    </div>
                </div>
                <div class="pagination-button">
                    <div class="pagination-icon w-embed">
                        <svg
                             version="1.1"
                             fill="currentColor"
                             xmlns="http://www.w3.org/2000/svg"
                             width="32px"
                             height="32px"
                             viewBox="0 0 32 32"
                             xml:space="preserve"
                             >
                            <polygon points="12,8 22,16 12,24 "></polygon>
                        </svg>
                    </div>
                </div>
            </div>
        </div>
    </div>
</form>
```