.section {
  display: block;
  width: 100%;
}

.section.section--size-sm {
  padding: calc( 1.50 * var(--gap-y)) 0;
}

.section.section--size-md {
  padding: calc( 3.00 * var(--gap-y)) 0;
}

.section.section--size-lg {
  padding: calc( 6.00 * var(--gap-y)) 0;
}

.section.section--size-top-off {
	padding-bottom: calc( 3.00 * var(--gap-y));
	padding-top: 0;
}

.section.section--size-bottom-off {
	padding-top: calc( 3.00 * var(--gap-y));
	padding-bottom: 0;
}

@media only screen and (max-width: 1400px) {
  .section.section--size-sm {
    padding: calc( 1.25 * var(--gap-y)) 0;
  }
  .section.section--size-md {
    padding: calc( 2 * var(--gap-y)) 0;
  }
  .section.section--size-lg {
    padding: calc( 4.00 * var(--gap-y)) 0;
  }
}

@media only screen and (max-width: 1024px) {
  .section.section--size-sm {
    padding: calc( 1 * var(--gap-y)) 0;
  }
  .section.section--size-md {
    padding: calc( 1.75 * var(--gap-y)) 0;
  }
  .section.section--size-lg {
    padding: calc( 2.75 * var(--gap-y)) 0;
  }
}

@media only screen and (max-width: 767px) {
  .wp-block-spacer {
    max-height: 3rem !important;
  }
}

.content {
  margin: 0 auto;
  max-width: calc( var(--content-width) * 1px + calc( var(--gap-x) * 2 ));
  padding: 0 var(--gap-x);
}

.section--width-full .content {
  max-width: 100%;
}

.section--width-max .content {
  max-width: 100%;
  padding: 0;
}

@media only screen and (max-width: 768px) {
  .content {
    max-width: calc( var(--content-width) * 1px + 80px);
    padding: 0 40px;
  }
}

.section--color-base {
  background-color: var(--color-base);
}

.section--color-alternate {
  background-color: var(--color-alternate);
}

.section--color-invert {
  background-color: var(--color-invert);
}