/*body {
  font-size: small;
  font-family: Arial;
}
*/
.settings_gui {
  background: #f9f9f9;
  border: 1px solid #bbbbbb;
  width: 150px;
}

.settings_gui h5 {
  color: #999999;
  margin: 10px;
}

.settings_gui h3 {
  color: #666666;
  background: #dddddd;
  padding: 5px 8px;
}

.settings_gui a.close {
  float: right;
  display: block;
  width: 9px;
  height: 9px;
  margin: 3px;
  background: url(/image/close.png) no-repeat center center;
}

.settings_gui ul {
  margin: 10px;
}

.settings_gui ul li {
	list-style:none;
}
.settings_gui ul li a {
  color: #333333;
  display: block;
  padding: 4px 0;
  margin: 2px 5px;
  border-bottom: 1px solid #dddddd;
}

.settings_gui ul li a.selected {
  font-weight: bold;
  padding-left: 20px;
  background: url(/image/star.png) no-repeat 0 50%;
}

#game {
  margin: 0 auto;
}


#game ul.settings {
  float: right;
  margin: 5px;
}

div#board {
  margin: 10px auto;
  padding: 5px;
}

div#board div.stats {
  /*float: left;*/
  position:absolute;
  right:-205px;
  top:10px;
  width: 175px;
  background-color: #eeeeee;
  min-height: 300px;
  margin-left: 20px;
}

div#board div.stats a.settings_link {
  float: right;
  display: block;
  width: 11px;
  height: 11px;
  background: url(/image/dropdown.png) no-repeat center center;
  margin: 7px 5px 0 0;
}

div#board div.stats h3 {
  color: #ffffff;
  background: #111111;
  padding: 5px;
  line-height: 25px;
}

div#board div.stats table {
  font-size: .8em;
  width: 100%;
}

div#board div.stats table td,
div#board div.stats table th {
  padding: 2px;
}

div#board div.stats table th {
  background: #333333;
  color: #ffffff;
}

div.card,
div.hidden_card,
div.sp_card {
  width: 80px;
  height: 80px;
  background-repeat: no-repeat;
  float: left;
  margin: 5px;
}

div.card,
div.hidden_card {
  background-image: url(/image/cards.png);
}

div.sp_card {
  background-image: url(/image/south_park.jpg);
}

div.hidden_card {
  cursor: pointer;
  background-position: 0 -640px;
}

div.hidden_card:hover {
  background-position: -80px -640px;
}

.red {
  background-position: 0 0;
}

.blue {
  background-position: 0 -80px;
}

.green {
  background-position: 0 -160px;
}

.orange {
  background-position: 0 -240px;
}

.pink {
  background-position: 0 -320px;
}

.light_blue {
  background-position: 0 -400px;
}

.black {
  background-position: 0 -480px;
}

.yellow {
  background-position: 0 -560px;
}

.red_dot {
  background-position: -80px 0;
}

.blue_dot {
  background-position: -80px -80px;
}

.green_dot {
  background-position: -80px -160px;
}

.orange_dot {
  background-position: -80px -240px;
}

.pink_dot {
  background-position: -80px -320px;
}

.light_blue_dot {
  background-position: -80px -400px;
}

.black_dot {
  background-position: -80px -480px;
}

.black_point {
  background-position: -160px -480px;
}

.yellow_dot {
  background-position: -80px -560px;
}

.red_point {
  background-position: -160px 0;
}

.blue_point {
  background-position: -160px -80px;
}

.yellow_point {
  background-position: -160px -560px;
}

.green_point {
  background-position: -160px -160px;
}

.orange_point {
  background-position: -160px -240px;
}

.pink_point {
  background-position: -160px -320px;
}

.light_blue_point {
  background-position: -160px -400px;
}