
body{background:#eee;margin:0;padding:0;font-family:'Chau Philomene One',sans-serif}
a{color:#c50}
a:hover{color:#e71}
*{-webkit-tap-highlight-color:rgba(0,0,0,0);-moz-user-select:-moz-none;-khtml-user-select:none;-webkit-user-select:none;-o-user-select:none;user-select:none}
#viewporter{margin:0px auto}
#game{background:#fff;position:relative}
#game .chrono{position:absolute;top:0;right:0;padding:5px;color:white;font-size:2em;z-index:15}
#game .front{position:absolute;top:0;left:0;width:100%;height:100%;z-index:10;text-shadow:1px 1px 3px #000}
#game .front.bgtransparent{background:transparent}
#game .front.bgdarker{background:rgba(0,0,0,0.2)}
#game .front *{color:white;font-weight:bold;font-size:2em;text-align:center;position:relative;display:block;top:40%}
#game .title{font-weight:bold;font-size:2.2em}
#game .message.countdown{font-weight:bold;font-size:6em}
#game .message{transform:scale(1);-moz-transform:scale(1);-webkit-transform:scale(1)}
#game .message.change{transition:800ms;-moz-transition:800ms;-webkit-transition:800ms;transform:scale(.7);-moz-transform:scale(.7);-webkit-transform:scale(.7)}
nav{padding:0 10px;font-size:1.4em;text-align:left}
nav a{color:#000;background:#c50;padding:1px 6px;border-radius:8px;text-decoration:none;border:4px solid #000}
nav a:hover{color:#000;border-color:transparent}
.stage{display:block;position:fixed;top:0;left:0;width:100%;height:100%;overflow:hidden;text-align:center;padding:0;margin:0 auto;color:white}
.stage:not(.game){background:url("../images/background.jpg") #261d16}
.stage h1{font-size:3em}
.stage header{width:100%;padding:2% 0;text-align:center}
.stage footer{position:absolute;bottom:5px;text-align:center;margin-top:10px;display:block;width:100%;white-space:nowrap}
.stage ul{list-style:none;padding:4% 0}
.stage li{padding:5px}
.levels{margin:20px auto;width:80%}
.levels .level{width:160px;height:160px;padding:10px;margin:10px;border:5px solid transparent;background:black;border-radius:5px;float:left;display:block;text-align:center;cursor:pointer}
.levels .level:hover{border-color:#c50;box-shadow:0px 6px 20px black}
.levels .level img{display:block;margin-bottom:10px}
.levels .level .title{height:30px;display:block}
.button{padding:0px 10px;border-radius:10px;background:black;border:4px solid #c50;text-decoration:none;font-size:50px;font-weight:bold;opacity:0.8;box-shadow:0px 3px 10px black}
.button:hover{opacity:1;box-shadow:0px 6px 20px black}
#loader h2{padding-top:25%}
#loader .error{padding:0;list-style:none;font-family:monospace;font-size:10px;margin:20px auto;text-align:left;color:#e00}
