/* The original concrete5 "default" theme as customised for Semimetrics,
   followed by a small-screen layout that only applies below 840px. */

html, body { height: 100%; }
body { background-color: #ffffff; text-align: center; padding: 0px; margin: 0px; font: normal normal 13px Arial; color: #777777; }
img { border: 0px }
a { cursor: pointer }
a, a:visited, a:active { color: #66aa33; }
a:hover { color: #66CC00; }

h1, h2, h3, h4, h5 { margin: 0px 0px 4px 0px; padding: 4px 0px; margin-top: 8px }
h1 { font: normal normal 21px Arial; line-height: 28px }
h2 { font-size: 18px; line-height: 24px }
h3 { font-size: 16px; line-height: 21px }
h4 { font-size: 14px; line-height: 18px }
h5 { font-size: 13px; line-height: 16px }
p { padding: 0px 0px 0px 0px; line-height: 18px; }

/* Page Structure / Navigation */
#page { width: 800px; margin: auto; text-align: left }
#page #headerSpacer { height: 64px }
#page #header { position: relative; }
#page #header #logo {
	color: #999; font-size: 32px; font-family: Arial, Helvetica, sans-serif;
	margin-bottom: 0px; padding: 0px; margin-top: 8px; cursor: pointer; left: 0px; z-index: 10; float: left; position: relative;
	text-indent: -900em; width: 265px; height: 44px; background: url(/images/theme/semi-logo.png);
}
#page #header #logo a { color: #999; text-decoration: none; display: block; height: 100%; }

#page #header #headerNav { position: absolute; top: 14px; right: 0px; z-index: 2; width: 100%; overflow: visible; }
#page #header ul.nav-header { list-style: none; margin: 0px; padding: 0px; width: auto; z-index: 2; overflow: visible; float: right }
#page #header ul.nav-header li { float: left; padding: 2px 0px; margin-left: 16px; margin-bottom: 0px; color: #999; font-size: 13px; margin-top: 0px }
#page #header ul.nav-header li a, #page #header ul.nav-header li a:hover { text-decoration: none; color: #999999 }
#page #header ul.nav-header li.nav-selected { border: 1px solid #bbb; padding: 2px 8px; }
#page #header #header-area { margin-top: 10px; margin-bottom: 10px }
#page #header #header-area #header-area-inside { margin-bottom: 12px; }
#page #header #header-area img { display: block }
#page .divider { padding-top: 12px; background: url(/images/theme/nav_horizontal_divider.gif) no-repeat top; overflow: hidden; height: 1px; clear: both; width: 100%; }

#page #central { background: url(/images/theme/nav_sidebar_right_bg.gif) repeat-y center; clear: both; }
#page #central #body { float: left; width: 67%; overflow: hidden; padding-left: 0px; padding-right: 0px }
#page #central #body p { text-align: justify; }
#page #central #sidebar { float: right; width: 24%; overflow: hidden }
#page #central #sidebar p { line-height: 24px }

/* The home page introduction was 16px text with no paragraph spacing. */
#page #central #body blockquote p { font-size: 16px; margin: 0; text-align: left; }

#page #footer { padding-top: 24px; clear: both; padding-bottom: 16px; color: #999; font-size: 10px }
#page #footer a { text-decoration: none }

div.spacer, div.ccm-spacer { clear: both; font-size: 1px; line-height: 1px }

/* Shown when an editor's sign-in has expired. */
.sm-signin { position: fixed; top: 12px; right: 12px; padding: 8px 14px; background: #fff; border: 1px solid #bbb; border-radius: 4px; font-size: 15px; }

@media (max-width: 840px) {
	#page { width: auto; padding: 0 16px; }
	#page #headerSpacer { height: 20px }
	#page #header { display: flex; flex-direction: column; }
	#page #header > * { order: 2; }
	#page #header #logo { order: 0; float: none; margin-top: 0; }
	#page #header #headerNav { order: 1; }
	#page #header #headerNav { position: static; width: auto; margin-bottom: 12px; }
	#page #header ul.nav-header { float: none; display: flex; flex-wrap: wrap; gap: 6px 16px; }
	#page #header ul.nav-header li { float: none; margin-left: 0; font-size: 15px; }
	#page #header #header-area img { width: 100%; height: auto; }

	#page #central { background: none; display: flex; flex-direction: column; }
	#page #central #body, #page #central #sidebar { float: none; width: auto; }
	#page #central #body { order: 1; }
	#page #central #sidebar { order: 2; margin-top: 16px; border-top: 1px dotted #999; }
	#page #central #body p { text-align: left; }
	#page #central #body blockquote { margin: 1em 0 1em 16px; }
}