#tabular {
    font-weight: bold;
}

p.tabular {
    display: block;
}

.diagram {
    display: table;
    border: 1px solid;
    margin-top: 1em;
}

.diagram .header {
    display: table-caption;
    text-align: center;
    font-size: smaller;
}

.diagram .header div {
    display: inline;    
}

.diagram .header div:before {
    content: " / ";
}

.diagram .header div:first-child:before {
    content: "";
}

.diagram .hand {
    display: table-row;
}

.red {
    color: red;
}

.hand .seatname {
    display: table-cell;
    width: 8%;
    padding: 1ex;
    text-align: right;
    font-size: smaller;
    font-style: italic;
}

.holding {
   display: table-cell;
   width: 23%;
   white-space: nowrap;
   padding: 1ex;
}