body {
	font-family: 'Arial', sans-serif;
	margin: 0;
	padding: 0;
}

.header {
	background-color: #333;
	color: #fff;
	padding: 10px 20px;
	text-align: center;
}

.nav {
	padding: 0;
	margin: 0;
	list-style-type: none;
	background-color: #f2f2f2;
}

.nav li {
	padding: 8px 12px;
}

.nav li:hover {
	background-color: #ddd;
}

.nav li a {
	text-decoration: none;
	color: #333;
	display: block;
}

.content {
	padding: 20px;
}

.footer {
	background-color: #333;
	color: #fff;
	text-align: center;
	padding: 10px 20px;
	position: absolute;
	bottom: 0;
	width: 100%;
}

/* Island Class: hide duplicate theme title on pages with their own hero (2026/10/23, Maths form pages added 2026/10/24, Home added 2026/10/25, IT SBA guide added 2026/10/28) */
body.page-id-8454 .entry-header,
body.page-id-9243 .entry-header,
body.page-id-10738 .entry-header,
body.page-id-10739 .entry-header,
body.page-id-10740 .entry-header,
body.page-id-10399 .entry-header,
body.page-id-9647 .entry-header,
body.page-id-10611 .entry-header,
body.page-id-10614 .entry-header,
body.page-id-10615 .entry-header,
body.page-id-10616 .entry-header,
body.page-id-10617 .entry-header,
body.page-id-10618 .entry-header,
body.page-id-10619 .entry-header,
body.page-id-10620 .entry-header,
body.page-id-10621 .entry-header,
body.page-id-10154 .entry-header,
body.page-id-7569 .entry-header,
body.page-id-9698 .entry-header,
body.page-id-7940 .entry-header,
body.page-id-11181 .entry-header,
body.page-id-11182 .entry-header,
body.page-id-11183 .entry-header,
body.page-id-9230 .entry-header,
body.page-id-11461 .entry-header,
body.page-id-11462 .entry-header,
body.page-id-11463 .entry-header,
body.page-id-11464 .entry-header,
body.page-id-11465 .entry-header,
body.page-id-11466 .entry-header,
body.page-id-11467 .entry-header,
body.page-id-11468 .entry-header,
body.page-id-11469 .entry-header,
body.page-id-11470 .entry-header,
body.page-id-11471 .entry-header,
body.page-id-11327 .entry-header {
	display: none;
}

/* Island Class: hide the Updates change log on pages (2026/10/24)
   Hides the "Updates" heading and the dated change lines under it,
   on PAGES only. Posts are not affected. The © copyright line and
   everything else on the page stay visible.

   ON/OFF SWITCH: the line marked TOGGLE near the bottom of this block.
   - To SHOW the Updates again: on the TOGGLE line, change the word
     none  to  revert   (so it reads  display: revert;)
     then press Save Changes.
   - To HIDE them again: change  revert  back to  none
     (so it reads  display: none;)  then press Save Changes.
   Change only that one word. Leave the rest of this block as it is.

   Which pages it works on: the Updates heading must have the HTML anchor
   "updates" (Heading block > Advanced > HTML anchor) with the © line as
   the last paragraph after the change lines, OR the heading and change
   lines must sit in a Group block with the Additional CSS class
   "ic-updates" (Group block > Advanced). */
body.page .entry-content > #updates,
body.page .entry-content > #updates ~ :is(p, ul, ol):has(~ p:not(:empty)),
body.page .entry-content .ic-updates {
  display: none; /* TOGGLE: none = hidden, revert = shown */
}

/* Island Class: move the right sidebar to the bottom on computers (2026/10/24)
   On computers and wide tablets (986px and wider) this moves the
   right-hand sidebar (Blog Stats, the search box and the donation
   box) from the right side to the bottom of the page, under the
   content and above the footer, on EVERY page, post and archive.
   The content then uses the full 1140px width of the site. This is
   the same thing the theme already does on phones and small tablets.
   On phones and narrow tablets nothing changes.

   ON/OFF SWITCH: the line marked TOGGLE (the first line below).
   - To put the sidebar back on the RIGHT: on the TOGGLE line, change
     986px  to  99999px   (so it reads  @media (min-width: 99999px) {)
     then press Save Changes.
   - To move it to the BOTTOM again: change  99999px  back to  986px
     then press Save Changes.
   Change only that one number. Leave the rest of this block as it is. */
@media (min-width: 986px) { /* TOGGLE: 986px = sidebar at bottom, 99999px = sidebar on right */
  .site-content > .content-area {
    float: none;
    width: 100%;
  }
  .site-content > .widget-area {
    float: none;
    clear: both;
    width: 100%;
    max-width: 820px;
    margin: 1.6em 0 0;
  }
}

/* Island Class: comfortable text width on computers (2026/10/24)
   On computers and wide tablets (986px and wider), plain text in posts,
   pages and archives (paragraphs, lists, quotes and h2 to h4 headings)
   is kept between 760px and 960px wide, depending on the screen size,
   so lines are not too long to read. Everything else still uses the
   full content width: pictures, figures, cards, tables, Try it boxes,
   code, videos, and anything inside groups or columns.
   On phones and narrow tablets nothing changes.

   ON/OFF SWITCH: the line marked TOGGLE (the first line below).
   - For FULL-WIDTH text: on the TOGGLE line, change  986px  to  99999px
     (so it reads  @media (min-width: 99999px) {)  then press Save Changes.
   - To narrow the text again: change  99999px  back to  986px
     then press Save Changes.
   Change only that one number. Leave the rest of this block as it is. */
@media (min-width: 986px) { /* TOGGLE: 986px = comfortable text width, 99999px = full width */
  .entry-content > :is(p, ul, ol, blockquote, h2, h3, h4) {
    max-width: clamp(760px, 70vw, 960px);
  }
}