/**
 * @file
 * Section base styles.
 */

.section {
  --sectionBgImage: none;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  background-color: var(--sectionBgColor, transparent);
  background-image: var(--sectionBgImage);
  padding: var(--sectionSpaceTop, var(--layout07)) var(--layout02) var(--sectionSpaceBottom, var(--layout07));
}

.section--video-background {
  position: relative;
}

.section--video-background .section__content {
  position: inherit;
  z-index: 2;
}

.section__content {
  width: 100%;
  max-width: var(--layoutWidthMax);
  margin: auto;
}

.section__video {
  object-fit: cover;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  overflow: hidden;
}

.section-st-none {
  --sectionSpaceTop: 0;
}

.section-sb-none {
  --sectionSpaceBottom: 0;
}

.section-st-01 {
  --sectionSpaceTop: var(--layout01);
}

.section-sb-01 {
  --sectionSpaceBottom: var(--layout01);
}

.section-st-02 {
  --sectionSpaceTop: var(--layout02);
}

.section-sb-02 {
  --sectionSpaceBottom: var(--layout02);
}

.section-st-03 {
  --sectionSpaceTop: var(--layout03);
}

.section-sb-03 {
  --sectionSpaceBottom: var(--layout03);
}

.section-st-04 {
  --sectionSpaceTop: var(--layout04);
}

.section-sb-04 {
  --sectionSpaceBottom: var(--layout04);
}

.section-st-05 {
  --sectionSpaceTop: var(--layout05);
}

.section-sb-05 {
  --sectionSpaceBottom: var(--layout05);
}

.section-st-06 {
  --sectionSpaceTop: var(--layout06);
}

.section-sb-06 {
  --sectionSpaceBottom: var(--layout06);
}

.section-st-07 {
  --sectionSpaceTop: var(--layout07);
}

.section-sb-07 {
  --sectionSpaceBottom: var(--layout07);
}

.section-st-08 {
  --sectionSpaceTop: var(--layout08);
}

.section-sb-08 {
  --sectionSpaceBottom: var(--layout08);
}
