html { font-size: 95%; }
body { width: 100%; min-width: 360px; font-size: 100%; font-family: sans-serif, Arial; text-align: left; color: #404248; padding: 0px; top: 0; left: 0; right: 0; bottom: 0; margin: 0px; background-color: #ffffff; border: 0px red solid; }
* { font-family: sans-serif, Arial; }	
table, th, tr, td, div, span { font-size: 100%; color: #404248; }
table, td { border-width: 0px; border-style: solid; border-color: #FFFFFF; border-collapse: collapse; }

input, select, option, textarea, button { font-size: 100%; box-sizing: border-box; }
input { margin: 0px 2px; text-indent: 0px; }
input[type=text] { padding-left: 2px; }

#AjaxContentBox input:required:invalid { -moz-box-shadow: none; }
#AjaxContentBox input:required:valid { -moz-box-shadow: none; }

textarea { padding-left: 2px; margin: 0px 2px; text-indent: 0px; box-sizing: border-box; }
select { height: 1.7em; margin: 0px 2px; text-indent: 0px; box-sizing: border-box; }
option { margin: 0px; text-indent: 0px; box-sizing: border-box; }
button { margin: 0px 2px; text-indent: 0px; box-sizing: border-box; }

p { text-align: left; font-size: 100%; }
div { margin: 0px; padding: 0px; text-align: left; font-size: 100%; }
ul { margin: 8px 0px 0px 0px; }
li { margin: 0px 0px 3px 0px; }

h1, h2, h3, h4, h5, h6 { margin-top: 5px; margin-bottom: 5px; font-weight: bold; }
h1 { font-size: 126%; text-align: center; }
h2 { font-size: 120%; }
h3 { font-size: 110%; }
h4 { font-size: 100%; }
h5 { font-size: 100%; }
h6 { font-size: 100%; }

.w5 { width: 5%; }
.w10 { width: 10%; }
.w15 { width: 15%; }
.w20 { width: 20%; }
.w30 { width: 30%; }
.w40 { width: 40%; }
.w50 { width: 50%; }
.w60 { width: 60%; }
.w70 { width: 70%; }
.w80 { width: 80%; }
.w90 { width: 90%; }
.w95 { width: 95%; }
.w100 { width: 100%; }

.wm60 { min-width: 60px; }
.wm90 { min-width: 90px; }
.wm120 { min-width: 120px; }
.wm160 { min-width: 160px; }
.wm200 { min-width: 200px; }

.h2e { height: 2.1em !important; }
.h3e { height: 3.2em !important; }

.hm3e { min-height: 3em !important; }
.hm4e { min-height: 4em !important; }
.hm6e { min-height: 6em !important; }
.hm8e { min-height: 8em !important; }
.hm10e { min-height: 10em !important; }
.hm12e { min-height: 12em !important; }
.hm15e { min-height: 15em !important; }

a { color: #006FC0; text-decoration: none; border-bottom: dotted 1px #006FC0; }
a:hover { color: #005FC0; text-decoration: underline; border-bottom: dotted 0px #006FC0; }

img { margin: 5px; }
img.fullWidth { border: solid 1px #ddd; width: 98%; height: auto; margin: 0.25rem 0px 0.25rem 0px; }
.inlineLinkBox { margin-top: 2rem; padding: 1.15rem 1.5rem 1rem 1.5rem; border: solid 1px #dddddd; background-color: #f5f5f5; border-radius: 5px; }

body.FullContent .MenuBoxLeft { display: none !important; overflow: hidden; width: 1px !important; }
body.FullContent .ContentMain { margin: 0px 0px 0px 0px !important; }
body.FullContent #AjaxTreelineBox { margin-left: 0px !important; }

#BodyBox { border: solid 0px; width: 100%; margin: 0px; padding: 0px; }
#PageBox { display: block; background-color: #FFFFFF; border: solid 0px; width: 100%; margin: 0px; padding: 0px; }

/* Doc element styles */

#AjaxContentBox { text-align: center; }
#AjaxTreelineBox { margin-bottom: 10px !important; }
#AjaxTreelineBox .Content { font-weight: normal; color: #333333; text-align: center; }
#AjaxTreelineBox .Content span { /* font-size: 96%; font-weight: normal; color: #888888; */ }

#AjaxTreelineBox { width: 100%; display: table; }
#AjaxTreelineBox div { width: 100%; min-height: 2.8em; display: table-row; }
#AjaxTreelineBox div h1 { display: table-cell; width: 100%; height: 2.8em; text-align: center; vertical-align: middle; font-size: 110%; margin: 0px; background-color: #006699; color: white; line-height: 1.1em; }
#AjaxTreelineBox div h1 a { display: inline-block; float: none; margin: 0px 1em; vertical-align: middle; color: white; }


.AjaxContentBox { text-align: center; box-sizing: border-box; display: block; /* float: left; */ }
.AjaxContentBox.fullSize { width: 100%; min-height: 580px !important; padding-bottom: 2em; }
.AjaxContentBox.halfSize { width: 50%; }
.AjaxContentBox.thirdSize { width: 33.3%; }
.AjaxContentBox.quartSize { width: 24.75%; }

@media screen and (max-width: 640px) {
	.AjaxContentBox.fullSize { width: 100%; padding: 10px 10px 150px 10px !important; } .AjaxContentBox.halfSize { width: 100%; }
	.AjaxContentBox.thirdSize { width: 100%; } .AjaxContentBox.quartSize { width: 100%; }
}

#AjaxTreelineBox .PageHeader {
	display: table-cell; width: 100%; height: 2.8em; 
	text-align: left; vertical-align: middle; font-size: 130%; margin: 0px; 
	background-color: #006699; color: white; line-height: 1.1em; text-align: center;
}
#AjaxTreelineBox .PageHeader a { color: white; font-weight: normal; }
#AjaxTreelineBox .PageHeader a:first-child { color: white; font-weight: bold; }

#ContentBox { /* text-align: left; */ margin: 0px auto; padding: 1em 1em; }
#ContentBox > h1 { display: inline-block; width: auto; text-align: left; padding: 0px 1px 0.5em 1px; margin: 0px; }
#ContentBox .Beta { display: inline-block; color: #aaaaaa; padding-left: 1em; }
#ContentBox > p { text-align: left; padding-left: 5px; }

#ContentBox .Header2 { width: calc(100% - 4px); color: #888888; font-size: 100%; background-color: #efefef; text-align: left; box-sizing: border-box; padding: 0.5em 1em; margin: 0.75em 1px 0.5em 1px; border-radius: 2px; }
#ContentBox .TopSpace { margin-top: 0.75em !important; }

.FooterBox { display: block; float: left; position: relative; bottom: 0; left: 0; right: 0; width: 100%; min-height: 4em; box-sizing: border-box; padding: 1rem 1rem 2.5rem 1rem; }
.FooterBox .Center { width: 100%; display: block; text-align: center; padding: 1em 1em 1em 1em; box-sizing: border-box; }
.FooterBox .Center a { color: #006699; border-bottom: 1px dotted #aaaaaa; text-decoration: none; padding: 0.1rem 0px; }
.FooterBox .Center a:hover { color: #006699; text-decoration: none; border-bottom: solid 1px; }

.FooterBox .Center nav { margin: 0rem auto 0.5rem auto; text-align: center; width: fit-content; }
.FooterBox .Center nav ul { display: flex; flex-wrap: wrap; padding: 0px; }
.FooterBox .Center nav ul li { display: inline-block; margin: 0px 1vw; }
.FooterBox .Center nav ul li a { padding: 0.2rem 0.5rem; }
.FooterBox .Center nav ul li span.fa { vertical-align: middle; font-size: 1.1rem; color: #006699; }

@media screen and (max-width: 640px) {
	.FooterBox .Center nav ul li { padding: 0.5rem 0px; }
}
@media screen and (max-width: 480px) {
	.FooterBox .Center nav ul { flex-direction: column; }
}

.maxW800 { width: 100%; max-width: 1200px; /* max-width: 800px; max-width: 900px; */ display: flex; flex-direction: column; }
.maxW900 { width: 93%; max-width: 900px; margin: auto; } 

.bigFontLink { font-size: 110%; }

.PageHeader .LogoIcon { font-size: 1.5em; color: white; vertical-align: middle; margin: -1px 0.5em 1px 0em; }

.PreviewArticle { width: 100%; padding: 0.5rem 0px 1.5rem 0px; }
.PreviewArticle h2 { padding-top: 0.25em; }
img.PreviewTool { float: left; width: 30%; max-width: 320px; height: auto; margin: 0em 1.25em 0.5em 0em; border: solid 1px #eeeeee; border-radius: 3px; }

@media screen and (max-width: 480px) {
	.PreviewArticle { text-align: center; }
	.PreviewArticle > a { border: none; }
	img.PreviewTool { float: none ; width: 100%; margin: 1rem auto; }
}

.HomePage { text-align: center !important; }
.HomePage .PageHeader { text-align: center !important; }
.HomePage .ContentHead { }
.HomePage .ContentHead p { text-align: center; margin: 0.5em 0px 2em 0px; }
.HomePage #ContentBox { /* max-width: 800px; */ max-width: 1200px; }
.HomePage #ContentBox .ContentHead { max-width: 900px; }