/* .text{ */
/* text-decoration: none; */
/* font-family: "Confillia Bold", sans-serif;
    font-size: 175px; */
/* font-weight: bolder; */
/* line-height: 175px; */
/* overflow: hidden; */
/* text-transform: uppercase; */
/* height: 175px; */
/* } */
*{
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}
div.block {
  display: flex;
}

.text-big:hover .letter,
.text-big.play .letter,
.text-medium:hover .letter,
.text-medium.play .letter,
.text-small:hover .letter,
.text-small.play .letter,
.text-highlight:hover .letter,
.text-highlight.play .letter,
.text-usecase-controls:hover .letter,
.text-usecase-controls.play .letter,
.text-menu:hover .letter,
.text-menu.play .letter {
  transform: translateY(-100%);
}

.text-big .block:last-child,
.text-medium .block:last-child,
.text-small .block:last-child,
.text-highlight .block:last-child,
.text-usecase-controls .block:last-child,
.text-menu .block:last-child {
  color: parent;
}

.text-big .letter,
.text-medium .letter,
.text-small .letter,
.text-highlight .letter,
.text-usecase-controls .letter,
.text-menu .letter {
  display: inline-block;
  transition: transform 0.6s cubic-bezier(0.76, 0, 0.024, 1);
}

.letter:nth-child(1) {
  transition-delay: 0s;
}
.letter:nth-child(2) {
  transition-delay: 0.03s;
}
.letter:nth-child(3) {
  transition-delay: 0.06s;
}
.letter:nth-child(4) {
  transition-delay: 0.09s;
}
.letter:nth-child(5) {
  transition-delay: 0.12s;
}
.letter:nth-child(6) {
  transition-delay: 0.15s;
}
.letter:nth-child(7) {
  transition-delay: 0.18s;
}
.letter:nth-child(8) {
  transition-delay: 0.21s;
}
.letter:nth-child(9) {
  transition-delay: 0.24s;
}
.letter:nth-child(10) {
  transition-delay: 0.27s;
}
.letter:nth-child(11) {
  transition-delay: 0.3s;
}
.letter:nth-child(12) {
  transition-delay: 0.33s;
}
.letter:nth-child(13) {
  transition-delay: 0.36s;
}
.letter:nth-child(14) {
  transition-delay: 0.39s;
}
.letter:nth-child(15) {
  transition-delay: 0.42s;
}
.letter:nth-child(16) {
  transition-delay: 0.45s;
}
.letter:nth-child(17) {
  transition-delay: 0.48s;
}
.letter:nth-child(18) {
  transition-delay: 0.51s;
}
.letter:nth-child(19) {
  transition-delay: 0.54s;
}
.letter:nth-child(20) {
  transition-delay: 0.57s;
}
.letter:nth-child(21) {
  transition-delay: 0.6s;
}
