header {
	grid-area: header;
	position:relative;
}
	header a.header_bar_logo {
		background-size:contain;
		background-position:center center;
		background-repeat:no-repeat;
		text-indent:-500em;
	}
		header a.header_bar_logo img {
			display:none;
		}
	
	header div#inner {
		z-index:1;
		display:grid;
	}
	header div.header_logo {
		background-size:contain;
		background-position:center center;
		background-repeat:no-repeat;
		height:140px;
	}
	.header_heading {
		grid-area: hr;
		z-index:2;
		align-self:center;
		justify-self:center;
		padding:0;
	}
	.header_subheading {
		grid-area: sh;
		z-index:2;
		align-self:center;
		justify-self:center;
		padding:0;
	}
	header div.header_logo {
		grid-area:lo;
		align-self:stretch;
		height:auto;
		z-index:2;
	}

#header_bar {
	position:relative;
	z-index:1;
	display:grid;
	grid-gap:1rem;
	grid-template-columns:1fr;
}
	#header_bar>span {
		min-height:3rem;
		justify-self:center;
	}
	#header_bar.header_bar_mobile_hidden {
		display:none;
	}
	
	@media(min-width: 1000px) {
		#header_bar {
			padding:1rem;
			grid-template-columns:1fr 1fr 1fr;
		}
		#header_bar>* {
			align-content:center;
			width:100%;
		}
			#header_bar.header_bar_align_start>* {
				align-content:start;
			}
			#header_bar.header_bar_align_end>* {
				align-content:end;
			}
		#header_bar>*:nth-child(1) {
			display:grid;
			justify-content:start;
			background-position:left center;
		}
		#header_bar>*:nth-child(2) {
			display:grid;		
		}
		#header_bar>*:nth-child(3) {
			display:grid;
			justify-content:end;
			background-position:right center;
		}
		#header_bar.header_bar_mobile_hidden {
			display:grid;
		}
		
		
		/* single item */
		#header_bar>*:first-child:last-child {
			justify-content:center;
			grid-column: 1/4;
		}
		
		/* two items */
		#header_bar>*:first-child:nth-last-child(2) {
			justify-content:start;
			background-position:left center;
			grid-column: 1;
		}
		#header_bar>*:nth-child(2):last-child {
			justify-content:end;
			background-position:right center;
			grid-column: 3;
		}
		
		
	}
	
.header_bar_social_networks span {
	display:flex;
	margin:.5rem 0;
}
	.header_bar_social_networks a {
		height:32px;
		width:32px;
		margin:auto 4px;
		text-indent:-500rem;
		background-size:70%;
		background-position:center center;
		background-repeat:no-repeat;
		display:inline-block;
	}
	
	
#header_bar_search {
	display:inline;
}
	#header_bar_search input[type=search] {
	
	}
	#header_bar_search input[type=submit] {
	
	}
	
