/* ==== PADDING ==== */
:root {
  --space-unit: 1px !important;
}

/* Padding All */
.p-0 { padding: 0px !important; }
.p-1 { padding: 1px !important; }
.p-2 { padding: 2px !important; }
.p-3 { padding: 3px !important; }
.p-4 { padding: 4px !important; }
.p-5 { padding: 5px !important; }
.p-10 { padding: 10px !important; }
.p-15 { padding: 15px !important; }
.p-20 { padding: 20px !important; }
.p-25 { padding: 25px !important; }
.p-30 { padding: 30px !important; }
.p-40 { padding: 40px !important; }
.p-50 { padding: 50px !important; }
.p-60 { padding: 60px !important; }
.p-70 { padding: 70px !important; }
.p-80 { padding: 80px !important; }
.p-90 { padding: 90px !important; }
.p-100 { padding: 100px !important; }

/* Padding Top */
.pt-0 { padding-top: 0px !important; }
.pt-1 { padding-top: 1px !important; }
.pt-2 { padding-top: 2px !important; }
.pt-3 { padding-top: 3px !important; }
.pt-4 { padding-top: 4px !important; }
.pt-5 { padding-top: 5px !important; }
.pt-10 { padding-top: 10px !important; }
.pt-15 { padding-top: 15px !important; }
.pt-20 { padding-top: 20px !important; }
.pt-25 { padding-top: 25px !important; }
.pt-30 { padding-top: 30px !important; }
.pt-40 { padding-top: 40px !important; }
.pt-50 { padding-top: 50px !important; }
.pt-60 { padding-top: 60px !important; }
.pt-70 { padding-top: 70px !important; }
.pt-80 { padding-top: 80px !important; }
.pt-90 { padding-top: 90px !important; }
.pt-100 { padding-top: 100px !important; }

/* Padding Bottom */
.pb-0 { padding-bottom: 0px !important; }
.pb-1 { padding-bottom: 1px !important; }
.pb-2 { padding-bottom: 2px !important; }
.pb-3 { padding-bottom: 3px !important; }
.pb-4 { padding-bottom: 4px !important; }
.pb-5 { padding-bottom: 5px !important; }
.pb-10 { padding-bottom: 10px !important; }
.pb-15 { padding-bottom: 15px !important; }
.pb-20 { padding-bottom: 20px !important; }
.pb-25 { padding-bottom: 25px !important; }
.pb-30 { padding-bottom: 30px !important; }
.pb-40 { padding-bottom: 40px !important; }
.pb-50 { padding-bottom: 50px !important; }
.pb-60 { padding-bottom: 60px !important; }
.pb-70 { padding-bottom: 70px !important; }
.pb-80 { padding-bottom: 80px !important; }
.pb-90 { padding-bottom: 90px !important; }
.pb-100 { padding-bottom: 100px !important; }

/* Padding Left */
.pl-0 { padding-left: 0px !important; }
.pl-1 { padding-left: 1px !important; }
.pl-2 { padding-left: 2px !important; }
.pl-3 { padding-left: 3px !important; }
.pl-4 { padding-left: 4px !important; }
.pl-5 { padding-left: 5px !important; }
.pl-10 { padding-left: 10px !important; }
.pl-15 { padding-left: 15px !important; }
.pl-20 { padding-left: 20px !important; }
.pl-25 { padding-left: 25px !important; }
.pl-30 { padding-left: 30px !important; }
.pl-40 { padding-left: 40px !important; }
.pl-50 { padding-left: 50px !important; }
.pl-60 { padding-left: 60px !important; }
.pl-70 { padding-left: 70px !important; }
.pl-80 { padding-left: 80px !important; }
.pl-90 { padding-left: 90px !important; }
.pl-100 { padding-left: 100px !important; }

/* Padding Right */
.pr-0 { padding-right: 0px !important; }
.pr-1 { padding-right: 1px !important; }
.pr-2 { padding-right: 2px !important; }
.pr-3 { padding-right: 3px !important; }
.pr-4 { padding-right: 4px !important; }
.pr-5 { padding-right: 5px !important; }
.pr-10 { padding-right: 10px !important; }
.pr-15 { padding-right: 15px !important; }
.pr-20 { padding-right: 20px !important; }
.pr-25 { padding-right: 25px !important; }
.pr-30 { padding-right: 30px !important; }
.pr-40 { padding-right: 40px !important; }
.pr-50 { padding-right: 50px !important; }
.pr-60 { padding-right: 60px !important; }
.pr-70 { padding-right: 70px !important; }
.pr-80 { padding-right: 80px !important; }
.pr-90 { padding-right: 90px !important; }
.pr-100 { padding-right: 100px !important; }

