.sb-text-dark .sb-text-white .button-arrow,
.sb-text-white .button-arrow,
.sb-text-white .sb-text-dark .sb-text-white .button-arrow {
  background-color: #fff
}

.sb-text-dark .sb-text-white .button-arrow:hover,
.sb-text-white .button-arrow:hover,
.sb-text-white .sb-text-dark .sb-text-white .button-arrow:hover {
  background-color: hsla(0, 0%, 100%, .8)
}

.sb-text-dark .sb-text-white .button-arrow-icon,
.sb-text-white .button-arrow-icon,
.sb-text-white .sb-text-dark .sb-text-white .button-arrow-icon {
  color: #111;
  opacity: .48
}

.sb-text-dark .button-arrow,
.sb-text-dark .sb-text-white .sb-text-dark .button-arrow,
.sb-text-white .sb-text-dark .button-arrow {
  background-color: rgba(17, 17, 17, .04)
}

.sb-text-dark .button-arrow:hover,
.sb-text-dark .sb-text-white .sb-text-dark .button-arrow:hover,
.sb-text-white .sb-text-dark .button-arrow:hover {
  background-color: rgba(17, 17, 17, .16)
}

.sb-text-dark .button-arrow:hover .button-arrow-icon,
.sb-text-dark .sb-text-white .sb-text-dark .button-arrow:hover .button-arrow-icon,
.sb-text-white .sb-text-dark .button-arrow:hover .button-arrow-icon {
  opacity: .88
}

.sb-text-dark .button-arrow_white-arrow,
.sb-text-dark .sb-text-white .sb-text-dark .button-arrow_white-arrow,
.sb-text-white .sb-text-dark .button-arrow_white-arrow {
  background-color: rgba(0, 0, 0, .25)
}

.sb-text-dark .button-arrow_white-arrow .button-arrow-icon,
.sb-text-dark .sb-text-white .sb-text-dark .button-arrow_white-arrow .button-arrow-icon,
.sb-text-white .sb-text-dark .button-arrow_white-arrow .button-arrow-icon {
  color: #fff;
  opacity: 1
}

.sb-text-dark .button-arrow-icon,
.sb-text-dark .sb-text-white .sb-text-dark .button-arrow-icon,
.sb-text-white .sb-text-dark .button-arrow-icon {
  color: #111;
  opacity: .56
}

.button-arrow {
  position: relative;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 100%;
  cursor: pointer;
  transition: background-color .3s
}

.button-arrow_next {
  transform: rotate(180deg)
}

.button-arrow-icon {
  width: 12px;
  height: 12px;
  transition: opacity .3s
}
