@use "sass:math";
/* media query mixin */
/* get rid of list formatting */
/* prevent long links from breaking out of container */
/* creates a colored circle with an icon in the middle */
/* formats the placeholder text within an input field */
.pager {
  display: flex;
  justify-content: center;
  gap: 10px;
  position: relative;
  margin: 0;
  padding: 0; }
  @media (max-width: 35.9375rem) {
    .pager {
      margin-top: 0 !important;
      margin-bottom: 155px !important; } }
  .pager li {
    font-size: 16px;
    text-transform: capitalize;
    display: block;
    height: 45px; }
    .pager li a,
    .pager li span {
      background: white;
      border: 1px solid #d5d5d5;
      width: 35px;
      height: 100%;
      display: flex;
      justify-content: center;
      align-items: center;
      color: #555;
      text-decoration: none; }
    .pager li a:hover {
      border: 2px solid #ffcf3e; }
    @media (max-width: 35.9375rem) {
      .pager li {
        flex: 1; }
        .pager li a,
        .pager li span {
          width: auto; } }
  .pager .pager--enabled a {
    border: 1px solid black;
    color: #2b2b2b; }
  .pager--first {
    margin-right: auto; }
    .pager--first a,
    .pager--first span {
      width: 120px !important;
      border-radius: 6.25rem; }
    .pager--first.pager--enabled a:hover {
      border: none;
      background: #2b2b2b !important;
      color: white; }
    @media (max-width: 74.9375rem) {
      .pager--first a,
      .pager--first span {
        width: 80px !important; } }
    @media (max-width: 35.9375rem) {
      .pager--first {
        position: absolute;
        bottom: -85px;
        left: 0;
        width: 100%; }
        .pager--first a,
        .pager--first span {
          width: 100% !important; } }
  .pager--last {
    margin-left: auto; }
    .pager--last a,
    .pager--last span {
      width: 120px !important;
      background: #ffcf3e !important;
      font-weight: bold;
      border-radius: 6.25rem;
      border: none !important; }
    .pager--last.pager--enabled a:hover {
      background: #ffe160 !important; }
    @media (max-width: 74.9375rem) {
      .pager--last a,
      .pager--last span {
        width: 80px !important; } }
    @media (max-width: 35.9375rem) {
      .pager--last {
        position: absolute;
        bottom: -155px;
        left: 0;
        width: 100%; }
        .pager--last a,
        .pager--last span {
          width: 100% !important; } }
  .pager .pager--arrow a {
    border: 1px solid black; }
  .pager .pager--arrow i:before {
    color: black; }
  .pager .pager--active span {
    border: 2px solid black;
    color: #2b2b2b;
    font-weight: bold; }

/*# sourceMappingURL=pager.css.map */
