body{background: #111;color:#eee;font-family: monospace;margin:0;padding:0;}

#wrapper {padding: 40px;display: flex;position:relative}
#instructions {position: absolute;top:70px;left:70px;right:70px;padding:40px;background-color:#000;border:1px solid #999;font-size:17px;max-width:932px;}
#instructions.hidden {display:none;}
h1,h4 {font-weight: 600;}
.msg1 {font-size:1.4em;color:#b10}
.msg2 {font-size:1.4em;color:#2c5}
.start-btn {margin:20px 0;padding:20px;border: 1px solid #fff;display:inline-block;cursor:pointer;}
.start-btn:hover {color:#6ad}
.acknow {font-size:0.7em;color:#ccc}
a {color:#fff;}

#grid {}
#right {border: 1px solid #778;width:300px;margin:0 0 0 40px;position:relative;}

#restart {position:absolute;border:1px solid #c31950;padding:15px;bottom: 8px;left:8px;right:8px;text-align: center;color:#bbb;cursor:pointer;}
#restart:hover {border-color: #d00;color:#fff;}

table {border-collapse: collapse;}
td{height:40px;width:40px;border:1px solid #778;text-align:center;font-size: 20px}
td.cell.w0 {background:#111;cursor:pointer;color:#bbb}
td.cell.firing {color:#ccc;}
td.cell.w0:hover {background:334;}

.ent {padding-top: 0px;}
.x1y0  {animation: 1s linear 0s 1 moveRight}
.x-1y0  {animation: 1s linear 0s 1 moveLeft}
.x0y-1 {animation: 1s linear 0s 1 moveUp}
.x0y1  {animation: 1s linear 0s 1 moveDown}

@keyframes moveRight {0% {transform: translateX(0);}100% {transform: translateX(41px);}}
@keyframes moveLeft  {0% {transform: translateX(0);}100% {transform: translateX(-41px);}}
@keyframes moveUp    {0% {transform: translateY(0);}100% {transform: translateY(-41px);}}
@keyframes moveDown  {0% {transform: translateY(0);}100% {transform: translateY(41px);}}

.readout > div {color:#ccc;padding:8px;}
.readout span {color:#eee;}
.piece-selector {border-top:1px solid #778;margin-top: 10px;padding:10px 1px;color:#ccc}
.piece-selector > div {display:flex;cursor: pointer;}
.piece-selector > div:hover {color:#eee;}
.piece-selector > div > div {padding:8px;}
.piece-selector .piece-selected {color:#6ad !important;}
.selling {border-top:1px solid #778;margin-top: 10px;padding:15px 8px;color:#ccc}
.sell-btn {text-align:center;padding: 50px;border:1px solid #f60;margin-top: 10px}
.sell-btn:hover {color:#d00;}
#highscore_wrapper {text-align:center;position: absolute;bottom:100px;left:0;right:0}
#highscore {font-size:30px;color:#eee;}