.row {
    display: flex;
    flex-direction: row;
}

.right_justified {
    justify-content: end;
    text-align: end;
}

.center {
    text-align: center;
}

.right {
    text-align: right;
}

.column {
    display: flex;
    flex-direction: column;
}

.ellipsis {
    text-overflow: ellipsis;
}

.hidden {
    overflow: hidden;
}

.nowrap {
    white-space: nowrap;
}

.inline {
    display: inline;
}

.inline_flex {
    display: inline flex;
}

.max_content {
    max-width: max-content;
}

.self_center {
    align-self: center;
}

.align_center {
    align-items: center;
}

.justify_center {
    justify-content: center;
}

.justify_between {
    justify-content: space-between;
}

.pre_line {
    white-space: pre-line;
}

.title_large {
    font-size: 1.25rem;
}

.title {
    font-size: 1.15rem;
}

.body {
    font-size: 1rem;
}

.body_small {
    font-size: 0.9rem;
}

.label {
    font-size: 0.85rem;
}

.heavier {
    font-weight: 500;
}

.heaviest {
    font-weight: 600;
}

.lightest {
    font-weight: 200;
}

.lighter {
    font-weight: 300;
}

.italic {
    font-style: italic;
}

:root {
    --p1: 1px;
    --p2: 2px;
    --p4: 4px;
    --p8: 8px;
    --p12: 12px;
    --p16: 16px;
    --p20: 20px;
    --p24: 24px;
    --p28: 28px;
    --p32: 32px;
}

/* Padding All */
.p1  { padding: var(--p1); }
.p2  { padding: var(--p2); }
.p4  { padding: var(--p4); }
.p8  { padding: var(--p8); }
.p12 { padding: var(--p12); }
.p16 { padding: var(--p16); }
.p20 { padding: var(--p20); }
.p24 { padding: var(--p24); }
.p28 { padding: var(--p28); }
.p32 { padding: var(--p32); }

/* Padding Top */
.pt1  { padding-top: var(--p1); }
.pt2  { padding-top: var(--p2); }
.pt4  { padding-top: var(--p4); }
.pt8  { padding-top: var(--p8); }
.pt12 { padding-top: var(--p12); }
.pt16 { padding-top: var(--p16); }
.pt20 { padding-top: var(--p20); }
.pt24 { padding-top: var(--p24); }
.pt28 { padding-top: var(--p28); }
.pt32 { padding-top: var(--p32); }

/* Padding Bottom */
.pb1  { padding-bottom: var(--p1); }
.pb2  { padding-bottom: var(--p2); }
.pb4  { padding-bottom: var(--p4); }
.pb8  { padding-bottom: var(--p8); }
.pb12 { padding-bottom: var(--p12); }
.pb16 { padding-bottom: var(--p16); }
.pb20 { padding-bottom: var(--p20); }
.pb24 { padding-bottom: var(--p24); }
.pb28 { padding-bottom: var(--p28); }
.pb32 { padding-bottom: var(--p32); }

/* Padding Left */
.pl1  { padding-left: var(--p1); }
.pl2  { padding-left: var(--p2); }
.pl4  { padding-left: var(--p4); }
.pl8  { padding-left: var(--p8); }
.pl12 { padding-left: var(--p12); }
.pl16 { padding-left: var(--p16); }
.pl20 { padding-left: var(--p20); }
.pl24 { padding-left: var(--p24); }
.pl28 { padding-left: var(--p28); }
.pl32 { padding-left: var(--p32); }

/* Padding Right */
.pr1  { padding-right: var(--p1); }
.pr2  { padding-right: var(--p2); }
.pr4  { padding-right: var(--p4); }
.pr8  { padding-right: var(--p8); }
.pr12 { padding-right: var(--p12); }
.pr16 { padding-right: var(--p16); }
.pr20 { padding-right: var(--p20); }
.pr24 { padding-right: var(--p24); }
.pr28 { padding-right: var(--p28); }
.pr32 { padding-right: var(--p32); }

/* Margin All */
.m1  { margin: var(--p1); }
.m2  { margin: var(--p2); }
.m4  { margin: var(--p4); }
.m8  { margin: var(--p8); }
.m12 { margin: var(--p12); }
.m16 { margin: var(--p16); }
.m20 { margin: var(--p20); }
.m24 { margin: var(--p24); }
.m28 { margin: var(--p28); }
.m32 { margin: var(--p32); }

/* Margin Top */
.mt1  { margin-top: var(--p1); }
.mt2  { margin-top: var(--p2); }
.mt4  { margin-top: var(--p4); }
.mt8  { margin-top: var(--p8); }
.mt12 { margin-top: var(--p12); }
.mt16 { margin-top: var(--p16); }
.mt20 { margin-top: var(--p20); }
.mt24 { margin-top: var(--p24); }
.mt28 { margin-top: var(--p28); }
.mt32 { margin-top: var(--p32); }

/* Margin Bottom */
.mb1  { margin-bottom: var(--p1); }
.mb2  { margin-bottom: var(--p2); }
.mb4  { margin-bottom: var(--p4); }
.mb8  { margin-bottom: var(--p8); }
.mb12 { margin-bottom: var(--p12); }
.mb16 { margin-bottom: var(--p16); }
.mb20 { margin-bottom: var(--p20); }
.mb24 { margin-bottom: var(--p24); }
.mb28 { margin-bottom: var(--p28); }
.mb32 { margin-bottom: var(--p32); }

/* Margin Left */
.ml1  { margin-left: var(--p1); }
.ml2  { margin-left: var(--p2); }
.ml4  { margin-left: var(--p4); }
.ml8  { margin-left: var(--p8); }
.ml12 { margin-left: var(--p12); }
.ml16 { margin-left: var(--p16); }
.ml20 { margin-left: var(--p20); }
.ml24 { margin-left: var(--p24); }
.ml28 { margin-left: var(--p28); }
.ml32 { margin-left: var(--p32); }

/* Margin Right */
.mr1  { margin-right: var(--p1); }
.mr2  { margin-right: var(--p2); }
.mr4  { margin-right: var(--p4); }
.mr8  { margin-right: var(--p8); }
.mr12 { margin-right: var(--p12); }
.mr16 { margin-right: var(--p16); }
.mr20 { margin-right: var(--p20); }
.mr24 { margin-right: var(--p24); }
.mr28 { margin-right: var(--p28); }
.mr32 { margin-right: var(--p32); }