body {
font-family: Arial, Helvetica, sans-serif;
font-size: 12pt;
margin: 0px;
padding: 0px;
background-color: #cfcfcf;
color: #000000;
}

/*
 * Forece Google CSE background to be transparent
 */
.gsc-control-cse {
background:transparent !important; /* enforce this rule; do not allow override */
border-color:transparent !important; /* border color */
}

/*
 * Tweak border width to stop WebKit from displaying black backgrounds in
 * text fields
 */
input[type='text'], input[type='password'] {
border-color: #0f0f0f;
border-width: 1px;
}

input[type='submit'] {
color: #ffffff;
background-color: #909090;
font-weight: bold;
border-width: 1px;
-moz-border-radius: 6px;
-webkit-border-radius: 6px;
-khtml-border-radius: 6px;
border-radius: 6px;
padding: 2px
}

table {
width: 100%;
border: 0px;
padding: 2px;
border-spacing: 2px;
}

td {
vertical-align: top;
}

hr {
color: #efefef;
background-color: #efefef;
height: 1px;
border: none;
font-size: 1px;
}

h1 {
color: #000000;
font-family: Arial, Helvetica, sans-serif;
}

h2 {
color: #000000;
font-family: Arial, Helvetica, sans-serif;
}

h3 {
color: #000000;
font-family: Arial, Helvetica, sans-serif;
}

ul {
padding-left: 20px;
}

li {
margin: 5px 0;
}

a:link {
color: #000066;
}

a:visited {
color: #000066;
}

a[href]:hover {
color: #660066;
}

.highlight {
background-color: #f0f09f;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
-khtml-border-radius: 8px;
border-radius: 8px;
margin: 1px;
padding: 5px;
}

.mainnavbar {
color: #ffffff;
background-color: #707070;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
-khtml-border-radius: 8px;
font-size: 11pt;
border-radius: 8px;
margin: 1px;
padding: 5px;
}

.mainnavbar hr {
color: #d2d2d2;
background-color: #d2d2d2;
height: 1px;
border: none;
font-size: 1px;
}

.titlebar {
color: #ffffff;
background-color: #4f4faf;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
-khtml-border-radius: 8px;
border-radius: 8px;
margin: 1px;
padding: 5px;
}

.warning {
background-color: #b0aff7;
-moz-border-radius: 8px;
-webkit-border-radius: 8px;
-khtml-border-radius: 8px;
font-size: 11pt;
border-radius: 8px;
margin: 1px;
padding: 5px;
}

.missing {
color: #ff0000;
}

.footer {
font-size: 8pt;
text-align: left;
margin-top: 8px;
margin-bottom: 8px;
}

.header {
min-width: 400px;
margin-left: 15px;
margin-right: 15px;
position: relative;
}

table.header {
margin-left: 0px;
margin-right: 0px;
}

table.mainnavbar {
padding: 1px;
border-spacing: 0px;
}

table.mainnavbar tr {
color: #ffffff;
text-align: center;
font-weight: bold;
}

.mainnavbar ul {
margin: 2px;
padding: 0px 0px 0px 50px;
}

.mainnavbar li {
display: inline;
list-style-type: none;
white-space: nowrap;
padding-right: 50px;
}

.mainnavbar a:link {
color: #ffffff;
text-decoration: none;
font-weight: bold;
}

.mainnavbar a:visited {
color: #ffffff;
text-decoration: none;
font-weight: bold;
}

.mainnavbar a[href]:hover {
color: #ffffff;
text-decoration: underline;
font-weight: bold;
}

table.titlebar tr {
text-align: center;
font-weight: bold;
}

table.titlebar td {
vertical-align: middle;
}

tr.titlebar {
color: #ffffff;
text-align: center;
font-weight: bold;
}

tr.titlebar td {
vertical-align: middle;
}

.titlebar img {
width: 64px;
height: 64px;
float: right;
}

.titlebar a:link {
color: #ffffff;
font-weight: bold;
}

.titlebar a:visited {
color: #ffffff;
font-weight: bold;
}

.titlebar a[href]:hover {
color: #f0f09f;
font-weight: bold;
}

.block {
display: block;
text-decoration: none;
}

table.warning tr {
text-align: center;
}

p.warning {
padding: 8px;
}

input.wide {
font-size: 10pt;
width: 350px;
margin: 5px;
padding: 5px;
}

select {
font-size: 10pt;
}

td.rightborder {
border-right: 1px solid #cfcfcf;
}

#columns p.smallfont {
font-size: 8pt;
}

#columns td {
padding: 10px;
font-size: 10pt;
}

#columns select {
font-size: 10pt;
}

#userLogin td {
padding: 2px;
vertical-align: middle;
}

img.checkmark {
width: 23px;
height: 20px;
margin: 2px;
border: 0px;
}

table.checkmark {
max-width: 1200px;
border-spacing: 5px 2px;
}

table.checkmark td {
min-width: 125px;
text-align: center;
vertical-align: middle;
}

table.checkmark td.checkmarkfirstcolumn {
text-align: left;
}

img.ship {
width: 128px;
height: 128px;
margin: 10px;
border: 0px;
}

td.ship {
width: 148px;
}

img.snapshot {
border-color: #cfcfcf;
border-width: 1px;
border-style: solid;
margin: 5px 10px;
float: right;
max-width: 500px;
max-height: 200px;
}

img.sample {
border-color: #cfcfcf;
border-width: 1px;
border-style: solid;
margin: 5px 10px;
width: 540px;
height: 450px;
float: right;
}

img.texthighlighting {
height: 203px;
float: none;
vertical-align: bottom;
}

img.twitter {
height: 16px;
position: relative;
top: 3px;
right: 2px;
float: right;
}

#content {
background-color: #e7e7e7;
min-width: 400px;
text-align: left;
border-color: #afafaf;
border-width: 1px;
border-style: solid;
}

#content .pageContent {
padding: 1px 10px;
min-height: 500px;
}

.monospace {
font-family: monospace;
}

@viewport {
width: device-width;
}

@media all and (max-width: 980px) {

img.sample {
width: 360px;
height: 300px;
}

}

@media (prefers-color-scheme: dark) {

img {
opacity: .75;
}

img:hover {
opacity: 1;
}

body {
background-color: #303030;
color: #ffffff;
}

hr {
color: #101010;
background-color: #101010;
}

h1 {
color: #ffffff;
}

h2 {
color: #ffffff;
}

h3 {
color: #ffffff;
}

a:link {
color: #99f0ff;
}

a:visited {
color: #99f0ff;
}

a[href]:hover {
color: #fff0ff;
}

.warning {
background-color: #907fc7;
}

img.snapshot {
border-color: #303030;
}

img.sample {
border-color: #303030;
}

#content {
background-color: #181818;
border-color: #505050;
}

}