Source: dist/css/virtual_boot.css, line
10668
8.3.3
No Results
experimental
When the search returns no results or the user has filters all results away.
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:
<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_5271" id="checkfacet_5271" class="font-size_up"></div>
<div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_5271" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_5271ut 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_3820" id="checkfacet_3820" class="font-size_up"></div>
<div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_3820" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_3820ut 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_0435" id="checkfacet_0435" class="font-size_up"></div>
<div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_0435" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_0435ut 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_9990" id="checkfacet_9990" class="font-size_up"></div>
<div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_9990" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_9990ut 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_3352" id="checkfacet_3352" class="font-size_up"></div>
<div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_3352" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_3352ut 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_7405" id="checkfacet_7405" class="font-size_up"></div>
<div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_7405" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_7405ut 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_2981" id="checkfacet_2981" class="font-size_up"></div>
<div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_2981" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_2981ut 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_1052" id="checkfacet_1052" class="font-size_up"></div>
<div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_1052" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_1052ut 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_8930" id="checkfacet_8930" class="font-size_up"></div>
<div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_8930" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_8930ut 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_6253" id="checkfacet_6253" class="font-size_up"></div>
<div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_6253" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_6253ut 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_7405" id="checkfacet_7405" class="font-size_up"></div>
<div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_7405" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_7405ut 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_2981" id="checkfacet_2981" class="font-size_up"></div>
<div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_2981" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_2981ut 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_1052" id="checkfacet_1052" class="font-size_up"></div>
<div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_1052" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_1052ut 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_8930" id="checkfacet_8930" class="font-size_up"></div>
<div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_8930" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_8930ut 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_6253" id="checkfacet_6253" class="font-size_up"></div>
<div class="flex_auto self_center p-l_2 p-y_2"><label for="checkfacet_6253" class="font-size_up lh_2 block"><span class="font_regular p-y_2 inline-block p-y_1:md"> facet_6253ut 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>