div.flex {
    display: flex;
}

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

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

div.flex-grow {
    display: flex;
    flex-grow: 1;
}

div.flex-shrink {
    display: flex;
    flex-shrink: 1;
}

div.flex-no-grow {
    display: flex;
    flex-shrink: 0;
}

div.flex-no-shrink {
    display: flex;
    flex-shrink: 0;
}

div.flex-basis-zero {
    display: flex;
    flex-basis: 0;
}

div.flex-wrap {
    display: flex;
    flex-wrap: wrap;
}

div.flex-no-wrap {
    display: flex;
    flex-wrap: nowrap;
}

div.flex-justify-content-center {
    display: flex;
    justify-content: center;
}

div.flex-justify-content-space-between {
    display: flex;
    justify-content: space-between;
}

div.flex-align-items-center {
    display: flex;
    align-items: center;
}

div.flex-align-self-center {
    display: flex;
    align-self: center;
}

div.flex-auto > * {
    /* 
    flex-grow: 1;
    flex-shrink: 1;
    flex-basis: 0; 
    */
    flex: 1;
    min-width: 0;
}

div.flex-gap-8 {
    gap: 8px;
}

div.flex-gap-16 {
    gap: 16px;
}

div.flex-gap-32 {
    gap: 32px;
}

div.margin-16 {
    margin: 16px;
}

div.padding-16 {
    padding: 16px;
}

div.margin-32 {
    margin: 32px;
}

div.padding-32 {
    padding: 32px;
}