
body
{
	--featurecolour:rgb(141,4,5);
	--featurecolour-hover:rgb(109,2,2);
	--featurecolour-darker:rgb(141,4,5);
}


@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(141,4,5)'/%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-size:100% auto;
}

.panel2
{
	grid-template-areas:".    line line line line line line ."
						".    head head head head head head ."
						".    tex1 tex1 tex1 tex1 tex1 tex1 ."
						".    fig1 fig1 fig1 fig1 fig1 fig1 ." 
						".    fig2 fig2 fig2 fig2 fig2 fig2 ."
						".    tex2 tex2 tex2 tex2 tex2 tex2 ." 
						".    fig3 fig3 fig3 fig3 fig3 fig3 ."
						".    fig4 fig4 fig4 fig4 fig4 fig4 ."
						".    tex3 tex3 tex3 tex3 tex3 tex3 ."
						".    fig5 fig5 fig5 fig5 fig5 fig5 ."
						".    tex4 tex4 tex4 tex4 tex4 tex4 ."
						".    fig6 fig6 fig6 fig6 fig6 fig6 ."
						".    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 .    fig1 fig1 fig1 fig1 fig1 fig1 fig1 .    side ."
							". tex1 tex1 tex1 tex1 tex1 .    fig1 fig1 fig1 fig1 fig1 fig1 fig1 .    side ."
							". fig2 fig2 fig2 fig2 fig2 .    fig1 fig1 fig1 fig1 fig1 fig1 fig1 .    side ."
							". tex2 tex2 tex2 tex2 tex2 .    fig3 fig3 fig3 fig3 fig3 .    .    .    side ."
							". tex2 tex2 tex2 tex2 tex2 .    fig4 fig4 fig4 fig4 fig4 .    .    .    side ."
							". fig5 fig5 fig5 fig5 fig5 .    fig4 fig4 fig4 fig4 fig4 .    .    .    side ."
							". fig5 fig5 fig5 fig5 fig5 .    tex3 tex3 tex3 tex3 tex3 .    .    .    side ."
							". tex4 tex4 tex4 tex4 tex4 .    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(7,min-content) 1fr repeat(2,min-content);
	}
}

@media screen and (min-width:1200px)
{
	.panel2
	{
		grid-template-areas:". line line .    .    .    .    .    .    .    .    .    .    .    .    .    ." 
							". head head head head head .    fig1 fig1 fig1 fig1 fig1 fig1 fig1 .    side ."
							". tex1 tex1 tex1 tex1 tex1 .    fig1 fig1 fig1 fig1 fig1 fig1 fig1 .    side ."
							". fig2 fig2 fig2 fig2 fig2 .    fig1 fig1 fig1 fig1 fig1 fig1 fig1 .    side ."
							". tex2 tex2 .    fig3 fig3 fig3 fig3 fig3 .    .    .    .    .    .    side ."
							". tex2 tex2 .    fig4 fig4 fig4 fig4 fig4 .    tex3 tex3 .    .    .    side ."
							". tex2 tex2 .    fig4 fig4 fig4 fig4 fig4 .    fig5 fig5 fig5 fig5 .    side ."
							". tex4 tex4 .    .    fig6 fig6 fig6 fig6 .    fig5 fig5 fig5 fig5 .    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;
	}
	
}



@media screen and (min-width:1200px)
{
	.panel2>.content1
	{
		column-count:2;
		column-gap:var(--gridunit);
	}
}

.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;
}


@media screen and (min-width:960px)
{
	.panel2>.content4 h2 b,
	.panel2>.content4 h2 span
	{
		display:block;
	}
}

/*
.panel2>.content1
{
	padding-bottom:1rem;
}
*/

.panel2>.content1,
.panel2>.content3
{
	padding-bottom:3rem;
}

@media screen and (min-width:960px)
{
	.panel2>.content1
	{
		padding-bottom:1.666667rem;
	}
	.panel2>.content3
	{
		padding-bottom:0.722222rem;
	}
}

.panel2>.content2
{
	padding-top:2rem;
	padding-bottom:3rem;
}

@media screen and (min-width:960px)
{
	.panel2>.content2
	{
		padding-top:0;
		padding-bottom:1.666667rem;
	}
}



.panel2>.content3
{
	padding-top:2rem;
	padding-bottom:3rem;
}

@media screen and (min-width:960px)
{
	.panel2>.content3
	{
		padding-top:0;
		padding-bottom:1.666667rem;
	}
}



.panel2>.content4
{
	color:var(--featurecolour-darker);
	padding-top:2rem;
	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:0 0 5em;
		padding-top:0;
		padding-bottom:1.666667rem;
	}
}

@media screen and (min-width:1200px)
{
	.panel2>.content4
	{
		margin:0 0 5em;
		padding-bottom:1.666667rem;
	}
}

@media screen and (min-width:960px)
{
	.fig4
	{
		margin-bottom:0;
	}
	
}

@media screen and (min-width:960px)
{
	.fig6
	{
		margin-top:1.666667rem;
	}
}

@media screen and (min-width:1200px)
{
	.fig6
	{
		margin:1rem -25% 0 -12.5%;
		pointer-events: none;
	}
}

@media print
{
	.fig1,.fig4,.fig5,.fig6
	{
		max-width:60%;
		margin-left:auto;
		margin-right:auto;
	}

}

a.shop-button
{
	font-size:1.15rem;
	margin-top:3rem;
}
