body.pi-base-2-legacy-layout main > .main-content {
  display: block;
}
body.pi-base-2-legacy-layout .region-container.header .region .region-content::after,
body.pi-base-2-legacy-layout main > .main-content::after,
body.pi-base-2-legacy-layout .region-container.sidebar .region .region-content::after,
body.pi-base-2-legacy-layout .region-container.footer .region .region-content::after {
  content: '.';
  display: block;
  block-size: 0;
  clear: both;
  visibility: hidden;
}
/* The width complexity here is so that when the content area is divided into
   columns intended to match the width of the sidebar, they actually match. */
body.pi-base-2-legacy-layout.has-sidebar .region-container.content {
  padding-inline-end: calc((var(--gutter-inline-size) / 3) * 2);
  inline-size: calc(((100% / 3) * 2) + (var(--gutter-inline-size) / 3));
  float: left;
  float: inline-start;
}
body.pi-base-2-legacy-layout.two-sidebars .region-container.content {
  padding-inline: calc((var(--gutter-inline-size) / 4) * 3);
  inline-size: calc(50% + (var(--gutter-inline-size) / 2));
}
body.pi-base-2-legacy-layout .region-container.sidebar {
  padding-inline-start: calc(var(--gutter-inline-size) / 3);
  inline-size: calc((100% / 3) - (var(--gutter-inline-size) / 3));
  float: right;
  float: inline-end;
}
body.pi-base-2-legacy-layout.two-sidebars .region-container.sidebar {
  padding-inline-start: calc(var(--gutter-inline-size) / 4);
  inline-size: calc(25% - (var(--gutter-inline-size) / 4));
}
body.pi-base-2-legacy-layout.two-sidebars .region-container.sidebar-first {
  padding-inline: 0 calc(var(--gutter-inline-size) / 4);
  float: left;
  float: inline-start;
}

@media screen and (max-width: 1439px) {
  body.pi-base-2-legacy-layout.has-sidebar .region-container.content {
    padding-inline-end: calc((var(--gutter-inline-size-large-screen) / 3) * 2);
    inline-size: calc(((100% / 3) * 2) + (var(--gutter-inline-size-large-screen) / 3));
  }
  body.pi-base-2-legacy-layout.two-sidebars .region-container.content {
    padding-inline: calc((var(--gutter-inline-size-large-screen) / 4) * 3);
    inline-size: calc(50% + (var(--gutter-inline-size-large-screen) / 2));
  }
  body.pi-base-2-legacy-layout .region-container.sidebar {
    padding-inline-start: calc(var(--gutter-inline-size-large-screen) / 3);
    inline-size: calc((100% / 3) - (var(--gutter-inline-size-large-screen) / 3));
  }
  body.pi-base-2-legacy-layout.two-sidebars .region-container.sidebar {
    padding-inline-start: calc(var(--gutter-inline-size-large-screen) / 4);
    inline-size: calc(25% - (var(--gutter-inline-size-large-screen) / 4));
  }
  body.pi-base-2-legacy-layout.two-sidebars .region-container.sidebar-first {
    padding-inline: 0 calc(var(--gutter-inline-size-large-screen) / 4);
  }
}

@media screen and (max-width: 959px) {
  body.pi-base-2-legacy-layout.has-sidebar .region-container.content {
    padding-inline-end: calc((var(--gutter-inline-size-medium-screen) / 3) * 2);
    inline-size: calc(((100% / 3) * 2) + (var(--gutter-inline-size-medium-screen) / 3));
  }
  body.pi-base-2-legacy-layout.two-sidebars .region-container.content {
    padding-inline: calc((var(--gutter-inline-size-medium-screen) / 4) * 3);
    inline-size: calc(50% + (var(--gutter-inline-size-medium-screen) / 2));
  }
  body.pi-base-2-legacy-layout .region-container.sidebar {
    padding-inline-start: calc(var(--gutter-inline-size-medium-screen) / 3);
    inline-size: calc((100% / 3) - (var(--gutter-inline-size-medium-screen) / 3));
  }
  body.pi-base-2-legacy-layout.two-sidebars .region-container.sidebar {
    padding-inline-start: calc(var(--gutter-inline-size-medium-screen) / 4);
    inline-size: calc(25% - (var(--gutter-inline-size-medium-screen) / 4));
  }
  body.pi-base-2-legacy-layout.two-sidebars .region-container.sidebar-first {
    padding-inline: 0 calc(var(--gutter-inline-size-medium-screen) / 4);
  }
}

@media screen and (max-width: 639px) {
  body.pi-base-2-legacy-layout.has-sidebar .region-container.content,
  body.pi-base-2-legacy-layout.two-sidebars .region-container.content,
  body.pi-base-2-legacy-layout .region-container.sidebar,
  body.pi-base-2-legacy-layout.two-sidebars .region-container.sidebar,
  body.pi-base-2-legacy-layout.two-sidebars .region-container.sidebar-first {
    margin-block-end: 1.25rem;
    padding-inline: 0;
    inline-size: auto;
    float: none;
  }
}
