@keyframes placeHolderShimmer {
  0% {
      background-position: -800px 0
  }
  100% {
      background-position: 800px 0
  }
}

.animated-background {
  animation-duration: 2.3s;
  animation-fill-mode: forwards;
  animation-iteration-count: infinite;
  animation-name: placeHolderShimmer;
  animation-timing-function: linear;
  background: #eee;
  background: linear-gradient(to right, #eaeaea 8%, #dcdcdc 18%, #eaeaea 33%);
  background-size: 800px 104px;
  height: 33px;
  position: relative;
}

.background-masker {
  background: #fff;
  position: absolute;
}

.mask-action {
  bottom: 0;
  left: 0;
  height: 13px;
  width: 82px;
}

.mask-score {
  bottom: 0;
  right: 0;
  height: 13px;
  width: 54px;
}

.col-div-1 {
  top: 0;
  left: 13px;
  height: 33px;
  width: 30px;
}

.col-div-2 {
  top: 0;
  left: 67px;
  height: 33px;
  width: 15px;
}

.col-div-3 {
  top: 0;
  right: 39px;
  height: 36px;
  width: 40px;
}

.width-100 {
  top: 13px;
  height: 7px;
  width: 100%;
}

.mask-desc-top {
  top: 0;
  right: 60px;
  height: 13px;
  width: 4%;
}

.mask-desc-bottom {
  bottom: 0;
  right: 60px;
  height: 13px;
  width: 40%;
}

.animated-background-2 .mask-desc-top {
  width: 6%;
}

.animated-background-2 .mask-desc-bottom {
  width: 47%;
}

.animated-background-3 .mask-desc-top {
  width: 4%;
}

.animated-background-3 .mask-desc-bottom {
  width: 35%;
}

.animated-background-4 .mask-desc-top {
  width: 8%;
}

.animated-background-4 .mask-desc-bottom {
  width: 59%;
}

.animated-background-5 .mask-desc-top {
  width: 4%;
}

.animated-background-5 .mask-desc-bottom {
  width: 39%;
}