$black: #000;
$white: #fff;

$background-color: #1e3f51;
$foreground-color: $white;

$link-color: #fd0;

$board-border-color: #000;
$board-shadow-color: rgba(0, 0, 0, 0.4);

$board-square-size: 9vmin;
$base-font-size: 16px;

$black-square-color: #777;
$white-square-color: #bbb;

$selected-square-color: #0cf;
$available-square-color: #6f0;

$your-turn-background-color: rgba($white, 0.1);

$game-state-background-color: darken($black-square-color, 10%);

$square-outline-color: darken($black-square-color, 20%);
$selected-outline-color: lighten($selected-square-color, 20%);
$available-outline-color: rgba(lighten($available-square-color, 20%), 0.5);

$colours: "black" "white";
$pieces: king queen bishop knight rook pawn;

$black: #000;
$white: #fff;

$background-color: #1e3f51;
$foreground-color: $white;

$link-color: #fd0;

$board-border-color: #000;
$board-shadow-color: rgba(0, 0, 0, 0.4);

$board-square-size: 9vmin;
$base-font-size: 16px;

$black-square-color: #777;
$white-square-color: #bbb;

$selected-square-color: #0cf;
$available-square-color: #6f0;

$your-turn-background-color: rgba($white, 0.1);

$game-state-background-color: rgba(darken($black-square-color, 10%), 0.9);

$square-outline-color: darken($black-square-color, 20%);
$selected-outline-color: lighten($selected-square-color, 20%);
$available-outline-color: rgba(lighten($available-square-color, 20%), 0.5);

$colours: "black" "white";
$pieces: king queen bishop knight rook pawn;

Make game state indicator slightly transparent
Make game state indicator slightly transparent
