/* --------------------------------------------------
  Section Padding Utilities
  Usage examples:
  pt-xxsmall
  pb-medium
  pt-md-large
  pb-lg-xxlarge
-------------------------------------------------- */

/* =========================
   Base spacing scale
========================= */

.pt-xxsmall { padding-top: 20px; }
.pt-xsmall  { padding-top: 30px; }
.pt-small   { padding-top: 45px; }
.pt-medium  { padding-top: 60px; }
.pt-large   { padding-top: 80px; }
.pt-xlarge  { padding-top: 110px; }
.pt-xxlarge { padding-top: 140px; }

.pb-xxsmall { padding-bottom: 20px; }
.pb-xsmall  { padding-bottom: 30px; }
.pb-small   { padding-bottom: 45px; }
.pb-medium  { padding-bottom: 60px; }
.pb-large   { padding-bottom: 80px; }
.pb-xlarge  { padding-bottom: 110px; }
.pb-xxlarge { padding-bottom: 140px; }


/* =========================
   Medium breakpoint and up
   Bootstrap md = 768px
========================= */

@media (min-width: 768px) {
  .pt-md-xxsmall { padding-top: 20px; }
  .pt-md-xsmall  { padding-top: 30px; }
  .pt-md-small   { padding-top: 45px; }
  .pt-md-medium  { padding-top: 60px; }
  .pt-md-large   { padding-top: 80px; }
  .pt-md-xlarge  { padding-top: 110px; }
  .pt-md-xxlarge { padding-top: 140px; }

  .pb-md-xxsmall { padding-bottom: 20px; }
  .pb-md-xsmall  { padding-bottom: 30px; }
  .pb-md-small   { padding-bottom: 45px; }
  .pb-md-medium  { padding-bottom: 60px; }
  .pb-md-large   { padding-bottom: 80px; }
  .pb-md-xlarge  { padding-bottom: 110px; }
  .pb-md-xxlarge { padding-bottom: 140px; }
}


/* =========================
   Large breakpoint and up
   Bootstrap lg = 992px
========================= */

@media (min-width: 992px) {
  .pt-lg-xxsmall { padding-top: 20px; }
  .pt-lg-xsmall  { padding-top: 30px; }
  .pt-lg-small   { padding-top: 45px; }
  .pt-lg-medium  { padding-top: 60px; }
  .pt-lg-large   { padding-top: 80px; }
  .pt-lg-xlarge  { padding-top: 110px; }
  .pt-lg-xxlarge { padding-top: 140px; }

  .pb-lg-xxsmall { padding-bottom: 20px; }
  .pb-lg-xsmall  { padding-bottom: 30px; }
  .pb-lg-small   { padding-bottom: 45px; }
  .pb-lg-medium  { padding-bottom: 60px; }
  .pb-lg-large   { padding-bottom: 80px; }
  .pb-lg-xlarge  { padding-bottom: 110px; }
  .pb-lg-xxlarge { padding-bottom: 140px; }
}