.xxx-sort {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  padding-top: 5px;
  padding-bottom: 20px;
  font-size: 14px;
  line-height: 17px;
}

.xxx-sort__nav {
    display: flex;
}

.xxx-sort__nav > * {
    position: relative;
}

.xxx-sort__nav > *:not(:last-child) {
  margin-right: 20px;
}

.xxx-sort__nav > *:not(:first-child) {
    margin-left: 20px;
}

.xxx-sort__nav > *:not(:first-child)::before {
    position: absolute;
    left: -20px;
    pointer-events: none;
    content: '|';
    margin-right: 20px;
    color: #F1F4F7;
}

.xxx-sort__count {
  color: #9299A2;
}

.xxx-sort__nav .xxx-sort--on {
    color: #333E50;
}

.xxx-sort__nav .xxx-sort--on::after {
    content: none;
}