#play-screen {
        position: absolute;
        left: 380px;
        top: 40px;
	display:none;
        background-image: url(../images/grid/background.png);
        width: 818px;
        height:650px;
        
        z-index: 50;
}

#play-screen.active {
    display:block;
}

#ps-exit {
    position:absolute;
    left:55px;
    top:17px;
}
#grid {
    position:absolute;
    left:249px;
    top:79px;
}

.tile {
    position:absolute;
    width:70px;
    height:70px;
}

.tile.border {
    background-image: url(../images/grid/selection.png);
    background-size: contain;
}

.tile.invisible {
    transition: visibility 0s linear 0.3s;
    visibility: hidden;
}

.figure {
    transition: opacity 0.5s ease;
    opacity: 1;
}
.figure.invisible {
    transition: transform 0.3s ease, opacity 0s linear 0.3s;
    transform: scale(0,0) translateZ(0);
    opacity: 0;
}

.tile-inner {
    width:60px;
    height:60px;
    padding:5px;
}

.tile-inner img {
    width:60px;
    height:60px;
}

#moves {
    position:absolute;
    left:120px;
    top:270px;
    color:white;
}

#goals {
    position:absolute;
    left:90px;
    top:340px;
    color:white;
}

/* Invisible hotspots over the top booster icons (aligned to the board frame) */
#boost-hotspots { position:absolute; left:300px; top:15px; width:480px; height:50px; pointer-events:none; }
.boost-btn { position:absolute; width:36px; height:36px; background:transparent; border:0; cursor:pointer; pointer-events:auto; }
.boost-hammer { left:250px; top:6px; }
.boost-bomb { left:300px; top:6px; }
.boost-shuffle { left:350px; top:6px; }

#g-player-info {
    display: block;
    position: absolute;
    left: 70px;
    top: 3px;
    transform: scale(0.81);
}