/**
* Homebrew Spacing System for Pandiweb - Based on the root font size of 16px
* Running a 8 point system
*/

:root {
  --size-0: 0;
  --size-1: 0.25rem;
  --size-1-5: 0.375rem;
  --size-2: 0.5rem;
  --size-2-25: 0.5625rem;
  --size-2-5: 0.625rem;
  --size-2-75: 0.6875rem;
  --size-3: 0.75rem;
  --size-3-25: 0.8125rem;
  --size-3-5: 0.875rem;
  --size-3-75: 0.9375rem;
  --size-4: 1rem;
  --size-4-5: 1.125rem;
  --size-5: 1.25rem;
  --size-5-3125: 1.3125rem;
  --size-5-5: 1.375rem;
  --size-6: 1.5rem;
  --size-6-25: 1.5625rem;
  --size-6-5: 1.6875rem;
  --size-6-75: 1.625rem;
  --size-7: 1.75rem;
  --size-7-5: 1.85rem;
  --size-8: 2rem;
  --size-8-5: 2.125rem;
  --size-9: 2.25rem;
  --size-9-5: 2.375rem;
  --size-10: 2.5rem;
  --size-10-5: 2.625rem;
  --size-11: 2.75rem;
  --size-11-5: 2.875rem;
  --size-12: 3rem;
  --size-12-5: 3.125rem;
  --size-13: 3.25rem;
  --size-13-5: 3.375rem;
  --size-14: 3.5rem;
  --size-14-5: 3.625rem;
  --size-15: 3.75rem;
  --size-15-5: 3.85rem;
  --size-16: 4rem;
  --size-16-5: 4.125rem;
  --size-17: 4.25rem;
  --size-17-5: 4.375rem;
  --size-18: 4.5rem;
  --size-18-5: 4.625rem;
  --size-19: 4.75rem;
  --size-20: 5rem;
  --size-20-5: 5.125rem;
  --size-21: 5.25rem;
  --size-21-75: 5.438rem;
  --size-22: 5.5rem;
  --size-22-5: 5.625rem;
  --size-23: 5.75rem;
  --size-24: 6rem;
  --size-24-5: 6.125rem;
  --size-25: 6.25rem;
  --size-26: 6.5rem;
  --size-27: 6.75rem;
  --size-28: 7rem;
  --size-30: 7.5rem;
  --size-31: 7.75rem;
  --size-32: 8rem;
  --size-34: 8.5rem;
  --size-35: 8.75rem;
  --size-38: 9.5rem;
  --size-40: 10rem;
  --size-42: 10.5rem;
  --size-45: 11.25rem;
  --size-46: 11.5rem;
  --size-48: 12rem;
  --size-50: 12.5rem;
  --size-51-75: 12.938rem;
  --size-54: 13.5rem;
  --size-56: 14rem;
  --size-60: 15rem;
  --size-62: 15.5rem;
  --size-66: 16.5rem;
  --size-67-75: 16.938rem;
  --size-70: 17.4375rem;
}

/* Width */

.w-100 {
  width: 100%;
}

.w-auto {
  width: auto;
}

.h-100 {
  height: 100%;
}

@media (min-width: 576px) {
  .w-sm-auto {
    width: auto;
  }
}

/* Margin */

/* MT */

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

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

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

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

.mt-2-5 {
  margin-top: var(--size-2-5);
}

.mt-3-25 {
  margin-top: var(--size-3-25);
}

.mt-3-5 {
  margin-top: var(--size-3-5);
}

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

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

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

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

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

.mt-7-5 {
  margin-top: var(--size-7-5);
}

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

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

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

.mt-10-5 {
  margin-top: var(--size-10-5);
}

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

.mt-11-5 {
  margin-top: var(--size-11-5);
}

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

.mt-13-5 {
  margin-top: var(--size-13-5);
}

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

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

.mt-15-5 {
  margin-top: var(--size-15-5);
}

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

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

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

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

.mt-21-75 {
  margin-top: var(--size-21-75);
}

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

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

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

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

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

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

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

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

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

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

