/*cards*/
.card {
  /*background-image: url("images/cardback.gif");*/
  /*background-color: white;*/
  border: 0px solid #000000;
  font-size: 13px;
  width:  3.75em;
  height: 5.00em;
  float: left;
  margin: 0px;
  padding: 0px;
  display: inline;
}

.front {
  background-color: #ffffff;
  color: #000000;
  position: absolute;
  /*width: 100%;
  height: 100%;*/
  padding: 0px;
  margin: 0px;
  float: left;
}

.red { color: #ff0000; }

.index {
  font-size: 50%;
  font-weight: normal;
  text-align: center;
  position: absolute;
  left: 0.25em;
  top:  0.25em;
}

.ace {
  font-size: 300%;
  position: absolute;
  left: 0.325em;
  top:  0.250em;
}

.face {
  border: 1px solid #000000;
  position: absolute;
  left: 0.50em;
  top:  0.45em;
  width:  2.6em;
  height: 4.0em;
}

.spotA1 { position: absolute; left: 0.60em; top: 0.5em; }
.spotA2 { position: absolute; left: 0.60em; top: 1.5em; }
.spotA3 { position: absolute; left: 0.60em; top: 2.0em; }
.spotA4 { position: absolute; left: 0.60em; top: 2.5em; }
.spotA5 { position: absolute; left: 0.60em; top: 3.5em; }

.spotB1 { position: absolute; left: 1.55em; top: 0.5em; }
.spotB2 { position: absolute; left: 1.55em; top: 1.0em; }
.spotB3 { position: absolute; left: 1.55em; top: 2.0em; }
.spotB4 { position: absolute; left: 1.55em; top: 3.0em; }
.spotB5 { position: absolute; left: 1.55em; top: 3.5em; }

.spotC1 { position: absolute; left: 2.50em; top: 0.5em; }
.spotC2 { position: absolute; left: 2.50em; top: 1.5em; }
.spotC3 { position: absolute; left: 2.50em; top: 2.0em; }
.spotC4 { position: absolute; left: 2.50em; top: 2.5em; }
.spotC5 { position: absolute; left: 2.50em; top: 3.5em; }

/*layout*/
body 
{
font-family: georgia, times new roman, sans-serif;
font-weight: normal;
font-size: 14px; 
padding: 0px;
margin: 0px;
color: #000000;
text-align: center;
background-color: white;
}

.table_shell
{
padding: 0px;
margin: 0px;
}

.table_cell
{
padding: 0px;
margin: 0px;
border: 1px solid darkred;
text-align: center;
}

.table_cell td
{
width: 49px;
height: 65px;
border: 1px solid darkred;
padding: 0px;
margin: 0px;
font-family: Lucida Console;
font-size: 40px;
color: gray;
text-align: left;
}

.table_cell td.error
{
background-color: cyan;
}

fieldset input, label
{
margin: 5px;
height: 20px;
width: 45%;
}

fieldset label 
{
text-align: right;
clear: left;
float: left;
}

fieldset input
{
float: left;
}

fieldset input.submit
{
height: 25px;
width: 100px;
}

fieldset textarea
{
clear: both;
float: left;
width: 360px;
}

.puzz_box
{
clear: both;
}

.puzz_form
{
padding: 0px;
margin: 0px;
}

.puzz_form input
{
color: black;
width: 100%;
height: 100%;
margin: 0px;
padding: 0px;
text-align: center;
font-size: 49px;
font-family: Arial Narrow;
font-weight: normal;
}

.puzz_form input.submit
{
font-size: 16px;
clear: left;
width: 50px;
height: 30px;
font-weight: normal;
}

input.hiddensub
{
width: 0px;
height: 0px;
padding: 0px;
margin: 0px;
border-style: none;
}

.puzz_form input.posted_name
{
width: 220px;
text-align: left;
font-size: 10pt;
font-weight: normal;
}

.log
{
	float: left;
	border-style: none;
	padding: 0px;
}

.log textarea
{
	float: clear;
	padding: 0px;
	margin-top: 2px;
	width: 297px;
	height: 100px;
	font-family: Arial;
	font-size: 10px;
}

.white
{
background-color: white;
border-style: none;
}

.red
{
background-color: #ffdddd;
border-style: none;
}

.green
{
background-color: #ddffdd;
border-style: none;
}

.blue
{
background-color: #ddddff;
border-style: none;
}

.purple
{
background-color: #ffddff;
border-style: none;
}

.gray
{
background-color: #ddddde;
border-style: none;
}

.lightgray
{
background-color: #eeeeef;
border-style: none;
}

.dull
{
color: #ffffff;
border-style: none;
}

.glass
{
background-color: transparent;
border-style: none;
}

.error
{
background-color: red;
border-style: none;
}

/*extra colours for 'colouring'*/
.darkred
{
background-color: darkred;
border-style: none;
}
.darkblue
{
background-color: darkblue;
border-style: none;
}
.darkgreen
{
background-color: darkgreen;
border-style: none;
}
.violet
{
background-color: violet;
border-style: none;
}
.darkviolet
{
background-color: darkviolet;
border-style: none;
}
.orange
{
background-color: orange;
border-style: none;
}
.darkorange
{
background-color: darkorange;
border-style: none;
}
.cyan
{
background-color: cyan;
border-style: none;
}
.lightcyan
{
background-color: lightcyan;
border-style: none;
}
.goldenrod
{
background-color: goldenrod;
border-style: none;
}
.darkgoldenrod
{
background-color: darkgoldenrod;
border-style: none;
}
.khaki
{
background-color: khaki;
border-style: none;
}
.darkkhaki
{
background-color: darkkhaki;
border-style: none;
}
.yellow
{
background-color: yellow;
border-style: none;
}
.lightyellow
{
background-color: lightyellow;
border-style: none;
}

.copyright
{
font-size: 12px;
font-family: helvetica;
background-color: darkred;
color: white;
width: 465px;
text-align: center;
margin-bottom: 0px;
margin-top: 0px;
padding-bottom: 1px;
}

a:visited, a:hover, a:link
{
font-family: helvetica;
color: white;
text-decoration: underline;
font-size: 12px;
}