#board_editor {
  position: relative;
  min-height: 600px;
  padding-top: 5px;
}
#board_editor square.last-move {
  background-color: transparent;
}
#board_editor .spare {
  height: 64px;
  width: 512px;
  border-radius: 3px;
  box-sizing: border-box;
  box-shadow: 0 2px 3px rgba(0,0,0,0.3) inset;
}
#board_editor .spare.black, #board_editor .spare.white .selected-square {
  background: #888;
}
#board_editor .spare.white, #board_editor .spare.black .selected-square {
  background: #ccc;
}
body.dark #board_editor .spare.white {
  background: #aaa;
}
#board_editor .spare.top {
  margin-bottom: 15px;
}
#board_editor .spare.bottom {
  margin-top: 15px;
}
#board_editor .spare .no-square {
  position: relative;
  display:inline-block;
  width: 64px;
  height: 64px;
}
.is3d #board_editor .spare .no-square {
  height: 58.102px;
}
#board_editor .spare piece {
  width: 100%;
  height: 100%;
}
.is3d #board_editor .spare piece {
  /* original size:
     width: 140.625%;
     height: 179.6875%; */
  /* size on 3D board, with height/width = 90.78571% */
  width: 100%;
  height: 140.7465%;
  left: 0;
  top: -36%;
}
#board_editor .editor-side {
  position: absolute;
  left: 552px;
  top: 150px;
  width: 228px;
}
#board_editor .editor-side > div {
  margin-bottom: 3em;
  text-align: center;
}
#board_editor .button {
  display: block;
  text-align: center;
  margin-bottom: 1em;
}
#board_editor .button.disabled {
  opacity: 0.5;
}
#board_editor .editor-side select.positions {
  width: 100%;
}
#board_editor .editor-side select.positions option:checked {
  font-style: italic;
}
#board_editor .copyables > p {
  margin-top: 7px;
}
#board_editor .copyables .name {
  font-size: 1.2em;
  display: inline-block;
  width: 40px;
}
#board_editor .copyable {
  width: 462px;
}
#board_editor .editor-side > div.metadata {
  white-space: nowrap;
}
#board_editor .editor-side > div.metadata div.color {
  margin-bottom: 1em;
}
#board_editor .editor-side .castling label,
#board_editor .editor-side .castling input {
  display:inline-block;
  margin: 3px;
  vertical-align: middle;
}
/*
http://www.flaticon.com/free-icon/clicker_99162
*/
#board_editor .spare piece.pointer {
  background-image: url('data:image/svg+xml;utf8;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iaXNvLTg4NTktMSI/Pgo8IS0tIEdlbmVyYXRvcjogQWRvYmUgSWxsdXN0cmF0b3IgMTguMC4wLCBTVkcgRXhwb3J0IFBsdWctSW4gLiBTVkcgVmVyc2lvbjogNi4wMCBCdWlsZCAwKSAgLS0+CjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+CjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB4bWxuczp4bGluaz0iaHR0cDovL3d3dy53My5vcmcvMTk5OS94bGluayIgdmVyc2lvbj0iMS4xIiBpZD0iQ2FwYV8xIiB4PSIwcHgiIHk9IjBweCIgdmlld0JveD0iMCAwIDI5NyAyOTciIHN0eWxlPSJlbmFibGUtYmFja2dyb3VuZDpuZXcgMCAwIDI5NyAyOTc7IiB4bWw6c3BhY2U9InByZXNlcnZlIiB3aWR0aD0iNjRweCIgaGVpZ2h0PSI2NHB4Ij4KPHBhdGggZD0iTTI0NC4yNzksOTEuNjYyYy00LjE5OCwwLTguMTk1LDAuODc2LTExLjgyNSwyLjQ1Yy00LjQxMy0xMS4xNTItMTUuMjM4LTE5LjA1OC0yNy44NjktMTkuMDU4ICBjLTQuNjkyLDAtOS4xMzYsMS4wOTItMTMuMDk0LDMuMDM0Yy01LjAwOS05LjY1Ny0xNS4wNDgtMTYuMjctMjYuNTk4LTE2LjI3Yy0zLjM5NSwwLTYuNjU1LDAuNTc5LTkuNzAxLDEuNjMyVjMwLjIwMSAgQzE1NS4xOTMsMTMuNTQ5LDE0MS43MzgsMCwxMjUuMTk4LDBDMTA4LjY2LDAsOTUuMjA2LDEzLjU0OSw5NS4yMDYsMzAuMjAxdjExOS42NDNMNzMuNjA0LDEyNS4xMyAgYy0wLjE1MS0wLjE2OS0wLjMwNS0wLjMzNS0wLjQ2NS0wLjQ5NGMtNS42NzItNS42NzYtMTMuMjIxLTguODIzLTIxLjI1Ni04Ljg2MmMtMC4wNTIsMC0wLjEwMSwwLTAuMTUzLDAgIGMtOC4wMTYsMC0xNS41MjEsMy4wOTUtMjEuMTQ2LDguNzI0Yy05LjkxOCw5LjkyMS0xMC40NjcsMjQuNjQ3LTEuNTAyLDQwLjQwOGMxMS42MDUsMjAuMzksMjQuMjIsMzkuNjE2LDM1LjM1MSw1Ni41ODEgIGM4LjEzNCwxMi4zOTgsMTUuODE4LDI0LjEwOCwyMS40MzUsMzMuNzljNC44NzEsOC40MDIsMTcuODAxLDM1LjY1MSwxNy45MzMsMzUuOTI2YzEuNjc4LDMuNTQxLDUuMjQ3LDUuNzk4LDkuMTYzLDUuNzk4aDEyOC4yNyAgYzQuNDA3LDAsOC4zMDgtMi44NDMsOS42NTktNy4wMzVjMi4zOTItNy40MzksMjMuMzc5LTczLjM5OCwyMy4zNzktOTguODcxdi02OS4yMjlDMjc0LjI3LDEwNS4yMSwyNjAuODE3LDkxLjY2MiwyNDQuMjc5LDkxLjY2MnogICBNMjM0LjU3OSwxMjEuODY1YzAtNS40NjgsNC4zNTItOS45MTYsOS43LTkuOTE2YzUuMzUxLDAsOS43MDMsNC40NDgsOS43MDMsOS45MTZ2NjkuMjI5YzAsMTYuOTI4LTEzLjAxLDYyLjQzNy0yMC4xODksODUuNjE4ICBIMTE5LjM2MWMtNC4yMDYtOC43NTItMTIuMDg5LTI0Ljk2NC0xNS45NDQtMzEuNjEzYy01Ljg5Ny0xMC4xNjgtMTMuNzMtMjIuMTA1LTIyLjAyMi0zNC43NDQgIGMtMTAuOTY2LTE2LjcxLTIzLjM5My0zNS42NTItMzQuNjgxLTU1LjQ4MmMtMi45NDYtNS4xODEtNS42NDYtMTIuMTY2LTEuNzgtMTYuMDMyYzEuODAzLTEuODA3LDQuMjMxLTIuNzUxLDYuODUxLTIuNzc5ICBjMi41NTcsMC4wMTMsNC45NjIsMC45NzcsNi44MDUsMi43MjFsMzkuMTI0LDQ0Ljc1NWMyLjc4LDMuMTgzLDcuMjQ4LDQuMzA2LDExLjIwMiwyLjgyMWMzLjk1OC0xLjQ4Niw2LjU3OS01LjI3MSw2LjU3OS05LjQ5NyAgVjMwLjIwMWMwLTUuNDY3LDQuMzUzLTkuOTEzLDkuNzA0LTkuOTEzYzUuMzUyLDAsOS43MDYsNC40NDYsOS43MDYsOS45MTN2OTQuNzExYzAsNS42MDIsNC41NDMsMTAuMTQ0LDEwLjE0NCwxMC4xNDQgIGM1LjYwMSwwLDEwLjE0NC00LjU0MiwxMC4xNDQtMTAuMTQ0VjkyLjAxNmMwLTUuNDY0LDQuMzUyLTkuOTA5LDkuNzAxLTkuOTA5YzUuMzUxLDAsOS43MDMsNC40NDUsOS43MDMsOS45MDl2NDYuMTI3ICBjMCw1LjYwNSw0LjU0MiwxMC4xNDUsMTAuMTQzLDEwLjE0NWM1LjYwMiwwLDEwLjE0NS00LjUzOSwxMC4xNDUtMTAuMTQ1di0zMi44ODhjMC01LjQ2Nyw0LjM1Mi05LjkxNCw5LjcwMS05LjkxNCAgYzUuMzUyLDAsOS43MDYsNC40NDcsOS43MDYsOS45MTR2NDYuMTNjMCw1LjYwMSw0LjU0MiwxMC4xNDUsMTAuMTQ0LDEwLjE0NWM1LjYwMywwLDEwLjE0NS00LjU0NCwxMC4xNDUtMTAuMTQ1VjEyMS44NjV6IiBmaWxsPSIjMDAwMDAwIi8+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+CjxnPgo8L2c+Cjwvc3ZnPgo=');
  top: 6px;
  left: 6px;
  height: 80%;
  width: 80%;
}
.is3d #board_editor .spare piece.pointer {
  height: 87%;
}
#board_editor .spare piece.trash {
  font-size: 32pt;
  top: 0;
  height: 100%;
}
#board_editor .spare .no-square.trash {
  color: black;
  text-align: center
}