.sk {
  padding: 0;
  margin: 0;
  font-size: 0;
  position: relative;
  left: 0;
  white-space: nowrap;
}
.sk li {
  font-size: initial;
  height: 100%;
  vertical-align: top;
  /* automatically center everything in scroller */
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

/* arrows */
.sk-arrow {
  position: absolute;
  top: calc(50% - 14px);
  padding-top: 100%;
  width: 28px;
  background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz48c3ZnIHZlcnNpb249IjEuMSIgaWQ9IkdlbmVyYWwiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIHg9IjBweCIgeT0iMHB4IiB2aWV3Qm94PSItMzAxIDM5MCA4IDE0IiBzdHlsZT0iZW5hYmxlLWJhY2tncm91bmQ6bmV3IC0zMDEgMzkwIDggMTQ7IiB4bWw6c3BhY2U9InByZXNlcnZlIj48c3R5bGUgdHlwZT0idGV4dC9jc3MiPi5zdDB7b3BhY2l0eTowLjg7ZmlsbDojODE4MTgxO308L3N0eWxlPjxwYXRoIGNsYXNzPSJzdDAiIGQ9Ik0tMjk5LjMsNDAzLjdsNi02YzAuMi0wLjIsMC4zLTAuNCwwLjMtMC43cy0wLjEtMC41LTAuMy0wLjdsLTYtNmMtMC4yLTAuMi0wLjQtMC4zLTAuNy0wLjNjLTAuNiwwLTEsMC40LTEsMWMwLDAuMywwLjEsMC41LDAuMywwLjdsNC4zLDQuM2MwLDAsMC42LDAuNSwwLjYsMWMwLDAuNi0wLjYsMS0wLjYsMWwtNC4zLDQuM2MtMC4yLDAuMi0wLjMsMC40LTAuMywwLjdjMCwwLjYsMC40LDEsMSwxQy0yOTkuNyw0MDQtMjk5LjUsNDAzLjktMjk5LjMsNDAzLjd6Ii8+PC9zdmc+)
    no-repeat center;
  background-size: 28px 49px;
  z-index: 1000;
  cursor: pointer;
  color: #e4b101;
  transition: visibility 0s 0s, opacity 0.5s, padding-left 0.5s,
    padding-right 0.5s;
  visibility: visible;
  opacity: 100;
}
.sk-left {
  left: 0;
  transform: rotate(180deg) translateY(calc(50% - 14px));
}
.sk-right {
  right: 0;
  transform: translateY(calc(-50% + 14px));
}

#sponsors .sk-left {
  left: 5px;
}
#sponsors .sk-right {
  right: 5px;
}

.sk-arrow.sk-hidden {
  transition: visibility 0s 0.5s, opacity 0.5s, padding-left 0.5s,
    padding-right 0.5s;
  visibility: hidden;
  opacity: 0;
  padding-left: 0;
  padding-right: 0;
}

/* buttons */
.sk-button-cont {
  transition: visibility 0s 0s, opacity 0.5s, bottom 0.5s;
  position: absolute;
  bottom: 10px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1000;
}
.sk-button {
  display: inline-block;
  height: 8px;
  width: 8px;
  border-radius: 50%;
  margin: 0 4px;
  background: rgba(0, 0, 0, 0.75);
  cursor: pointer;
  z-index: 1000;
}
@supports (shape-outside: circle) {
  .sk-button {
    -webkit-shape-outside: circle;
    shape-outside: circle;
  }
}
.sk-button-cont.sk-hidden {
  transition: visibility 0s 0.5s, opacity 0.5s, bottom 0.5s;
  visibility: hidden;
  opacity: 0;
  bottom: 0;
}
