.placeholder {
  width: 100%;
}

.faux-image-wrapper {
  margin-bottom: 10px;
  position: relative;
  width: 100px;
  height: 100px;
}

.faux-image {
  background: #ddd;
  border-radius: 4px;
  position: absolute;
  height: 100%;
  width: 100%;
  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

.faux-text {
  background: #ddd;
  border-radius: 4px;
  height: 20px;
  margin-bottom: 5px;
  animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

.faux-text.short {
  width: 75%;
}

.faux-text.min-short {
  width: 45%;
}

.shimmer {
  overflow: hidden;
  position: relative;
}

.shimmer::before {
  content: '';
  position: absolute;

  /* background: linear-gradient(90deg, rgb(255 255 255 / 0%) 0%, rgb(255 255 255 / 40%) 50%, rgb(255 255 255 / 0%) 100%); */
  height: 100%;
  width: 100%;
  z-index: 1;
  border-radius: 4px;

  /*  animation: shimmer 1s infinite; */

  /* animation: pulse 2s cubic-bezier(.4,0,.6,1) infinite; */
}

@keyframes shimmer {
  0% {
    transform: translateX(-100%);
  }

  100% {
    transform: translateX(100%);
  }
}

@keyframes pulse {
  50% {
    opacity: 0.5;
  }
}
