body {padding:0; margin:0; text-align:center; font-family: 'VT323', monospace;}

#lwj {background-image:url(images/lwj-sprites.png);}
#wwx {background-image:url(images/wwx-sprites.png);}

.sprite,.npc {background-repeat:no-repeat; width:100px; height:100px; position:absolute;}
.object {position:absolute;}
.hitbox {position:absolute; background:#A00; opacity:.6;} /* for debugging */
.movebounds {position:absolute; border:1px solid #00A; opacity:.6;} /* for debugging */

.sprite.front {background-position-y:0px;}
.sprite.left {background-position-y:-100px;}
.sprite.back {background-position-y:-200px;}
.sprite.right {background-position-y:-300px;}

.sprite.move {background-position-x:-100px;}
.sprite.move2 {background-position-x:-200px;}

#controls {position:absolute; left:250px; top:460px; width:300px; height:140px; z-index:9999; font-family:sans-serif;}
#controls div {position:absolute; width:60px; height:60px; line-height:56px; color:#000; font-size:56px; background:rgba(255,255,255,.4); cursor:pointer;}
#controls #back {left:120px;}
#controls #left {left:50px; top:70px;}
#controls #front {left:120px; top:70px;}
#controls #right {left:190px; top:70px;}
#controls #interact {left:190px; background:rgba(204,204,255,.4); }
#controls #inventory {left:50px; background:rgba(204,255,204,.4); }
#controls #inventory img {width:25px; height:25px; float:left; margin:2px;}
#controls div:active {background:rgba(255,255,255,.9);}

#transition {background: linear-gradient(0deg, rgba(12,12,12,1) 0%, rgba(42,42,42,1) 100%);}
#transition {position:absolute; top:0; left:0; width:100%; height:100%; z-index:99999;}

#infodetails {position:absolute; top:0; left:580px; width:180px; height:130px; padding:15px; z-index:99990; display:none;}
#info {position:absolute; top:0; left:760px; width:40px; height:40px; color:#FFF; text-shadow:2px 2px 2px #000; cursor:pointer; z-index:99991;}
#info::before {content:'ⓘ'; font-size:20px; line-height:40px;}

/* mobile adjustments */
@media (max-width:790px) {

  #controls {position:fixed; left:auto; top:auto; right:0; bottom:0;}

}