@import "./ack-sizes";

.m-0, .margin-0 {margin:0}
.margin-1 {margin:1px}
.margin-xxs {margin:$em-xxs}
.margin-xs {margin:$em-xs}
.margin-smx {margin:$em-smx}
.margin-sm {margin:$em-sm}
.m-1, .margin {margin:$em}
.m-2, .margin-2x, .margin-md {margin:$em-md}
.m-3, .margin-3x, .margin-lg {margin:$em-lg}
.m-4, .margin-4x {margin:$em-4x}
.m-5, .margin-5x {margin:$em-5x}

.my-0, .margin-v-0 {margin-top:0;margin-bottom:0}
.margin-v-1 {margin-top:1px;margin-bottom:1px}
.margin-v-xxs {margin-top:$em-xxs;margin-bottom:$em-xxs}
.margin-v-xs {margin-top:$em-xs;margin-bottom:$em-xs}
.margin-v-smx {margin-top:$em-smx;margin-bottom:$em-smx}
.margin-v-sm {margin-top:$em-sm;margin-bottom:$em-sm}
.my-1, .margin-v {margin-top:$em;margin-bottom:$em}
.my-2, .margin-v-2x, .margin-v-md {margin-top:$em-md;margin-bottom:$em-md}
.my-3, .margin-v-3x, .margin-v-lg {margin-top:$em-lg;margin-bottom:$em-lg}
.my-4, .margin-v-4x {margin-top:$em-4x;margin-bottom:$em-4x}
.my-5, .margin-v-5x {margin-top:$em-5x;margin-bottom:$em-5x}

.mx-0, .margin-h-0 {margin-left:0;margin-right:0}
.margin-h-1 {margin-left:1px;margin-right:1px}
.margin-h-xxs {margin-left:$em-xxs;margin-right:$em-xxs}
.margin-h-xs {margin-left:$em-xs;margin-right:$em-xs}
.margin-h-smx {margin-left:$em-smx;margin-right:$em-smx}
.margin-h-sm {margin-left:$em-sm;margin-right:$em-sm}
.mx-1, .margin-h {margin-left:$em;margin-right:$em}
.mx-2, .margin-h-2x, .margin-h-md {margin-left:$em-md;margin-right:$em-md}
.mx-3, .margin-h-3x, .margin-h-lg {margin-left:$em-lg;margin-right:$em-lg}
.mx-4, .margin-h-4x {margin-left:$em-4x;margin-right:$em-4x}
.mx-5, .margin-h-5x {margin-left:$em-5x;margin-right:$em-5x}

.mt-0, .margin-top-0 {margin-top:0}
.margin-top-1 {margin-top:1px}
.margin-top-xxs {margin-top:$em-xxs}
.margin-top-xs {margin-top:$em-xs}
.margin-top-smx {margin-top:$em-smx}
.margin-top-sm {margin-top:$em-sm}
.mt-1, .margin-top {margin-top:$em}
.mt-2, .margin-top-2x, .margin-top-md {margin-top:$em-md}
.mt-3, .margin-top-3x, .margin-top-lg {margin-top:$em-lg}
.mt-4, .margin-top-4x, .margin-top-lg {margin-top:$em-4x}
.mt-5, .margin-top-5x, .margin-top-lg {margin-top:$em-5x}

.mb-0, .margin-bottom-0 {margin-bottom:0}
.margin-bottom-1 {margin-bottom:1px}
.margin-bottom-xxs {margin-bottom:$em-xxs}
.margin-bottom-xs {margin-bottom:$em-xs}
.margin-bottom-smx {margin-bottom:$em-smx}
.margin-bottom-sm {margin-bottom:$em-sm}
.mb-1, .margin-bottom {margin-bottom:$em}
.mb-2, .margin-bottom-2x, .margin-bottom-md {margin-bottom:$em-md}
.mb-3, .margin-bottom-3x, .margin-bottom-lg {margin-bottom:$em-lg}
.mb-4, .margin-bottom-4x {margin-bottom:$em-4x}
.mb-5, .margin-bottom-5x {margin-bottom:$em-5x}

.ml-0, .margin-left-0 {margin-left:0}
.margin-left-1 {margin-left:1px}
.margin-left-xxs {margin-left:$em-xxs}
.margin-left-xs {margin-left:$em-xs}
.margin-left-smx {margin-left:$em-smx}
.margin-left-sm {margin-left:$em-sm}
.ml-1, .margin-left {margin-left:$em}
.ml-2, .margin-left-2x, .margin-left-md {margin-left:$em-md}
.ml-3, .margin-left-3x, .margin-left-lg {margin-left:$em-lg}
.ml-4, .margin-left-4x {margin-left:$em-4x}
.ml-5, .margin-left-5x {margin-left:$em-5x}

