.thumbnail-bar {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.thumbnail-bar::-webkit-scrollbar {
  display: none;
}

.thumb-img {
  opacity: 0.7;
  border: 2px solid transparent;
  transition: opacity 0.2s, border-color 0.2s;
  flex: 0 0 auto;
}

.thumb-img.active, .thumb-img:hover, .thumb-img.border-primary {
  opacity: 1;
  border-color: #0d6efd;
}

@media (min-width: 768px) {
  .thumbnail-bar-wrapper {
    justify-content: center !important;
  }
}

@media (min-width: 768px) {
  .thumb-scroll-btn {
    display: none !important;
  }
}

@media (min-width: 768px) {
  .thumbnail-bar {
    overflow-x: visible;
    justify-content: center;
  }
}

@media (min-width: 768px) {
  .thumb-img {
    width: 90px !important;
    margin-right: 12px;
  }
}