…, which inside a Bootstrap column must fill the
column rather than behave like a page-width, centred container — so neutralise the inner container's
fixed width and horizontal gutters. Only containers *inside the row* are affected; the columns
block's own outer container is untouched.
------------------------------------------------------------------ */
.xw-columns > .container > .row > [class*="col"] {
display: flex;
flex-direction: column;
}
.xw-columns > .container > .row .container {
width: 100%;
max-width: 100%;
padding-left: 0;
padding-right: 0;
}
/* Trim the nested blocks' vertical rhythm so a column reads as one tidy stack, not a series of
full-page sections with heavy padding. */
.xw-columns > .container > .row .xw-block > .container {
padding-top: 0.75rem;
padding-bottom: 0.75rem;
}
/* ------------------------------------------------------------------
Stock-image attribution (#3838)
An in-context credit caption overlaid on the corner of a stock image whose supplier licence requires
one (e.g. Unsplash), plus the site-wide supplier credit in the footer (e.g. Pexels). The wrapper
gives ![]()
-based blocks a positioning context; hero/CTA bands and card/carousel media are already
positioned, so they need no wrapper.
------------------------------------------------------------------ */
.xw-image-credit-wrap {
position: relative;
}
.xw-image-credit {
position: absolute;
right: 0.5rem;
bottom: 0.5rem;
z-index: 2;
max-width: calc(100% - 1rem);
padding: 0.15rem 0.5rem;
border-radius: 0.35rem;
background-color: rgba(0, 0, 0, 0.55);
color: #ffffff;
font-size: 0.72rem;
line-height: 1.35;
text-align: right;
}
.xw-image-credit-link {
color: #ffffff;
text-decoration: underline;
}
.xw-image-credit-link:hover,
.xw-image-credit-link:focus-visible {
color: #ffffff;
opacity: 0.85;
}
/* The copyright + image-credit strip. It renders on every page below whatever footer is in play — the
built-in one or a template's Footer block — so it carries the footer's own colours to read as one
band with it. The border replaces the divider that used to sit inside the footer, and is drawn only
when a footer actually precedes it (a template need not have one). */
.xw-credits-strip {
background-color: var(--xw-nav-bg, #0f3460);
color: var(--xw-nav-font, #ffffff);
padding: 1rem 0;
}
.xw-footer + .xw-credits-strip > .container {
border-top: 1px solid rgba(255, 255, 255, 0.2);
padding-top: 1rem;
}
/* Site-wide supplier credit line(s) in the footer, above the copyright. */
.xw-footer-credits {
margin-bottom: 0.75rem;
}
.xw-footer-credit {
display: block;
color: var(--xw-secondary-font, #b0b0b0);
opacity: 0.85;
}
/* A subtle, always-present link to the standalone /credits page, beside the copyright line. */
.xw-footer-credits-link {
color: var(--xw-secondary-font, #b0b0b0);
opacity: 0.85;
}
/* ------------------------------------------------------------------
Standalone image-credits page (/credits) — the site-wide list of the
stock-image suppliers and photographers the site attributes (#3838).
------------------------------------------------------------------ */
.xw-credits {
max-width: 48rem;
padding-top: 2rem;
padding-bottom: 3rem;
}
.xw-credits-title {
margin-bottom: 1rem;
}
.xw-credits-intro {
margin-bottom: 2rem;
}
.xw-credits-empty {
color: var(--xw-secondary-font, #b0b0b0);
}
.xw-credits-supplier {
margin-bottom: 2rem;
}
.xw-credits-supplier-name {
font-size: 1.25rem;
margin-bottom: 0.5rem;
}
.xw-credits-photographers {
list-style: none;
padding-left: 0;
margin-bottom: 0;
display: flex;
flex-wrap: wrap;
gap: 0.35rem 1rem;
}
.xw-credits-photographer {
color: var(--xw-secondary-font, #b0b0b0);
}
/* Supplier and photographer links mirror the site's body-content link style
(var(--xw-nav-font), as .xw-richtext-body a does) so the credits page stays
on-brand and readable on the themed background rather than falling back to the
browser's default anchor blue. */
.xw-credits-link {
color: var(--xw-nav-font, #ffffff);
text-decoration: underline;
}
.xw-credits-link:hover,
.xw-credits-link:focus-visible {
color: var(--xw-nav-font, #ffffff);
opacity: 0.85;
}
/* ==========================================================================
Page templates
========================================================================== */
/* The Page placeholder, shown only when a template is previewed on its own — composing a page
replaces it with that page's content, so a visitor never sees this. */
.xw-page-placeholder {
padding: 3rem 0;
border: 2px dashed currentColor;
border-radius: 0.5rem;
opacity: 0.45;
}
.xw-page-placeholder-text {
margin: 0;
text-align: center;
font-style: italic;
}