.dropdown-pagination {
  align-items: center;
  display: flex;
  justify-content: center;
  margin-top: 60px !important;
}
.dropdown-pagination .btn {
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 5px;
  color: #ccc;
  padding: 18px 25px;
  text-decoration: none;
}
.dropdown-pagination select,
.dropdown-pagination .select-selected {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: #fff
    url("data:image/svg+xml;utf8,<svg viewBox=%270 0 140 140%27 width=%2713%27 height=%2724%27 xmlns=%27http://www.w3.org/2000/svg%27><g><path d=%27m121.3,34.6c-1.6-1.6-4.2-1.6-5.8,0l-51,51.1-51.1-51.1c-1.6-1.6-4.2-1.6-5.8,0-1.6,1.6-1.6,4.2 0,5.8l53.9,53.9c0.8,0.8 1.8,1.2 2.9,1.2 1,0 2.1-0.4 2.9-1.2l53.9-53.9c1.7-1.6 1.7-4.2 0.1-5.8z%27 fill=%27grey%27/></g></svg>")
    no-repeat;
  background-position: right 10px top 50%;
  border: 1px solid #ddd;
  border-radius: 5px;
  font-size: 14px;
  font-weight: 400;
  margin: 0 10px;
  padding: 21px 0;
  text-align: center;
  width: 200px;
}
.dropdown-pagination .btn.disabled {
  background: #f2f2f2;
  cursor: unset;
  opacity: 0.6;
}

/*the container must be positioned relative:*/
.dropdown-pagination {
  position: relative;
  font-family: Arial;
}

.dropdown-pagination select {
  display: none; /*hide original SELECT element:*/
}

.select-selected {
  background: #fff
    url("data:image/svg+xml;utf8,<svg viewBox=%270 0 140 140%27 width=%2713%27 height=%2724%27 xmlns=%27http://www.w3.org/2000/svg%27><g><path d=%27m121.3,34.6c-1.6-1.6-4.2-1.6-5.8,0l-51,51.1-51.1-51.1c-1.6-1.6-4.2-1.6-5.8,0-1.6,1.6-1.6,4.2 0,5.8l53.9,53.9c0.8,0.8 1.8,1.2 2.9,1.2 1,0 2.1-0.4 2.9-1.2l53.9-53.9c1.7-1.6 1.7-4.2 0.1-5.8z%27 fill=%27grey%27/></g></svg>")
    right 10px top 50% no-repeat;
}

/*style the arrow inside the select element:*/
.select-selected:after {
  position: absolute;
  content: "";
  top: 14px;
  right: 10px;
  width: 0;
  height: 0;
  border: 6px solid transparent;
  /* border-color: #fff transparent transparent transparent; */
}

/*point the arrow upwards when the select box is open (active):*/
.select-selected.select-arrow-active:after {
  /* border-color: transparent transparent #fff transparent; */
  top: 7px;
}

/*style the items (options), including the selected item:*/
.select-items div,
.select-selected {
  color: #000000;
  padding: 8px 16px;
  border: 1px solid transparent;
  cursor: pointer;
  user-select: none;
}

/*style items (options):*/
.select-items {
  width: 200px;
  background-color: #ffffff;
  font-size: 14px;
  font-weight: 400;
  margin: 0 10px;
  padding: 21px 0;
  text-align: center;
  position: absolute;
  top: 100%;
  left: 0;
  right: 0;
  z-index: 99;
}

/*hide the items when the select box is closed:*/
.select-hide {
  display: none;
}

.select-items div:hover,
.same-as-selected {
  background-color: rgba(0, 0, 0, 0.1);
}

.dropdown-pagination .dropdown-pagination__dropdown {
  position: relative;
}