.mt-72 {
  margin-top: 4rem;
}

@media (min-width: 576px) {
  .sm-mt-0 {
    margin-top: 0;
  }
}

@media (min-width: 768px) {
  .md-mt-0 {
    margin-top: var(--size-0);
  }
  .md-mt-5 {
    margin-top: var(--size-5);
  }
  .md-mt-6-5 {
    margin-top: var(--size-6-5);
  }
  .md-mt-7 {
    margin-top: var(--size-7);
  }
  .md-mt-11 {
    margin-top: var(--size-11);
  }
  .md-mt-16 {
    margin-top: var(--size-16);
  }
  .md-mt-9 {
    margin-top: var(--size-9);
  }
  .md-mt-10 {
    margin-top: var(--size-10);
  }
  .md-mt-10-5 {
    margin-top: var(--size-10-5);
  }
  .md-mt-12 {
    margin-top: var(--size-12);
  }
  .md-mt-13-5 {
    margin-top: var(--size-13-5);
  }
  .md-mt-17 {
    margin-top: var(--size-17);
  }
  .md-mt-18 {
    margin-top: var(--size-18);
  }
  .md-mt-18-5 {
    margin-top: var(--size-18-5);
  }
  .md-mt-19 {
    margin-top: var(--size-19);
  }
  .md-mt-20 {
    margin-top: var(--size-20);
  }
  .md-mt-22 {
    margin-top: var(--size-22);
  }
  .md-mt-25 {
    margin-top: var(--size-25);
  }
  .md-mt-28 {
    margin-top: var(--size-28);
  }
  .md-mt-42 {
    margin-top: var(--size-42);
  }
  .md-mt-54 {
    margin-top: var(--size-54);
  }
  .md-mt-70 {
    margin-top: var(--size-70);
  }
}

@media (min-width: 1025px) {
  .lg-mt-0 {
    margin-top: var(--size-0);
  }
  .lg-mt-6-5 {
    margin-top: var(--size-6-5);
  }
  .lg-mt-10 {
    margin-top: var(--size-10);
  }
  .lg-mt-32 {
    margin-top: var(--size-32);
  }
  .lg-mt-40 {
    margin-top: var(--size-40);
  }
  .lg-mt-50 {
    margin-top: var(--size-50);
  }
  .lg-mt-56 {
    margin-top: var(--size-56);
  }
  .lg-mt-62 {
    margin-top: var(--size-62);
  }
}

@media (min-width: 1440px) {
  .xl-mt-12-5 {
    margin-top: var(--size-12-5);
  }
  .xl-mt-23 {
    margin-top: var(--size-23);
  }
}

/* MR */

.mr-1-5 {
  margin-right: var(--size-1-5);
}

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

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

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

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

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

.mr-7-5 {
  margin-right: var(--size-7-5);
}

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

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

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

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

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

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

@media (min-width: 768px) {
  .md-mr-0 {
    margin-right: var(--size-0);
  }
  .md-mr-7-5 {
    margin-right: var(--size-7-5);
  }
  .md-mr-8 {
    margin-right: var(--size-8);
  }
  .md-mr-10 {
    margin-right: var(--size-10);
  }
  .md-mr-11 {
    margin-right: var(--size-11);
  }
}

@media (min-width: 1025px) {
  .lg-mr-0 {
    margin-right: var(--size-0);
  }
  .lg-mr-4 {
    margin-right: var(--size-4);
  }
  .lg-mr-6 {
    margin-right: var(--size-6);
  }
  .lg-mr-8 {
    margin-right: var(--size-8);
  }
  .lg-mr-10 {
    margin-right: var(--size-10);
  }
}

/* ML */

.ml-1-5 {
  margin-left: var(--size-1-5);
}

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

.ml-2-5 {
  margin-left: var(--size-2-5);
}

.ml-3-5 {
  margin-left: var(--size-3-5);
}

.ml-3-75 {
  margin-left: var(--size-3-75);
}

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

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

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

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

.ml-10-5 {
  margin-left: var(--size-10-5);
}

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

