/*!Author information for CSS code
=================================================
   Version 3.00 | Friday, April 02, 2021
   Style sheet © 2021, Keith W Bell
   www.december14.biz
   ----------------------------------------------
   This style sheet, associated graphics and web
   page design are copyrighted materials and may
   not be copied or reproduced by any party for
   any reason whatsoever.
================================================= */


/* Design notes
=================================================
   A simple, tasteful, typographically rigorous
   presentation of Land Court decisions on screen,
   with optimisations for printing.
   ----------------------------------------------
   CSS architecture broadly in line with 'ITCSS',
   i.e. in order of increasing specificity, with
   specificity graph trending upwards.
   ----------------------------------------------
   C O N T E N T S                           Flag
   ----------------------------------------------
   Layer 1 - Generic                           =1
   Layer 2 - Base                              =2
   Layer 3 - Components                        =3
   Adjustments for small screens and printing  =4
================================================= */


/* Layer 1 - Generic                           =1
=================================================
 * Basic reset.
 * Text highlighting.
 * Legacy browser HTML5 fixes.
   If basic-level browsers recognise these, fine.
   If not, it isn't a disaster as these elements
   contain block-level or 100% width children.
================================================= */

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	}

::selection {
	color: #333333;
	background-color: #FFFFAA;
	text-shadow: none;
	}

header, footer, main {
	margin:  0;
	padding: 0;
	display: block;
	}


/* Layer 2 - Base                              =2
=================================================
 * Simple selectors: no ID or CLASS attributes
   and no combinators.
   ----------------------------------------------
 * Scroll behaviour is set on the HTML element in
   order to apply to the viewport. It will not
   propagate to the viewport if set on BODY.
   ----------------------------------------------
 * Font stack: For reasons of speed, simplicity
   and familiarity, this style sheet uses only
   system fonts. 'Georgia' by Matthew Carter
   (inspired by the early 19th century 'Scotch
   Roman' typefaces of the Edinburgh type foundry
   Miller & Richard) is an elegant font that
   works well on screen and in print, and is
   supported on both Windows and Mac platforms.
   Other devices not having this font available
   will fall back to their default serif face.
================================================= */

html {
	scroll-behavior: smooth;
	}

body {
	margin: 0 auto;
	padding: 5%;
	max-width: 60em;
	font-family: Georgia, serif;
	font-size: 100%;
	line-height: 1.5;
/*	Take the edge off the black-on-white contrast, but maintain
	better than WCAG 2.1 Level AA. */
	color: #444444;
	background: #FFFFFF;
	}

header {
	text-align: center;
	}

footer {
/*	Add some top margin to provide a bit of separation from body text. */
	margin-top: 3em;
	font-weight: bold;
/*	Georgia has a very *bold* bold weight; almost a black. Lighten the
	text colour so that it does not appear so heavy. */
	color: #666666;
	}


/* Headings.
------------------------------------------------- */

h1, h2, h3, h4, h5, h6 {
/*	To make for separation between sections but proximity to the
	following section, set the top margin greater than the bottom. */
	margin-top: 1.5em;
	margin-bottom: 0.75em;
/*	Default bold weight is too heavy, and ugly. Distinguish heading
	levels primarily by size, as in the rules below. */
	font-weight: normal;
/*	Headings need tighter leading than body text. */
	line-height: 1.2;
	}

h1 {
	font-size: 2em;
	text-align: center;
	}

h2 {
	font-size: 1.8em;
	}

h3 {
	font-size: 1.6em;
	}

h4 {
	font-size: 1.4em;
	 }

h5 {
/*	Georgia at 1.15em italic 'looks' about the same size as 1.2em roman. */
	font-size: 1.15em;
	font-style: italic;
	 }

h6 {
	font-size: 1.1em;
	}


/* Body text.
------------------------------------------------- */

p, ul, ol, hr,
blockquote {
/*	Basic block spacing for body text; based on leading. */
	margin-bottom: 1.5em;
	}

