:root { --amsblue: #007fc4; --amsgray: #35383b; --amsdark: #282828; --amslight: #f6f6f8; --tabhover: #b0e3ff; --subhover: #009ee0; }

font { color: black; }
html { overflow-y: scroll; }
* { margin: 0; padding: 0; }
* body { font: 12px/16px Verdana, Geneva, sans-serif; background: white; color: var(--amsgray); text-align: center; }
.bodydark { background-color: var(--amsdark); }
header.masthead { background: white; height: 53px; position: relative; }
h1 { font-size: 14px; font-weight: bold; color: var(--amsblue); padding: 2px 5px 5px 12px; }
.hm { color: var(--amsgray); }
.hmu { color: var(--amsgray); font-size: 9px; float: right; font-weight: normal; padding: 0px 10px 0px 0px; }
h2 { font-size: 12px; font-weight: normal; padding: 2px 5px 5px 5px }
.menu-amsmenu-container { background: var(--amsgray); width: 770px; height: 30px; position: relative; z-index: 99; }
header .menu-container { background: var(--amsgray); }
ul.sf-navbar { width: 770px; padding-right: 0px; float: none; margin: 0; }

#wrapper { position: relative; width: 770px; margin: 0 auto; text-align: left; padding: 0; }
.wrapperdark { background-color: var(--amsdark); }
.wrapperlight { background-color: white; }
.container { position: relative; width: 770px; margin: 0 auto; text-align: left; padding: 0; }
#main, #mainc, #build { clear: both; position: relative; width: 748px; padding: 10px 10px 10px 10px; border-top: none; }
.maindark { background-color: var(--amsdark); }
.mainlight { background-color: white; }
#mainc { text-align:center; }
#main a { color: var(--amsblue); }
#loginbox { border: 5px solid var(--amsblue); width: 350px; height: 140px; border-radius: 16px; margin: 0 auto; }
#resetbox { border: 5px solid var(--amsblue); width: 350px; height: 160px; border-radius: 16px; margin: 0 auto; }
#loginsin { float:middle; }
.refresh { text-align: right; font-size: 9px; font-style: italic; font-weight: normal; color: var(--amsdark); }
.refreshdark { color: var(--amslight); }
#siteseal { text-align: right; }
#quest { font-size: 11px;font-weight:normal; }
#buttop { margin-top:0px; }
.footer { text-align: right; font-size: 9px; font-style: italic; font-weight: normal; color: var(--amsdark); }
.footerdark { color: var(--amslight); }
.legend-dark { color: white; }
.legend-light { color: black; }

@media print { .no-print, .no-print * { display: none !important; } }

form input[type=submit] { background: var(--amsblue); border: 0; color: white; padding: 3px 8px 3px; cursor: pointer; font-weight: bold !important; text-align: center; font-size: 12px !important; font: inherit; margin: 5px 0px 0px 0px;border-radius:4px; }
form input[type=submit]:hover { text-decoration: none; background: var(--subhover); color: white; }
form input[type=button] { background: var(--amsblue); border: 0; color: white; padding: 3px 8px 3px; cursor: pointer; font-weight: bold !important; text-align: center; font-size: 12px !important; font: inherit; margin: 5px 0px 0px 0px;border-radius:4px; }
form input[type=button]:hover { text-decoration: none; background: var(--subhover); color: white; }
form input[type=checkbox] { padding: 3px 8px 3px; cursor: pointer; margin: 2px 0px 0px 10px; accent-color: var(--amsblue); }
form input[type=textdt] { width: 80px; padding: 0px 0px 0px 4px; border-radius: 4px; }
form input[type=text] { border-radius: 4px; }
form input[type=password] { border-radius: 4px; }
input.profemail { width: 250px; }
input.largerCheckbox { width: 20px; height: 20px; }

img.gauge { padding: 0px 0px 0px 0px; }
img.question,img.questsub { width: 11px; height: 10px; }
img.question { vertical-align: super; padding: 0px 0px 0px 3px; }
img.questsub { vertical-align: super; padding: 0px 0px 0px 0px }
img.icon { width: 16px; height: 16px; }
img.stats { padding: 0px 20px 0px 10px; }
img.webalizer { display: block; margin-left: auto; margin-right: auto; }
img { vertical-align: middle; }
.q { color: white; background: blue; width: 12px; height: 12px; display: inline-block; vertical-align: super; text-decoration: none; font-size: 10px; text-align: center; border-radius: 50%; line-height: 12px; }

div.masthead { font-size: 14px; font-weight: bold; color: var(--amsblue); padding: 2px 5px 5px 5px; }
div.mapdivmy { width: 100%; height: 100%; }
.mapdivmydark { background-color: var(--amsdark); }
.mapdivmylight { background-color: lightgray; }
div.gmapdiv { width: 100%; height: 100%; }
div.tab { overflow: hidden; padding-left: 5px; }
div.tab-dark { background-color: var(--amsdark); }
div.tab-light { background-color: white; }
div.tab button { background-color: inherit; float: left; border: ridge; outline: none; cursor: pointer; padding: 1px 20px; transition: 0.3s; font-size: 12px; font-weight: bold; }
div.tab-dark button { color: var(--amslight); }
div.tab-light button { color: var(--amsgray); }
div.tab button:hover { color: var(--amsgray); background-color: var(--tabhover); }
div.tab-dark button:hover { color: var(--amsgray); background-color: var(--tabhover); }
div.tab-light button:hover { color: var(--amsgray); background-color: var(--tabhover); }
div.tab button.active { color: var(--amslight); background-color: var(--amsblue); }
div.tab-dark button.active { color: black; background-color: var(--amsblue); }
div.tab-light button.active { color: var(--amslight); background-color: var(--amsblue); }

span.gauge { vertical-align:bottom;padding: 0px 0px 0px 5px; }
span.alert { color:red; }
span.reset { float:right; }

p.alert { font-size: 12px; font-weight: normal; color: red; }
p.urllink,span.urllink { background: var(--amsblue); border: 0; color: white; padding: 3px 8px 3px; cursor: pointer; font-weight: bold !important; text-align: left; font-size: 12px !important; font: inherit; margin: 0px 0px 0px 0px; border-radius: 4px; }
p.urllink:hover,span.urllink:hover { text-decoration: none; background: var(--subhover); color: white; }
p.subject { font-size: 12px; color: var(--amsblue); font-weight: bold; }
p.topmsg { margin: 0px 0px 10px 0px; color: var(--amsblue); }
p.dashlrg { margin: 0px 0px 0px 10px; color: var(--amsgray); font-size: 12px; }
p.dashsml { margin: 0px 0px 0px 10px; color: var(--amsgray); font-size: 10px; }

select.proplist,select.syslist { width: 440px; border-radius: 4px; }
select.profdd { border-radius: 4px; }
select.admindd { width: 135px; margin-top: 0px; border-radius: 4px; }
select.dtrange { width: 20px; border-radius: 4px; }

.optgroup-light { background-color: #e6e6e6; }
.optgroup-dark { background-color: #e6e6e6; }

i.dtrange { padding: 0px 5px 0px 5px; }

table.rpt { margin: 0px 0px 0px 10px; }
table.detail, table.detaillogin { font-size: 12px; width: auto; border-collapse: separate; padding: 0px 0px 0px 10px; }
table.detaillogin { margin-left: 40px; }
td.profdata, td.profdesc { width: 150px; }
td.profupd { width: 500px; color: red; }
td.usermsg { font-weight: bold; color: red; }
td.cont { font-weight: bold; color: var(--amsblue); width: 80px; text-align: center; }
td.contb { font-weight: bold; color: var(--amsblue); width: 260px; text-align: center; }
td.contsa { font-weight: bold; color: var(--amsblue); text-align: left; }
td.contsai { font-size: 10px; font-style: italic; color: var(--amsgray); text-align: left; }
td.contd { font-weight: bold; }
td.contd-dark { color: var(--amslight); }
td.contd-light { color: var(--amsdark); }
td.proplist,td.syslist { text-align: center; }
table.adm { margin: 0px 0px 0px 10px; }
table.adm0 { margin: 0px 0px 0px 0px; }
td.admin { width: 130px; }
td.admind { font-weight: bold; }
table.procboard { margin: 0px 0px 0px 12px; }
td.procdata,td.prochead { font-size: 12px; text-align: center; font-weight: bold; padding: 0px 10px 0px 10px; border: 3px double var(--amsgray); border-radius: 4px; }
td.prochead { color: black; background-color: lightgray; }
td.procdata { color: var(--amsgray); }
table.gauges { border-collapse: collapse; border-spacing: 0px; table-layout: fixed; width: auto; }
thead.gauges, tbody.gauges { vertical-align: middle; }
th.gauges, td.gauges { text-align: top; width: 80px; font-size: 10px; font-weight: bold; color: var(--amsgray); }
th.gauges-dark { color: var(--amslight); }
th.gauges-light { color: var(--amsdark); }
td.gauges { white-space: nowrap; color: var(--amsblue); text-align: right; }
td.gaugessub { white-space: nowrap; color: var(--amsgray); text-align: left; font-style: italic; font-weight: bold; font-size: 12px; padding-left: 5px; }
td.gaugessubdark { color: var(--amslight); }
td.gaugessublight { color: var(--amsdark); }
tr.g1-dark { background: var(--amsgray); }
tr.g1-light { background: var(--amslight); }
tr.g2-dark { background: var(--amsdark); }
tr.g2-light { background: white; }
tr.blankrow { height: 10px; }
td.vishidden { visibility: hidden; }
td.redmsg { color: red; text-align: center; }
td.center { text-align: center; }

a.hmhead { color: var(--amsblue); }
a.conthead { margin-left: 80px; }

.tooltip { position: relative; display: inline-block; }
.tooltiptext { visibility: hidden; text-align: left; font-size: 11px; font-weight: normal; background-color: var(--amsgray); color: white; border-radius: 7px; padding: 5px 10px; position: absolute; z-index: 1; }
.tooltipL { bottom: 100%; left: 60%; right: 10px; margin-left: -300px; }
.tooltipR { bottom: 100%; left: 10px; right: 60%; margin-right: -300px; }
.tooltipX { bottom: 100%; left: 10px; right: 60%; margin-right: -150px; }
.tooltip:hover .tooltiptext { visibility: visible; }

svg { height: 20px; width: 20px; display: block; margin: auto; }
circle { cx: 10px; cy: 10px; r: 8px; stroke: black; stroke-width: 2px; }

.l1 { fill: lime; }
.l2 { fill: yellow; }
.l3 { fill: orange; }
.l4 { fill: red; }
.l5 { fill: lightgray; }
.l6 { fill: gray; }
.l7 { fill: lightblue; }
.l8 { fill: green; }
.l9 { fill: darkgreen; }
.g0 { fill: blue; }
.g1 { fill: lightblue; }
.g2 { fill: green; }
.g4 { fill: lightgreen; }
.g5 { fill: sienna; }
.g7 { fill: orange; }
.g8 { fill: tan; }
.g10 { fill: yellow; }
.g11 { fill: purple; }
.g12 { fill: violet; }
.g13 { fill: lightsalmon; }
.g14 { fill: orangered; }
.g15 { fill: cyan; }
.g16 { fill: khaki; }