@media (min-width: 768px) {
  .md-ml-4 {
    margin-left: var(--size-4);
  }
  .md-ml-10-5 {
    margin-left: var(--size-10-5);
  }
  .md-ml-12-5 {
    margin-left: var(--size-12-5);
  }
}

@media (min-width: 1025px) {
  .lg-ml-4 {
    margin-left: var(--size-4);
  }
  .lg-ml-10-5 {
    margin-left: var(--size-10-5);
  }
  .lg-ml-12-5 {
    margin-left: var(--size-12-5);
  }
}

/* MB */

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

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

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

.mb-2-5 {
  margin-bottom: var(--size-2-5);
}

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

.mb-3-5 {
  margin-bottom: var(--size-3-5);
}

.mb-3-75 {
  margin-bottom: var(--size-3-75);
}

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

.mb-4-5 {
  margin-bottom: var(--size-4-5);
}

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

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

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

.mb-6-5 {
  margin-bottom: var(--size-6-5);
}

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

.mb-7-5 {
  margin-bottom: var(--size-7-5);
}

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

.mb-8-5 {
  margin-bottom: var(--size-8-5);
}

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

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

.mb-10-5 {
  margin-bottom: var(--size-10-5);
}

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

.mb-11-5 {
  margin-bottom: var(--size-11-5);
}

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

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

.mb-13-5 {
  margin-bottom: var(--size-13-5);
}

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

.mb-15-5 {
  margin-bottom: var(--size-15-5);
}

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

.mb-17-5 {
  margin-bottom: var(--size-17-5);
}

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

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

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

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

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

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

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

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

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

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

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

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

@media (min-width: 576px) {
  .sm-mb-10 {
    margin-bottom: var(--size-10);
  }
}

@media (min-width: 768px) {
  .md-mb-0 {
    margin-bottom: var(--size-0);
  }
  .md-mb-3-5 {
    margin-bottom: var(--size-3-5);
  }
  .md-mb-4 {
    margin-bottom: var(--size-4);
  }
  .md-mb-4-5 {
    margin-bottom: var(--size-4-5);
  }
  .md-mb-6 {
    margin-bottom: var(--size-6);
  }
  .md-mb-6-5 {
    margin-bottom: var(--size-6-5);
  }
  .md-mb-7-5 {
    margin-bottom: var(--size-7-5);
  }
  .md-mb-8 {
    margin-bottom: var(--size-8);
  }
  .md-mb-10 {
    margin-bottom: var(--size-10);
  }
  .md-mb-11 {
    margin-bottom: var(--size-11);
  }
  .md-mb-11-5 {
    margin-bottom: var(--size-11-5);
  }
  .md-mb-12 {
    margin-bottom: var(--size-12);
  }
  .md-mb-14 {
    margin-bottom: var(--size-14);
  }
  .md-mb-16 {
    margin-bottom: var(--size-16);
  }
  .md-mb-17-5 {
    margin-bottom: var(--size-17-5);
  }
  .md-mb-18 {
    margin-bottom: var(--size-18);
  }
  .md-mb-19 {
    margin-bottom: var(--size-19);
  }
  .md-mb-20 {
    margin-bottom: var(--size-20);
  }
  .md-mb-22 {
    margin-bottom: var(--size-22);
  }
  .md-mb-26 {
    margin-bottom: var(--size-26);
  }
  .md-mb-28 {
    margin-bottom: var(--size-28);
  }
  .md-mb-34 {
    margin-bottom: var(--size-34);
  }
  .md-mb-56 {
    margin-bottom: var(--size-56);
  }
}

