
body
{
	/* lighter 225,151,38 */
	--featurecolour:rgb(195,126,48);
	--featurecolour-hover:rgb(172,94,28);
	--featurecolour-darker:rgb(195,126,48);
}


@media screen and (min-width:960px)
{
	h1 span
	{
		max-width:6em;
	}
}

.lead
{
	color:var(--featurecolour-darker);
}

.frame::after
{
	background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 500 500' width='500px' height='500px'%3E%3Cpath d='M0,0v500h500V0H0z M397.5,397.5H133.9V140.8h263.6V397.5z' fill='white'/%3E%3Cpolygon points='0,0 0,263.5 133.914,397.546 133.914,140.821 397.474,140.821 397.474,140.754 256.841,0 0,0' fill='rgb(225,151,38)'/%3E%3Cpolygon points='397.467,140.81 397.467,397.372 243.487,397.372 243.487,500 500,500 500,140.81 397.467,140.81' fill='rgb(199,200,202)'/%3E%3C/svg%3E") no-repeat scroll 50% 0;
	/*background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 500 500' width='500px' height='500px'%3E%3Cpath d='M0,0v500h500V0H0z M397.5,397.5H133.9V140.8h263.6V397.5z' fill='white'/%3E%3Cpolygon points='0,0 0,263.5 133.914,397.546 133.914,140.821 397.474,140.821 397.474,140.754 256.841,0 0,0' fill='rgb(165,102,98)'/%3E%3Cpolygon points='397.467,140.81 397.467,397.372 243.487,397.372 243.487,500 500,500 500,140.81 397.467,140.81' fill='rgb(199,200,202)'/%3E%3Cpolygon points='133.914,397.372 243.487,397.372 243.487,398.372 134.914,398.372' fill='rgb(199,200,202)'/%3E%3C/svg%3E%0A") no-repeat scroll 50% 0;*/
	background-size:100% auto;
}

.panel2
{
	grid-template-areas:".    line line line line line line ."
						".    head head head head head head ."
						".    fig1 fig1 fig1 fig1 fig1 fig1 ."
						".    tex1 tex1 tex1 tex1 tex1 tex1 ." 
						".    fig2 fig2 fig2 fig2 fig2 fig2 ."
						".    fig3 fig3 fig3 fig3 fig3 fig3 ."
						".    fig4 fig4 fig4 fig4 fig4 fig4 ."
						".    tex2 tex2 tex2 tex2 tex2 tex2 ."
						".    fig5 fig5 fig5 fig5 fig5 fig5 ." 
						".    tex3 tex3 tex3 tex3 tex3 tex3 ."
						".    fig6 fig6 fig6 fig6 fig6 fig6 ."
						".    tex4 tex4 tex4 tex4 tex4 tex4 ."
						".    side side side side side side ."
						".    cred cred cred cred cred cred .";
	
}


@media screen and (min-width:960px)
{
	.panel2
	{
		grid-template-areas:". line line .    .    .    .    .    .    .    .    .    .    .    .    .    ." 
							". head head head head head .    .    .    .    .    .    .    .    .    side ." 
							". fig1 fig1 fig1 fig1 fig1 fig1 fig1 fig1 fig1 fig1 fig1 fig1 fig1 .    side ."
							". tex1 tex1 tex1 tex1 tex1 tex1 tex1 tex1 tex1 .    fig5 fig5 fig5 .    side ."
							". fig2 fig2 fig2 fig2 fig2 .    tex2 tex2 tex2 .    fig5 fig5 fig5 .    side ."
							". fig3 fig3 fig3 fig3 fig3 .    tex2 tex2 tex2 .    fig5 fig5 fig5 .    side ."
							". fig4 fig4 fig4 fig4 fig4 .    tex2 tex2 tex2 .    fig5 fig5 fig5 .    side ."
							". fig4 fig4 fig4 fig4 fig4 .    tex2 tex2 tex2 .    tex3 tex3 tex3 .    side ."
							". fig6 fig6 fig6 fig6 fig6 fig6 fig6 fig6 fig6 fig6 fig6 fig6 fig6 .    side ."
							". tex4 tex4 tex4 tex4 tex4 .    .    .    .    .    .    .    .    .    side ." 
							". cred cred cred cred cred cred cred cred cred cred cred cred cred .    side .";
		grid-template-rows:repeat(7,min-content) 1fr min-content min-content min-content;
	}
}

