---
---


/* Enable the scrolling of chess board up to the page top */

body, html { height: 100%; }
#GameWrapper { min-height: 100%; }
#GameBoardWrapper { position: relative; }


/* Chess board */

$squareSize: 56px;
$boardBorderWidth: 4px;
$boardSize: 8 * $squareSize + 2 * $boardBorderWidth;

.boardTable {
  width: $boardSize;
  height: $boardSize;
  border: $boardBorderWidth solid #663300;
}
.whiteSquare, .blackSquare {
  width: $squareSize;
  height: $squareSize;
}
.pieceImage {
  height: $squareSize;
  width: $squareSize;
}
.whiteSquare, .highlightWhiteSquare {
  background: #ffcc99;
}
.blackSquare, .highlightBlackSquare {
  background: #cc9966;
}


/* Game text */

#GameText, #downloadPGN {
  position: absolute;
  left: $boardSize + 10px;
  right: 0;
}
#GameText {
  top: 0;
  bottom: 44px;

  display: block;
  overflow-y: auto;
}
#downloadPGN {
  bottom: 0;
  text-align: center;
}

.moveOn, .variationOn {
  color: #fff;
  background-color: #428bca;
  &:hover {
    background-color: darken(#428bca, 10%);
  }
}