@media (min-width: 1025px) {
  .lg-mb-0 {
    margin-bottom: 0;
  }
  .lg-mb-4 {
    margin-bottom: var(--size-4);
  }
  .lg-mb-6 {
    margin-bottom: var(--size-6);
  }
  .lg-mb-9 {
    margin-bottom: var(--size-9);
  }
  .lg-mb-10 {
    margin-bottom: var(--size-10);
  }
  .lg-mb-14 {
    margin-bottom: var(--size-14);
  }
  .lg-mb-18 {
    margin-bottom: var(--size-18);
  }
  .lg-mb-20 {
    margin-bottom: var(--size-20);
  }
  .lg-mb-22 {
    margin-bottom: var(--size-22);
  }
  .lg-mb-24 {
    margin-bottom: var(--size-24);
  }
  .lg-mb-28 {
    margin-bottom: var(--size-28);
  }
  .lg-mb-30 {
    margin-bottom: var(--size-30);
  }
  .lg-mb-38 {
    margin-bottom: var(--size-38);
  }
  .lg-mb-40 {
    margin-bottom: var(--size-40);
  }
  .lg-mb-42 {
    margin-bottom: var(--size-42);
  }
  .lg-mb-50 {
    margin-bottom: var(--size-50);
  }
  .lg-mb-54 {
    margin-bottom: var(--size-54);
  }
}

@media (min-width: 1200px) {
  .xl-mb-0 {
    margin-bottom: var(--size-0);
  }
  .xl-mb-9 {
    margin-bottom: var(--size-9);
  }
  .xl-mb-18 {
    margin-bottom: var(--size-18);
  }
}

.mx-1-5 {
  margin-left: var(--size-1-5);
  margin-right: var(--size-1-5);
}

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

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

/* MY */

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

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

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

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

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

@media (min-width: 768px) {
  .lg-my-8 {
    margin-top: var(--size-8);
    margin-bottom: var(--size-8);
  }
  .md-my-16 {
    margin-top: var(--size-16);
    margin-bottom: var(--size-16);
  }
}

@media (min-width: 1025px) {
  .lg-my-12 {
    margin-top: var(--size-12);
    margin-bottom: var(--size-12);
  }
  .lg-my-22 {
    margin-top: var(--size-22);
    margin-bottom: var(--size-22);
  }
  .lg-my-46 {
    margin-top: var(--size-46);
    margin-bottom: var(--size-46);
  }
}

/* Padding */

/* PT */

.pt-2 {
  padding-top: var(--size-2);
}

.pt-4 {
  padding-top: var(--size-4);
}

.pt-5 {
  padding-top: var(--size-5);
}

.pt-6 {
  padding-top: var(--size-6);
}

.pt-7 {
  padding-top: var(--size-7);
}

.pt-7-5 {
  padding-top: var(--size-7-5);
}

.pt-8 {
  padding-top: var(--size-8);
}

.pt-9-5 {
  padding-top: var(--size-9-5);
}

.pt-10 {
  padding-top: var(--size-10);
}

.pt-12 {
  padding-top: var(--size-12);
}

.pt-12-5 {
  padding-top: var(--size-12-5);
}

.pt-14 {
  padding-top: var(--size-14);
}

.pt-14-5 {
  padding-top: var(--size-14-5);
}

.pt-15 {
  padding-top: var(--size-15);
}

.pt-16 {
  padding-top: var(--size-16);
}

.pt-18 {
  padding-top: var(--size-18);
}

.pt-20 {
  padding-top: var(--size-20);
}

.pt-21 {
  padding-top: var(--size-21);
}

.pt-22-5 {
  padding-top: var(--size-22-5);
}

.pt-23 {
  padding-top: var(--size-23);
}

.pt-24 {
  padding-top: var(--size-24);
}

.pt-28 {
  padding-top: var(--size-28);
}

.pt-28 {
  padding-top: var(--size-28);
}

.pt-30 {
  padding-top: var(--size-30);
}

.pt-32 {
  padding-top: var(--size-32);
}

.pt-38 {
  padding-top: var(--size-38);
}

.pt-40 {
  padding-top: var(--size-40);
}

.pt-57-75 {
  padding-top: var(--size-51-75);
}

.pt-60 {
  padding-top: var(--size-60);
}

.pt-67-75 {
  padding-top: var(--size-67-75);
}

/* PR */

.pr-0 {
  padding-right: 0;
}

.pr-2 {
  padding-right: var(--size-2);
}

