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

:root {
  --size-0: 0;
  --size-0-25: 0.0625rem;
  --size-0-5: 0.125rem;
  --size-1: 0.25rem;
  --size-1-5: 0.375rem;
  --size-2: 0.5rem;
  --size-2-5: 0.625rem;
  --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-5: 1.375rem;
  --size-5-75: 1.438rem;
  --size-6: 1.5rem;
  --size-6-5: 1.625rem;
  --size-6-75: 1.6875rem;
  --size-7: 1.75rem;
  --size-7-5: 1.85rem;
  --size-8: 2rem;
  --size-9: 2.375rem;
  --size-10: 2.5rem;
  --size-10-5: 2.625rem;
  --size-11: 2.875rem;
  --size-12: 3rem;
  --size-12-5: 3.125rem;
  --size-14: 3.5rem;
  --size-14-5: 3.625rem;
  --size-15: 3.75rem;
  --size-16: 4rem;
  --size-17-5: 4.375rem;
  --size-18: 4.5rem;
  --size-19: 4.75rem;
  --size-20: 5rem;
  --size-21-25: 5.313rem;
  --size-22: 5.5rem;
  --size-23-5: 5.875rem;
  --size-24: 6rem;
  --size-26: 6.5rem;
  --size-27-5: 6.875rem;
  --size-28: 7rem;
  --size-30: 7.5rem;
  --size-32: 8rem;
  --size-32-25: 8.063rem;
  --size-34: 8.5rem;
  --size-35: 8.75rem;
  --size-38: 9.5rem;
  --size-40: 10rem;
  --size-42: 10.5rem;
  --size-46: 11.5rem;
  --size-48: 12rem;
  --size-50: 12.5rem;
  --size-54: 13.5rem;
  --size-56: 14rem;
  --size-62: 15.5rem;
  --size-64: 16rem;
  --size-66: 16.5rem;
  --size-79-25: 19.813rem;
  --size-87-5: 21.875rem;
}

/* Margin */

/* MT */

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

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

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

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

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

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

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

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

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

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

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

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

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

.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-56 {
  margin-top: 3.11rem;
}

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

@media (min-width: 768px) {
  .md-mt-0 {
    margin-top: var(--size-0);
  }

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

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

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

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

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

@media (min-width: 1025px) {
  .lg-mt-0 {
    margin-top: var(--size-0);
  }

  .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);
  }
}

/* MR */

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

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

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

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

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

.mr-14 {
  margin-right: var(--size-14);
}
@media (min-width: 576px) {
  .sm-mr-1 {
    margin-right: var(--size-1);
  }
  .sm-mr-2 {
    margin-right: var(--size-2);
  }
  .sm-mr-4 {
    margin-right: var(--size-4);
  }
}

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

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

@media (min-width: 1025px) {
  .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 {
  margin-left: var(--size-1);
}
.ml-2 {
  margin-left: var(--size-2);
}
.ml-3 {
  margin-left: var(--size-3);
}
.ml-4 {
  margin-left: var(--size-4);
}
.ml-4-5 {
  margin-left: var(--size-4-5);
}

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

@media (min-width: 576px) {
  .sm-ml-1 {
    margin-left: var(--size-1);
  }
  .sm-ml-2 {
    margin-left: var(--size-2);
  }
  .sm-ml-4 {
    margin-left: var(--size-4);
  }
}

/* MB */


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

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

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

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

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

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

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

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

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

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

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

.mb-14 {
  margin-bottom: var(--size-14);
}
.mb-14-5 {
  margin-bottom: var(--size-14-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-23-5 {
  margin-bottom: var(--size-23-5);
}

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

.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-0 {
    margin-bottom: 0;
  }
}

@media (min-width: 768px) {
  .md-mb-0 {
    margin-bottom: var(--size-0);
  }

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

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

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

  .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-22 {
    margin-bottom: var(--size-22);
  }

  .md-mb-26 {
    margin-bottom: var(--size-26);
  }
  .md-mb-27-5 {
    margin-bottom: var(--size-27-5);
  }
  .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-10 {
    margin-bottom: var(--size-10);
  }

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

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

  .lg-mb-22 {
    margin-bottom: var(--size-22);
  }
  .lg-mb-27-5 {
    margin-bottom: var(--size-27-5);
  }
  .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);
  }
}