/* Padding X (left + right) */
.px-0 { padding-left: 0px !important; padding-right: 0px !important; }
.px-1 { padding-left: 1px !important; padding-right: 1px !important; }
.px-2 { padding-left: 2px !important; padding-right: 2px !important; }
.px-3 { padding-left: 3px !important; padding-right: 3px !important; }
.px-4 { padding-left: 4px !important; padding-right: 4px !important; }
.px-5 { padding-left: 5px !important; padding-right: 5px !important; }
.px-10 { padding-left: 10px !important; padding-right: 10px !important; }
.px-15 { padding-left: 15px !important; padding-right: 15px !important; }
.px-20 { padding-left: 20px !important; padding-right: 20px !important; }
.px-25 { padding-left: 25px !important; padding-right: 25px !important; }
.px-30 { padding-left: 30px !important; padding-right: 30px !important; }
.px-40 { padding-left: 40px !important; padding-right: 40px !important; }
.px-50 { padding-left: 50px !important; padding-right: 50px !important; }
.px-60 { padding-left: 60px !important; padding-right: 60px !important; }
.px-70 { padding-left: 70px !important; padding-right: 70px !important; }
.px-80 { padding-left: 80px !important; padding-right: 80px !important; }
.px-90 { padding-left: 90px !important; padding-right: 90px !important; }
.px-100 { padding-left: 100px !important; padding-right: 100px !important; }

/* Padding Y (top + bottom) */
.py-0 { padding-top: 0px !important; padding-bottom: 0px !important; }
.py-1 { padding-top: 1px !important; padding-bottom: 1px !important; }
.py-2 { padding-top: 2px !important; padding-bottom: 2px !important; }
.py-3 { padding-top: 3px !important; padding-bottom: 3px !important; }
.py-4 { padding-top: 4px !important; padding-bottom: 4px !important; }
.py-5 { padding-top: 5px !important; padding-bottom: 5px !important; }
.py-10 { padding-top: 10px !important; padding-bottom: 10px !important; }
.py-15 { padding-top: 15px !important; padding-bottom: 15px !important; }
.py-20 { padding-top: 20px !important; padding-bottom: 20px !important; }
.py-25 { padding-top: 25px !important; padding-bottom: 25px !important; }
.py-30 { padding-top: 30px !important; padding-bottom: 30px !important; }
.py-40 { padding-top: 40px !important; padding-bottom: 40px !important; }
.py-50 { padding-top: 50px !important; padding-bottom: 50px !important; }
.py-60 { padding-top: 60px !important; padding-bottom: 60px !important; }
.py-70 { padding-top: 70px !important; padding-bottom: 70px !important; }
.py-80 { padding-top: 80px !important; padding-bottom: 80px !important; }
.py-90 { padding-top: 90px !important; padding-bottom: 90px !important; }
.py-100 { padding-top: 100px !important; padding-bottom: 100px !important; }

/* ==== MARGIN ==== */

/* Margin All */
.m-0 { margin: 0px !important; }
.m-1 { margin: 1px !important; }
.m-2 { margin: 2px !important; }
.m-3 { margin: 3px !important; }
.m-4 { margin: 4px !important; }
.m-5 { margin: 5px !important; }
.m-10 { margin: 10px !important; }
.m-15 { margin: 15px !important; }
.m-20 { margin: 20px !important; }
.m-25 { margin: 25px !important; }
.m-30 { margin: 30px !important; }
.m-40 { margin: 40px !important; }
.m-50 { margin: 50px !important; }
.m-60 { margin: 60px !important; }
.m-70 { margin: 70px !important; }
.m-80 { margin: 80px !important; }
.m-90 { margin: 90px !important; }
.m-100 { margin: 100px !important; }

/* Margin Top */
.mt-0 { margin-top: 0px !important; }
.mt-1 { margin-top: 1px !important; }
.mt-2 { margin-top: 2px !important; }
.mt-3 { margin-top: 3px !important; }
.mt-4 { margin-top: 4px !important; }
.mt-5 { margin-top: 5px !important; }
.mt-10 { margin-top: 10px !important; }
.mt-15 { margin-top: 15px !important; }
.mt-20 { margin-top: 20px !important; }
.mt-25 { margin-top: 25px !important; }
.mt-30 { margin-top: 30px !important; }
.mt-40 { margin-top: 40px !important; }
.mt-50 { margin-top: 50px !important; }
.mt-60 { margin-top: 60px !important; }
.mt-70 { margin-top: 70px !important; }
.mt-80 { margin-top: 80px !important; }
.mt-90 { margin-top: 90px !important; }
.mt-100 { margin-top: 100px !important; }

/* Margin Bottom */
.mb-0 { margin-bottom: 0px !important; }
.mb-1 { margin-bottom: 1px !important; }
.mb-2 { margin-bottom: 2px !important; }
.mb-3 { margin-bottom: 3px !important; }
.mb-4 { margin-bottom: 4px !important; }
.mb-5 { margin-bottom: 5px !important; }
.mb-10 { margin-bottom: 10px !important; }
.mb-15 { margin-bottom: 15px !important; }
.mb-20 { margin-bottom: 20px !important; }
.mb-25 { margin-bottom: 25px !important; }
.mb-30 { margin-bottom: 30px !important; }
.mb-40 { margin-bottom: 40px !important; }
.mb-50 { margin-bottom: 50px !important; }
.mb-60 { margin-bottom: 60px !important; }
.mb-70 { margin-bottom: 70px !important; }
.mb-80 { margin-bottom: 80px !important; }
.mb-90 { margin-bottom: 90px !important; }
.mb-100 { margin-bottom: 100px !important; }