.pr-2-5 {
  padding-right: var(--size-2-5);
}

.pr-2-25 {
  padding-right: var(--size-2-25);
}

.pr-4 {
  padding-right: var(--size-4);
}

.pr-5 {
  padding-right: var(--size-5);
}

.pr-5-3125 {
  padding-right: var(--size-5-3125);
}

.pr-6 {
  padding-right: var(--size-6);
}

.pr-31 {
  padding-right: var(--size-31);
}

@media (min-width: 768px) {
  .md-pr-0 {
    padding-right: 0;
  }
  .md-pr-4 {
    padding-right: var(--size-4);
  }
  .md-pr-5 {
    padding-right: var(--size-5);
  }
  .md-pt-9-5 {
    padding-top: var(--size-9-5);
  }
  .md-pr-12-5 {
    padding-right: var(--size-12-5);
  }
  .md-pr-15-5 {
    padding-right: var(--size-12-5);
  }
}

/* PB */

.pb-2 {
  padding-bottom: var(--size-2);
}

.pb-3 {
  padding-bottom: var(--size-3);
}

.pb-4 {
  padding-bottom: var(--size-4);
}

.pb-4-5 {
  padding-bottom: var(--size-4-5);
}

.pb-5 {
  padding-bottom: var(--size-5);
}

.pb-6 {
  padding-bottom: var(--size-6);
}

.pb-6-25 {
  padding-bottom: var(--size-6-25);
}

.pb-7 {
  padding-bottom: var(--size-7);
}

.pb-8 {
  padding-bottom: var(--size-8);
}

.pb-10 {
  padding-bottom: var(--size-10);
}

.pb-12 {
  padding-bottom: var(--size-12);
}

.pb-14 {
  padding-bottom: var(--size-14);
}

.pb-16 {
  padding-bottom: var(--size-16);
}

.pb-18 {
  padding-bottom: var(--size-18);
}

.pb-20 {
  padding-bottom: var(--size-20);
}

.pb-20-5 {
  padding-bottom: var(--size-20-5);
}

.pt-23 {
  padding-bottom: var(--size-23);
}

.pb-24 {
  padding-bottom: var(--size-24);
}

.pb-28 {
  padding-bottom: var(--size-28);
}

.pb-30 {
  padding-bottom: var(--size-30);
}

.pb-45 {
  padding-bottom: var(--size-45);
}

@media (min-width: 768px) {
  .md-pb-0 {
    padding-bottom: var(--size-0);
  }
  .md-pb-12-5 {
    padding-bottom: var(--size-12-5);
  }
  .md-pb-13-5 {
    padding-bottom: var(--size-13-5);
  }
}

@media (min-width: 768px) {
  .md-pb-0 {
    padding-bottom: var(--size-0);
  }
  .md-pb-12-5 {
    padding-bottom: var(--size-12-5);
  }
  .md-pb-13-5 {
    padding-bottom: var(--size-13-5);
  }
}

@media (min-width: 1025px) {
  .lg-pb-0 {
    padding-bottom: var(--size-0);
  }
  .lg-pb-12-5 {
    padding-bottom: var(--size-12-5);
  }
  .lg-pb-13-5 {
    padding-bottom: var(--size-13-5);
  }
}

@media (min-width: 1441px) {
  .xl-pb-0 {
    padding-bottom: var(--size-0);
  }
  .xl-pb-12-5 {
    padding-bottom: var(--size-12-5);
  }
  .xl-pb-13-5 {
    padding-bottom: var(--size-13-5);
  }

  .xl-pb-28 {
    padding-bottom: var(--size-28);
  }
}

/* PL */

.pl-2 {
  padding-left: var(--size-2);
}

.pl-2-5 {
  padding-left: var(--size-2-5);
}

.pl-5 {
  padding-left: var(--size-5);
}

.pl-5-3125 {
  padding-left: var(--size-5-3125);
}

.pl-6 {
  padding-left: var(--size-6);
}

.pl-13 {
  padding-left: var(--size-13);
}