blockquote {
/*	A tiny amount of bottom padding prevents collapsing of the bottom
	margin on the final paragraph or list in a blockquote.
	Set the blockquote off with a pale grey background. */
	padding: 1em 1.5em 0.05em;
	background-color: #F8F8F8;
	}

ul, ol {
/*	Pull up the top margin to associate the list more closely with
	the preceding paragraph. Indent the list from the left margin
	sufficiently to accommodate OL numbers comfortably. */
	margin-top: -0.75em;
	margin-left: 2em;
	}

li {
/*	Make spacing between list items tighter than between paragraphs. */
	margin-bottom: 0.75em;
	}

hr {
/*	Make a 1px high rule. Colour AND background colour must be set
	and be the same. */
	border: 0;
	height: 1px;
	color: #444444;
	background-color: #444444;
	}


/* Data tables.
------------------------------------------------- */

table, tr, th, td {
	border: none;
	}

table {
/*	Make sure tables are always set off from surrounding text, even if
	the preceding element is a heading. */
	margin-top: 1.5em;
	margin-bottom: 1.5em;
	border-top: 1px solid #A8A8A8;
	border-collapse: collapse;
	width: 100%;
	}

th, td {
	padding: 4px 10px 4px 5px;
	vertical-align: top;
	text-align: left;
	}

th {
	font-weight: bold;
/*	Lighten up that bold, again! */
	color: #555555;
	}

td {
/*	It would be nice to use tabular numerals, but I don't believe they
	are supported in non-Pro versions of Georgia. Lining figures are
	still better for tables in general and currency in particular than
	the default 'old style' figures. */
	font-variant-numeric: lining-nums;
	}

caption {
	margin-bottom: 1em;
	line-height: 1.1;
	text-align: center;
	text-transform: uppercase;
	letter-spacing: 1px;
	}


/* 'Mobile first' design provisions.
-------------------------------------------------
 * To accommodate small screens - including old
   featurephones that don't support table display
   properties - initially set the default display
   for rows and cells as 'block' and separate the
   rows with a border.
   ----------------------------------------------
 * Restore normal table rendering on wider
   screens and move the bottom border to cells.
------------------------------------------------- */

tr, th, td {
	display: block;
	}

tr {
	border-bottom: 1px solid #A8A8A8;
	}

@media (min-width: 740px) {

	tr {
		display: table-row;
		}

	th, td {
		display: table-cell;
		border-bottom: 1px solid #A8A8A8;
		}

}


/* Inline elements.
------------------------------------------------- */

b, strong {
	font-weight: bold;
/*	Lighten up that bold, again! */
	color: #555555;
	}

i, em {
	font-style: italic;
	}

abbr {
	border-bottom: 1px dotted #666666;
	cursor: help;
	}

a {
	text-decoration: underline;
	color: #105CB6;
	}


/* Layer 3 - Components                        =3
=================================================
 * Fully designed blocks or UI elements.
================================================= */


/* The document header.
-------------------------------------------------
 * Give headings in the title region a bit more
   breathing room.
------------------------------------------------- */

header h1, header h2, header h3 {
	line-height: 1.5;
	}


/* Consecutive headings in body text.
-------------------------------------------------
 * Reduce the top margin to associate subheadings
   more closely with any immediately preceding
   headings.
------------------------------------------------- */

h3+h4, h4+h5, h5+h6 {
	margin-top: 0.75em;
	}


/* Nested lists.
-------------------------------------------------
 * Increase the top margin to separate from the
   parent list item.
------------------------------------------------- */

li ul, li ol, li p {
	margin-top: 1em;
	}


/* Blockquotes.
-------------------------------------------------
 * Tighten up the spacing between paragraphs.
   These are often short 'list items' in quoted
   legislation, where the base 1.5em margin feels
   uncomfortably large. Also reduces the length
   of the blockquote regions a little.
 * Join consecutive blockquotes seamlessly by
   shifting up the top margin: eliminates the
   whitespace between. Use when there is a second
   or subsequent opening quotation mark in a
   block of quoted text.
------------------------------------------------- */

blockquote p {
	margin-bottom: 1em;
	}