#header_slideshow {
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	z-index:0;
}
	#header_slideshow>div {
		position:absolute;
		top:0;
		bottom:0;
		left:0;
		right:0;
		background-size:cover;
		background-position:center center;
	}
	
	/* CAPTION POSITIONS */
	#header_slideshow>div>span {
		display:inline-block;
		position:absolute;
		top:1rem;
		right:1rem;
		font-style:italic;
		font-size:.8rem;
		opacity:.7;
	}
	.hsc_br #header_slideshow>div>span {
		top:auto;
		bottom:1rem;
	}
	.hsc_bl #header_slideshow>div>span {
		top:auto;
		bottom:1rem;
		right:auto;
		left:1rem;
	}
	.hsc_tl #header_slideshow>div>span {
		right:auto;
		left:1rem;
	}
	
	/* CAPTION STYLES */
	.hsc_s1 #header_slideshow>div>span {
		padding:3px 9px 3px 12px;
		background:#fff;
		color:#000;
		opacity:1;
		right:0;
		border-radius:9px 0 0 9px;
		box-shadow:0 0 2px 0 rgba(0,0,0,.3) inset;
	}
		.hsc_s1.hsc_bl #header_slideshow>div>span,
		.hsc_s1.hsc_tl #header_slideshow>div>span {
			right:auto;
			left:0;
			border-radius:0 9px 9px 0;
			padding:3px 10px 3px 9px;
		}
	.hsc_s2 #header_slideshow>div>span {
		padding:3px 9px 3px 12px;
		background:rgba(0,0,0,.5);
		color:#fff;
		right:0;
		border-radius:9px 0 0 9px;
	}
		.hsc_s2.hsc_bl #header_slideshow>div>span,
		.hsc_s2.hsc_tl #header_slideshow>div>span {
			right:auto;
			left:0;
			border-radius:0 9px 9px 0;
			padding:3px 10px 3px 9px;
		}
	.hsc_s3 #header_slideshow>div>span {
		padding: 3px 20px;
		background: rgba(255, 255, 255, 0.7);
		color: #262626;
		border-radius: 15px;
		border: 3px solid #fff;
		font-style:normal;
	}
		.hsc_s3 #header_slideshow>div>span::before,
		.hsc_s3 #header_slideshow>div>span::after {
			content:'';
			display:inline-block;
			background:#fff;
			width:7px;
			height:7px;
			border-radius:50%;
			position:absolute;
			top: 9px;
			left: 7px;
			box-shadow: 1px 1px 2px 0 rgba(0,0,0,.7);
		}
		.hsc_s3 #header_slideshow>div>span::after {
			left:auto;
			right:7px;
		}

	.hsc_s4 #header_slideshow>div>span {
		padding: 3px 22px;
		background: linear-gradient(128deg, rgba(184,149,28,1) 0%, rgba(217,198,106,1) 51%, rgba(181,123,26,1) 100%);
		color: #262626;
		border-radius: 15px;
		font-style:normal;
		font-variant:small-caps;
		font-family:Calibri, sans-serif;
		text-shadow: rgba(245,245,245,0.5) 1px 1px 1px;
		box-shadow:1px 1px 2px 0 rgba(0,0,0,.3);
	}
		.hsc_s4 #header_slideshow>div>span::before,
		.hsc_s4 #header_slideshow>div>span::after {
			content:'';
			display:inline-block;
			background: linear-gradient(128deg, rgba(184,149,28,1) 0%, rgba(217,198,106,1) 51%, rgba(181,123,26,1) 100%);
			width:7px;
			height:7px;
			border-radius:50%;
			position:absolute;
			top: 9px;
			left: 7px;
			box-shadow: 1px 1px 2px 0 rgba(0,0,0,.7);
		}
		.hsc_s4 #header_slideshow>div>span::after {
			left:auto;
			right:7px;
		}
		
	
	/* MOBILE LAYOUTS */

	/* 0 = h1 and optional h3 */
	.header_layout0 div#inner {
		grid-template-columns: repeat(3, 1fr);
		grid-template-rows: 1fr;
		grid-template-areas: 
		"hr hr hr"
		;		
	}
	.header_layout0.with_strapline div#inner {
		grid-template-columns: repeat(3, 1fr);
		grid-template-rows: 1fr 1fr;
		grid-template-areas: 
		"hr hr hr"
		"sh sh sh"
		;
	}
	/* 1,2,3,4 logo and h1 */
	.header_layout1 div#inner,
	.header_layout2 div#inner,
	.header_layout3 div#inner,
	.header_layout4 div#inner {
		grid-template-columns: repeat(3, 1fr);
		grid-template-rows: 1fr 1fr;
		grid-template-areas:
		"lo lo lo"
		"hr hr hr"
		;	
	}
	.header_layout1.with_strapline div#inner,
	.header_layout2.with_strapline div#inner,
	.header_layout3.with_strapline div#inner,
	.header_layout4.with_strapline div#inner {
		grid-template-columns: repeat(3, 1fr);
		grid-template-rows: 1fr 1fr;
		grid-template-areas:
		"lo lo lo"
		"hr hr hr"
		"sh sh sh"
		;	
	}
	
	/* 5 = logo only */
	.header_layout5 div#inner {
		grid-template-columns: repeat(3 1fr);
		grid-template-rows: 1fr;
		grid-template-areas: 
		"lo lo lo"
		;
	}
		
	/* 7 = no name or logo - background image/slideshow only */
	.header_layout7 div#inner {
		grid-template-columns: 1fr;
		grid-template-rows: 1fr;
		grid-template-areas: 
		"xx"
		;
	}
	
	/* 9 = logo centred above name */
	.header_layout9 div#inner {
		grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
		grid-template-rows: 2fr 1fr 1fr 1fr;
		grid-template-areas: 
		". . . . ."
		". lo lo lo ."
		"hr hr hr hr hr"
		"sh sh sh sh sh"
		;
	}	