@media (min-width: 576px) {
  .sm-pl-0 {
    padding-left: 0;
  }
}

@media (min-width: 768px) {
  .md-pl-0 {
    padding-left: var(--size-0);
  }
  .md-pl-12-5 {
    padding-left: var(--size-12-5);
  }
  .md-pl-13-5 {
    padding-left: var(--size-13-5);
  }
}

/* PY */

.py-1-5 {
  padding-top: var(--size-1-5);
  padding-bottom: var(--size-1-5);
}

.py-2 {
  padding-top: var(--size-2);
  padding-bottom: var(--size-2);
}

.py-2-5 {
  padding-top: var(--size-2-5);
  padding-bottom: var(--size-2-5);
}

.py-3 {
  padding-top: var(--size-3);
  padding-bottom: var(--size-3);
}

.py-3-5 {
  padding-top: var(--size-3-5);
  padding-bottom: var(--size-3-5);
}

.py-3-5 {
  padding-top: var(--size-3-5);
  padding-bottom: var(--size-3-5);
}

.py-4 {
  padding-top: var(--size-4);
  padding-bottom: var(--size-4);
}

.py-4-5 {
  padding-top: var(--size-4-5);
  padding-bottom: var(--size-4-5);
}

.py-5 {
  padding-top: var(--size-5);
  padding-bottom: var(--size-5);
}

.py-5-5 {
  padding-top: var(--size-5-5);
  padding-bottom: var(--size-5-5);
}

.py-6 {
  padding-top: var(--size-6);
  padding-bottom: var(--size-6);
}

.py-6-5 {
  padding-top: var(--size-6-5);
  padding-bottom: var(--size-6-5);
}

.py-6-25 {
  padding-top: var(--size-6-25);
  padding-bottom: var(--size-6-25);
}

.py-7 {
  padding-top: var(--size-7);
  padding-bottom: var(--size-7);
}

.py-7-5 {
  padding-top: var(--size-7-5);
  padding-bottom: var(--size-7-5);
}

.py-8 {
  padding-top: var(--size-8);
  padding-bottom: var(--size-8);
}

.py-9 {
  padding-top: var(--size-9);
  padding-bottom: var(--size-9);
}

.py-10 {
  padding-top: var(--size-10);
  padding-bottom: var(--size-10);
}

.py-11-5 {
  padding-top: var(--size-11-5);
  padding-bottom: var(--size-11-5);
}

.py-12 {
  padding-top: var(--size-12);
  padding-bottom: var(--size-12);
}

.py-20 {
  padding-top: var(--size-20);
  padding-bottom: var(--size-20);
}

@media (min-width: 768px) {
  .md-py-0 {
    padding-top: var(--size-0);
    padding-bottom: var(--size-0);
  }
  .md-py-7-5 {
    padding-top: var(--size-7-5);
    padding-bottom: var(--size-7-5);
  }
  .md-py-8 {
    padding-top: var(--size-8);
    padding-bottom: var(--size-8);
  }
  .md-py-10 {
    padding-top: var(--size-10);
    padding-bottom: var(--size-10);
  }
  .md-py-10-5 {
    padding-top: var(--size-10-5);
    padding-bottom: var(--size-10-5);
  }
  .md-py-11-5 {
    padding-top: var(--size-11-5);
    padding-bottom: var(--size-11-5);
  }
  .md-py-12 {
    padding-top: var(--size-12);
    padding-bottom: var(--size-12);
  }
  .md-py-14 {
    padding-top: var(--size-14);
    padding-bottom: var(--size-14);
  }
  .md-py-16 {
    padding-top: var(--size-16);
    padding-bottom: var(--size-16);
  }
  .md-py-16-5 {
    padding-top: var(--size-16-5);
    padding-bottom: var(--size-16-5);
  }
}

