#rules              { text-align:center !important; }
#rules table        { border:solid 1px #ddf; border-collapse:collapse; margin:auto; }
#rules td           { border:none; border-bottom:solid 1px #ddf; padding:4px; text-align:left; }
#rules table table  { border:none; }
#rules td td        { border:none; }
#rules .output      { border:none; margin:auto; }
#rules .output td   { border:none; font-weight:bold; padding:4px 8px; }
#rules .best        { background-color:#9f9; }
#rules select       { font-family:inherit; }

#calc               { background-image:url(table.png); background-repeat:no-repeat; height:400px; margin:auto; overflow:hidden; position:relative; width:600px; }
#calc .card         { background-image:url(deck.png); background-repeat:no-repeat; cursor:pointer; font-size:1px; height:94px; position:absolute; width:67px; }

#calc .rank2        { background-position:0 0; }
#calc .rank3        { background-position:0 -94px; }
#calc .rank4        { background-position:0 -188px; }
#calc .rank5        { background-position:0 -282px; }
#calc .rank6        { background-position:0 -376px; }
#calc .rank7        { background-position:0 -470px; }
#calc .rank8        { background-position:0 -564px; }
#calc .rank9        { background-position:0 -658px; }
#calc .rankT        { background-position:0 -752px; }
#calc .rankJ        { background-position:0 -846px; }
#calc .rankQ        { background-position:0 -940px; }
#calc .rankK        { background-position:0 -1034px; }
#calc .rankA        { background-position:0 -1128px; }
#calc .back         { background-position:0 -1222px; cursor:default !important; }

#calc .dealer2      { cursor:pointer; font-size:1px; height:48px; left: 78px; position:absolute; top: 8px; width:36px; }
#calc .dealer3      { cursor:pointer; font-size:1px; height:48px; left:118px; position:absolute; top: 8px; width:36px; }
#calc .dealer4      { cursor:pointer; font-size:1px; height:48px; left:158px; position:absolute; top: 8px; width:36px; }
#calc .dealer5      { cursor:pointer; font-size:1px; height:48px; left:198px; position:absolute; top: 8px; width:36px; }
#calc .dealer6      { cursor:pointer; font-size:1px; height:48px; left:238px; position:absolute; top: 8px; width:36px; }
#calc .dealer7      { cursor:pointer; font-size:1px; height:48px; left:278px; position:absolute; top: 8px; width:36px; }
#calc .dealer8      { cursor:pointer; font-size:1px; height:48px; left:318px; position:absolute; top: 8px; width:36px; }
#calc .dealer9      { cursor:pointer; font-size:1px; height:48px; left:358px; position:absolute; top: 8px; width:36px; }
#calc .dealerT      { cursor:pointer; font-size:1px; height:48px; left:398px; position:absolute; top: 8px; width:36px; }
#calc .dealerJ      { cursor:pointer; font-size:1px; height:48px; left:438px; position:absolute; top: 8px; width:36px; }
#calc .dealerQ      { cursor:pointer; font-size:1px; height:48px; left:478px; position:absolute; top: 8px; width:36px; }
#calc .dealerK      { cursor:pointer; font-size:1px; height:48px; left:518px; position:absolute; top: 8px; width:36px; }
#calc .dealerA      { cursor:pointer; font-size:1px; height:48px; left:558px; position:absolute; top: 8px; width:36px; }

#calc .player2      { cursor:pointer; font-size:1px; height:48px; left: 78px; position:absolute; top:71px; width:36px; }
#calc .player3      { cursor:pointer; font-size:1px; height:48px; left:118px; position:absolute; top:71px; width:36px; }
#calc .player4      { cursor:pointer; font-size:1px; height:48px; left:158px; position:absolute; top:71px; width:36px; }
#calc .player5      { cursor:pointer; font-size:1px; height:48px; left:198px; position:absolute; top:71px; width:36px; }
#calc .player6      { cursor:pointer; font-size:1px; height:48px; left:238px; position:absolute; top:71px; width:36px; }
#calc .player7      { cursor:pointer; font-size:1px; height:48px; left:278px; position:absolute; top:71px; width:36px; }
#calc .player8      { cursor:pointer; font-size:1px; height:48px; left:318px; position:absolute; top:71px; width:36px; }
#calc .player9      { cursor:pointer; font-size:1px; height:48px; left:358px; position:absolute; top:71px; width:36px; }
#calc .playerT      { cursor:pointer; font-size:1px; height:48px; left:398px; position:absolute; top:71px; width:36px; }
#calc .playerJ      { cursor:pointer; font-size:1px; height:48px; left:438px; position:absolute; top:71px; width:36px; }
#calc .playerQ      { cursor:pointer; font-size:1px; height:48px; left:478px; position:absolute; top:71px; width:36px; }
#calc .playerK      { cursor:pointer; font-size:1px; height:48px; left:518px; position:absolute; top:71px; width:36px; }
#calc .playerA      { cursor:pointer; font-size:1px; height:48px; left:558px; position:absolute; top:71px; width:36px; }

#dealercard1        { left:230px; top:130px; }
#dealercard2        { left:300px; top:130px; }

#busy               { background-color:#ff0; border:solid 1px #000; border-radius:6px; box-shadow:2px 2px 6px #000; color:#000; display:none; font-family:sans-serif; font-size:11pt; font-weight:bold; left:19px; padding:2px 6px; position:absolute; top:164px; }

#playerhand         { font-size:1px; left:230px; position:absolute; top:300px; }
#playerdesc         { color:#fff; font-family:sans-serif; font-size:12pt; font-weight:bold; left:0; position:absolute; text-align:right; top:375px; width:225px; }

#btn_calc           { background-color:#fff; border:solid 1px #000; border-radius:8px; box-shadow:2px 2px 4px #000; color:#000; cursor:pointer; font-family:sans-serif; font-size:11pt; font-weight:bold; left:52px; padding:4px 8px; position:absolute; text-align:center; top:141px; width:125px; }
#btn_calc:hover     { background-color:#ff0; }
#btn_calc:active    { background-color:#ccf; }

#btn_clear          { background-color:#fff; border:solid 1px #000; border-radius:8px; box-shadow:2px 2px 4px #000; color:#000; cursor:pointer; font-family:sans-serif; font-size:11pt; font-weight:bold; left:52px; padding:4px 8px; position:absolute; text-align:center; top:181px; width:125px; }
#btn_clear:hover    { background-color:#ff0; }
#btn_clear:active   { background-color:#ccf; }

#output             { left:367px; position:absolute; top:197px; width:232px; }
#output table       { background-color:#fff; border:solid 4px #000; border-collapse:collapse; box-shadow:0 0 24px #000; margin:auto; }
#output td          { border:solid 1px #000; color:#000; font-size:10pt; padding:2px 6px; vertical-align:middle; }
#output .l          { text-align:left; }
#output .r          { text-align:right; }
#output .pos        { background-color:#0f9; }
#output .neg        { background-color:#f99; }
#output .zer        { background-color:#ff9; }
#output .best       { background-color:#0f9; font-weight:bold; text-transform:uppercase; }