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

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

.dr {
    flex-direction: row;
}

.dc {
    flex-direction: column;
}

.color-weak {
    color: $color-text-weak;
}

.color-strong {
    color: $color-text-strong;
}

.color-invert {
    color: $color-text-invert;
}

.padding-xs {
    padding: $padding-xs;
}
.padding-top-xs {
    padding-top: $padding-xs;
}
.padding-right-xs {
    padding-right: $padding-xs;
}
.padding-left-xs {
    padding-left: $padding-xs;
}
.padding-bottom-xs {
    padding-bottom: $padding-xs;
}

.margin-xs {
    margin: $margin-xs;
}
.margin-top-xs {
    margin-top: $margin-xs;
}
.margin-right-xs {
    margin-right: $margin-xs;
}
.margin-left-xs {
    margin-left: $margin-xs;
}
.margin-bottom-xs {
    margin-bottom: $margin-xs;
}

.padding-sm {
    padding: $padding-sm;
}
.padding-top-sm {
    padding-top: $padding-sm;
}
.padding-right-sm {
    padding-right: $padding-sm;
}
.padding-left-sm {
    padding-left: $padding-sm;
}
.padding-bottom-sm {
    padding-bottom: $padding-sm;
}

.margin-sm {
    margin: $margin-sm;
}
.margin-top-sm {
    margin-top: $margin-sm;
}
.margin-right-sm {
    margin-right: $margin-sm;
}
.margin-left-sm {
    margin-left: $margin-sm;
}
.margin-bottom-sm {
    margin-bottom: $margin-sm;
}

.padding-md {
    padding: $padding-md;
}
.padding-top-md {
    padding-top: $padding-md;
}
.padding-right-md {
    padding-right: $padding-md;
}
.padding-left-md {
    padding-left: $padding-md;
}
.padding-bottom-md {
    padding-bottom: $padding-md;
}

.margin-md {
    margin: $margin-md;
}
.margin-top-md {
    margin-top: $margin-md;
}
.margin-right-md {
    margin-right: $margin-md;
}
.margin-left-md {
    margin-left: $margin-md;
}
.margin-bottom-md {
    margin-bottom: $margin-md;
}

.padding-lg {
    padding: $padding-lg;
}
.padding-top-lg {
    padding-top: $padding-lg;
}
.padding-right-lg {
    padding-right: $padding-lg;
}
.padding-left-lg {
    padding-left: $padding-lg;
}
.padding-bottom-lg {
    padding-bottom: $padding-lg;
}

.margin-lg {
    margin: $margin-lg;
}
.margin-top-lg {
    margin-top: $margin-lg;
}
.margin-right-lg {
    margin-right: $margin-lg;
}
.margin-left-lg {
    margin-left: $margin-lg;
}
.margin-bottom-lg {
    margin-bottom: $margin-lg;
}

.padding-xl {
    padding: $padding-xl;
}
.padding-top-xl {
    padding-top: $padding-xl;
}
.padding-right-xl {
    padding-right: $padding-xl;
}
.padding-left-xl {
    padding-left: $padding-xl;
}
.padding-bottom-xl {
    padding-bottom: $padding-xl;
}

.margin-xl {
    margin: $margin-xl;
}
.margin-top-xl {
    margin-top: $margin-xl;
}
.margin-right-xl {
    margin-right: $margin-xl;
}
.margin-left-xl {
    margin-left: $margin-xl;
}
.margin-bottom-xl {
    margin-bottom: $margin-xl;
}