.mr-0, .margin-right-0 {margin-right:0}
.margin-right-1 {margin-right:1px}
.margin-right-xxs {margin-right:$em-xxs}
.margin-right-xs {margin-right:$em-xs}
.margin-right-smx {margin-right:$em-smx}
.margin-right-sm {margin-right:$em-sm}
.mr-1, .margin-right {margin-right:$em}
.mr-2, .margin-right-2x, .margin-right-md {margin-right:$em-md}
.mr-3, .margin-right-3x, .margin-right-lg {margin-right:$em-lg}
.mr-4, .margin-right-4x {margin-right:$em-4x}
.mr-5, .margin-right-5x {margin-right:$em-5x}

/* child targeting classes */
.child-margin-0 > * {@extend .margin-0}
.child-margin-1 > * {@extend .margin-1}
.child-margin-xxs > * {@extend .margin-xxs}
.child-margin-xs > * {@extend .margin-xs}
.child-margin-sm > * {@extend .margin-sm}
.child-margin-smx > * {@extend .margin-smx}
.child-margin > * {@extend .margin}
.child-margin-2x > *,
.child-margin-md > * {@extend .margin-md}
.child-margin-3x > *,
.child-margin-lg > * {@extend .margin-lg}
.child-margin-4x > * {@extend .margin-4x}

.child-margin-v-0 > * {@extend .margin-v-0}
.child-margin-v-1 > * {@extend .margin-v-1}
.child-margin-v-xxs > * {@extend .margin-v-xxs}
.child-margin-v-xs > * {@extend .margin-v-xs}
.child-margin-v-sm > * {@extend .margin-v-sm}
.child-margin-v > * {@extend .margin-v}
.child-margin-v-2x > *,
.child-margin-v-md > * {@extend .margin-v-md}
.child-margin-h-0 > * {@extend .margin-h-0}
.child-margin-h-1 > * {@extend .margin-h-1}
.child-margin-h-xxs > * {@extend .margin-h-xxs}
.child-margin-h-xs > * {@extend .margin-h-xs}
.child-margin-h-sm > * {@extend .margin-h-sm}
.child-margin-h > * {@extend .margin-h}
.child-margin-h-2x > *,
.child-margin-h-md > * {@extend .margin-h-md}
.child-margin-h-3x > *,
.child-margin-h-lg > * {@extend .margin-h-lg}
.child-margin-h-4x > * {@extend .margin-h-4x}

.child-margin-top-0 > * {@extend .margin-top-0}
.child-margin-top-1 > * {@extend .margin-top-1}
.child-margin-top-xxs > * {@extend .margin-top-xxs}
.child-margin-top-xs > * {@extend .margin-top-xs}
.child-margin-top-sm > * {@extend .margin-top-sm}
.child-margin-top > * {@extend .margin-top}
.child-margin-top-2x > *,
.child-margin-top-md > * {@extend .margin-top-md}
.child-margin-top-3x > *,
.child-margin-top-lg > * {@extend .margin-top-lg}
.child-margin-top-4x > * {@extend .margin-top-4x}

.child-margin-bottom-0 > * {@extend .margin-bottom-0}
.child-margin-bottom-1 > * {@extend .margin-bottom-1}
.child-margin-bottom-xxs > * {@extend .margin-bottom-xxs}
.child-margin-bottom-xs > * {@extend .margin-bottom-xs}
.child-margin-bottom-sm > * {@extend .margin-bottom-sm}
.child-margin-bottom > * {@extend .margin-bottom}
.child-margin-bottom-2x > *,
.child-margin-bottom-md > * {@extend .margin-bottom-md}
.child-margin-bottom-3x > *,
.child-margin-bottom-lg > * {@extend .margin-bottom-lg}
.child-margin-bottom-4x > * {@extend .margin-bottom-4x}

.child-margin-left-0 > * {@extend .margin-left-0}
.child-margin-left-1 > * {@extend .margin-left-1}
.child-margin-left-xxs > * {@extend .margin-left-xxs}
.child-margin-left-xs > * {@extend .margin-left-xs}
.child-margin-left-sm > * {@extend .margin-left-sm}
.child-margin-left > * {@extend .margin-left}
.child-margin-left-2x > *,
.child-margin-left-md > * {@extend .margin-left-md}
.child-margin-left-3x > *,
.child-margin-left-lg > * {@extend .margin-left-lg}
.child-margin-left-4x > * {@extend .margin-left-4x}

.child-margin-right-0 > * {@extend .margin-right-0}
.child-margin-right-1 > * {@extend .margin-right-1}
.child-margin-right-xs > * {@extend .margin-right-xs}
.child-margin-right-sm > * {@extend .margin-right-sm}
.child-margin-right > * {@extend .margin-right}
.child-margin-right-2x > *,
.child-margin-right-md > * {@extend .margin-right-md}
.child-margin-right-3x > *,
.child-margin-right-lg > * {@extend .margin-right-lg}
.child-margin-right-4x > * {@extend .margin-right-4x}