.mx-0 {
  margin-left: var(--size-0);
  margin-right: var(--size-0);
}
.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-0 {
  margin-top: 0;
  margin-bottom: 0;
}
.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-3 {
  padding-top: var(--size-3);
}
.pt-4 {
  padding-top: var(--size-4);
}

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

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

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

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

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

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

.pt-14 {
  padding-top: var(--size-14);
}
.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-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);
}

@media (min-width: 576px) {
  .sm-pt-12 {
    padding-top: var(--size-12);
  }
}

@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 {
    padding-top: var(--size-9);
  }
  .md-pt-10 {
    padding-top: var(--size-10);
  }
  .md-pt-12 {
    padding-top: var(--size-12);
  }

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

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

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

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

  .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-50 {
    padding-top: var(--size-50);
  }
}

@media (min-width: 1025px) {
  .lg-pt-0 {
    padding-top: var(--size-0);
  }

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

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

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

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

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

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

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

/* PR */

.pr-0 {
  padding-right: var(--size-0);
}
.pr-2 {
  padding-right: var(--size-2);
}
.pr-4 {
  padding-right: var(--size-4);
}
.pr-8 {
  padding-right: var(--size-8);
}
.pr-9 {
  padding-right: var(--size-9);
}

@media (min-width: 576px) {
  .sm-pr-8 {
    padding-right: var(--size-8);
  }
}
@media (min-width: 768px) {
  .md-pr-11 {
    padding-right: var(--size-11);
  }
}

/* PB */

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

@media (min-width: 576px) {
  .sm-pb-9 {
    padding-bottom: var(--size-9);
  }
}

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

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

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

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

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

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

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

  .md-pb-79-25 {
    padding-bottom: var(--size-79-25);
  }
}
@media (min-width: 1025px) {
  .lg-pb-4 {
    padding-bottom: var(--size-4);
  }
  .lg-pb-14 {
    padding-bottom: var(--size-14);
  }

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

  .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);
  }

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

/* PL */

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

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

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

.pl-12 {
  padding-left: var(--size-12) !important;
}

.pl-15 {
  padding-left: var(--size-15);
}
@media (min-width: 768px) {
  .md-pl-11 {
    padding-left: var(--size-11);
  }

  .md-pl-12 {
    padding-left: var(--size-12) !important;
  }
}
@media (min-width: 1024px) {
  .lg-pl-11 {
    padding-left: var(--size-11);
  }
}
/* PY */

.py-0-5 {
  padding-top: var(--size-0-5);
  padding-bottom: var(--size-0-5);
}
.py-1 {
  padding-top: var(--size-1);
  padding-bottom: var(--size-1);
}
.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-2 {
  padding-top: var(--size-2);
  padding-bottom: var(--size-2);
}
.py-3 {
  padding-top: var(--size-3);
  padding-bottom: var(--size-3);
}
.py-4 {
  padding-top: var(--size-4);
  padding-bottom: var(--size-4);
}

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

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

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

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

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

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

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

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

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

@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);
  }
}

/* PX */

.px-1-5 {
  padding-left: var(--size-1-5);
  padding-right: var(--size-1-5);
}
.px-2-5 {
  padding-left: var(--size-2-5);
  padding-right: var(--size-2-5);
}
.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-4 {
  padding-left: var(--size-4);
  padding-right: var(--size-4);
}
.px-6 {
  padding-left: var(--size-6);
  padding-right: var(--size-6);
}

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

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

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

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

@media (min-width: 576px) {
  .sm-px-4 {
    padding-left: var(--size-4);
    padding-right: var(--size-4);
  }
  .sm-px-6 {
    padding-left: var(--size-6);
    padding-right: var(--size-6);
  }
}

@media (min-width: 768px) {
}

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

@media (min-width: 1441px) {
  .xl-pb-79-25 {
    padding-bottom: var(--size-79-25);
  }
}

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