table, select, input {
    font-size: 150%;
}
table {
  border-spacing: 0px;
}
.large {
    font-size: 150%;
}
.extraLarge {
    font-size: 200%;
}

#bigBar td, #characterTraitBar td, #diceBar td {
    text-align: center;
}

.starting {
    font-weight: bold;
    color: #0b0;
    background: #ddd;
}

.current {
    font-weight: bold;
}

.special {
    border: 2px solid #f00;
    margin: -2px;
}

.cell {
    border: 2px solid #fff;
}

.skull {}

.monospace {
    font-family: monospace;
}

.red     { background: #f44; color: #fff; text-shadow: 2px 2px 2px black; }
.blue    { background: #44f; color: #fff; text-shadow: 2px 2px 2px black; }
.green   { background: #3e3; color: #fff; text-shadow: 2px 2px 2px black; }
.yellow  { background: #fe4; color: #fff; text-shadow: 2px 2px 2px black; }
.purple  { background: #f4f; color: #fff; text-shadow: 2px 2px 2px black; }
.white   { background: #000; color: #fff; text-shadow: 2px 2px 2px black; }
.monster { background: #800; color: #fff; text-shadow: 2px 2px 2px black; }

#modalMask {
    position: fixed;
    display: block;
    top: 0px;
    left: 0px;
    width: 100%;
    height: 100%;
    background: #fff;
    opacity: 0.8;
}

#modalDialog {
    position: fixed;
    display: block;
    background: #ccf;
}

.reroll { background: #66f; }