@media (min-width: 1025px) {
  .lg-pb-0 {
    padding-bottom: 0;
  }
  .lg-pb-14 {
    padding-bottom: var(--size-14);
  }
  .lg-pb-20 {
    padding-bottom: var(--size-20);
  }
  .lg-pb-20-5 {
    padding-bottom: var(--size-20-5);
  }
  .lg-pb-21 {
    padding-bottom: var(--size-21);
  }
  .lg-pb-28 {
    padding-bottom: var(--size-28);
  }
  .lg-pb-24 {
    padding-bottom: var(--size-24);
  }
  .lg-pb-32 {
    padding-bottom: var(--size-32);
  }
  .lg-pb-40 {
    padding-bottom: var(--size-40);
  }
}

@media (min-width: 1025px) {
  .lg-py-6 {
    padding-top: var(--size-6);
    padding-bottom: var(--size-6);
  }
  .lg-py-40 {
    padding-top: var(--size-40);
    padding-bottom: var(--size-40);
  }
}

@media (min-width: 1440px) {
  .xl-py-7-5 {
    padding-top: var(--size-7-5);
    padding-bottom: var(--size-7-5);
  }
}

/* PX */

.px-2-5 {
  padding-left: var(--size-2-5);
  padding-right: var(--size-2-5);
}

.px-4 {
  padding-left: var(--size-4);
  padding-right: var(--size-4);
}

.px-3 {
  padding-left: var(--size-3);
  padding-right: var(--size-3);
}

.px-3-5 {
  padding-left: var(--size-3-5);
  padding-right: var(--size-3-5);
}

.px-5 {
  padding-left: var(--size-5);
  padding-right: var(--size-5);
}

.px-6 {
  padding-left: var(--size-6);
  padding-right: var(--size-6);
}

.px-6-5 {
  padding-left: var(--size-6-5);
  padding-right: var(--size-6-5);
}

.px-7 {
  padding-left: var(--size-7);
  padding-right: var(--size-7);
}

.px-6-75 {
  padding-left: var(--size-6-75);
  padding-right: var(--size-6-75);
}

.px-8 {
  padding-left: var(--size-8);
  padding-right: var(--size-8);
}

.px-9 {
  padding-left: var(--size-9);
  padding-right: var(--size-9);
}

.px-10 {
  padding-left: var(--size-10);
  padding-right: var(--size-10);
}

.px-11-5 {
  padding-left: var(--size-11-5);
  padding-right: var(--size--11-5);
}

.px-12 {
  padding-left: var(--size-12);
  padding-right: var(--size--12);
}

@media (min-width: 576px) {
  .sm-px-0 {
    padding-left: 0;
    padding-right: 0;
  }
}

@media (min-width: 768px) {
  .md-px-8 {
    padding-left: var(--size-8);
    padding-right: var(--size-8);
  }
  .md-px-10 {
    padding-left: var(--size-10);
    padding-right: var(--size-10);
  }
  .md-px-11-5 {
    padding-left: var(--size-11-5);
    padding-right: var(--size-11-5);
  }
  .md-px-12 {
    padding-left: var(--size-12);
    padding-right: var(--size-12);
  }
  .md-px-12-5 {
    padding-left: var(--size-12-5);
    padding-right: var(--size-12-5);
  }
  .md-px-14-5 {
    padding-left: var(--size-14-5);
    padding-right: var(--size-14-5);
  }
}

@media (min-width: 1025px) {
  .lg-px-0 {
    padding-left: 0;
    padding-right: 0;
  }
}

@media (min-width: 1025px) {
  .lg-pt-0 {
    padding-top: var(--size-0);
  }
  .lg-pt-6 {
    padding-top: var(--size-6);
  }
  .lg-pt-12 {
    padding-top: var(--size-12);
  }
  .lg-pt-14-5 {
    padding-top: var(--size-14-5);
  }
  .lg-pt-21 {
    padding-top: var(--size-21);
  }
  .lg-pt-28 {
    padding-top: var(--size-28);
  }
  .lg-pt-38 {
    padding-top: var(--size-38);
  }

  .lg-pt-40 {
    padding-top: var(--size-40);
  }

  .lg-pt-56 {
    padding-top: var(--size-56);
  }
  .lg-pt-62 {
    padding-top: var(--size-62);
  }
}

