@media only screen and (min-width: 768px) {
    #content_main, #content, #content_main_inner, .content_main, .content  {
        margin-left: inherit;
        margin-right: inherit;
        padding-left: inherit;
        padding-right: inherit;
        width: inherit;
        max-width: inherit;
    }
}

.not-edge-to-edge, .not-edge-to-edge-wrapper {
    width: 100%;
    max-width: 1024px;
    margin: 0 auto;
    box-sizing: border-box;
}

@media only screen and (min-width: 768px) {
    /* edlio/cms#16563: 20px, not the 1rem added by edlio/cms#8227. This gutter and the
       `.not-edge-to-edge-wrapper` one below must be the SAME value — they sit on sibling
       elements of the same 1024px container, so any difference shows up directly as zones
       that do not line up. They drifted apart because the wrapper's `padding: 0 20px` is
       declared after this block and silently outranks it, leaving standalone
       `.not-edge-to-edge` elements (hero and footer blocks) 4px inside everything else. */
    .not-edge-to-edge, .not-edge-to-edge-wrapper {
        padding-left: 20px;
        padding-right: 20px;
    }

    .hero-wrapper .page-block-photos.not-edge-to-edge,
    .hero-wrapper .hero-page-navigation-wrapper.not-edge-to-edge {
        padding-right: 0;
    }
}

.not-edge-to-edge-wrapper {
    margin: 30px auto;
    padding: 0 20px;
}

/* edlio/cms#16563: the page content wrapper renders INSIDE `.not-edge-to-edge-wrapper`
   (`start_not_edge-to-edge_wrapper.jsp`, emitted for every non-single-column edge-to-edge
   page) and also carries `.not-edge-to-edge` itself (`layout_page.ftl`, added by
   edlio/cms#7172). That applies the 1024px cap and the gutter TWICE, so every block inside
   the content area — the top zone and all the columns — was inset a further gutter-width
   from the page title and breadcrumb, which are siblings inside the same outer wrapper.

   Measured on `thirds` at a 1412px viewport before this rule: title 214px, hero and footer
   blocks 210px, top zone and columns 230px — three different left edges on one page. The
   outer wrapper already supplies both the cap and the gutter, so the inner application is
   pure duplication. Direct child, not descendant: blocks that legitimately carry
   `.not-edge-to-edge` on single-column layouts are never nested here, because that outer
   wrapper is only emitted when the layout is NOT single column. */
.not-edge-to-edge-wrapper > .not-edge-to-edge {
    max-width: none;
    padding-left: 0;
    padding-right: 0;
}

link:first-child ~ .pageTitle.not-edge-to-edge,
link:first-child ~ .breadcrumb.not-edge-to-edge {
    padding-top: 1.5em;
    margin-bottom: 10px;
}

link:first-child ~ .breadcrumb.not-edge-to-edge + .pageTitle.not-edge-to-edge {
    padding-top: 0;
}

@media screen and (max-width: 1024px) and (min-width: 768px) {
    .hero-wrapper:not(:empty) ~ .pageTitle.not-edge-to-edge,
    .hero-wrapper:not(:empty) ~ .breadcrumb.not-edge-to-edge,
    .pages-left-column {
        padding: 0rem 1rem !important;
    }

    .pages-column {
        padding: 0rem !important;
    }
}

@media only screen and (max-width: 768px) {
    #content_main, #content, #content_main_inner, .content_main, .content  {
        margin-left: inherit;
        margin-right: inherit;
        padding-left: inherit;
        padding-right: inherit;
        width: 100%;
    }

    .pageTitle.not-edge-to-edge,
    .breadcrumb.not-edge-to-edge,
    .right-column-page-navigation-wrapper {
        padding: 0rem 1rem;
    }

    .page-block.page-block-text,
    .page-block.page-block-files,
    .page-block.page-block-staff,
    .page-block.page-block-button,
    .page-block.page-block-events {
        width: auto !important;
        padding: 0rem 1rem;
    }

    .left-hero .pages-left-column-wrapper .pages-column .page-block.page-block-photos,
    .right-hero .pages-left-column-wrapper .pages-column .page-block.page-block-photos,
    .full-hero .pages-left-column-wrapper .pages-column .page-block.page-block-photos.not-edge-to-edge,
    .full-width .pages-left-column-wrapper .pages-column .page-block.page-block-photos.not-edge-to-edge {
        width: auto !important;
        padding: 0rem 1rem;
    }
}
