.wskco-break-text {
  position: relative;
  background-color: #000;
  height: 120px;

  &__content {
    position: absolute;
    top: 50%;
    left: 50%;
    font-size: 36px;
    font-family: Raleway, Verdana, Arial;
    color: #fff;

    &::before {
      content: attr(data-word);
      position: absolute;
      top: 0;
      left: 0.5px;
      height: 0px;
      color: rgba(255, 255, 255, 0.9);
      overflow: hidden;
      z-index: 2;
      animation: wskco-redShadow 1s ease-in infinite;
      filter: contrast(200%);
      text-shadow: 1px 0 0 red;
    }

    &::after {
      content: attr(data-word);
      position: absolute;
      top: 0;
      left: -3px;
      height: 36px;
      color: rgba(255, 255, 255, 0.8);
      overflow: hidden;
      z-index: 3;
      background: rgba(0, 0, 0, 0.9);
      animation: wskco-redHeight 1.5s ease-out infinite;
      filter: contrast(200%);
      text-shadow: -1px 0 0 cyan;
      mix-blend-mode: darken;
    }
  }

  &__white {
    position: absolute;
    left: -10px;
    width: 100%;
    height: 3px;
    // background: #000;
    z-index: 4;
    animation: wskco-whiteMove 3s ease-out infinite;
  }
}

@keyframes wskco-redShadow {
  20% {
    height: 32px;
  }
  60% {
    height: 6px;
  }
  100% {
    height: 42px;
  }
}

@keyframes wskco-redHeight {
  20% {
    height: 42px;
  }
  35% {
    height: 12px;
  }
  50% {
    height: 40px;
  }
  60% {
    height: 20px;
  }
  70% {
    height: 34px;
  }
  80% {
    height: 22px;
  }
  100% {
    height: 0px;
  }
}

@keyframes wskco-whiteMove {
  8% {
    top: 38px;
  }
  14% {
    top: 8px;
  }
  20% {
    top: 42px;
  }
  32% {
    top: 2px;
  }
  99% {
    top: 30px;
  }
}