/*-----------------------------------*\
  #TYPOGRAPHY.CSS
\*-----------------------------------*/

.display-1,
.headline-1,
.headline-2,
.title-1,
.title-2,
.title-3,
.title-4 {
  color: var(--white);
  font-family: var(--fontFamily-forum);
  font-weight: var(--weight-regular);
  line-height: var(--lineHeight-2);
}

.display-1 {
  font-size: var(--fontSize-display-1);
  line-height: var(--lineHeight-1);
}

.headline-1 { font-size: var(--fontSize-headline-1); }

.headline-2 {
  font-size: var(--fontSize-headline-2);
  line-height: var(--lineHeight-6);
}

.title-1 { font-size: var(--fontSize-title-1); }
.title-2 { font-size: var(--fontSize-title-2); }
.title-3 { font-size: var(--fontSize-title-3); }
.title-4 { font-size: var(--fontSize-title-4); }

.body-1 { font-size: var(--fontSize-body-1); line-height: var(--lineHeight-6); }
.body-2 { font-size: var(--fontSize-body-2); line-height: var(--lineHeight-4); }
.body-3 { font-size: var(--fontSize-body-3); }
.body-4 { font-size: var(--fontSize-body-4); }

.label-1 { font-size: var(--fontSize-label-1); }
.label-2 { font-size: var(--fontSize-label-2); }

.text-center { text-align: center; }