@charset "utf-8";
/* © 2010-2020 Richard W. Adams */

@import "bg-score.css";

#also { text-align: center; }
body {
	counter-reset: title;
	margin: 0;
	padding: 0;
	border: 0;
	overflow: hidden;
	height: 100%;
	max-height: 100%;
}
#choose-pane p {
	position: absolute;
	top: 50%;
	font-size: 200%;
	width: 100%;
}
#choose-pane {
	position: fixed;
	left: 14em;		/* Width of left-pane */
	right: 0;
	bottom: 0;
}
#illustration {
	border: .5em ridge silver;
	border-radius: 1em;
	float: right;
	margin: 0 1em;
}
#left-pane {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	width: 14em;
	height: 100%;
	overflow: scroll;
	background: white;
}
#left-pane h1 {
	font-size: 1em;
}
#left-pane img {
	border: 0 none;
	margin: 0;
}
#left-pane a:hover { background-color: white; }
#left-pane ul {
	margin: 2ex 0;
	padding: 0;
}
@media screen and (max-width: 799px)  { /* Narrow screens */
	#left-pane li {
		list-style-type: none;
		margin: 3ex 0;
		text-align: center;
	}
	td p, div p, td ul, td ol { text-align: left !important; }
}
@media screen and (min-width: 800px)  {  /* Wide screens */
	#left-pane li {
		list-style-type: none;
		margin: .5ex 0;
		text-align: center;
	}
}
#list ol {
	margin-left: 1em;
	margin-top: 0em;
}
p { 	text-align: center !important; }
#right-bottom-pane {
	position: fixed;
	left: 14em; /* Width of left-pane */
	right: 0;
	bottom: 0;
	overflow: auto;
	padding-right: 1em;
}
#right-bottom-pane #list {
	margin-top:		1em;
	column-gap:		normal;
	column-rule: 	var(--ColumnRule);
}
@media screen and (min-width: 768px) {
	#right-bottom-pane #list { column-count: 2; 	}
}
@media screen and (min-width: 992px) {
	#right-bottom-pane #list { column-count: 3; 	}
}
@media screen and (min-width: 1200px) {
	#right-bottom-pane #list { column-count: 4; 	}
}
#right-bottom-pane ol.menu {
	padding-left: 2em;
	padding-right: 1em;
}
#right-top-pane {
	position: fixed;
	top: 0;
	left: 14em;		/* Width of left-pane  */
	right: 0;
	background: -radial-gradient( 50% 50%, ellipse cover, white, #99CCFF);
	background: -moz-radial-gradient( 50% 50%, ellipse cover, white, #99CCFF);
	background: -webkit-radial-gradient(center, white, #99CCFF);
	background: -ms-radial-gradient(center, white, #99CCFF);
}
#right-top-pane h1 {
	font-size: 150%;
	margin-top: 1em;
}
#right-top-pane:last-child { padding-bottom: 1ex; }
table#external-links {
	margin: auto;
}