@media (min-width: 1440px) {
  .xl-px-8 {
    padding-left: var(--size-8);
    padding-right: var(--size-8);
  }
}

/* MD PT */

@media (min-width: 768px) {
  .md-pt-0 {
    padding-top: var(--size-0);
  }
  .md-pt-2 {
    padding-top: var(--size-2);
  }
  .md-pt-4 {
    padding-top: var(--size-4);
  }
  .md-pt-8 {
    padding-top: var(--size-8);
  }
  .md-pt-9-5 {
    padding-top: var(--size-9-5);
  }
  .md-pt-10 {
    padding-top: var(--size-10);
  }
  .md-pt-11-5 {
    padding-top: var(--size-11-5);
  }
  .md-pt-14 {
    padding-top: var(--size-14);
  }
  .md-pt-14-5 {
    padding-top: var(--size-14-5);
  }

  .md-pt-20 {
    padding-top: var(--size-20);
  }

  .md-pt-30 {
    padding-top: var(--size-30);
  }

  .md-pt-32 {
    padding-top: var(--size-32);
  }
  .md-pt-38 {
    padding-top: var(--size-38);
  }
  .md-pt-48 {
    padding-top: var(--size-48);
  }

  .md-pt-57-75 {
    padding-top: var(--size-51-75);
  }

  .md-pt-60 {
    padding-top: var(--size-60);
  }
  .md-pt-67-75 {
    padding-top: var(--size-67-75);
  }
}

/* lg PT */

@media (min-width: 1025px) {
  .lg-pt-0 {
    padding-top: var(--size-0);
  }
  .lg-pt-2 {
    padding-top: var(--size-2);
  }
  .lg-pt-4 {
    padding-top: var(--size-4);
  }
  .lg-pt-8 {
    padding-top: var(--size-8);
  }
  .lg-pt-9-5 {
    padding-top: var(--size-9-5);
  }
  .lg-pt-10 {
    padding-top: var(--size-10);
  }
  .lg-pt-11-5 {
    padding-top: var(--size-11-5);
  }
  .lg-pt-14 {
    padding-top: var(--size-14);
  }
  .lg-pt-14-5 {
    padding-top: var(--size-14-5);
  }
  .lg-pt-32 {
    padding-top: var(--size-32);
  }
  .lg-pt-38 {
    padding-top: var(--size-38);
  }
  .lg-pt-48 {
    padding-top: var(--size-48);
  }

  .lg-pt-57-75 {
    padding-top: var(--size-51-75);
  }

  .lg-pt-60 {
    padding-top: var(--size-60);
  }
  .lg-pt-67-75 {
    padding-top: var(--size-67-75);
  }
}

/* MD PB */

@media (min-width: 768px) {
  .md-pb-0 {
    padding-bottom: var(--size-0);
  }
  .md-pb-4 {
    padding-bottom: var(--size-4);
  }
  .md-pb-8-5 {
    padding-bottom: var(--size-8-5);
  }
  .md-pb-10 {
    padding-bottom: var(--size-10);
  }
  .md-pb-12 {
    padding-bottom: var(--size-12);
  }
  .md-pb-14 {
    padding-bottom: var(--size-14);
  }
  .md-pb-16 {
    padding-bottom: var(--size-16);
  }
  .md-pb-18 {
    padding-bottom: var(--size-18);
  }
  .md-pb-20 {
    padding-bottom: var(--size-20);
  }
  .md-pb-20-5 {
    padding-bottom: var(--size-20-5);
  }
  .md-pb-32 {
    padding-bottom: var(--size-32);
  }
  .md-pb-66 {
    padding-bottom: var(--size-66);
  }
}

/* PXY */

.pxy-11 {
  padding: var(--size-11);
}

.pxy-5 {
  padding: var(--size-5);
}

/* Margin auto */

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

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

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

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

.mt-unset {
  margin: 0 !important;
}

@media screen and (min-width: 768px) {
  .md-mt-auto {
    margin-top: auto;
  }
  .md-mt-unset {
    margin: 0 !important;
  }
}