#interface {
  height: 0;
}

.interface-btn, .interface-btn-letter, .interface-btn-disabled{
  position: absolute;
  cursor: pointer;
  user-select: none;
  -moz-user-select: -moz-none;
  display: inline-block;
  width: 3.3vh;
  height: 3.3vh;
  color: var(--color-main);
  box-shadow: 0 0 0 0.5vh var(--color-main),
              0 0.3vh 0 0.8vh black;
  border-radius: 25%;
  border: var(--game-box-border);
  background: var(--color-active);
  padding: 0.5vh;
}

.interface-btn:hover, .interface-btn-letter:hover{
  cursor: pointer;
  /*background: var(--color-hover);
  box-shadow: 0 0 0 0.5vh var(--color-main),
              0 0.3vh 0 0.8vh black;*/
}

.interface-btn:active, .interface-btn-letter:active{
  cursor: pointer;
  /*background: var(--color-active);
  box-shadow: 0 0 0 0.5vh var(--color-main),
              0 0.3vh 0 0.8vh black;*/
}

.interface-btn img, .interface-btn-disabled img{
  position: relative;
  user-select: none;
  -moz-user-select: -moz-none;
  pointer-events: none;
  z-index: 1;
}

.interface-btn-letter{
  border: var(--game-box-border);
  background: white;
  line-height: 2.9vh;
  font-size: 2.5vh;
}

.interface-btn-letter:hover{
  background: white;
}

.interface-btn-letter:active{
  background: white;
}

.interface-btn-disabled{
  cursor: default;
  pointer-events: none;
  filter: opacity(0.5);
}

.interface-btn-white{
  user-select: none;
  -moz-user-select: -moz-none;
  color: #666666;
  box-shadow: -0.2vh -0.2vh 0 0   #FFFFFF,
              0 0 0 0.5vh         #CCCCCC,
              0 0.3vh 0 0.8vh     #666666,
             -0.3vh -0.05vh 0 1vh #999999,
              0.2vh 0.4vh 0 1vh   #FFFFFF;
  border-radius: 50%;
  border: 0.3vh solid #666666;
  height: 2.8vh;
  width: 2.8vh;
  line-height: 2.5vh;
  font-size: 2.7vh;
  display: block;
  background: #FFFFFF;
  position: absolute;
  top: 2.5vh;
  left: 37vh;
}

.interface-btn-white:hover{
  cursor: default;
  background: #FFFFFF;
  box-shadow: -0.2vh -0.2vh 0 0   #FFFFFF,
              0 0 0 0.5vh         #919293,
              0 0.3vh 0 0.8vh     #666666,
             -0.3vh -0.05vh 0 1vh #999999,
              0.2vh 0.4vh 0 1vh   #FFFFFF;
}

.interface-btn-white:active{
  cursor: default;
  background: #FFFFFF;
  box-shadow: -0.2vh -0.2vh 0 0   #FFFFFF,
              0 0 0 0.5vh         #999999,
              0 0.3vh 0 0.8vh     #666666,
             -0.3vh -0.05vh 0 1vh #999999,
              0.2vh 0.4vh 0 1vh   #FFFFFF;
}