@media screen and (min-width:1200px)
{
	.panel2
	{
		grid-template-areas:". line line .    .    .    .    .    .    .    .    .    .    .    .    .    ." 
							". head head head head head .    .    .    .    .    .    .    .    .    side ." 
							". tex1 tex1 .    fig1 fig1 fig1 fig1 fig1 fig1 fig1 fig1 fig1 fig1 .    side ."
							". tex1 tex1 .    fig2 fig2 fig2 fig2 fig2 .    .    fig5 fig5 fig5 .    side ."
							". fig3 fig3 fig3 fig3 fig3 .    tex2 tex2 .    .    fig5 fig5 fig5 .    side ."
							". fig4 fig4 fig4 fig4 fig4 .    tex2 tex2 .    .    fig5 fig5 fig5 .    side ."
							". fig4 fig4 fig4 fig4 fig4 .    tex2 tex2 .    .    tex3 tex3 tex3 .    side ."
							". tex4 tex4 fig6 fig6 fig6 fig6 fig6 fig6 fig6 fig6 fig6 fig6 fig6 .    side ."
							". cred cred cred cred cred cred cred cred cred cred cred cred cred .    side .";
		grid-template-rows:repeat(6,min-content) 1fr min-content min-content;
	}
	
}


.content1 b,
.content2 b,
.content3 b,
.content4 b
{
	font-weight:500;
}

.panel2>.content2,
.panel2>.content3,
.panel2>.content4
{
	margin-top:0;
}

.panel2>.content2 h2,
.panel2>.content3 h2,
.panel2>.content4 h2
{
	padding:0.833333rem 0 1.666667rem;
	border-top:0.444444rem solid rgb(88,89,91);
	min-height:4.2rem;
}

@media screen and (min-width:1200px)
{
	.panel2>.content2 h2,
	.panel2>.content3 h2
	{
		min-height:7.75rem;
	}
	.panel2>.content4 h2
	{
		min-height:9.45rem;
	}
}

.panel2>.content2 h2 b,
.panel2>.content3 h2 b,
.panel2>.content4 h2 b
{
	font-weight:500;
}


/*
.panel2>.content1
{
	padding-bottom:1rem;
}
*/

.panel2>.content1,
.panel2>.content3
{
	padding-bottom:3rem;
}

@media screen and (min-width:960px)
{
	.panel2>.content1,
	.panel2>.content3
	{
		padding-bottom:1.666667rem;
	}
}

.panel2>.content2
{
	padding-top:2rem;
	padding-bottom:3rem;
}

@media screen and (min-width:960px)
{
	.panel2>.content2
	{
		padding-top:0;
		padding-bottom:1.666667rem;
	}
}

.panel2>.content4
{
	color:var(--featurecolour-darker);
	padding-bottom:3rem;
}
.panel2>.content4 h2 b
{
	color:var(--featurecolour-darker);
	display:block;
	font-weight:500;
}

@media screen and (min-width:960px)
{
	.panel2>.content4
	{
		margin:-10.5rem 0 5em;
		padding-bottom:1.666667rem;
	}
}

@media screen and (min-width:1200px)
{
	.panel2>.content4
	{
		margin:10.5rem 0 5em;
		padding-bottom:1.666667rem;
	}
}

@media screen and (min-width:960px)
{
	.fig4 figcaption
	{
		max-width:15em;
	}
}

@media print
{
	.fig5
	{
		display:grid;
		grid-template-columns:repeat(3,1fr);
		column-gap:1rem;
	}
}

@media screen and (min-width:960px)
{
	.fig6
	{
		margin:0 -1% 0 -1%;
		pointer-events: none;
	}
}

@media screen and (min-width:1200px)
{
	.fig6
	{
		margin:0 -1% 0 -4%;
		pointer-events: none;
	}
}

/*
.fig1
{
	margin-bottom:3rem;
}

.fig2
{
	margin-bottom:3rem;
}
@media screen and (min-width:960px)
{
	.fig2
	{
	margin-top:1rem;
	}
}

.fig3
{
	margin:0 -10% 0 -4%;
}

@media screen and (min-width:1200px)
{
	.panel2>.fig3
	{
		grid-column-start:6;
	}
}
*/
a.shop-button
{
	font-size:1.15rem;
}
