@mixin nth-children($points...) {
  @each $point in $points {
    &:nth-child(#{$point}) {
      @content;
    }
  }
}

.loading-placeholder {
  // height: 214px;
  padding: 10px;
  // border: 1px solid lightgrey;
  // border-radius: 4px;
  width: 100%;
  background-color: #FFF;

  >.line {
    height: 10px;
    margin: 10px;
    animation: pulse 1s infinite ease-in-out;
  }

  div {
    @include nth-children(1, 5, 9) {
      width: 70%;
    }
    @include nth-children(2, 6, 10) {
      width: 80%;
    }
    @include nth-children(3, 7) {
      width: 70%;
    }
    @include nth-children(4, 8) {
      width: 40%;
      margin-bottom: 20px;
    }
  }
}
@keyframes pulse {
  0% {
    background-color: rgba(#666, 0.1);
  }

  50% {
    background-color: rgba(#666, 0.15);
  }

  100% {
    background-color: rgba(#666, 0.1);
  }
}
