html {
	 background-attachment: fixed;
	 transition: background 0.15s ease;
}
body {
	font-family: 'IBM Plex Sans', sans-serif;
	background: #fff;
	margin: 5px;	
}

picture	img {
	margin: 0 auto;
	padding: 10px 5%;
	max-width: 90%;
	height: auto;
}

figcaption	{
	padding: 0 5% 5px 7%;
	font-style: italic;
	color: #999;
	max-width: 90%;
	display: block;
}

h1, h2, h3, h2	{
	font-family: 'Space Grotesk';
	font-weight: 700;
	padding: 0 10px;
}

h1 	{
	text-align: center;
	font-size: 1.6em;
	
	font-weight: 900;

	color: hsl(25 100% 50% / 1);		
	filter: drop-shadow(0 0 1em hsl(25 100% 50% / 0.25));
}

h2	{
	font-size: 1.4em;
}

h2 a{
	
	color: #333;
	text-decoration: none;
	
}

aside h2{
	color: hsl(25 100% 50% / 1);
}

p	{
	font-size: 1.2em;
	padding: 0 10px;
}

a	{
	color: hsl(25 100% 50% / 1);

}

a:hover	{
	filter: drop-shadow(0 0 1em hsl(25 100% 50% / 0.35));
}

main, header, aside, footer {
	background: #fff;
	max-width: 75ch;
	margin: 0 auto;
	padding: 20px 0 0 0;
}
footer	{
	text-align: center;
}

#logo	{
	display: block;
	width: 25vw;

	margin: 0 auto;
	padding: 0;
}
.tpticon {
	display: inline-block;
	width: 2em;
	height: 2em;
	margin: 0 0 0.2em 0;
	background-image: url('/fonts/tpticon.png');
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
	vertical-align: middle;
}