/*DEFAULT PAGINATOR*/
.paginator {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 30px auto;
}

.paginator a,
.paginator span {
  display: inline-block;
  padding: 8px 16px;
  border: 1px solid #cccccc;
  border-right: 0;
  color: #555555;
  font-weight: var(--weight-bold);
  text-decoration: none;
  transition-duration: 0.2s;
}

.paginator a:first-of-type {
  -webkit-border-radius: var(--radius-normal) 0 0 var(--radius-normal);
  -moz-border-radius: var(--radius-normal) 0 0 var(--radius-normal);
  border-radius: var(--radius-normal) 0 0 var(--radius-normal);
}

.paginator a:last-of-type {
  border-right: 1px solid #cccccc;
  -webkit-border-radius: 0 var(--radius-normal) var(--radius-normal) 0;
  -moz-border-radius: 0 var(--radius-normal) var(--radius-normal) 0;
  border-radius: 0 var(--radius-normal) var(--radius-normal) 0;
}

.paginator a:hover {
  background: var(--hover-color-green);
  background-size: 200%;
  color: #ff8927;
}

.paginator span {
  background: #cccccc;
}