@charset "utf-8";
.sidebar {
	float: left;
	margin: 0 5px 25px 2px;
	padding: 5px 5px 0 10px;
	border: 2px solid #777777;
	border-radius: 3px;
	width: 24%;
	background-color: #FFFBF3;
	font-family: "Roboto Slab", serif;	/* was Cambria, "Hoefler Text"... */
	font-size: 1em;
}
.sidebar sup {
	font-size: 10px;
}
.sidebar h5 {
	margin: 0 0 5px -10px;
	text-align: center;
	font-family: 'Roboto Condensed', sans-serif;	/* was "Gill Sans", "Gill Sans MT"... */
	font-size: 1.1em;
}
.sidebar p {
	margin-bottom: 10px;
}
.sidebar .footnote {
	margin-bottom: 10px;
	border-top: solid 1px;
	font-size: smaller;
}
.sidebar .footnote p {
	margin-top: 10px;
	margin-bottom: 5px;
}

@media (min-width: 666px) and (max-width: 1058px) {
	.sidebar {
		font-size: 0.9em;
	}
}
@media (min-width: 540px) and (max-width: 669px) {
	.sidebar {
		font-size: 0.8em;
	}
}
@media (min-width: 489px) and (max-width: 539px) {
	.sidebar {
		font-size: 0.7em;
	}
}
@media (min-width: 416px) and (max-width: 488px) {
	.sidebar {
		font-size: 0.55em;
	}
}
@media (max-width: 415px) {	/* switch to vertical layout */
	.sidebar {
		float: none;
		margin: 15px 5px 5px 1px;
		border-width: 1px;
		width: 93.5%;
		font-size: 0.8em;
	}
	.sidebar sup {
		font-size: 8px;
	}
	.sidebar h5 {
		margin-bottom: 2px;
		font-size: 1em;
	}
	.sidebar p {
		margin-bottom: 5px;
	}
	.sidebar .footnote {
		margin-top: 10px;
		margin-bottom: 10px;
	}
}
/*
@media (max-width: 359px) {
	.sidebar {
		font-size: 0.8em;
	}
	.sidebar h3 {
		font-size: 0.8em;
	}
}
*/
@media (max-width: 288px) {
	.sidebar {
		width: 93.0%;
		font-size: 0.8em;
	}
}
/*
	width 320->415, height 480->767: phone
	width 415->1024, height 768-1024: tablet
	width 1025->2560, height 1024-1600: desktop
	width > 2561, height > 1600: ultra (4K,5K,8K)
*/