/* RESET STYLES - SO CROSS BROWSER CSS works easier and more performantly. 
-------------------------------------------------------------------------- */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	/*vertical-align: bottom;*/ /*baseline*/ /* GH removed May 1, 2023. */
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
/* div, */
body, p, span {
	line-height: 1.3rem;
}

li { line-height: 1.15rem; }

.globalbanner {
    position:relative;
    padding:0.5rem 2rem;
    background-color:lightyellow;
    color:black;
    font-size:1rem;
    text-align:left;
    box-shadow:0px 0px 3px rgba(0 0 0 / 25%);
    text-align:center;
}
.globalbanner .close { position: absolute; top:0.5rem; left:0.5rem; lince-height:0.7rem; }
.globalbanner .content { margin:auto auto; color:#333; font-size:0.8rem; }

button *, .button *, .lineheightnormal, .lineheightnormal * { line-height:normal; }
.lineheight1, .lineheight1 * { line-height:1rem !important; }
.lineheight1_1, .lineheight1_1 * { line-height:1.1rem; }
.lineheight1_2, .lineheight1_2 * { line-height:1.2rem; }
.lineheight1_3, .lineheight1_3 * { line-height:1.3rem; }

ul { margin-left:1.5rem; margin-top:0.5rem; list-style: square; }
ol { margin-left:1.5rem; margin-top:0.5rem; }


ul ul { margin-left:2.5rem; margin-top:0; margin-bottom:0.6rem; }
ol ol { margin-left:2.5rem; margin-top:0; margin-bottom:0.6rem; }

/* Numbered lists like 1, 1.1, 2.2.1... */
ol.subnumbers li {display:block;} /* hide original list counter */
ol.subnumbers > li:first-child {counter-reset: item;} /* reset counter */
ol.subnumbers > li {counter-increment: item; position: relative;} /* increment counter */
ol.subnumbers > li:before {content:counters(item, ".") ". "; position: absolute; margin-right: 100%; right: 10px;} /* print counter */


blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

table th, table td,
table th li, table td  li { line-height:1.1rem; }

kbd, .kbd, .cmd, code, .code { display:inline-block; padding:0rem 0.5rem;
    font-size:smaller; font-weight:normal; font-family:monospace; 
    border:1px inset currentColor; border-radius:0.5rem; 
    background-color:#EEF; Xbackground-color:lighter;
}


li { margin-bottom:0.15rem; }
/* -------------------------------------------------------------------------- 
end: RESET STYLES - SO CROSS BROWSER CSS works easier and more performantly. */


.skiplink, .skiplink:link, .skiplink:visited  { display:inline-block; background-color:#7119E1; color:white; padding:0 0.5em !important; border:2px solid  white; } /*border-radius:0.5em;*/
.skiplink:hover, .skiplink:active { background-color:#444; color:white; border-color:white !important; }
body a.skiplink:focus { width:auto!important; height:auto!important; position:absolute !important; top:5px !important; left:5px !important; border:2px solid #7119E1 !important; text-indent:0 !important; z-Index:987654321; }


#navigation-wrap.navhiddenmobile .anchorguard { display:none; } /* hide anchorguards when NOT in mobile menu mode. */

.anchorguard { display:inline-block; width:0 !important; height:0 !important; }

figure { margin:0.5rem; }
figcaption { text-align:center; word-break:break-all; padding:0.2rem; margin:1rem 0.12rem 1.5rem 0.12rem; border:1px solid #CCC; border-radius:1rem; }

.timestamp { float:right; display:inline-block; padding:0.1rem 0.25rem; margin:0.1rem; font-size:smaller; border:1px solid #555; border-radius:0.25rem; background-color:rgba(255 255 255 / 50%) }

/*
#homerecent h2 { border-bottom:1px solid silver; font-size:1.2rem; margin-bottom:1rem; font-weight:600; }
#homerecent h3 { font-size:1rem; margin-bottom:1rem;  font-weight:600; }
*/
#homerecent ul { list-style-type:none; margin-left:0; margin-top:0;  }
#homerecent ul li h3 { display:inline-block; font-size:0.8rem; font-weight:400; color:#444; }
#homerecent ul li h3 strong { font-weight:600; }

#homerecent ul li h4 { margin-top:0.5rem; margin-bottom:0.5rem; }

#homerecent ul li { margin:0; border-bottom:1px solid #ddd; clear:both; padding:0.5rem 0.5rem; }
#homerecent ul li ul li { padding:0.25rem 0.25rem 0.25rem 1.5rem;   }
#homerecent ul li .button { font-size:0.7rem; }
#homerecent ul li a { font-size:0.7rem; }


#homerecent ul > li:nth-of-type(odd) {
    background-color: #eFeFeF;
}

#homerecent ul > li > ul li:nth-of-type(odd) { background-color: transparent; }
#homerecent ul > li > ul li { border:none; }


#topindicators h3 { font-weight:600; font-size:1rem; Xfloat:left; }


/*#homerecent .bignumber,*/
a.bignumber,
a.bignumber:link, a.bignumber:visited, a.bignumber:active { background-color:white; color:blue; display:inline-block; min-width:1.5rem; text-align:center; font-weight:600; text-decoration:none; vertical-align:center; margin:0.1rem; padding:0rem; border:1px solid currentColor; font-size:big; }
a.bignumber:hover, a.bignumber:focus { background-color:blue; color:white; }


a.bignumber.red,
a.bignumber.red:link, a.bignumber.red:visited, a.bignumber.red:active { background-color:white; color:brown; display:inline-block; min-width:1.5rem; text-align:center; font-weight:600; text-decoration:none; vertical-align:center; margin:0.1rem; padding:0rem; border:1px solid currentColor; font-size:big; }
a.bignumber.red:hover, a.bignumber.red:focus { background-color:brown; color:white; }



.asterisk { margin:auto 0.2rem; color:brown; font-weight:bold; }

#periodicbutton { padding:0.5rem !important; }



/* Module: Accordion Items
* ----------------------------- */
.accordions_module_box { margin:3rem auto; } /* Box holding entire Accordion Items module contents. */

.accordions_module_box .accordions_list { list-style-type:none; margin:0; padding:0; } /*  THE UL or OL tage being used for structure. */

.accordions_module_box .accordion_box li { margin:0; padding:0; }

.accordions_module_box .accordion_box .accordion_heading { padding:0 0; margin:0 0; border:0px solid #DDD; border-bottom-width:1px;  display:block; font-size:1.2rem; }

.accordions_module_box .striped .accordion_box .accordion_heading { border-bottom-width:0; }

.accordions_module_box .accordion_box .accordion_content { display:none; padding:1rem 1rem 1rem 1.75rem; color:#444; 
/*border-left:0.25rem solid #EEE;*/
background: white linear-gradient(to right, #EEE, #fff 3%);

} /* initially hidden; shows by toggling JScript code. */
/*.accordions_module_box .accordion_box .accordion_content * {  font-size:18px;  }*/
.accordions_module_box .accordion_box .accordion_content {  font-size:18px;  }

.accordions_module_box a.accordion_heading_link,
.accordions_module_box a.accordion_heading_link:link,
.accordions_module_box a.accordion_heading_link:visited,
.accordions_module_box a.accordion_heading_link[aria-expanded=false] { display:block; font-size:1.3rem; color:#333; background:white; text-decoration:none; border:none; border-bottom:1px solid transparent; padding:0.3rem; }

.accordions_module_box a.accordion_heading_link:hover,
.accordions_module_box a.accordion_heading_link:active,
.accordions_module_box a.accordion_heading_link:focus { color:#EEE; background:#666; text-decoration:underline; }

.accordions_module_box a.accordion_heading_link:hover .badtext,
.accordions_module_box a.accordion_heading_link:active .badtext,
.accordions_module_box a.accordion_heading_link:focus .badtext,
.accordions_module_box a.accordion_heading_link[aria-expanded=true] .badtext { color:white; }

.accordions_module_box a.accordion_heading_link:hover .goodtext,
.accordions_module_box a.accordion_heading_link:active .goodtext,
.accordions_module_box a.accordion_heading_link:focus .goodtext,
.accordions_module_box a.accordion_heading_link[aria-expanded=true] .goodtext { color:white; }



.accordions_module_box a.accordion_heading_link:hover .accordion_heading_link_text,
.accordions_module_box a.accordion_heading_link:active .accordion_heading_link_text,
.accordions_module_box a.accordion_heading_link:focus .accordion_heading_link_text  { text-decoration:underline; }

.accordions_module_box a.accordion_heading_link::before { 
content:"+";
display:inline-block; 
line-height:1.2rem; height:1.2rem; width:1.3rem; /*2rem*/

text-align:center; vertical-align:top;
margin-right:0.5rem;
margin-top:0.2rem;
border:3px solid #DDD;
border-radius:50%;
color:white;
background-color:#555;
font-weight:200;
}

.accordions_module_box a.accordion_heading_link .accordion_heading_link_text { display:inline-block; width:calc(100% - 2.5rem); }

.accordions_module_box a.accordion_heading_link:hover[aria-expanded=false]::before,
.accordions_module_box a.accordion_heading_link:active[aria-expanded=false]::before,
.accordions_module_box a.accordion_heading_link:focus[aria-expanded=false]::before { /*border:3px solid #DDD;*/ border-color:#DDD;  }


.accordions_module_box a.accordion_heading_link:hover[aria-expanded=true]::before,
.accordions_module_box a.accordion_heading_link:active[aria-expanded=true]::before,
.accordions_module_box a.accordion_heading_link:focus[aria-expanded=true]::before {  border-color:#AAA; border-style:dashed; }


.accordions_module_box a.accordion_heading_link[aria-expanded=false]::before {  content:"+"; }

.accordions_module_box a.accordion_heading_link[aria-expanded=true]::before {  content:"-"; color:#333; border-color:#EEE; background-color:white; font-weight:900; line-height:1rem; }


.accordions_module_box a.accordion_heading_link[aria-expanded=true] { /*border-color:black; */ color:#EEE; background:#555; }
/* -----------------------------
* end Module: Accordion Items */


table.striped tr:nth-of-type(even) td {
    background-color: #f0f0f0;
    line-height:1.1rem;
}


ul.striped > li { margin:0 0 0.1rem 0; padding:0.5rem; }
ul.striped > li:nth-of-type(even),
ol.striped > li:nth-of-type(even) {
    background-color: #f0f0f0;
    border:1px solid silver;
    /*line-height:1.1rem;*/
}

ul.striped > li:nth-of-type(odd),
ol.striped > li:nth-of-type(odd) { border:1px solid silver; }


/*
table.striped tr:nth-of-type(even) th {
    background-color: #dedede;
    /*border-right:1px solid grey;*/
}
*/

/* Striped results List Items */
ul.striped > li:nth-of-type(odd),
ol.striped > li:nth-of-type(odd) {
    background-color: #eFeFeF;
}





/* Toggle / Disclosure styles */
.togglebutton { transition:none; position:relative; top:-0.25rem; font-size:0.7rem; width:1.1rem; background-color:white; color:#333; Xborder-width:0; box-shadow:none; border-color:white; padding:0.1rem; border-radius:50%; vertical-align:middle; }


/*a.togglebutton:link, button.togglebutton,*/
button.togglebutton:active,
button.togglebutton:visited,
button.togglebutton:focus,
button.togglebutton:focus-visible { /*border-color:black;*/ XXbox-shadow:0px 0px 5px rgb(0 0 0 / 90%); background-color:#EEE; color:black;  }

button.togglebutton img, a.togglebutton img { vertical-align:middle; }

.boxshadow { box-shadow: 0px 0px 5px rgb(0 0 0 / 90%); }

a.togglebutton,
a.togglebutton:link,
a.togglebutton:active,
a.togglebutton:visited,
a.togglebutton:focus,
a.togglebutton:focus-visible { border:1px solid black; background-color:#EEE; color:black; box-shadow:none; text-decoration:none; }


a.togglebutton:hover, button.togglebutton:hover { background-color:black; color:white; box-shadow:none; }

a.togglebutton:hover img, button.togglebutton:hover img { filter: invert(100%); }


.togglebutton.addtext { padding:0.1rem 0.5rem; border-radius: 0.25rem; position:initial; width:auto; border-color:#666; }
/*a.togglebutton.addtext { border-color:black; }*/

.togglebutton.addtext[aria-expanded=false]:before { content:"Open ";  position:relative; top:0; } /*padding-top: inherit; */
.togglebutton[aria-expanded=false]::after { content: "\25bc"; position:relative; top:0.0rem; } /* Down solid arrow */

.togglebutton.addtext[aria-expanded=true]:before { content:"Close "; position:relative; top:0; } /*padding-top: inherit;*/
.togglebutton[aria-expanded=true]::after  { content: "\25b2"; position:relative; top:0.0rem; } /* Right solid arrow */

/* end: Toggle / Disclosure styles */


.button.small, button.small,
.buttonyellow.small, button.buttonyellow.small,
.buttonblue.small, button.buttonblue.small,
.buttonred.small, button.buttonred.small,
.buttonpurple.small, button.buttonpurple.small,
.buttongrey.small, button.buttongrey.small { font-size:0.7rem; margin-bottom:0.3rem; padding: 0.2em 0.5em; /*position:relative; top:0.25rem;*/  }


.smallbutton,
.smallbutton:link,
.smallbutton:active,
.smallbutton:visited { border:1px solid #7119E1; font-size:0.7rem; background-color:#7119E1; color:white; /*line-height:initial;*/ margin-bottom:0.3rem; padding: 0.2em 0.5em; border-radius:0.35rem; /*position:relative; top:0.25rem;*/ text-decoration:none; }


.smallbutton:focus,
.smallbutton:hover,
.smallbutton:focus-visible { border:1px solid black; background-color:indigo; color:white; box-shadow:none; box-shadow:0px 0px 2px rgba( 50, 0, 50, 0.75); }

.smallbutton.inline { display:inline !important; }
.smallbutton.inblock { display:inline-block !important; }
.smallbutton.block { display:block !important; }

.offscreen, .hideme, .sr-only {
  position:absolute;
  left:-10000px;
  top:auto;
  width:1px;
  height:1px;
  overflow:hidden; }


ol.nobullet, ul.nobullet { list-style:none; margin-left:0; }

em { font-style:italic; font-weight:100; /*text-shadow:1px 1px 1px rgba(0 0 0 / 25%);*/ }

 
.linkcapsule,
a.linkcapsule,
a.linkcapsule:link,
a.linkcapsule:visited { font-size:small; display:inline-block; padding:0.2rem 0.4rem; border:1px solid grey !important; border-radius:0.33rem; background-color:white; text-decoration:none; }
 
a.linkcapsule:hover,
a.linkcapsule:active { background-color:purple; color:white; border-style:dashed; }
 
.capsule                  { white-space:nowrap; display:inline-block; line-height:1rem; padding:0.1rem 0.25rem; margin:0.1rem 0.2rem; border:3px double #FFF; border-radius:0.25rem; color:white; background-color:#7119E1; font-size:smaller; }
.capsule img              { vertical-align:sub; }
.capsule.invertimg img    { filter: invert(100%); }

.logcapsule               { white-space:nowrap; display:inline-block; line-height:1rem; padding:0.2rem 0.4rem; margin:0.1rem 0.2rem; border:1px solid #7119E1; border-radius:0.45rem; color:#7119E1; background-color:white; Xfont-size:small; }
.logcapsule img           { vertical-align:sub; }
.logcapsule.invertimg img { filter: invert(100%); }

/* For showing user Roles in a capsule */
.rolecapsule               {
                               display:inline-flex; flex-direction:row; flex-wrap:nowrap; 
                               align-items:center;  /* vertical alignment/justification */
                               justify-content:center; /* horizontal alignment/justification */
                               font-size:0.8rem;
                               /*line-height:0.7rem;*/
                               padding:0 0; 
                               margin:0.1rem;
                               border:1px solid #420a89; border-radius:0.25rem;
                               /*color:white; background-color:#7119E1;*/
                               background-color: white;
                           }

.rolecapsule .imgbox { border:0px solid #7119E1; border-radius: 0.20rem 0 0 0.20rem; border-right:1px solid #420a89; background-color:#5b14b7; padding:0 0.25rem; }

.rolecapsule img           { flex:1; flex-grow:0; vertical-align:middle; align-celf:center; filter: invert(100%); height:16px; }
.rolecapsule.invertimg .imgbox img { filter: invert(0%); } /* this should FLIP whatever the default '.rolecapsule img' is. */

.rolecapsule .rolename { flex:5; flex-grow:10;
    flex-wrap:nowrap; white-space:nowrap;
    font-size:smaller;
    line-height:normal;
    letter-spacing:0.7px;
    align-self:center;
    color:currentColor;
    padding:0.25rem;
 }


img.invert, img.invertimg { filter: invert(100%); }
.invert100 { filter: invert(100%); }
.invert25  { filter: invert(25%);  }
.invert50  { filter: invert(50%);  }
.invert75  { filter: invert(75%);  }
.invert0   { filter: invert(0%);   }



html, body { font-family:arial, helevetica; font-size:18px; background-color:#FFF; color:#333; }
body { padding:0; margin:0; }
.button, .buttonyellow, .buttongrey, .buttonblue, .buttonred, button, th, td, input, select, textarea { font-family:inherit; font-size:inherit; }


button img, .button img, .buttonyellow img, .buttongrey img { width:1rem; vertical-align:top; }

a.button, a.button:link, a.button:visited { display:inline-block; background-color:black; color:white; text-decoration:none;  line-height:normal; /*padding:0.1rem 0.25rem;*/ }
a.button:hover, a.button:focus, a.button:active { color:black; border-color:black; background-color:white; line-height:normal; }

a.buttonyellow, a.buttonyellow:link, a.buttonyellow:visited { display:inline-block; background-color:khaki; color:#444; text-decoration:none;  line-height:normal; /*padding:0.1rem 0.25rem;*/ }
a.buttonyellow:hover, a.buttonyellow:focus, a.buttonyellow:active { background-color:yellow; color:black; border-color:black; }

button.buttonblue, a.buttonblue, a.buttonblue:link, a.buttonblue:visited { display:inline-block; background-color:darkblue; color:white; text-decoration:none;  line-height:normal; /*padding:0.1rem 0.25rem;*/ }
a.buttonblue:hover, a.buttonblue:focus, a.buttonblue:active { background-color:darkslateblue; color:white; border-color:black; }

button.buttonred .buttonred, a.buttonred, a.buttonred:link, a.buttonred:visited { display:inline-block; background-color:brown !important; color:white !important; text-decoration:none;  line-height:normal; } /* box-shadow: 3px 3px 3px rgba(0 0 0 / 20%); border:1px solid black; padding:0.2em 0.5em; border-radius: 0.35rem 0.35rem; font-weight:100; transition: margin 0.3s, color 0.3s, background-color 0.3s;  */
a.buttonred:hover, a.buttonred:focus, a.buttonred:active,
.buttonred:hover, .buttonred:focus { background-color:#bd3030 !important; color:white !important; border-color:brown !important; }

button.buttonblue, a.buttonpurple, a.buttonpurple:link, a.buttonpurple:visited { display:inline-block; background-color:#7119E1;  line-height:normal; color:white; text-decoration:none; box-shadow: 3px 3px 3px rgba(0 0 0 / 20%); border:1px solid black; padding:0.2em 0.5em; border-radius: 0.35rem 0.35rem; font-weight:100; transition: margin 0.3s, color 0.3s, background-color 0.3s; }
a.buttonpurple:hover, a.buttonpurple:focus, a.buttonpurple:active { background-color:indigo; color:white; border-color:black; box-shadow: 1px 1px 1px rgba(0 0 0 / 40%); }

button.buttongrey, .buttongrey, .buttongrey:link, .buttongrey:visited { display:inline-block; color:#333; background-color:#DDF; line-height:normal; text-decoration:none; XXpadding:0.1rem 0.25rem; border:1px solid grey; border-radius:0.25rem; box-shadow: 2px 2px 2px rgba(0 0 0 / 25% ); transition: margin 0.3s, color 0.3s, background-color 0.3s;  } 
.buttongrey:hover, .buttongrey:focus, .buttongrey:active { color:black; background-color:#FFF; border-color:black; box-shadow: 1px 1px 1px rgba(0 0 0 / 55% ); }


a.closex, a.closex:link, a.closex:visited, .closex { display:inline-block; padding:0 0.3rem; background-color:#444; color:white; border:2px solid white; border-radius:0.25rem; text-decoration:none; vertical-align:middle; transition: margin 0.3s, color 0.3s, background-color 0.3s;  }
a.closex:hover, a.closex:active, a.closex:focus { background-color:white; color:#444; border-color:#444; box-shadow: 0 0 5px rgb(255 255 255 / 100%); }


/* Dec 9, 2022: removed :before icon as it is being announced to eReaders. instead adding a span with the entity and an aria-hidden property instead. See variable in header named 'popicon' */
/*
a.popup { position:relative; margin-left:0.7rem; }
a.popup:before { content:"\21F1"; margin-right:0.2rem; text-decoration:none !important; border:none !important; color:grey; position:absolute; left:-0.8rem; /*top:0.07rem;*/ } /*display:inline-block; padding-left:1rem; margin-left:-1rem;*/
*/

table { border-collapse:collapse; font-size:0.9rem; }
th { vertical-align:bottom; border:1px solid #EEE; font-weight:bold; padding:0.4rem 0.5rem; text-align:left; font-size:0.9rem;  }
th[scope=row],
td { vertical-align:top;    border:1px solid #EEE; padding:0.4rem 0.5rem; }

table thead th { background-color:black; color:white; font-weight:bold; }
table tbody th[scope=row] { background-color:#EEE; } 


table.vtop th[scope=row],
table.vtop td { vertical-align:top; }

.vtop    { vertical-align:top; }
.vmiddle { vertical-align:middle; }
.vbottom { vertical-align:bottom; }


table.purple thead th { background-color:#7119E1; }


.container { max-width:1024px; min-width:340px; margin: auto auto; padding-left:0.5rem; padding-right:0.5rem; } /* padding:1em; XXoutline:2px solid purple; */

#chartcontainer { min-width:340px; margin:auto auto; padding:0.5rem; }
#chartcontainer.normal { width:1024px; max-width:1024px; }
#chartcontainer.large  { width:90vw; max-width:90vw; } /* Just toggle this classname on or off */


#main { padding: 1rem 0 2rem 0; margin:auto auto; max-width:calc(99% - 2rem); } /*max-width:900px;*/

#main p { margin:1rem 0 0.5rem 0; }

h1 { font-size:2rem; margin:0.5rem 0 0.5rem 0; line-height:1.75rem; }
h2 { font-size:1.4rem; margin:0.5rem 0 0.5rem 0; line-height:1.5rem; }
    .datanameheading { color:#555; font-weight:200; font-size: 1.25rem; 
    /*text-shadow: 0px 4px 3px rgba(0,0,0,0.2),
             0px 8px 13px rgba(0,0,0,0.1),
             0px 18px 23px rgba(0,0,0,0.1);*/ }
h3 { font-size:1.2rem; }
h4 { font-size:1.15rem; }
h5 { font-size:1.1rem; }
h6 { font-size:1.0rem; }


.checkmark:before { content:"\2714"  } /* css=\2714, entity=✔*/
.crossmark:before { content:"\274C"; } /* css=\274C, entity=❌*/
.skullmark:before { content:"\01F480"; } /* css=\01F480 */

.goodtext  { color:darkgreen; }
.badtext   { color:brown; }
.othertext { color:#7119E1; }
.smalltext { font-size:0.6rem; color:#555; }
.largetext { font-size:1.5rem; color:#555; }

/* Colored background versions of goodtext and badtext */
.goodcell { background-color:#AAEEAA !important; color:black !important; }
.badcell  { background-color:#F2CA73 !important;   color:black !important; }

small, .small { font-size:0.7rem;  } 
.medium { font-size:1.1rem; }
.large { font-size:1.5rem; }





.boxbelow { margin-top:0.5rem; }


.pagesection { margin:3rem auto; padding:1rem; border:1px solid grey; border-radius:1rem; }

.pagesection h2 { font-size:1.4rem; color:#444; border-bottom:1px solid silver; margin:0.1rem 0 1rem; }
.pagesection h3 { font-size:1.1rem; color:#666; margin:0.1rem 0 0.5rem; }
.pagesection h4 { font-size:1rem; color:#555; margin:0.1rem 0 0.5rem; }



.breakall  { word-break:break-all; }
.breakword { word-break:break-word; }

.nowrap { white-space:nowrap; }

.minilabel { display:inline-block; font-weight:600; }
.min25perc { min-width:25%; } 
.min40perc { min-width:40%; }
.min50perc { min-width:50%; }
.min75perc { min-width:75%; }


label, .label { text-align:left; }

.inputrow { display:flex; flex-wrap:wrap; align-items: flex-start; margin:0.25em 0; padding:0.15rem 0 0.5rem 0; border-bottom:1px dotted #DDD; padding-bottom:0.25rem; }
.inputrow > label { flex:1; align-self:flex-start; margin-left:0; margin-right:0.25rem; min-width:2rem; XXXtext-shadow: 1px 1px 2px rgba(0 0 0 / 25%); padding-bottom:0.25rem; }
.inputrow > .label, .inputrow > legend.label { flex:1; align-self:flex-start;  margin-left:0; margin-right:1rem; margin-top:0.5rem; vertical-align:middle; XXmin-width:8rem; text-shadow: 1px 1px 1px rgba(0 0 0 / 25%); padding-bottom:0.25rem; }
.inputrow > label.label,
.inputrow > legend.label { flex:1; align-self:flex-start;  /*margin-left:auto;*/ margin-top:0.5rem; margin-right:0.5rem; padding-bottom:0.25rem; }

.inputrow span { margin-top:0.5rem; }

.inputrow label.labelinvalid,
.inputrow .label.labelinvalid,
.inputrow_fieldset .label.labelinvalid
 { border-bottom:2px solid red; color:brown; }
 
 
 .grey { color:grey; }
 
 
 .infoflexrow { display:flex; flex-wrap:wrap; align-items:stretch; justify-content:space-around;  padding:0.15rem 0 0.5rem 0; padding-bottom:0.25rem; }
 .infoflexrow .flexsegment { border:1px solid silver; border-radius:0.5rem; padding:1rem; margin:0.25em; }
 
 .boxy { border:1px solid silver; border-radius:0.5rem; padding:1rem; margin:0.25em; }
 
 .infoflexrow .flexsegment input[readonly],
 .infoflexrow .flexsegment textarea[readonly] { border-color:transparent; color:#555; }
 
 
 .infoflexrow .flexsegment .inputrow { align-items:flex-start; }
 
 .infoflexrow .flexsegment h2 { margin-bottom:0.75rem; }

 .thickborder { border-width:4px !important; }
 
 
/* NOTE: fieldsets (and legends) do NOT display flex properly. get around by using sub-container and a DIV with an aria-labelled BY attribute to replace LEGEND.*/
/*
.inputrow_fieldset { display:block; }
.inputrow_fieldset fieldset { display:flex; flex-wrap:wrap; align-items: top; }
.inputrow_fieldset fieldset legend { flex:1; align-self:flex-start; margin-left:auto; margin-right:1rem; margin-top:0.5rem; min-width:2rem; text-shadow: 1px 1px 2px rgba(0 0 0 / 25%); padding-bottom:0.25rem; }
.inputrow_fieldset fieldset ol, .inputrow_fieldset fieldset ul { Xflex:5; align-self:flex-start; margin-left:auto; margin-right:1rem; margin-top:0.5rem; min-width:2rem; Xtext-shadow: 1px 1px 2px rgba(0 0 0 / 25%); padding-bottom:0.25rem; }
.inputrow_fieldset fieldset ol li label, .inputrow_fieldset fieldset ul li label { flex:none; }
*/
.inputrow_fieldset { padding:0.15rem 0 0.5rem 0; border-bottom:1px dotted #DDD; padding-bottom:0.25rem; }
.inputrow_fieldset fieldset div.flex > div.flex1 { flex:1; align-self:flex-start;  margin-left:auto; margin-right:1rem; margin-top:0.5rem; vertical-align:middle; XXmin-width:8rem; text-shadow: 1px 1px 2px rgba(0 0 0 / 25%); padding-bottom:0.25rem; }
.inputrow_fieldset fieldset ul, .inputrow_fieldset fieldset ol { margin-top:0.5rem; }

.buttonrow {  }

button, .button, input[type=submit], .submit, input[type=image] { /*display:inline-block;*/ background-color:black; color:white; font-size:1rem; /*font-weight:bold;*/ border:1px solid black; border-radius:0.25rem; padding:0.2rem 0.75rem;
box-shadow: 3px 3px 3px rgba( 0 0 0 / 25%); 
transition: margin 0.3s, color 0.3s, background-color 0.3s, border 0.3s, outline 0.3s;
}
button:hover, .button:hover, .submit:hover, input[type=submit]:hover, input[type=image]:hover,
button:focus, .button:focus, .submit:focus, input[type=submit]:focus, input[type=image]:focus { background-color:white; color:black; 
/*box-shadow: 2px 2px 2px rgba( 0 0 0 / 50%);*/
 }


button.buttonyellow, .buttonyellow, .buttonyellow:active { display:inline-block; background-color:khaki; color:black; font-weight:normal; border:1px solid black; border-radius:0.25rem; padding:0.2rem 0.75rem; box-shadow: 3px 3px 3px rgba( 0 0 0 / 25%); 
transition: margin 0.3s, color 0.3s, background-color 0.3s, border 0.3s, outline 0.3s;
}
button.buttonyellow:hover, .buttonyellow:hover,
button.buttonyellow:focus, .buttonyellow:focus { background-color:yellow; color:black; box-shadow: 2px 2px 2px rgba( 0 0 0 / 50%); }


button.buttonblue, .buttonblue, .buttonblue:active { display:inline-block; background-color:darkslateblue; color:white; font-weight:normal; border:1px solid black; border-radius:0.25rem; /*padding:0.2rem 0.75rem;*/ box-shadow: 3px 3px 3px rgba( 0 0 0 / 25%); 
transition: margin 0.3s, color 0.3s, background-color 0.3s, border 0.3s, outline 0.3s;
}
button.buttonblue:hover, .buttonblue:hover,
button.buttonblue:focus, .buttonblue:focus { background-color:indigo; color:white; box-shadow: 2px 2px 2px rgba( 0 0 0  / 50%); /*text-shadow:1px 1px 1px rgba(200 200 200 / 90%);*/ }

button.buttonred, .buttonred, .buttonred:active { display:inline-block; background-color:brown; color:white; font-weight:normal; border:1px solid black; border-radius:0.25rem; padding:0.2rem 0.75rem; box-shadow: 3px 3px 3px rgba( 0 0 0 / 25%); 
transition: margin 0.3s, color 0.3s, background-color 0.3s, border 0.3s, outline 0.3s;
}
button.buttonred:hover, .buttonred:hover,
button.buttonred:focus, .buttonred:focus { background-color:crimson; color:white; box-shadow: 2px 2px 2px rgba( 0 0 0  / 50%); /*text-shadow:1px 1px 1px rgba(200 200 200 / 90%);*/ }



.disabled, disabled, button.disabled, button disabled { color:#777; }
a.disabled:hover, a.disabled:active, a.disabled:focus,
button.disabled:hover, button.disabled:active, button.disabled:focus { color:white; }

input[type=submit][disabled],
input[type=submit][disabled]:hover, input[type=submit][disabled]:active, input[type=submit][disabled]:focus,
input[type=button].disabled, button.disabled { color:#DDD; background-color:#666; Xbox-shadow: 2px 2px 2px rgba( 0 0 0  / 50%); /*text-shadow:1px 1px 1px rgba(200 200 200 / 90%);*/ border-radius:0.25rem; border-color:transparent; }

button.disabled:hover, button.disabled:active, button.disabled:focus,
input[type=button].disabled:hover,
input[type=button].disabled:active,
input[type=button].disabled:focus { color:white; }


input[type=submit][disabled], input[type=button][disabled] { background-color:#AAA; }

input[type=text][disabled],
input[type=select][disabled],
input[type=checkbox][disabled],
input[type=radio][disabled],
textarea[disabled] { border-color:transparent; }

.passwordexample { font-family:consolas,monopsace; color:darkblue; }

.monospace { font-family:consolas,monospace; }

.grey, .gray { color:#777;  }

input[type=text], input[type=password], input[type=date], textarea, select { padding:0.5rem 0.5rem; }
input[type="radio"] { margin-right:1.5rem; }


/* wider */
/*textarea { width:95%; }*/

.infomessages strong, .warnmessages strong { font-weight:bold; border-bottom:1px dotted grey; }

strong, .strong { font-weight:600; }


/* general  links */
a, a:link, a:visited { /*line-height:normal;*/ color:blue; text-decoration:underline; Xfont-weight:100; border-bottom:1px solid transparent; }
a:hover, a:active    { color:black; text-decoration:none; border-bottom-color:black; cursor: pointer; outline:none; }
a:focus { outline:2px solid black; }

/* end: general links */


/* RED links */
a.redlink, a.redlink:link, a.redlink:link, a.redlink:visited { color:brown !important; text-decoration:underline; border-bottom:1px solid transparent; }
a.redlink:hover, a.redlink:active    { color:brown; text-decoration:none; border-bottom-color:brown;  }


.pointer { cursor:pointer; }
.helpcursor { cursor:help; }

.bold { font-weight:bold; }
.medium { font-size:1rem; }

/* FLEX: styles */
.flexwrap { display:flex; flex-wrap: wrap; }
.flexitem {  }

.flexauto { flex:auto !important; }
.flex0, .flexnone { flex:none !important; }
.flex1 { flex:1 !important; }
.flex2 { flex:2 !important; }
.flex3 { flex:3 !important; }
.flex4 { flex:4 !important; }
.flex5 { flex:5 !important; }
.flex6 { flex:6 !important; }
.flex6 { flex:7 !important; }
.flex6 { flex:8 !important; }

.marg, .marg05 { margin:0.5rem !important; }
.marg0 { margin:0rem !important; }
.marg1 { margin:1rem !important; }
.marg2  { margin:2rem !important; }
.marg3  { margin:3rem !important; }


.margleft, .margleft05 { margin-left:0.5rem !important; }
.margleft0  { margin-left:0rem !important; }
.margleft1  { margin-left:1rem !important; }
.margleft2  { margin-left:2rem !important; }
.margleft3  { margin-left:3rem !important; }

.margright, .margright05 { margin-right:0.5rem !important; }
.margright0 { margin-right:0rem !important; }
.margright1 { margin-right:1rem !important; }
.margright2  { margin-right:2rem !important; }
.margright3  { margin-right:3rem !important; }

.margtop, .margtop05 { margin-top:0.5rem !important; }
.margtop0 { margin-top:0rem !important; }
.margtop1 { margin-top:1rem !important; }
.margtop2  { margin-top:2rem !important; }
.margtop3  { margin-top:3rem !important; }

.margbottom, .margbottom05 { margin-bottom:0.5rem !important; }
.margbottom0 { margin-bottom:0rem !important; }
.margbottom1 { margin-bottom:1rem !important; }
.margbottom2  { margin-bottom:2rem !important; }
.margbottom3  { margin-bottom:3rem !important; }


.pad, .pad05 { padding:0.5rem !important; }
.pad0 { padding:0rem !important; }
.pad1 { padding:1rem !important; }
.pad2  { padding:2rem !important; }
.pad3  { padding:3rem !important; }

.padleft, .padleft05 { padding-left:0.5rem; }
.padleft15 { padding-left:1rem; }
.padleft2  { padding-left:2rem; }
.padleft3  { padding-left:3rem; }

.padright, .padright05 { padding-right:0.5rem; }
.padright1 { padding-right:1rem; }
.padright2  { padding-right:2rem; }
.padright3  { padding-right:3rem; }

.padtop, .padtop05 { padding-top:0.5rem; }
.padtop1 { padding-top:1rem; }
.padtop2  { padding-top:2rem; }
.padtop3  { padding-top:3rem; }

.padbottom, .padbottom05 { padding-bottom:0.5rem; }
.padbottom1 { padding-bottom:1rem; }
.padbottom2  { padding-bottom:2rem; }
.padbottom3  { padding-bottom:3rem; }

.borderbottom, .borderbottom1 { border-bottom:1px solid #DDD; }
.borderbottom0 { border-bottom-width: 0px; }
.borderbottom2 { border-bottom:2px solid #DDD; }
.borderbottom3 { border-bottom:3px solid #DDD; }

.bordertop, .bordertop1 { border-top:1px solid #DDD; }
.bordertop2 { border-top:2px solid #DDD; }
.bordertop3 { border-top:3px solid #DDD; }

/* end:FLEX: styles */

/* NAVIGATION LINKS */
#navigation-wrap { border-bottom:2px solid black; padding-bottom:0.25rem; z-index:9; }

.navigation { font-size:16px; margin:0 auto; padding:0.25rem 0 0.25rem 0; align-items:center; }
.navigation.subnav { padding:0.1rem 0 0.25rem 0; } 
.navigation li { display:inline-block; margin:auto 0.25rem; }
.navigation li:first-child { margin-left:0; }
.navigation li:last-child { margin-right:0; }
/*
.navigation a, .navigation a:link, #navigation a:visited { color:#555; text-decoration:none; border-bottom:1px solid #555; font-weight:100; margin-bottom:0.5rem; }
*/

/*
.navigation a.active, .navigation a.active:hover, .navigation a.active:focus, .navigation a.active:visited { font-weight:500; border-bottom:3px double #7119E1 !important; color:#7119E1 !important; }
.navigation a.active:before { content:"\00BB"; display:inline; margin-right:0.25rem; font-weight:bold; Xposition:relative; color:#7119E1; }

.navigation a:hover, .navigation a:active { text-decoration:underline; color:black; border-color:transparent; cursor: pointer; }
.navigation a.active:hover, .navigation a.active:active { border-bottom-color:transparent !important; }
.navigation a:focus { text-decoration:none; color:black; border-color:transparent; cursor: pointer; }
.navigation a.active:focus { border-bottom-color:transparent !important; }
*/

.navigation a, .navigation a:link, .navigation a:visited { color:#555; text-decoration:none; border:1px solid white; border-bottom-color:currentColor; font-weight:100; margin-bottom:0.5rem; text-decoration:none; padding:0.1rem 0.15rem; }
.navigation a.active:hover, .navigation a.active:active, .navigation a.active:focus  { text-decoration:none; color:black;  background-color:#7119E1; color:white; Xborder-color:currentColor; cursor: pointer; }
.navigation a.active:hover img, .navigation a.active:active img, .navigation a.active:focus img { filter:invert(100%); }


.navigation a.active, .navigation a.active:visited
{ font-weight:500; Xcolor:white; XXbackground-color:#7119E1; border-color:#7119E1; border-left-width:4px;  padding:0.1rem 0.2rem; XXborder-radius:0.25rem; text-decoration:none; }

.navigation a:hover, .navigation a:active { color:black; border-color:currentColor; cursor: pointer; text-decoration:none; background-color:#fbf8ff; }

/*.navigation a.active:hover, .navigation a.active:active { border-bottom-color:transparent !important; }*/


#admin_navigation { text-align:left; } /* margin-left:1.8rem; */
#admin_navigation a { /*font-weight:700;*/ }


.absolutepersistentnav { position:absolute; top:0; right:0; }
.navigation.absolutepersistentnav li { display:inline-block !important; margin-bototm:0 !important; }
.navigation.absolutepersistentnav li a { margin-bottom:0 !important; }
/* end: NAVIGATION LINKS */


/* Box with H2 dark title. */
.h2box { padding:0; Xmax-width:900px; border:1px solid #444; border-radius:0.5rem; box-shadow: 3px 3px 3px rgba(0 0 0 / 25%); }
.h2box h2, .h2box .h2 { margin-top:0; margin-bottom:0; border-radius:0.5rem 0.5rem 0 0; background-color:#444; color:white; padding:0.5rem; }
.h2box .content { padding:1rem; }
.h2box .content p, .h2box p.content { margin-top:0 !important; }


/* Box with H3 dark title. */
.h3box { padding:0; Xmax-width:900px; border:1px solid #444; border-radius:0.5rem; box-shadow: 3px 3px 3px rgba(0 0 0 / 25%); }
.h3box h3, .h3box .h3 { margin-top:0; margin-bottom:0; border-radius:0.5rem 0.5rem 0 0; background-color:#444; color:white; padding:0.5rem; }
.h3box .content { padding:1rem; }
.h3box .content p, .h3box p.content { margin-top:0 !important; }



.red { color:brown; }
.green { color:forestgreen; }
.blue { color:royalblue; }

hr { border:2px solid #666; Xbackground-color:#666; box-shadow:2px 2px 2px rgba(0 0 0 / 25%); }

hr.red  { border:2px solid brown; Xbackground-color:brown; box-shadow:2px 2px 2px rgba(0 0 0 / 25%); }

hr.blue { border:2px solid indigo; Xbackground-color:indigo; box-shadow:2px 2px 2px rgba(0 0 0 / 25%); }

.fleft  {  float:left; }
.fright {  float:right; }

.left   { text-align:left; }
.center { text-align:center; }
.right  { text-align:right; }

.inline     { display:inline !important; }
.block      { display:block !important; }
.inblock    { display:inline-block; } /*!important*/
.flex       { display:flex; align-items:flex-start; }

.infomessages li, .warnmessages li { margin:0.2rem 0;  }
.infomessages { padding:1rem; margin-bottom:1rem; margin-left:auto; margin-right:auto; max-width:900px; background-color:#E0FFFF;     border:2px solid teal;   overflow:visible; box-shadow: 0 0 15px rgb(0 0 100 / 50%); border-radius:0.4rem; }
.warnmessages { padding:1rem; margin-bottom:1rem; margin-left:auto; margin-right:auto; max-width:900px;  background-color:lightyellow; border:2px solid brown; overflow:visible; box-shadow: 0 0 15px rgb(100 0 0 / 50%); border-radius:0.4rem; }


.explainbox { text-align:left;  font-size:0.8rem; margin-top:1rem; padding:0.5rem; border:1px solid grey; background-color:#EEE; color:#333; border-radius:0.25rem; }
/* margin: auto auto; display:table;  */

.helpicon,
a.helpicon:link, a.helpicon:visited  { 
    font-size:0.6rem; font-weight:600; color:#555; text-decoration:none; 
    display:inline-block;  border:1px solid currentcolor; border-radius:50%; width:0.8rem; height:0.8rem; text-align:center; padding:0.0rem;
    vertical-align:baseline; line-height:0.8rem; 
}
a.helpicon:hover, a.helpicon:focus, a.helpicon:active { text-decoration:underline; background-color:#444; color:white; } 

.helpicon.autowidth { width:auto; min-width:calc(1rem - 0.25rem); padding:0.15rem; }

.reloadicon, 
a.reloadicon { 
    font-weight:600; color:#555; text-decoration:none; 
    display:inline-block;  border:1px solid currentcolor; border-radius:30%; /*width:0.7rem; height:0.7rem;*/ text-align:center; padding:0.0rem;
    vertical-align:baseline; line-height:0.75rem; background-color:#444; color:white;
}
.reloadicon img,  a.reloadicon img { height:14px; padding:0.2rem; filter: invert(100%); }
a.reloadicon:hover, a.reloadicon:focus, a.reloadicon:active { text-decoration:underline; background-color:white; border-color:#333; box-shadow:0 0 4px rgba(100, 100, 100, 1);  } 
a.reloadicon:hover img, a.reloadicon:focus img, a.reloadicon:active img { filter: invert(0); }

.reloadicon.white, 
a.reloadicon.white { color: #333; background-color:white; border-color:white; }
.reloadicon.white img,  a.reloadicon.white img { height:14px; padding:0.2rem; filter: invert(0); }
a.reloadicon.white:hover, a.reloadicon.white:focus, a.reloadicon.white:active { text-decoration:underline; background-color:#333; border-color:white; box-shadow:0 0 4px rgba(255, 255, 255, 1); } 
a.reloadicon.white:hover img, a.reloadicon.white:focus img, a.reloadicon.white:active img { filter: invert(100%); }



/*.h2box h2 */
a.helpicon.white:link, a.helpicon.white:visited { color:white; border-color:white; text-decoration:none; }
/*.h2box h2 */
a.helpicon.white:hover, a.helpicon.white:focus, a.helpicon.white:active { color:#333; background-color:white; }



li.flex { border-bottom:1px solid silver; padding-bottom:0.5rem; }

/* Publish/ubnpublish page views. */
.publishlinks a.active { font-weight:bold; }
.publishlinks a.active:before {
    content: "\00BB";
    display: inline-block;
    margin-right: 0.25rem;
    font-weight: bold;
    color: blue;
}

/* FORMS */
.smallcontainer { max-width:900px;  }
.borderedform { border:1px solid #444; border-radius:0.5rem; padding:1em; box-shadow: 3px 3px 3px rgba(0 0 0 / 25%); }
.borderedformsolid { background-color:white; border:1px solid #444; border-radius:0.5rem; padding:1em; box-shadow: 3px 3px 3px rgba(0 0 0 / 25%); }

.borderedbox {  border:1px solid #444; border-radius:0.5rem; padding:1em; box-shadow: 3px 3px 3px rgba(0 0 0 / 25%); }

.borderedboxsolid { Xmax-width:900px; Xmargin:0rem auto; border:1px solid #444; border-radius:0.5rem; padding:1em; box-shadow: 3px 3px 3px rgba(0 0 0 / 25%); background-color:white; color:#333; }

.pale { background-color:#f1f3f3; }


.buttonrow { margin:1rem auto; }

#newrecord-wrap { margin-top:1em; }
.newrecord, a.newrecord, .newrecord:link, a.newrecord:visited { display:inline-block; background-color:black; color:white; box-shadow: 2px 2px 2px rgba(0 0 0 / 20%); border:1px solid black; padding:0.2em 0.5em; border-radius: 0 0.35rem 0.35rem 0; font-weight:100; text-decoration:none; 
    transition: margin 0.3s, color 0.3s, background-color 0.3s; }
a.newrecord:hover, a.newrecord:active, a.newrecord:focus { background-color:white; color:black; box-shadow: 1px 1px 1px rgba(0 0 0 / 40%); border-radius: 0.35rem; cursor: pointer; margin-left:0.1rem; }
.newrecord:after { content: "+"; } 


a.button, .a.button:link, a.button:visited { display:inline-block; background-color:black; color:white; box-shadow: 2px 2px 2px rgba(0 0 0 / 20%); border:1px solid black; padding:0.2em 0.5em; border-radius: 0.35rem 0.35rem; font-weight:100; text-decoration:none; 
    transition: margin 0.3s, color 0.3s, background-color 0.3s; }
a.button:hover, a.button:active, a.button:focus { background-color:white; color:black; box-shadow: 1px 1px 1px rgba(0 0 0 / 40%); border-radius: 0.35rem; cursor: pointer; /*margin-left:0.1rem;*/ }


a.importbutton, .a.importbutton:link, a.importbutton:visited {  margin:auto 0.5rem; display:inline-block; background-color:black; color:white; box-shadow: 2px 2px 2px rgba(0 0 0 / 20%); border:1px solid black; padding:0.2em 0.5em; border-radius: 0.35rem 0.35rem; font-weight:100; text-decoration:none; 
    transition: margin 0.3s, color 0.3s, background-color 0.3s; }
a.importbutton:hover, a.importbutton:active, a.importbutton:focus { background-color:white; color:black; box-shadow: 1px 1px 1px rgba(0 0 0 / 40%); cursor: pointer; }

.importbutton:after { content: " \219F"; } 

/* SEARCH RESULT LISTING-TABLE */
#searchresults { margin:0.5rem auto 3rem auto; overflow-x: visible; overflow-y:visible; } /* overflow-x means that a horizontal scroll should occur if width too narrow. */
#searchresults table { width:100%; }
/* end: SEARCH RESULT LISTING-TABLE */



.borderedform h2, .borderedform .greybg { margin:0 auto 1rem auto; padding: 0.5rem 0.5rem; background-color:#555; color:white; border-radius: 0.5rem 0.5rem 0 0;  }
.borderedform h3, .borderedform .h3 { font-size:1.2rem; font-weight:600; /*text-decoration:underline;*/ }

.vendorlogo-box { width:300px; display:inline-block; }
.vendorlogo-box img { max-width:100%; }

.tierimage-box { width:300px; display:inline-block; }
.tierimage-box img { max-width:100%; }


ul.stronglabel li strong { display:inline-block; font-weight:600; width:8rem; }


.loopitems-box {  }
.loopitems-box .item-box { margin:0.5rem 0 1rem 0.85rem; }
.loopitems-box .item-box label { font-size:0.8rem; }




/* Publish List extra styles so that publishable-rendered-HTML is not overpowering in this Admin website.*/
.bizsummary h2 { font-size:1.2em; font-weight:bold; }
.bizsummary h3 { font-size:1.1em; font-weight:bold; }
.bizsummary .defendant_founded, .bizsummary address {  }
.bizsummary p { margin: 0 0 0.5rem 0 !important; }



.pagination { }
.pagination a, .pagination a:link, .pagination a:visited { display:inline-block; min-width:1.5rem; background-color:#EEE; color:black; padding:0.2rem; border:1px solid #EEE; border-radius:0.25rem; margin: auto 0.2rem; }
.pagination a.currentpagenum { border-color:black; background-color:#444; color:white; }

.pagination a:hover, .pagination a:focus { background-color:black; color:white; }







.longlist_richtext_row { padding:0.5rem; margin:1rem 0; outline:1px solid silver; }

.two-column-list ul, .two-column-list ol   { column-count:2; margin:1rem 0 2rem 3rem; font-size:0.7rem; }
ul.three-column-list, ol.three-column-list { column-count:3; margin:1rem 0 2rem 3rem; font-size:0.7rem; }
ul.four-column-list, ol.four-column-list   { column-count:4; margin:1rem 0 2rem 3rem; font-size:0.7rem; }

.three-column-list li ol, .three-column-list li ul,
.four-column-list li ol, .four-column-list li ul { column-count:1; }


.inblockUL    { display:inline-block; margin:0 0 0 0; padding:0; }
.inblockUL li { display:inline-block; margin:0 0.5rem 0 0; padding:0; }


#brandbox { padding-top:1rem; padding-bottom:0.5rem; }
#brandbox img { max-width:250px; }

#appversion-box { position:absolute; display:inline-block; right:0; top:0; background-color:white; color:black; padding:0 0.2rem; border-color:#555; border-radius:0.2rem; z-index:9999; }
/* NOTE: don't set a TOP if it should not break out of curent parent container.*/

#appversion-box #appversioninfo { max-width:30rem; line-height:1.1rem; padding:0.5rem; }
#appversion-box #appversioninfo ul li, #appversion-box #appversioninfo ol li { line-height:1.1rem; }

#appversion-box .togglebutton { border-color:black; }

#appversionstring { font-size:1.0rem; border-bottom:2px solid grey; margin-bottom:0.5rem;}

#appversionnotes { position:absolute; background-color:#444; color:white; min-width:25rem; max-width:75vw; width:40vw; right:1rem; padding:0; border:2px solid black; border-radius:0.5rem; box-shadow:-5px 5px 5px rgb(0 0 0 / 50%); }
#appversionnotes .appversion_pretitle { text-align:center; background-color:#444; padding:0.5rem; font-size:larger;  border-radius:0.5rem 0.5rem 0 0;}
#appversionnotes .appversionnotes_content {  background-color:#EDC; color:black; overflow:auto; max-height:40vh; min-height:15rem; padding:0.25rem; border-top:2px solid black;  }

#appversionnotes .appversionnotes_content .whatsnewappnotes p { border-bottom:1px solid silver; }

#appversionnotes ul, #appversionnotes ol { margin-left:1rem; }
#appversionnotes ul ul, #appversionnotes ol ul, #appversionnotes ol ol { margin-left:1rem; }

.appversionnotes_content { font-size:0.8rem !important; }
.appversionnotes_content ul, .appversionnotes_content ol { margin-top:0.5rem; margin-bottom:1em; }
.appversionnotes_content ul li, .appversionnotes_content ol li { line-height:1.1rem; margin-bottom:0.5rem; font-size:0.8rem !important; }

a.appversion_apprefreshlink, a.appversion_apprefreshlink:link, a.appversion_apprefreshlink:visited
{ color:white !important; padding:0.1rem; line-height:normal; margin-top:0.1rem; margin-right:0.5rem; }

a.appversion_apprefreshlink:hover, a.appversion_apprefreshlink:focus { color:yellow !important; border-color:yellow; }



.hidden { display:none; }


#navigation-hamburger { position:relative; left:0.5rem; border:2px solid black; display:none; }



/* MEDIA QUERIES 
  --------------------------------------- */
@media (max-width: 800px) {
    #navigation-hamburger { display:initial; }
    #navigation-wrap { background-color:white; position:absolute; margin:auto auto; left:3rem; top:3.5rem; min-width:12rem; padding:0.5rem;  XXwidth:calc(100% - 4rem); border:0.15rem solid #333; border-radius:0 0.5rem 0.5rem 0.5rem;
        box-shadow:0 0 15px rgb(0 0 100 / 70%);
    }
    #navigation-wrap.navhiddenmobile { display:none; }

    #navigation-wrap .container { min-width:5rem; }
    
    .absolutepersistentnav { position:relative; Xfloat:right; margin-left:0; Xborder:2px solid grey; border-top:0.1rem solid silver; padding:0.25rem 0 0 0;  border-radius:0.5rem; }
    
    #navigation { border-bottom:1px solid silver; border-radius:0 0 0.5rem 0.5rem; padding-bottom:0.5rem; }
    
    .thirdnav { border-top:1px solid silver; border-radius:0 0.5rem 0 0; padding-top:0.5rem;
        margin-left:0.5rem; padding-left:1.5rem; border-left:0px double silver;  }
    
    .navigation li { margin-bottom:0.15rem !important;  display:block; margin-left:0.5rem !important; line-height:1.1rem; }
    .absolutepersistentnav a { margin:0; font-weight:700 !important; }
    
    .navigation a, .navigation a:link, #navigation a:visited { margin-bottom:0.2rem; }
    
    .navigation li.fright { float:none; }
    
    .navigation li a { display:inline-block; }
    .navigation li img { display:none; }
    .absolutepersistentnav li img { display:initial; }
    /*.absolutepersistentnav a { display:inline-block; }*/
    .absolutepersistentnav img { display:none; }
    
    .navigation.subnav { margin-left:0.5rem; border-left:3px double #7119E1; padding-left:0.25rem; padding-top:0.5rem; }
    .navigation.subnav li a.active { border-bottom:1px solid #7119E1 !important; }
    .navigation.subnav li a.active:focus { border-bottom-color:transparent !important; }
    
    #main { margin-top:-2rem; }
    #infomessages, #warnmessages { margin-top:3.5rem; }
    
    .flex:not(.flexrowonly) { flex-direction:column; flex-wrap:unset; }
    .flex .fright, .inputrow .fright { float:none !important; }
    .flex .right, .inputrow .right { text-align:left !important; }
    
    
    .flex .margleft, .inputrow .margleft,
    .flex .margleft1, .inputrow .margleft1,
    .flex .margleft2, .inputrow .margleft2,
    .flex .margleft3, .inputrow .margleft3 { margin-left:0 !important; }
    
    
    #appversioninfo .flex { flex-direction:row; }
    
    
    .pagesection li.flex { flex-direction:column; flex-wrap:unset;  }
    .pagesection li.flex .flex1 { padding-top:1rem; }

        
    .inputrow { flex-direction:column; border-bottom-color:transparent; align-items:initial; flex-wrap:unset;  }
    .inputrow label.label, .inputrow legend.label { margin:0.5rem 0 0 0; }
    .inputrow .flex1, .inputrow .flex2, .inputrow .flex3, .inputrow .flex4, .inputrow .flex15,  .inputrow .flex16 { width:90%; }
    
    #appversion-box { Xposition:static; Xfloat:right; }
    
}
  
  
@media (max-width: 600px) {
    #appversionnotes { Xposition:static; width:100%; min-width:300px; }
    /*.navigation li { margin-left:0; margin-bottom:0.5rem; }*/

    
    .inputrow label, .inputrow .label { text-align:left; }
    
    .inputrow textarea { width:90%; }
    
    .flex:not(.flexrowonly),
    .inputrow,
    .inputrow_fieldset fieldset div.flex { flex-direction:column !important; }
    .inputrow_fieldset fieldset div.flex > div.flex1 { margin-left:0; }
    
    .inputrow_fieldset fieldset div.flex ul,
    .inputrow_fieldset fieldset div.flex ol { margin-left:1rem; }
    
    .loopitems-box .item-box { margin-left:0; }
    
    
    h2 button.fright { font-size:0.75rem; float:none; position:relative; top:-0.25rem; }
    
    .XXXfright, .fleft { float:none; }
    .button.small, button.small, button, .button, .button, .buttonred { top:-0.25rem; margin-bottom:0.1rem; }

    .infoflexrow { flex-direction:column; flex-wrap:unset; }
    
    
}
  
  
  
/* --------------------------------------- 
    end: MEDIA QUERIES  */