@media(min-width: 1000px) {	
	
	div#inner {
		padding:0;
		margin:0 auto;
		max-width:1280px;
	}
		main.wide div#inner {
			/*
			width of article + aside - 2 gutters - 2 x article padding
			*/
			max-width:calc(90vw - var(--grid-gap) - var(--grid-gap) - 8rem);
		}
	
		/* DESKTOP LAYOUTS */
		
		/* 0 = h1 and optional h3 */
		.header_layout0 div#inner {
			grid-template-columns: repeat(3, 1fr);
			grid-template-rows: 1fr 1fr 3fr;
			grid-template-areas: 
			". . . "
			". . . "
			"hr hr hr"
			;		
		}
		.header_layout0.with_strapline div#inner {
			grid-template-columns: repeat(3, 1fr);
			grid-template-rows: 1fr 2fr 1fr;
			grid-template-areas: 
			". . . "
			"hr hr hr"
			"sh sh sh"
			;
		}

		/* 1,2,3,4 logo and h1 */
		.header_layout1 div#inner {
			grid-template-columns: repeat(3, 1fr);
			grid-template-rows: 1fr;
			grid-template-areas:
			"lo hr hr"
			;	
		}
		.header_layout1.with_strapline div#inner {
			grid-template-columns: repeat(3, 1fr);
			grid-template-rows: 1fr 1fr;
			grid-template-areas:
			"lo hr hr"
			"lo sh sh"
			;	
		}
		.header_layout2 div#inner {
			grid-template-columns: repeat(3, 1fr);
			grid-template-rows: 1fr;
			grid-template-areas:
			"hr hr lo"
			;	
		}
		.header_layout2.with_strapline div#inner {
			grid-template-columns: repeat(3, 1fr);
			grid-template-rows: 1fr 1fr;
			grid-template-areas:
			"hr hr lo"
			"sh sh lo"
			;	
		}
		.header_layout3 div#inner {
			grid-template-columns: repeat(4, 1fr);
			grid-template-rows: 1fr;
			grid-template-areas:
			"lo hr hr hr"
			;	
		}
		.header_layout3.with_strapline  div#inner {
			grid-template-columns: repeat(4, 1fr);
			grid-template-rows: 1fr 1fr;
			grid-template-areas:
			"lo hr hr hr"
			"lo sh sh sh"
			;	
		}
		.header_layout4 div#inner {
			grid-template-columns: repeat(4, 1fr);
			grid-template-rows: 1fr;
			grid-template-areas:
			"hr hr hr lo"
			;	
		}
		.header_layout4.with_strapline div#inner {
			grid-template-columns: repeat(4, 1fr);
			grid-template-rows: 1fr 1fr;
			grid-template-areas:
			"hr hr hr lo"
			"sh sh sh lo"
			;	
		}
		
		/* 5 = logo only */
				
}