/*
      Margins
-------------------------------

*/

.m {
  margin: var(--unit);
}

.m-xxs {
  margin: var(--unit-xxs);
}

.m-xs {
  margin: var(--unit-xs);
}

.m-s {
  margin: var(--unit-s);
}

.m-m {
  margin: var(--unit-m);
}

.m-l {
  margin: var(--unit-l);
}

.m-xl {
  margin: var(--unit-xl);
}

.m-0 {
  margin: 0;
}

.mr {
  margin-right: var(--unit);
}

.mr-xxs {
  margin-right: var(--unit-xxs);
}

.mr-xs {
  margin-right: var(--unit-xs);
}

.mr-s {
  margin-right: var(--unit-s);
}

.mr-m {
  margin-right: var(--unit-m);
}

.mr-l {
  margin-right: var(--unit-l);
}

.mr-xl {
  margin-right: var(--unit-xl);
}

.mr-0 {
  margin-right: 0;
}

.mr-- {
  margin-right: calc(-1 * var(--unit));
}

.ml {
  margin-left: var(--unit);
}

.ml-xxs {
  margin-left: var(--unit-xxs);
}

.ml-xs {
  margin-left: var(--unit-xs);
}

.ml-s {
  margin-left: var(--unit-s);
}

.ml-m {
  margin-left: var(--unit-m);
}

.ml-l {
  margin-left: var(--unit-l);
}

.ml-xl {
  margin-left: var(--unit-xl);
}

.ml-0 {
  margin-left: 0;
}

.mt {
  margin-top: var(--unit);
}

.mt-xxs {
  margin-top: var(--unit-xxs);
}

.mt-xs {
  margin-top: var(--unit-xs);
}

.mt-s {
  margin-top: var(--unit-s);
}

.mt-m {
  margin-top: var(--unit-m);
}

.mt-l {
  margin-top: var(--unit-l);
}

.mt-xl {
  margin-top: var(--unit-xl);
}

.mt-xxl {
  margin-top: var(--unit-xxl);
}

.mt-0 {
  margin-top: 0;
}

.mb {
  margin-bottom: var(--unit);
}

.mb-xxs {
  margin-bottom: var(--unit-xxs);
}

.mb-xs {
  margin-bottom: var(--unit-xs);
}

.mb-s {
  margin-bottom: var(--unit-s);
}

.mb-m {
  margin-bottom: var(--unit-m);
}

.mb-l {
  margin-bottom: var(--unit-l);
}

.mb-xl {
  margin-bottom: var(--unit-xl);
}

.mb-xxl {
  margin-bottom: var(--unit-xxl);
}

.mb-0 {
  margin-bottom: 0;
}

.mx {
  margin-right: var(--unit);
  margin-left: var(--unit);
}

.mx-xxs {
  margin-right: var(--unit-xxs);
  margin-left: var(--unit-xxs);
}

.mx-xs {
  margin-right: var(--unit-xs);
  margin-left: var(--unit-xs);
}

.mx-s {
  margin-right: var(--unit-s);
  margin-left: var(--unit-s);
}

.mx-m {
  margin-right: var(--unit-m);
  margin-left: var(--unit-m);
}

.mx-l {
  margin-right: var(--unit-l);
  margin-left: var(--unit-l);
}

.mx-xl {
  margin-right: var(--unit-xl);
  margin-left: var(--unit-xl);
}

.mx-xxl {
  margin-right: var(--unit-xxl);
  margin-left: var(--unit-xxl);
}

.mx-0 {
  margin-right: 0;
  margin-left: 0;
}

.my {
  margin-top: var(--unit);
  margin-bottom: var(--unit);
}

.my-xxs {
  margin-top: var(--unit-xxs);
  margin-bottom: var(--unit-xxs);
}

.my-xs {
  margin-top: var(--unit-xs);
  margin-bottom: var(--unit-xs);
}

.my-s {
  margin-top: var(--unit-s);
  margin-bottom: var(--unit-s);
}

.my-m {
  margin-top: var(--unit-m);
  margin-bottom: var(--unit-m);
}

.my-l {
  margin-top: var(--unit-l);
  margin-bottom: var(--unit-l);
}

.my-xl {
  margin-top: var(--unit-xl);
  margin-bottom: var(--unit-xl);
}

.my-0 {
  margin-top: 0;
  margin-bottom: 0;
}

.mx-auto {
  margin-left: auto;
  margin-right: auto;
}

.mt--s {
  margin-top: calc(var(--unit-s) * -1);
}

.mt--m {
  margin-top: calc(var(--unit-m) * -1);
}

.mb--s {
  margin-bottom: calc(var(--unit-s) * -1);
}

.mb--xs {
  margin-bottom: calc(var(--unit-xs) * -1);
}

.my--s {
  margin-top: calc(var(--unit-s) * -1);
  margin-bottom: calc(var(--unit-s) * -1);
}

.my--xs {
  margin-top: calc(var(--unit-xs) * -1);
  margin-bottom: calc(var(--unit-xs) * -1);
}