.none {
    display: none;
}

.thl-logo {
    min-width: 100px;
    max-width: 300px;
}

/*Flexbox Utilities*/
.flex-container {
    display: flex;
}

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

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

.flex-wrap {
    flex-wrap: wrap
}

/*Starts as row but flips to column at 425 and below*/
.mobile-flex-row {
    flex-direction: row;
}

@media (max-width: 425px) {
    .mobile-flex-row {
        flex-direction: column;
    }
}

/*Starts as column but flips to row at 425 and below*/
.mobile-flex-column {
    flex-direction: column;
}

@media (max-width: 425px) {
    .mobile-flex-column {
        flex-direction: row;
    }
}

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

.items-start {
    align-items: flex-start;
}

.items-end {
    align-items: flex-end;
}

.items-stretch {
    align-items: stretch;
}

.just-center {
    justify-content: center;
}

.just-start {
    justify-content: flex-start;
}

.just-end {
    justify-content: flex-end;
}

.just-around {
    justify-content: space-around;
}

.just-even {
    justify-content: space-evenly;
}

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

.just-stretch {
    justify-content: stretch;
}

.gap-3xs {
    gap: var(--space-3xs);
}

.gap-2xs {
    gap: var(--space-2xs);
}

.gap-xs {
    gap: var(--space-xs);
}

.gap-s {
    gap: var(--space-s);
}

.gap-m {
    gap: var(--space-m);
}

.gap-l {
    gap: var(--space-l);
}

.gap-xl {
    gap: var(--space-xl);
}

.gap-2xl {
    gap: var(--space-2xl);
}

.gap-3xl {
    gap: var(--space-3xl);
}

.block {
    display: block;
}

.inline-block {
    display: inline-block;
}

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

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

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

.wht-spc-pre {
    white-space: pre-line;
}

/*Child Display Utilities*/
.self-center {
    align-self: center;
}

.self-start {
    align-self: flex-start;
}

.self-end {
    align-self: flex-end;
}

.basis-100{
    flex-basis: 100%;
}

.flex-g-1{
    flex-grow: 1;
}

.flex-s-0 {
    flex-shrink: 0;
}

/*Lists*/
.no-list-style {
    list-style: none;
}

/*Display icon classes*/
.error-icon {
    color: var(--error-colour);
}

.success-icon {
    color: var(--success-colour);
}

.warning-icon {
    color: var(--warning-colour);
}

.icon {
    height: 1.0em;
    width: 1.0em;
    flex-shrink: 0;
}

.icon-3xs {
    --icon-dimension: var(--space-3xs);

    height: var(--icon-dimension);
    width: var(--icon-dimension);
}

.icon-2xs {
    --icon-dimension: var(--space-2xs);

    height: var(--icon-dimension);
    width: var(--icon-dimension);
}

.icon-xs {
    --icon-dimension: var(--space-xs);

    height: var(--icon-dimension);
    width: var(--icon-dimension);
}

.icon-s {
    --icon-dimension: var(--space-s);

    height: var(--icon-dimension);
    width: var(--icon-dimension);
}

.icon-m {
    --icon-dimension: var(--space-m);

    height: var(--icon-dimension);
    width: var(--icon-dimension);
}

.icon-l {
    --icon-dimension: var(--space-l);

    height: var(--icon-dimension);
    width: var(--icon-dimension);
}

.icon-xl {
    --icon-dimension: var(--space-xl);

    height: var(--icon-dimension);
    width: var(--icon-dimension);
}

.icon-2xl {
    --icon-dimension: var(--space-2xl);

    height: var(--icon-dimension);
    width: var(--icon-dimension);
}

.icon-3xl {
    --icon-dimension: var(--space-3xl);

    height: var(--icon-dimension);
    width: var(--icon-dimension);
}