#referenzen { margin-bottom: 100px; }
.referenzen-container { position: relative; margin: 0 auto; }
.referenzen-container h1 { font-size: 48px; font-weight: 700; margin-bottom: 30px; }

.bewertungen-slider { position: relative; padding: 12px 0 36px; scale: 101%; }

/* NAV ARROWS */
.bewertungen-slider .nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 5;
  border: none;
  background: rgba(1, 28, 51, 0.85);
  color: #fff;
  width: 44px;
  height: 44px;
  border-radius: 999px;
  cursor: pointer;
  font-size: 22px;
  line-height: 1;
  display: grid;
  place-items: center;
  box-shadow: 0 5px 18px rgba(0,0,0,.18);
}
.bewertungen-slider .nav.prev { left: -15px;background: #d3d3d3;color: rgba(1, 28, 51, 0.85); }
.bewertungen-slider .nav.next { right: -15px; }
.bewertungen-slider .nav[hidden] { display: none; }

.viewport { overflow: hidden; width: 100%; cursor: grab; }
.viewport:active { cursor: grabbing; }
.track {
  display: flex;
  will-change: transform;
  user-select: none;
  -webkit-user-drag: none;
  touch-action: pan-y;
  transition: transform .32s ease;
}
.slide { flex: 0 0 calc(100% / 3); max-width: calc(100% / 3); box-sizing: border-box; }
.card {
  border-radius: 14px;
  border: none;
  padding: 42px;
  height: 100%;
  background-color: rgba(1, 28, 51, 0.06);
  color: #011C33;
  margin: 0 10px;
}
.card.active-left { background-color: #011C33; color: white; }

.stars img { width: 25px; height: 25px; margin-right: 2px; vertical-align: middle; }
.bewertung { font-size: 20px; }
.author { font-weight: 700; font-size: 30px; margin: 5px 0; }

@media(min-width:992px){
  .bewertungen-slider .nav.next, .bewertungen-slider .nav.prev {
    visibility: hidden;
  }
}

@media (max-width: 1500px) {
  .bewertungen-slider { scale: 102%; }
}
@media (max-width: 1200px) {
  .slide { flex-basis: 50%; max-width: 50%; }
  .card { margin: 0 10px; padding: 35px; }
}
@media (max-width: 992px) {
  .slide { flex-basis: 50%; max-width: 50%; }
  .card { padding: 25px; }
  .bewertungen-slider { scale: 104%; }

}
@media (max-width: 576px) {
  .slide { flex-basis: 100%; max-width: 100%; }
  .card { padding: 20px; }
  .bewertungen-slider { scale: 106%; }
  .bewertungen-slider .nav.prev { left: -18px;background: #d3d3d3;color: rgba(1, 28, 51, 0.85); }
  .bewertungen-slider .nav.next { right: -18px;background: #d3d3d3;color: rgba(1, 28, 51, 0.85); }
}