.title-1 {
  font-size: 26px
}

.title-2 {
  font-size: 32px
}

.title-3 {
  font-size: 38px
}

.subtitle-1 {
  font-size: 18px
}

.subtitle-2 {
  font-size: 22px
}

.subtitle-3 {
  font-size: 26px
}

@media(min-width:576px) {
  .title-sm-1 {
    font-size: 32px
  }

  .title-sm-2 {
    font-size: 38px
  }

  .title-sm-3 {
    font-size: 44px
  }

  .subtitle-sm-1 {
    font-size: 22px
  }

  .subtitle-sm-2 {
    font-size: 26px
  }

  .subtitle-sm-3 {
    font-size: 30px
  }
}

@media(min-width:768px) {
  .title-md-1 {
    font-size: 38px
  }

  .title-md-2 {
    font-size: 44px
  }

  .title-md-3 {
    font-size: 50px
  }

  .subtitle-md-1 {
    font-size: 26px
  }

  .subtitle-md-2 {
    font-size: 30px
  }

  .subtitle-md-3 {
    font-size: 34px
  }
}

@media(min-width:992px) {
  .title-lg-1 {
    font-size: 44px
  }

  .title-lg-2 {
    font-size: 50px
  }

  .title-lg-3 {
    font-size: 56px
  }

  .subtitle-lg-1 {
    font-size: 30px
  }

  .subtitle-lg-2 {
    font-size: 34px
  }

  .subtitle-lg-3 {
    font-size: 38px
  }
}

@media(min-width:1200px) {
  .title-xl-1 {
    font-size: 50px
  }

  .title-xl-2 {
    font-size: 56px
  }

  .title-xl-3 {
    font-size: 62px
  }

  .subtitle-xl-1 {
    font-size: 34px
  }

  .subtitle-xl-2 {
    font-size: 38px
  }

  .subtitle-xl-3 {
    font-size: 42px
  }
}

.normal-1 {
  font-size: 16px
}

.normal-2 {
  font-size: 18px
}

.normal-3 {
  font-size: 20px
}

@media(min-width:576px) {
  .normal-sm-1 {
    font-size: 18px
  }

  .normal-sm-2 {
    font-size: 20px
  }

  .normal-sm-3 {
    font-size: 22px
  }
}

@media(min-width:768px) {
  .normal-md-1 {
    font-size: 20px
  }

  .normal-md-2 {
    font-size: 22px
  }

  .normal-md-3 {
    font-size: 24px
  }
}

@media(min-width:992px) {
  .normal-lg-1 {
    font-size: 22px
  }

  .normal-lg-2 {
    font-size: 24px
  }

  .normal-lg-3 {
    font-size: 26px
  }
}

@media(min-width:1200px) {
  .normal-xl-1 {
    font-size: 24px
  }

  .normal-xl-2 {
    font-size: 26px
  }

  .normal-xl-3 {
    font-size: 28px
  }
}