blockquote+blockquote {
	margin-top: -2.5em;
	}


/* Indented paragraphs in quoted legislation.
-------------------------------------------------
 * Arabic numbered: first level indent.
 * Alpha numbered: second level indent.
 * Roman numbered: third level indent.
------------------------------------------------- */

.para-1, .para-1-text {
	margin-left: 1.5em;
	}

.para-a, .para-a-text {
	margin-left: 4em;
	}

.para-i, .para-i-text {
	margin-left: 6.5em;
	}

.para-1, .para-a, .para-i {
/*	Outdent the first line to accommodate a paragraph number. */
	text-indent: -1.5em;
	}


/* Layout classes.
-------------------------------------------------
 * Text alignment. Useful for table cells, where
   there may be numeric data; and for appendix
   headings. And there's nothing wrong with just
   calling them 'centre' and 'right' here!
   ----------------------------------------------
 * Legacy items. Only in use on some early docs.
   Apply only on wider screens.
------------------------------------------------- */

.centre {
	text-align: center;
	}

.right {
	text-align: right;
	}

@media (min-width: 740px) {

	.record {
		float: right;
		margin-top: 0;
		margin-left: 1em;
		width: 15em;
		}

	.application {
		margin: 1.5em 0;
		}

	.court,
	.subscription {
		text-align: center;
		}

	.member1of2 {
		float: left;
		margin-top: 0;
		width: 50%;
		}

	.member1of3 {
		float: left;
		margin-top: 0;
		width: 33%;
		}

}


/* Link states.
-------------------------------------------------
 * As main site styles, for consistency.
------------------------------------------------- */

a:visited {
	color: #105CB6;
	}

a:hover, a:focus {
	text-decoration: underline overline;
	color: #000033;
	}


/* Particular blockquote treatments.
-------------------------------------------------
 * Provide for a hanging quotation mark on the
   first paragraph of a blockquote (unless that
   paragraph is centred such as a part or chapter
   title in quoted legislation, or is neutralised
   by a 'flush' class).
 * Indented paragraphs need to add that same
   negative indent amount to the existing indent.
   ----------------------------------------------
 * One day, we'll be able to simplify this with
   'hanging-punctuation: first'.
------------------------------------------------- */

blockquote p:first-child {
	text-indent: -0.4em;
	}

blockquote .para-1:first-child,
blockquote .para-a:first-child,
blockquote .para-i:first-child {
	text-indent: -1.9em;
	}

blockquote p:first-child.centre,
blockquote p:first-child.flush {
	text-indent: 0;
	}


/* Adjustments for small screens and printing. =4
=================================================
 * Small screens:
 * Shrink the headings in the title region.
   ----------------------------------------------
 * Printing:
 * Modify both the body text and the blockquote
   background colours.
 * Shrink the headings in the title region so as
   to occupy less space on the printed page.
 * Prevent headings being orphaned from the text
   that follows.
 * Ensure normal table rendering.
 * Remove borders from abbreviations.
 * Remove colour, overlines and underlines from
   link text.
================================================= */

@media (max-width: 740px) {

	header {
		font-size: 80%;
		}
}

@media print {

	body {
		color: #000000;
		}

	header {
		font-size: 80%
		}

	h1, h2, h3, h4, h5, h6 {
	/*	Try both old CSS2 & new CSS3 properties. You never know - one
		day, some browser might actually respect these declarations! */
		page-break-inside: avoid;
		break-inside: avoid-page;
		page-break-after: avoid;
		break-after: avoid-page;
		}

	blockquote {
	/*	Remove the extra spacing afforded the block by top & bottom
		padding, as we remove the coloured background. */
		padding-top: 0;
		padding-bottom: 0;
		background-color: #FFFFFF;
		}

	tr {
		display: table-row;
		}

	th, td {
		display: table-cell;
		border-bottom: 1px solid #A8A8A8;
		}

	abbr {
		border: 0;
		}

	a, a:link, a:visited {
		color: inherit;
		text-decoration: none;
		}

}