#board {
    border: 1px solid black;
}

    #board tr.row:nth-child(even) td.cell:nth-child(even) {
        background-color: white;
    }

    #board tr.row:nth-child(even) td.cell:nth-child(odd) {
        background-color: gray;
    }

    #board tr.row:nth-child(odd) td.cell:nth-child(even) {
        background-color: grey;
    }

    #board tr.row:nth-child(odd) td.cell:nth-child(odd) {
        background-color: white;
    }

.cell {
    border: 1px solid black;
    vertical-align: middle;
    position: relative;
    text-align: center;
    cursor: default;
    height: 56px;
    width: 56px;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

    .cell.selectable:hover {
        background-color: blue !important;
        border: 2px dashed lightblue;
        height: 54px;
        width: 54px;
    }

    .cell .check {
        pointer-events: none;
        position: absolute;
        color: darkgreen;
        font-size: 30pt;
        height: 48px;
        width: 48px;
        z-index: 2;
        left: -2px;
    }

    .cell.invalid {
        background-color: red !important;
        cursor: not-allowed;
    }

        .cell.invalid span.invalid {
            color: red;
        }

    .cell.selected {
        background-color: blue !important;
        cursor: pointer;
    }

    .cell.highlight {
        background-color: gold !important;
        cursor: pointer;
    }

    .cell.attacker {
        background-color: red !important;
    }

        .cell.attacker .piece {
            opacity: .7;
        }

    .cell.attack {
        background-color: red !important;
        cursor: pointer;
    }

        .cell.attack .piece {
            opacity: 1;
        }

    .cell .piece {
        font-size: 30pt;
        opacity: .3;
        z-index: 1;
    }

    .cell.selected .piece {
        opacity: 1;
    }

    /*.cell .piece[factionid="0"] {
            text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
        }*/

    .cell .piece[factionid="1"] {
        text-shadow: -2px 0 white, 0 2px white, 2px 0 white, 0 -2px white;
    }

    .cell.selectable .piece {
        cursor: pointer;
        opacity: 1;
    }

.ui-dialog .ui-dialog-buttonpane button {
    font-size: 20pt;
}