/* repeat child targeting class but only for first-child */
.child-first-margin-0 > *:first-child {@extend .margin-0}
.child-first-margin-1 > *:first-child {@extend .margin-1}
.child-first-margin-xxs > *:first-child {@extend .margin-xxs}
.child-first-margin-xs > *:first-child {@extend .margin-xs}
.child-first-margin-sm > *:first-child {@extend .margin-sm}
.child-first-margin > *:first-child {@extend .margin}
.child-first-margin-2x > *:first-child,
.child-first-margin-md > *:first-child {@extend .margin-md}
.child-first-3x-lg > *:first-child,
.child-first-margin-lg > *:first-child {@extend .margin-lg}
.child-first-margin-4x > *:first-child {@extend .margin-4x}

.child-first-margin-v-0 > *:first-child {@extend .margin-v-0}
.child-first-margin-v-1 > *:first-child {@extend .margin-v-1}
.child-first-margin-v-xxs > *:first-child {@extend .margin-v-xxs}
.child-first-margin-v-xs > *:first-child {@extend .margin-v-xs}
.child-first-margin-v-sm > *:first-child {@extend .margin-v-sm}
.child-first-margin-v > *:first-child {@extend .margin-v}
.child-first-margin-v-2x > *:first-child,
.child-first-margin-v-md > *:first-child {@extend .margin-v-md}
.child-first-margin-h-0 > *:first-child {@extend .margin-h-0}
.child-first-margin-h-1 > *:first-child {@extend .margin-h-1}
.child-first-margin-h-xxs > *:first-child {@extend .margin-h-xxs}
.child-first-margin-h-xs > *:first-child {@extend .margin-h-xs}
.child-first-margin-h-sm > *:first-child {@extend .margin-h-sm}
.child-first-margin-h > *:first-child {@extend .margin-h}
.child-first-margin-h-2x > *:first-child,
.child-first-margin-h-md > *:first-child {@extend .margin-h-md}
.child-first-margin-h-3x > *:first-child,
.child-first-margin-h-lg > *:first-child {@extend .margin-h-lg}
.child-first-margin-h-4x > *:first-child {@extend .margin-h-4x}

.child-first-margin-top-0 > *:first-child {@extend .margin-top-0}
.child-first-margin-top-1 > *:first-child {@extend .margin-top-1}
.child-first-margin-top-xxs > *:first-child {@extend .margin-top-xxs}
.child-first-margin-top-xs > *:first-child {@extend .margin-top-xs}
.child-first-margin-top-sm > *:first-child {@extend .margin-top-sm}
.child-first-margin-top > *:first-child {@extend .margin-top}
.child-first-margin-top-2x > *:first-child,
.child-first-margin-top-md > *:first-child {@extend .margin-top-md}
.child-first-margin-top-3x > *:first-child,
.child-first-margin-top-lg > *:first-child {@extend .margin-top-lg}
.child-first-margin-top-4x > *:first-child {@extend .margin-top-4x}

.child-first-margin-bottom-0 > *:first-child {@extend .margin-bottom-0}
.child-first-margin-bottom-1 > *:first-child {@extend .margin-bottom-1}
.child-first-margin-bottom-xxs > *:first-child {@extend .margin-bottom-xxs}
.child-first-margin-bottom-xs > *:first-child {@extend .margin-bottom-xs}
.child-first-margin-bottom-sm > *:first-child {@extend .margin-bottom-sm}
.child-first-margin-bottom > *:first-child {@extend .margin-bottom}
.child-first-margin-bottom-2x > *:first-child,
.child-first-margin-bottom-md > *:first-child {@extend .margin-bottom-md}
.child-first-margin-bottom-3x > *:first-child,
.child-first-margin-bottom-lg > *:first-child {@extend .margin-bottom-lg}
.child-first-margin-bottom-4x > *:first-child {@extend .margin-bottom-4x}

.child-first-margin-left-0 > *:first-child {@extend .margin-left-0}
.child-first-margin-left-1 > *:first-child {@extend .margin-left-1}
.child-first-margin-left-xxs > *:first-child {@extend .margin-left-xxs}
.child-first-margin-left-xs > *:first-child {@extend .margin-left-xs}
.child-first-margin-left-sm > *:first-child {@extend .margin-left-sm}
.child-first-margin-left > *:first-child {@extend .margin-left}
.child-first-margin-left-2x > *:first-child,
.child-first-margin-left-md > *:first-child {@extend .margin-left-md}
.child-first-margin-left-3x > *:first-child,
.child-first-margin-left-lg > *:first-child {@extend .margin-left-lg}
.child-first-margin-left-4x > *:first-child {@extend .margin-left-4x}

.child-first-margin-right-0 > *:first-child {@extend .margin-right-0}
.child-first-margin-right-1 > *:first-child {@extend .margin-right-1}
.child-first-margin-right-xs > *:first-child {@extend .margin-right-xs}
.child-first-margin-right-sm > *:first-child {@extend .margin-right-sm}
.child-first-margin-right > *:first-child {@extend .margin-right}
.child-first-margin-right-2x > *:first-child,
.child-first-margin-right-md > *:first-child {@extend .margin-right-md}
.child-first-margin-right-3x > *:first-child,
.child-first-margin-right-lg > *:first-child {@extend .margin-right-lg}
.child-first-margin-right-4x > *:first-child {@extend .margin-right-4x}
