This Documentation is Moved!

This is currently being depreciated. Please visited the new location for the styleguide at https://assets.acc.org/Arches/Latest/docs/

Arches: Virtual ACC

Arches:Virtual ACC

Multi Product Brand Style System by the American College of Cardiology

Source: dist/css/virtual_boot.css, line 10799

8.3.3 No Results

experimental

When the search returns no results or the user has filters all results away.

EXPERIMENTAL: this design is new

Sub.CollapseIcon.NoText - Collapse Icon Sub.Search.Faceted - Search Facet Group Sub.Search.Bar - Search Bar Sub.Search.ResultOverview - Search Result Overview Sub.Pagination - Pagination Program.Session.NoResults - No Result Response
Sub Components in Design:

    Example

    Program

    • OH NO! We couldn't find any results for your search.

      Search Help

      It is easy to search for a session, but its also easy to have a typo. Check your spelling and try again.


      Click the `Clear Search` button to return to all sessions.

    NOTE:
    Note that this page design is supposed to be full screen so in the documentation it might collapse incorrectly or seem too crunched.
    <div class="flex flex_row:md flex_column-reverse gap_4">
        <div class="flex_auto flex_100 max-w_20:lg" id="FilterNavContainer">
            <aside class="bg_black-1 p_3 br_radius shadow_emboss-light m-b_2 sticky:lg t_3:lg">
                <h3 class="flex flex_row font_2 font_display c_primary font_medium items_center m-b_0 m-l_3"><span class="flex flex_auto">Filters</span>
                <span class="">
                <div class="toggle user-select_none" data-bs-toggle="collapse" data-bs-target="#CollapseFacetGroupContainerID" role="button" aria-expanded="true" aria-controls="#CollapseFacetGroupContainerID">
                        <span class="fa-stack">
                        <i class="fas fa-square fa-stack-2x"></i>
                        <i class="fas fa-minus fa-stack-1x c_white"></i>
                        <i class="fas fa-minus rotate_90 a:rotation fa-stack-1x  c_white"></i>
                        </span>
                </div>            </span>
                </h3>
                <ul class="ul_none collapse show block:md" id="CollapseFacetGroupContainerID">
                    <li data-name="library-search-facet" class="bg_white-8 br_radius m-t_3 p_3  max-w_20:md br-b_2 br_0 br_primary-3 br_solid shadow_overlap-light" >
                        <header class="flex font-size_up m-y_2">
                            <div class="flex_auto  self_center p-l_0 lh_1 font-size_up font_medium">Primary Category </div>
                             <div class="c_primary-n2 flex flex_nowrap flex_row font-size_down h:c_primary-n3 h:opacity h:undecorated items_center lh_1 m-l_auto opacity_5 self_center toggle user-select_none p-l_4" data-bs-toggle="collapse" data-bs-target="#CollapseFacetGroupPrimaryID" role="button" aria-expanded="true" aria-controls="#CollapseFacetGroupPrimaryID">
                               <div class="flex_none self_center"> collapse </div>
                               <div class="flex_none" >
                                   <span class="fa-stack">
                                     <i class="fas fa-minus fa-stack-1x"></i>
                                     <i class="fas fa-minus rotate_90 a:rotation fa-stack-1x "></i>
                                   </span>
                               </div>
                             </div>    </header>
                        <main id="CollapseFacetGroupPrimaryID" class="p_1 collapse show" style="">
                            <ul class="p-y_3 ul_none br-t_1 br-b_1 br_primary-3 transition_3 br_solid">
                                <li class="m-y_2">
                                    <div class="input flex user-select_none relative h:bg_black-1 br_radius">
                                        <div class="flex_none p-l_3 p-r_3 self_center"><input type="checkbox" name="checkfacet_7835" id="checkfacet_7835" class="font-size_up"></div>
                                        <div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_7835" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_7835ut nobis est<small class="flex_auto p-l_2 font_light c_accent font-size_down-1">58</small></span></label></div>
                                        <!---->
                                    </div>
                                </li>            <li class="m-y_2">
                                    <div class="input flex user-select_none relative h:bg_black-1 br_radius">
                                        <div class="flex_none p-l_3 p-r_3 self_center"><input type="checkbox" name="checkfacet_0300" id="checkfacet_0300" class="font-size_up"></div>
                                        <div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_0300" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_0300ut nobis est<small class="flex_auto p-l_2 font_light c_accent font-size_down-1">58</small></span></label></div>
                                        <!---->
                                    </div>
                                </li>            <li class="m-y_2">
                                    <div class="input flex user-select_none relative h:bg_black-1 br_radius">
                                        <div class="flex_none p-l_3 p-r_3 self_center"><input type="checkbox" name="checkfacet_0849" id="checkfacet_0849" class="font-size_up"></div>
                                        <div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_0849" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_0849ut nobis est<small class="flex_auto p-l_2 font_light c_accent font-size_down-1">58</small></span></label></div>
                                        <!---->
                                    </div>
                                </li>            <li class="m-y_2">
                                    <div class="input flex user-select_none relative h:bg_black-1 br_radius">
                                        <div class="flex_none p-l_3 p-r_3 self_center"><input type="checkbox" name="checkfacet_8490" id="checkfacet_8490" class="font-size_up"></div>
                                        <div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_8490" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_8490ut nobis est<small class="flex_auto p-l_2 font_light c_accent font-size_down-1">58</small></span></label></div>
                                        <!---->
                                    </div>
                                </li>            <li class="m-y_2">
                                    <div class="input flex user-select_none relative h:bg_black-1 br_radius">
                                        <div class="flex_none p-l_3 p-r_3 self_center"><input type="checkbox" name="checkfacet_8066" id="checkfacet_8066" class="font-size_up"></div>
                                        <div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_8066" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_8066ut nobis est<small class="flex_auto p-l_2 font_light c_accent font-size_down-1">58</small></span></label></div>
                                        <!---->
                                    </div>
                                </li>        </ul>
                            <footer class="text_center font-size_down c_primary-n1 p-t_3"><span class="cursor_not-allowed c_black-3">less</span><span class="c_primary"> | </span><span class="link h:underline h:black link h:underline h:black cursor_pointer">more</span></footer>
                        </main>
                    </li>                <li data-name="library-search-facet" class="bg_white-8 br_radius m-t_3 p_3  max-w_20:md br-b_2 br_0 br_primary-3 br_solid shadow_overlap-light" >
                        <header class="flex font-size_up m-y_2">
                            <div class="flex_auto  self_center p-l_0 lh_1 font-size_up font_medium">Drugs Generic </div>
                              <div class="c_primary-n2 flex flex_nowrap flex_row font-size_down h:c_primary-n3 h:opacity h:undecorated items_center lh_1 m-l_auto opacity_5 self_center toggle user-select_none p-l_4" data-bs-toggle="collapse" data-bs-target="#CollapseFacetGroupID" role="button" aria-expanded="true" aria-controls="#CollapseFacetGroupID">
                                <div class="flex_none self_center"> collapse </div>
                                <div class="flex_none" >
                                    <span class="fa-stack">
                                      <i class="fas fa-minus fa-stack-1x"></i>
                                      <i class="fas fa-minus rotate_90 a:rotation fa-stack-1x "></i>
                                    </span>
                                </div>
                              </div>    </header>
                        <main id="CollapseFacetGroupID" class="p_1 collapse show" style="">
                            <ul class="p-y_3 ul_none br-t_1 br-b_1 br_primary-3 transition_3 br_solid">
                                <li class="m-y_2">
                                    <div class="input flex user-select_none relative h:bg_black-1 br_radius">
                                        <div class="flex_none p-l_3 p-r_3 self_center"><input type="checkbox" name="checkfacet_7685" id="checkfacet_7685" class="font-size_up"></div>
                                        <div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_7685" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_7685ut nobis est<small class="flex_auto p-l_2 font_light c_accent font-size_down-1">58</small></span></label></div>
                                        <!---->
                                    </div>
                                </li>            <li class="m-y_2">
                                    <div class="input flex user-select_none relative h:bg_black-1 br_radius">
                                        <div class="flex_none p-l_3 p-r_3 self_center"><input type="checkbox" name="checkfacet_6336" id="checkfacet_6336" class="font-size_up"></div>
                                        <div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_6336" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_6336ut nobis est<small class="flex_auto p-l_2 font_light c_accent font-size_down-1">58</small></span></label></div>
                                        <!---->
                                    </div>
                                </li>            <li class="m-y_2">
                                    <div class="input flex user-select_none relative h:bg_black-1 br_radius">
                                        <div class="flex_none p-l_3 p-r_3 self_center"><input type="checkbox" name="checkfacet_9112" id="checkfacet_9112" class="font-size_up"></div>
                                        <div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_9112" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_9112ut nobis est<small class="flex_auto p-l_2 font_light c_accent font-size_down-1">58</small></span></label></div>
                                        <!---->
                                    </div>
                                </li>            <li class="m-y_2">
                                    <div class="input flex user-select_none relative h:bg_black-1 br_radius">
                                        <div class="flex_none p-l_3 p-r_3 self_center"><input type="checkbox" name="checkfacet_5420" id="checkfacet_5420" class="font-size_up"></div>
                                        <div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_5420" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_5420ut nobis est<small class="flex_auto p-l_2 font_light c_accent font-size_down-1">58</small></span></label></div>
                                        <!---->
                                    </div>
                                </li>            <li class="m-y_2">
                                    <div class="input flex user-select_none relative h:bg_black-1 br_radius">
                                        <div class="flex_none p-l_3 p-r_3 self_center"><input type="checkbox" name="checkfacet_2677" id="checkfacet_2677" class="font-size_up"></div>
                                        <div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_2677" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_2677ut nobis est<small class="flex_auto p-l_2 font_light c_accent font-size_down-1">58</small></span></label></div>
                                        <!---->
                                    </div>
                                </li>        </ul>
                            <footer class="text_center font-size_down c_primary-n1 p-t_3"><span class="cursor_not-allowed c_black-3">less</span><span class="c_primary"> | </span><span class="link h:underline h:black link h:underline h:black cursor_pointer">more</span></footer>
                        </main>
                    </li>                <li data-name="library-search-facet" class="bg_white-8 br_radius m-t_3 p_3  max-w_20:md br-b_2 br_0 br_primary-3 br_solid shadow_overlap-light" >
                        <header class="flex font-size_up m-y_2">
                            <div class="flex_auto  self_center p-l_0 lh_1 font-size_up font_medium">Drugs Generic </div>
                              <div class="c_primary-n2 flex flex_nowrap flex_row font-size_down h:c_primary-n3 h:opacity h:undecorated items_center lh_1 m-l_auto opacity_5 self_center toggle user-select_none p-l_4" data-bs-toggle="collapse" data-bs-target="#CollapseFacetGroupID" role="button" aria-expanded="true" aria-controls="#CollapseFacetGroupID">
                                <div class="flex_none self_center"> collapse </div>
                                <div class="flex_none" >
                                    <span class="fa-stack">
                                      <i class="fas fa-minus fa-stack-1x"></i>
                                      <i class="fas fa-minus rotate_90 a:rotation fa-stack-1x "></i>
                                    </span>
                                </div>
                              </div>    </header>
                        <main id="CollapseFacetGroupID" class="p_1 collapse show" style="">
                            <ul class="p-y_3 ul_none br-t_1 br-b_1 br_primary-3 transition_3 br_solid">
                                <li class="m-y_2">
                                    <div class="input flex user-select_none relative h:bg_black-1 br_radius">
                                        <div class="flex_none p-l_3 p-r_3 self_center"><input type="checkbox" name="checkfacet_7685" id="checkfacet_7685" class="font-size_up"></div>
                                        <div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_7685" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_7685ut nobis est<small class="flex_auto p-l_2 font_light c_accent font-size_down-1">58</small></span></label></div>
                                        <!---->
                                    </div>
                                </li>            <li class="m-y_2">
                                    <div class="input flex user-select_none relative h:bg_black-1 br_radius">
                                        <div class="flex_none p-l_3 p-r_3 self_center"><input type="checkbox" name="checkfacet_6336" id="checkfacet_6336" class="font-size_up"></div>
                                        <div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_6336" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_6336ut nobis est<small class="flex_auto p-l_2 font_light c_accent font-size_down-1">58</small></span></label></div>
                                        <!---->
                                    </div>
                                </li>            <li class="m-y_2">
                                    <div class="input flex user-select_none relative h:bg_black-1 br_radius">
                                        <div class="flex_none p-l_3 p-r_3 self_center"><input type="checkbox" name="checkfacet_9112" id="checkfacet_9112" class="font-size_up"></div>
                                        <div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_9112" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_9112ut nobis est<small class="flex_auto p-l_2 font_light c_accent font-size_down-1">58</small></span></label></div>
                                        <!---->
                                    </div>
                                </li>            <li class="m-y_2">
                                    <div class="input flex user-select_none relative h:bg_black-1 br_radius">
                                        <div class="flex_none p-l_3 p-r_3 self_center"><input type="checkbox" name="checkfacet_5420" id="checkfacet_5420" class="font-size_up"></div>
                                        <div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_5420" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_5420ut nobis est<small class="flex_auto p-l_2 font_light c_accent font-size_down-1">58</small></span></label></div>
                                        <!---->
                                    </div>
                                </li>            <li class="m-y_2">
                                    <div class="input flex user-select_none relative h:bg_black-1 br_radius">
                                        <div class="flex_none p-l_3 p-r_3 self_center"><input type="checkbox" name="checkfacet_2677" id="checkfacet_2677" class="font-size_up"></div>
                                        <div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_2677" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_2677ut nobis est<small class="flex_auto p-l_2 font_light c_accent font-size_down-1">58</small></span></label></div>
                                        <!---->
                                    </div>
                                </li>        </ul>
                            <footer class="text_center font-size_down c_primary-n1 p-t_3"><span class="cursor_not-allowed c_black-3">less</span><span class="c_primary"> | </span><span class="link h:underline h:black link h:underline h:black cursor_pointer">more</span></footer>
                        </main>
                    </li>            </ul>
            </aside>
        </div>
        <div class="flex flex_auto flex_column isolation_isolate" id="SearchBarTop">
            <div class=" sticky jump-buttons_top  r_0 z_1">
            <div class="absolute r_4 t_0  flex flex_row flex_nowrap gap-x_3">
            <!--  Helper Jump links -->
              <a class="br-tl_square br-tr_square br_radius btn btn-accent btn-sm grid items_center justify_center m-l_auto self_center shadow_3" href="#SearchBarTop">
              <span><i class="fas fa-arrow-up"></i><i class="m-l_2 fas fa-search"></i></span>
              </a>
              <a href="#FilterNavContainer" class="br-tl_square br-tr_square br_radius btn btn-accent btn-sm display_none:md grid items_center justify_center m-l_auto self_center shadow_3">
              <span><i class="fas fa-arrow-down"></i><i class="m-l_2 fas fa-filter"></i></span>
              </a>
            <!--  Helper Jump links -->
            </div>
            </div>
            <div class="bg_white br_radius p_4:lg p_3 shadow_overlap-light z_2 relative" >
                <h1 class="c_primary-n1 font_display m-b_3 m-t_0 flex flex_row justify_between"><span>Program</span>
                  <a href="#FilterNavContainer" class="absolute br-tl_square br-tr_square br_radius btn btn-accent btn-sm display_none:md flex_none grid items_center justify_center m-l_auto r_3 self_center t_0">
                  <span><i class="fas fa-arrow-down"></i><i class="fas fa-filter"></i></span>
                  </a>
                </h1>
                <div class="flex_row flex gap-x_3">
                  <div class="input-holder flex_auto flex flex_row self_end relative w_100">
                      <input id="input_uniqueTextAnda" name="input_uniqueTextAnda" type="text" placeholder="Search" class=" br_2 flex_auto p-y_2 br_solid flex_auto p-l_4 lh_3 br_radius bg_white c_black bg_white f:bg_primary br_black-2 font_2:lg font_1:md font_0">
                      <button class="absolute b_0 br-bl_square br-tl_square btn btn-primary flex_none grid items_center justify_center r_0 t_0" onClick="Search()">
                      <i class="fas fa-search"></i>
                      </button>
                  </div>
                  <button class="disabled flex_none grid items_center justify_center btn btn-alert">
                    <i class="fas fa-times"></i>
                  </button>
                </div>
            </div>        <div class="c_secondary-n1 font_medium font-size_down-2 font_ui p_2 m-t_3 m-b_2">
              <ul class="ul_inline-pipe">
                  <li>
                    <ul class="ul_inline-comma">
                        <li class="font_bold   no-after uppercase">Results:</li>
                        <li class="c_accent-n1">230</li>
                    </ul>
                  </li>
                  <li>
                    <ul class="ul_inline-comma">
                        <li class="font_bold no-after uppercase">Filters:</li>
                        <li><a class="h:underline c_primary-n1 c_primary-n2">Category A <i class="fas fa-times c_alert-n1 p_2"></i></a></li>
                        <li><a class="h:underline c_primary-n1 c_primary-n2">Tag B  <i class="fas fa-times c_alert-n1 p_2"></i></a></li>
                        <li><a class="h:underline c_primary-n1 c_primary-n2">Tag C <i class="fas fa-times c_alert-n1 p_2"></i></a></li>
                    </ul>
                  </li>
              </ul>
            </div>        <ul class="bg_black-1 br_radius flex flex_column m-y_3 m-y_4:lg p_3 shadow_emboss-light ul_none z_0">
                <li> <article class="c_black font_0 br-t_3 br_solid br_radius isolation_isolate shadow_overlap-light bg_white br_black-4 bg_warning-n1 m-y_5 m-x_3">
        <div class="br_1 br-b_0 br-tr_radius br-tl_radius br_solid br_black-3 flex flex_column font_ui m-t_n2 relative">
            <div class="br-b_1 br_solid br_black-4" >
                <div class="p_4 p-b_2 flex flex_column flex_row:lg gap-x_4 gap-x_5:lg">
                    <header class="c_white">
                        <h2 class="font_2  c_white font_display font_bold lh_1">
                           <span class="font-size_up-2 block uppercase"><i class="fas fa-exclamation-triangle"></i> OH NO!</span>
                           <span class="font-size_down inline-block lh_0 m-t_2">We couldn't find any results for your search.</span>
                        </h2>
                        <h3 class="font_0 font_bold font_copy lh_0 m-b_2 m-t_4 uppercase">Search Help</h3>
                        <p class="font_copy m-b_4 lh_2 font_0">
                        It is easy to search for a session, but its also easy to have a typo. Check your spelling and try again.
                        <hr>
                        Click the `Clear Search` button to return to all sessions.
                        </p>
                    </header>
                    <div class="flex_grow m-x_auto m-l_auto:lg m-r_0:lg w_100 max-w_10:md flex flex_column items_center justify_center">
                        <aside class="flex flex_none flex_column gap-y_3 m-l_auto:md  max-w_30:md p-b_4 p-b_4:md w_100">
                              <nav aria-label="session actions" class="flex flex_none flex_row gap-x_2 gap-y_3 justify_between">
                                <a href="#" aria-label="navigate to" class="br_1 br_solid br_white-3 btn btn-secondary flex_auto shadow_overlap-light">Clear Search <i class="fas fa-times p-l_3"></i></a>
                              </nav>
                        </aside>                </div>
                </div>
            </div>
        </div>
        <div class="c_black flex flex_wrap font_n3 justify_start p_3 br-br_radius br-bl_radius bg_warning-n3 br_solid br_1 br-t_0 br_black-3">
        </div>
    </article></li>
            </ul>
            <nav aria-label="Pagination" class="flex flex_row p-b_5:lg p-b_4">
                <ul class="pagination flex flex_row ul_none justify_stretch relative lh_0 font_n1 font_medium m-x_auto shadow_bevel-light br_radius overflow_hidden">
                    <li class="flex pagination-previous ">
                        <a class="ease_out transition_1 f:outline_none h:undecorated a:bg_accent-n3 a:c_white c_black-7 h:c_black text_center inline-block w_auto cursor_pointer br-tl_radius br-bl_radius overflow_hidden br_square br-l_1 br_solid br_1 br_black-3 bg_white h:bg_black-3 p-y_3 p-x_3" style="min-height: unset;">
                            <div class="flex block justify_center flex_column ">
                                <div class="flex_auto self_center justify_center flex">
                                    <div class="flex flex_row nowrap"><i class="fas fa-arrow-left p-r_3 self_center"></i> <span class="show-for-sr display_none inline:md self_center">Prev</span></div>
                                </div>
                            </div>
                        </a>
                    </li>
                    <!---->
                    <li class="flex">
                        <a class="ease_out transition_1 f:outline_none h:undecorated a:bg_accent-n3 a:c_white c_black-7 h:c_black text_center inline-block w_auto cursor_pointer  br_square br-l_1 br_solid br_1 br_black-3 bg_white h:bg_black-3 p-y_3 p-x_3" style="min-height: unset;">
                            <div class="flex block justify_center flex_column ">
                                <div class="flex_auto self_center justify_center flex"><i class="fas  fa-ellipsis-h left"></i></div>
                            </div>
                        </a>
                    </li>
                    <li class="flex">
                        <a class="ease_out transition_1 f:outline_none h:undecorated a:bg_accent-n3 a:c_white c_black-7 h:c_black text_center inline-block w_auto cursor_pointer  br_square br-l_1 br_solid br_1 br_black-3 bg_white h:bg_black-3 p-y_3 p-x_3" style="min-height: unset;">
                            <div class="flex block justify_center flex_column ">
                                <div class="flex_auto self_center justify_center flex">50 </div>
                            </div>
                        </a>
                    </li>
                    <li class="flex">
                        <a class="active ease_out transition_1 f:outline_none h:undecorated a:bg_accent-n3 a:c_white c_black-7 h:c_black text_center inline-block w_auto cursor_pointer  br_square br-l_1 br_solid br_1 br_black-3 bg_white h:bg_black-3 p-y_3 p-x_3" style="min-height: unset;">
                            <div class="flex block justify_center flex_column ">
                                <div class="flex_auto self_center justify_center flex">51 </div>
                            </div>
                        </a>
                    </li>
                    <li class="flex">
                        <a class="ease_out transition_1 f:outline_none h:undecorated a:bg_accent-n3 a:c_white c_black-7 h:c_black text_center inline-block w_auto cursor_pointer  br_square br-l_1 br_solid br_1 br_black-3 bg_white h:bg_black-3 p-y_3 p-x_3" style="min-height: unset;">
                            <div class="flex block justify_center flex_column ">
                                <div class="flex_auto self_center justify_center flex">52 </div>
                            </div>
                        </a>
                    </li>
                    <li class="flex">
                        <a class="ease_out transition_1 f:outline_none h:undecorated a:bg_accent-n3 a:c_white c_black-7 h:c_black text_center inline-block w_auto cursor_pointer  br_square br-l_1 br_solid br_1 br_black-3 bg_white h:bg_black-3 p-y_3 p-x_3" style="min-height: unset;">
                            <div class="flex block justify_center flex_column ">
                                <div class="flex_auto self_center justify_center flex">53 </div>
                            </div>
                        </a>
                    </li>
                    <li class="flex">
                        <a class="ease_out transition_1 f:outline_none h:undecorated a:bg_accent-n3 a:c_white c_black-7 h:c_black text_center inline-block w_auto cursor_pointer  br_square br-l_1 br_solid br_1 br_black-3 bg_white h:bg_black-3 p-y_3 p-x_3" style="min-height: unset;">
                            <div class="flex block justify_center flex_column ">
                                <div class="flex_auto self_center justify_center flex">54 </div>
                            </div>
                        </a>
                    </li>
                    <li class="flex">
                        <a class="ease_out transition_1 f:outline_none h:undecorated a:bg_accent-n3 a:c_white c_black-7 h:c_black text_center inline-block w_auto cursor_pointer  br_square br-l_1 br_solid br_1 br_black-3 bg_white h:bg_black-3 p-y_3 p-x_3" style="min-height: unset;">
                            <div class="flex block justify_center flex_column ">
                                <div class="flex_auto self_center justify_center flex"><i class="fas  fa-ellipsis-h right"></i></div>
                            </div>
                        </a>
                    </li>
                    <!---->
                    <li class="flex pagination-next">
                        <a class="ease_out transition_1 f:outline_none h:undecorated a:bg_accent-n3 a:c_white c_black-7 h:c_black text_center inline-block w_auto cursor_pointer  br-tr_radius br-br_radius overflow_hidden br_square br-l_1 br_solid br_1 br_black-3 bg_white h:bg_black-3 p-y_3 p-x_3" aria-label="Next Page" style="min-height: unset;">
                            <div class="flex block justify_center flex_column ">
                                <div class="flex_auto self_center justify_center flex">
                                    <div class="flex flex_row nowrap"><span class="show-for-sr display_none inline:md self_center">Next</span> <i class="fas fa-arrow-right p-l_3 self_center"></i></div>
                                </div>
                            </div>
                        </a>
                    </li>
                </ul>
            </nav>    </div>
    </div>
    Copy Code