/* Margin Left */
.ml-0 { margin-left: 0px !important; }
.ml-1 { margin-left: 1px !important; }
.ml-2 { margin-left: 2px !important; }
.ml-3 { margin-left: 3px !important; }
.ml-4 { margin-left: 4px !important; }
.ml-5 { margin-left: 5px !important; }
.ml-10 { margin-left: 10px !important; }
.ml-15 { margin-left: 15px !important; }
.ml-20 { margin-left: 20px !important; }
.ml-25 { margin-left: 25px !important; }
.ml-30 { margin-left: 30px !important; }
.ml-40 { margin-left: 40px !important; }
.ml-50 { margin-left: 50px !important; }
.ml-60 { margin-left: 60px !important; }
.ml-70 { margin-left: 70px !important; }
.ml-80 { margin-left: 80px !important; }
.ml-90 { margin-left: 90px !important; }
.ml-100 { margin-left: 100px !important; }

/* Margin Right */
.mr-0 { margin-right: 0px !important; }
.mr-1 { margin-right: 1px !important; }
.mr-2 { margin-right: 2px !important; }
.mr-3 { margin-right: 3px !important; }
.mr-4 { margin-right: 4px !important; }
.mr-5 { margin-right: 5px !important; }
.mr-10 { margin-right: 10px !important; }
.mr-15 { margin-right: 15px !important; }
.mr-20 { margin-right: 20px !important; }
.mr-25 { margin-right: 25px !important; }
.mr-30 { margin-right: 30px !important; }
.mr-40 { margin-right: 40px !important; }
.mr-50 { margin-right: 50px !important; }
.mr-60 { margin-right: 60px !important; }
.mr-70 { margin-right: 70px !important; }
.mr-80 { margin-right: 80px !important; }
.mr-90 { margin-right: 90px !important; }
.mr-100 { margin-right: 100px !important; }

/* Margin X */
.mx-0 { margin-left: 0px !important; margin-right: 0px !important; }
.mx-1 { margin-left: 1px !important; margin-right: 1px !important; }
.mx-2 { margin-left: 2px !important; margin-right: 2px !important; }
.mx-3 { margin-left: 3px !important; margin-right: 3px !important; }
.mx-4 { margin-left: 4px !important; margin-right: 4px !important; }
.mx-5 { margin-left: 5px !important; margin-right: 5px !important; }
.mx-10 { margin-left: 10px !important; margin-right: 10px !important; }
.mx-15 { margin-left: 15px !important; margin-right: 15px !important; }
.mx-20 { margin-left: 20px !important; margin-right: 20px !important; }
.mx-25 { margin-left: 25px !important; margin-right: 25px !important; }
.mx-30 { margin-left: 30px !important; margin-right: 30px !important; }
.mx-40 { margin-left: 40px !important; margin-right: 40px !important; }
.mx-50 { margin-left: 50px !important; margin-right: 50px !important; }
.mx-60 { margin-left: 60px !important; margin-right: 60px !important; }
.mx-70 { margin-left: 70px !important; margin-right: 70px !important; }
.mx-80 { margin-left: 80px !important; margin-right: 80px !important; }
.mx-90 { margin-left: 90px !important; margin-right: 90px !important; }
.mx-100 { margin-left: 100px !important; margin-right: 100px !important; }

/* Margin Y */
.my-0 { margin-top: 0px !important; margin-bottom: 0px !important; }
.my-1 { margin-top: 1px !important; margin-bottom: 1px !important; }
.my-2 { margin-top: 2px !important; margin-bottom: 2px !important; }
.my-3 { margin-top: 3px !important; margin-bottom: 3px !important; }
.my-4 { margin-top: 4px !important; margin-bottom: 4px !important; }
.my-5 { margin-top: 5px !important; margin-bottom: 5px !important; }
.my-10 { margin-top: 10px !important; margin-bottom: 10px !important; }
.my-15 { margin-top: 15px !important; margin-bottom: 15px !important; }
.my-20 { margin-top: 20px !important; margin-bottom: 20px !important; }
.my-25 { margin-top: 25px !important; margin-bottom: 25px !important; }
.my-30 { margin-top: 30px !important; margin-bottom: 30px !important; }
.my-40 { margin-top: 40px !important; margin-bottom: 40px !important; }
.my-50 { margin-top: 50px !important; margin-bottom: 50px !important; }
.my-60 { margin-top: 60px !important; margin-bottom: 60px !important; }
.my-70 { margin-top: 70px !important; margin-bottom: 70px !important; }
.my-80 { margin-top: 80px !important; margin-bottom: 80px !important; }
.my-90 { margin-top: 90px !important; margin-bottom: 90px !important; }
.my-100 { margin-top: 100px !important; margin-bottom: 100px !important; }