*{box-sizing:border-box}html,body{margin:0;width:100%;height:100%;overflow:hidden;background:#032e49;color:white;font-family:Arial,sans-serif}#scene{width:100%;height:100%;display:block}#title{position:absolute;left:3%;top:3%;font-size:26px;text-shadow:0 2px 6px #000}#status{position:absolute;top:9%;left:3%;font-size:24px;background:rgba(0,20,40,.75);padding:10px;border-radius:10px;display:none}#bar{position:absolute;bottom:3%;left:2%;right:2%;text-align:center;background:rgba(0,20,40,.45);padding:12px;border-radius:18px;transition:opacity .3s}#bar.hidden{opacity:0;pointer-events:none}button{background:rgba(0,52,78,.8);border:2px solid rgba(255,255,255,.35);border-radius:10px;color:white;padding:14px 16px;margin:4px;font-size:21px;cursor:pointer}button:focus,input:focus,.selected{outline:none;border-color:#ffe789;background:#12688a;box-shadow:0 0 0 3px #ffe789}#login{position:absolute;top:5%;left:15%;width:70%;max-height:90%;overflow:auto;padding:25px;background:rgba(0,28,49,.96);border:2px solid #72cae4;border-radius:20px;text-align:center}#login h1{margin:0 0 10px}#login p{font-size:20px}label{display:inline-block;text-align:left;font-size:22px;margin:8px}input{display:block;background:#fff;color:#152733;padding:12px;border:3px solid transparent;border-radius:8px;font-size:25px;width:300px}#keyboard{width:740px;max-width:100%;margin:10px auto}#keyboard button{width:68px;padding:8px;margin:3px}#loginStatus{color:#ffe789;min-height:24px}small{font-size:18px}

#showControls{position:absolute;right:2%;top:2%;padding:10px 16px;font-size:20px;background:rgba(0,28,49,.45);z-index:2}

#bar button{font-size:18px;padding:12px 10px;margin:3px}

#scene{position:absolute;left:0;top:0;width:100%;height:100%;background:#064b70 url(background/underwater.jpg) center center no-repeat;background-size:cover}#scene canvas{width:100%;height:100%;display:block}#reef{position:absolute;left:0;bottom:0;width:100%;height:28%;pointer-events:none}#fatal{display:none;position:absolute;left:10%;top:40%;width:80%;padding:30px;background:#042b42;border:3px solid #ffe789;z-index:10;font-size:28px;text-align:center}#fatal a{color:#ffe789}#status{max-width:90%;z-index:5}#bar{z-index:3}#login{z-index:4}
#bar{transition:none;background:#063044}#bar.hidden{opacity:1;visibility:hidden}button{background:#08435b;box-shadow:none}button:focus,input:focus,.selected{box-shadow:none;border-color:#ffe789;background:#12688a}
#bar{bottom:2%;left:2%;right:2%;padding:12px}#bar button{font-size:27px;min-width:150px;min-height:68px;padding:15px 20px;margin:5px;border-width:4px;border-radius:8px}#bar button.selected{border-color:#ffe789;background:#12688a;box-shadow:none}#login button{font-size:27px;padding:15px 22px}#login input{font-size:29px}#showControls{font-size:25px;padding:14px 20px}

#bar,#showControls,#status{display:none!important}

#reef{display:none!important}

#login{display:none!important}