html,body{margin-top:0; background:#F4F4F1;}
body{font-size:18px; max-width: 800px; margin-top:0;margin-left:auto;margin-right:auto; padding:0 20px;}
#tattle{position:fixed;top:0;right:0;width:100px;height:100px;background:grey;}

/*@media screen and (max-device-aspect-ratio: 1/1) {
	html{font-size: 3.00em;}
	body{max-width: 1200px;}
	table#playercount th{width:240px;}
	table#playercount td{width:240px;}
}*/

span.mobile-only{display:none;}
@media only screen and (max-width:1000px) {
	body{font-size:30px;max-width:1200px;}
	span.mobile-only{display:initial;}
	#tattle{background:pink;}
}
@media only screen and (device-width: 768px) {
	body{font-size:22px;}
	#tattle{background:green;}
}

h1:first-of-type{margin-top:0;}
h1{max-width:100%;background:#00539F;color:#F4F4F1; padding:0 16px; margin: 1em 40px 0 00px; padding-bottom: 3px;}
h2{max-width:100%;background:#D6464F;color:#F4F4F1; padding:0 16px; margin: 1em 20px 0 20px; padding-bottom: 3px;}
h3{max-width:100%;background:#00539F;color:#F4F4F1; padding:0 16px; margin: 1em 00px 0 40px; padding-bottom: 3px;}
/*h1,h2,h3{border-radius:3px;}*/
h1{
	clip-path: polygon(2.7% 0, 100% 0, 97.3% 100%, 0 100%);
	-webkit-clip-path: polygon(2.7% 0, 100% 0, 97.3% 100%, 0 100%);
}
h2{
	clip-path: polygon(2.0% 0, 100% 0, 98.0% 100%, 0 100%);
	-webkit-clip-path: polygon(2.0% 0, 100% 0, 98.0% 100%, 0 100%);
}
h3{
	clip-path: polygon(1.7% 0, 100% 0, 98.3% 100%, 0 100%);
	-webkit-clip-path: polygon(1.7% 0, 100% 0, 98.3% 100%, 0 100%);
}

.indent1 	{ margin-left:05px; margin-right: 20px; }
.indent2,p 	{ margin-left:25px; margin-right:  0px; }
.indent3 	{ margin-left:45px; margin-right:-20px; }

span.tip{display:block;font-size:85%;font-style:italic;margin-left:20px;margin-bottom:1em;}
/*span.tip{display:none;}*/
table#playercount{text-align:center; margin-left:auto; margin-right:auto; border-spacing: 0;}
table#playercount th{width:160px; padding: 7px 2px;}
table#playercount td{width:160px; padding: 7px 2px;}
table#playercount tr:nth-child(2n+1){background-color: #ddd;}
table#playercount th:nth-child(2n+1),table#playercount td:nth-child(2n+1)
	{border-right: 1px #F4F4F1 solid;}
table#playercount th{background:#00539F;color:#F4F4F1;padding-top:0px;padding-bottom:5px;}

img {max-width:100%;}

a, a:visited {
	color:#D6464F; font-size: 120%;}
a.reveal, a.reveal:visited, a.jumplink, a.jumplink:visited {
	color:#0053BF; font-size: 100%;}

div#footer {margin-top:20px;margin-bottom:10px;}
div.aside { /*border-radius:6px;*/
	transition:
		background 0.1s ease-in-out,
		color 0.1s ease-in-out,
		max-height 0.35s cubic-bezier(.31,.09,.06,1.09),
		margin-bottom 0.35s cubic-bezier(.31,.09,.06,1.09);
	background-color:#fff;
	margin-bottom:1em;

	cursor: pointer;
	overflow-y: hidden;}

div.aside img {
	/*padding:0 20px;*/
	max-width:100%;
}
div.aside h3 {background:#D6464F;background:#3d3d38;color:#F4F4F1;
	transition:
		background 0.1s ease-in-out,
		color 0.1s ease-in-out;
	margin:0;
	clip-path: none;
	-webkit-clip-path: none;
	text-align: center;

	/*transition: background 0.1s ease-in-out, color 0.1s ease-in-out, transform 0.1s ease-in-out;*/
}
div.aside p {
	padding:0 20px;
}
div.aside.hidden, div.aside:hover {background:#FBFBF8; color:#333;}
div.aside.hidden h3, div.aside:hover h3 {background:#C6363F; background:#1d1d18;}

div.aside.hidden {
	margin-bottom:-1em;
}

div.nav {
	width:100%;text-align:center;margin:35px 0;
	padding-bottom:2em;
}