div#blackblock, div#whiteblock {
  width:1000px; height:740px;
  border: 2px solid #888; color:#888;
  text-align: center;
  margin: 2em auto 2em auto;
  clear: both;
}
table#checker, table#twoblocks {
   border-collapse: collapse;
   border: 2px solid #888;
  margin: 2em auto 2em auto;
  clear: both;
  color: #a00;
  text-align: center;
}
table#checker td, table#twoblocks td {
   padding:0px;
   margin: 0px;
   border: 0px;
   width: 200px;
   height: 200px;
}

table#checker td.blk {
   background: #000;
}
table#checker td.wht {
   background: #fff;
}
table#twoblocks td.lum100 {
     background: #ffffff;
  vertical-align: top;
}
table#twoblocks td.lum25 {
     background: #878787;
  vertical-align: top;
}


table#twoblocks td {
   background: #000;
}
table#checker td.wht {
   background: #fff;
}

div.Rfigure {
  clear: both;
  float: right;
  padding: 0em 0em 1em 1em;
  width: 400px;
  font-size: 0.9em;
}
div.Rfigure img {
  display: block;
}
#ratio { 
  font-size: 1.5em; 
  font-weight: bold; 
  color:#ff8;
}
#lum0, #lum1 { color: #ff8; }
form input[type=text], form input[type=submit], form select {
  border: 2px solid #666;
  border-top: 2px solid #000;
  border-left: 2px solid #000;
  background: #333; color: #ff8;
}

form input[type=text] { 
  font-family: monospace, Courier;
  font-size: 1em;
  font-weight: bold;
}
form input[type=radio] {
  background: #333;
  color: #ff8;
}
form select option {
  padding-top: 0.2ex
    }


form input[type=submit] {
 border: 2px solid #666;
  border-bottom: 2px solid #000;
  border-right: 2px solid #000;
}
form input[type=submit]:active {
 border: 2px solid #666;
  border-top: 2px solid #000;
	    border-left: 2px solid #000;
}

form input.inactive {
  color: #888;
}
td p#warnings {
     color: #f40;
     font-weight: bold;
     font-size: 1.2em;
     margin:0px auto 0px auto;
     padding:0px;
     width:30em;
}
#calcbutton, #resetbutton {
  display: block;
  background: #aaa;
  color: #008;
  border: 2px solid #ccc;
  border-bottom: 2px solid #888;
  border-right: 2px solid #888;
}
#calcbutton { float: left;}
#resetbutton { float: right;}

table.Btable {
   margin: 1em auto 1em auto;
   clear: both;
}

table.Btable tr.head th {
  text-align: center;
}
table.Btable th {
  text-align: right;
  font-weight: normal;
  color: #888;
}
table.Btable thead th {
  text-align: center;
}
table.Btable th.tussenkop {
  text-align: center;
  font-size: 1.2em;
  padding-top: 1em;
}
table.cratioresults td, table.cratioresults th  {
  vertical-align: text-top;
}
table.cratioresults th.img  {
  vertical-align: top;
}
table.cratioresults div.screenphoto {
 background: #747474; /* ev -2.5 */
 background-repeat: no-repeat;
  background-position: center center;
 width: 328px; 
 height: 248px; /* note: change contrast-view.php on change */
}

table.cratioresults div.screenphoto div.ftop {
 height:0px; width: 50%;
}
table.cratioresults div.screenphotolink {
  font-size: 0.9em;
  float: right;
}
table.cratioresults div.screenphotolink a {
 color: #999;
}
table.cratioresults div.screenphotolink a:visited {
 color: #666;
}
table.cratioresults div.screenphoto div.frame {
 margin: -1px auto 0px auto;
 border: 1px dashed #e00;
}


div.eq { 
   margin: 0.5em 2em 0.5em 2em; 
   font-family: "Times Roman", "Times New Roman", serif;
   font-size:1.2em;
}

div.navbar {
  font-size: 0.9em;
  text-align: center;
}
div.navbar a:visited, div.navbar a {
 color: #89b;
  text-decoration: none;
}

/* ads  fr, fl = float right, left
   p-version: top margin +0.5em
 */

div.ad {
 background: #222;
}
div.ad iframe {
 background: #282 !important;
 margin: 2px;
}

div.adfr {
  float: right;
 clear: right;
  margin: 0em 0em 1em 1em;
}

div.adfrp {
  float: right;
 clear: right;
 margin: 0.5em 0em 1em 1em;
}

div.adfl {
 float: left;
 margin: 0em 1em 1em 0em;
}

div.adflp {
 float: left;
 margin: 0.5em 1em 1em 0em;
}

div.adban {
 margin: 0.5em auto 0.5em auto;
}