/* Padding */

.pt-1 {
  padding-top: 16px !important;
}

.pt-2 {
  padding-top: 24px !important;
}

.pt-3 {
  padding-top: calc(24px + (32 - 24) * ((100vw - 300px) / (1280 - 300))) !important;
}

.pt-4 {
  padding-top: calc(32px + (40 - 32) * ((100vw - 300px) / (1280 - 300))) !important;
}

.pt-5 {
  padding-top: calc(32px + (48 - 32) * ((100vw - 300px) / (1280 - 300))) !important;
}

.pt-6 {
  padding-top: calc(40px + (56 - 40) * ((100vw - 300px) / (1280 - 300))) !important;
}

.pt-7 {
  padding-top: calc(40px + (64 - 40) * ((100vw - 300px) / (1280 - 300))) !important;
}

.pt-8 {
  padding-top: calc(48px + (72 - 48) * ((100vw - 300px) / (1280 - 300))) !important;
}

.pt-9 {
  padding-top: calc(56px + (80 - 56) * ((100vw - 300px) / (1280 - 300))) !important;
}

.pb-1 {
  padding-bottom: 16px !important;
}

.pb-2 {
  padding-bottom: 24px !important;
}

.pb-3 {
  padding-bottom: calc(24px + (32 - 24) * ((100vw - 300px) / (1280 - 300))) !important;
}

.pb-4 {
  padding-bottom: calc(32px + (40 - 32) * ((100vw - 300px) / (1280 - 300))) !important;
}

.pb-5 {
  padding-bottom: calc(32px + (48 - 32) * ((100vw - 300px) / (1280 - 300))) !important;
}

.pb-6 {
  padding-bottom: calc(40px + (56 - 40) * ((100vw - 300px) / (1280 - 300))) !important;
}

.pb-7 {
  padding-bottom: calc(40px + (64 - 40) * ((100vw - 300px) / (1280 - 300))) !important;
}

.pb-8 {
  padding-bottom: calc(48px + (72 - 48) * ((100vw - 300px) / (1280 - 300))) !important;
}

.pb-9 {
  padding-bottom: calc(56px + (80 - 56) * ((100vw - 300px) / (1280 - 300))) !important;
}


/* Margins */

.mt-1 {
  margin-top: 16px !important;
}

.mt-2 {
  margin-top: 24px !important;
}

.mt-3 {
  margin-top: calc(24px + (32 - 24) * ((100vw - 300px) / (1280 - 300))) !important;
}

.mt-4 {
  margin-top: calc(32px + (40 - 32) * ((100vw - 300px) / (1280 - 300))) !important;
}

.mt-5 {
  margin-top: calc(32px + (48 - 32) * ((100vw - 300px) / (1280 - 300))) !important;
}

.mt-6 {
  margin-top: calc(40px + (56 - 40) * ((100vw - 300px) / (1280 - 300))) !important;
}

.mt-7 {
  margin-top: calc(40px + (64 - 40) * ((100vw - 300px) / (1280 - 300))) !important;
}

.mt-8 {
  margin-top: calc(48px + (72 - 48) * ((100vw - 300px) / (1280 - 300))) !important;
}

.mt-9 {
  margin-top: calc(56px + (80 - 56) * ((100vw - 300px) / (1280 - 300))) !important;
}

.mr-1 {
  margin-right: 16px !important;
}

.mr-2 {
  margin-right: 24px !important;
}

.mr-3 {
  margin-right: calc(24px + (32 - 24) * ((100vw - 300px) / (1280 - 300))) !important;
}

.mr-4 {
  margin-right: calc(32px + (40 - 32) * ((100vw - 300px) / (1280 - 300))) !important;
}

.mr-5 {
  margin-right: calc(32px + (48 - 32) * ((100vw - 300px) / (1280 - 300))) !important;
}

.mr-6 {
  margin-right: calc(40px + (56 - 40) * ((100vw - 300px) / (1280 - 300))) !important;
}

.mr-7 {
  margin-right: calc(40px + (64 - 40) * ((100vw - 300px) / (1280 - 300))) !important;
}

.mr-8 {
  margin-right: calc(48px + (72 - 48) * ((100vw - 300px) / (1280 - 300))) !important;
}

.mr-9 {
  margin-right: calc(56px + (80 - 56) * ((100vw - 300px) / (1280 - 300))) !important;
}

.mb-1 {
	margin-bottom: 16px !important;
}

.mb-2 {
  margin-bottom: 24px !important;
}

.mb-3 {
  margin-bottom: calc(24px + (32 - 24) * ((100vw - 300px) / (1280 - 300))) !important;
}

.mb-4 {
  margin-bottom: calc(32px + (40 - 32) * ((100vw - 300px) / (1280 - 300))) !important;
}

.mb-5 {
  margin-bottom: calc(32px + (48 - 32) * ((100vw - 300px) / (1280 - 300))) !important;
}

.mb-6 {
  margin-bottom: calc(40px + (56 - 40) * ((100vw - 300px) / (1280 - 300))) !important;
}

.mb-7 {
  margin-bottom: calc(40px + (64 - 40) * ((100vw - 300px) / (1280 - 300))) !important;
}

.mb-8 {
  margin-bottom: calc(48px + (72 - 48) * ((100vw - 300px) / (1280 - 300))) !important;
}

.mb-9 {
  margin-bottom: calc(56px + (80 - 56) * ((100vw - 300px) / (1280 - 300))) !important;
}