html{
    background:#000
}
canvas {
  width: 100% !important;
  height: 100% !important;
}
html,body,.text,.display{
    border:0;
    margin:0;
    padding:0;
    color:#fafafa;
    text-align:center;
    vertical-align:middle;
    font-family:press start;
    z-index:84;
    -webkit-font-smoothing:none;
    -webkit-user-select:none
}
body{
    width:100%;
    height:100%;
    overflow:hidden
}
canvas{
    position:absolute;
    left:0
}
.display{
    position:fixed;
    font-size:21px
}
.indisplay{
    margin:7px 14px 0;
    text-align:center;
    z-index:14
}
.indisplay.counter,.indisplay.seed{
    position:fixed;
    padding:3px 7px;
    bottom:0;
    background:rgba(0,0,0,.49)
}
.indisplay.counter{
    right:0
}
.indisplay.seed{
    left:0
}
.text{
    position:absolute;
    z-index:14;
    text-align:left;
    line-height:210%;
    vertical-align:middle
}
.text *{
    margin:0
}
.score{
    width:35px;
    height:14px;
    font-size:21px;
    z-index:14
}
.editor #data_display{
    display:none
}
#sidebar{
    background:#000;
    position:fixed;
    right:-322px;
    width:343px;
    height:100%;
    z-index:96;
    border-left:2px solid #ccc;
    transition:right 280ms
}
#sidebar:hover,#sidebar.expanded{
    right:0
}
#sidebar *{
    font-family:press start;
    line-height:140%;
    color:#ddd
}
#sidebar #sectionselect{
    font-size:1.4em
}
#sidebar h1{
    font-size:1.4em;
    padding-bottom:14px;
    border-bottom:2px solid #999
}
#sidebar .group{
    padding:7px;
    width:100%;
    min-height:70px;
    line-height:175%
}
#sidebar .group select,#sidebar .group input{
    padding-bottom:3px;
    height:21px;
    border:1px solid #333;
    border-radius:3px;
    background-color:#000
}
#sidebar #options{
    font-size:17px
}
#sidebar .options.big{
    padding-top:3px;
    height:28px;
    text-align:center;
    font-size:21px
}
#sidebar #options h3.title{
    margin-top:-21px;
    padding-right:105px;
    border-bottom:1px solid #777;
    text-align:right;
    font-size:19px
}
#sidebar #options input,#sidebar #options select{
    margin-top:-14px;
    padding:3px;
    max-width:175px;
    min-height:24px;
    background:#000;
    border:1px solid #333;
    text-align:left
}
#sidebar #options .auto{
    padding:3px 7px;
    text-align:left
}
#sidebar #options input[type=Number]{
    max-width:63px
}
#sidebar #options .optspan{
    margin-right:3px;
    font-size:14px;
    color:#aaa
}
#sidebar #options .optspan+input{
    margin-top:-3px
}
#options tr td:first-of-type{
    text-align:right
}
#options tr td:last-of-type{
    text-align:left
}
#controls{
    position:absolute;
    bottom:0;
    right:3px;
    transition:70ms opacity
}
.control{
    float:right;
    width:64px;
    height:64px;
    border:2px solid #aaa;
    cursor:pointer;
    transition:49ms opacity;
    opacity:.7
}
.control:hover,.control.enabled{
    opacity:1
}
.controltext{
    padding-top:21px;
    font-size:11px;
    opacity:.49
}
#bottombar{
    position:absolute;
    bottom:68px;
    background:#111;
    transition:all 280ms,visibility 0;
    opacity:.7
}
#bottombar:hover{
    opacity:1
}
#bottombar .holder{
    float:left;
    width:64px;
    height:64px;
    border:2px solid #fff;
    cursor:pointer;
    overflow:hidden
}
#bottombar canvas{
    position:static;
    max-height:100%
}
#maplines{
    position:fixed;
    height:100%;
    width:100%;
    opacity:.49;
    border-left:2px dashed #ddd;
    cursor:crosshair
}
.mapline{
    position:fixed;
    padding:1px;
    width:100%;
    border-top:2px dashed #eee;
    text-align:left;
    cursor:crosshair
}
#erasing canvas,.erasing #maplines,.erasing .mapline,.erasing #follower{
    cursor:url(Theme/EraserTip.gif),pointer
}
#follower{
    cursor:crosshair
}
.scroller{
    position:fixed;
    width:64px;
    height:128px;
    opacity:.21;
    z-index:7;
    cursor:none;
    background:url(Theme/Hand.gif) center center no-repeat
}
.scroller:hover{
    opacity:.84
}
.scroller.off{
    display:none;
    visibility:hidden;
    z-index:-35
}
.flipped{
    -moz-transform:scaleX(-1);
    -o-transform:scaleX(-1);
    -webkit-transform:scaleX(-1);
    transform:scaleX(-1);
    filter:FlipH;
    -ms-filter:"FlipH"
}
#input_window{
    position:fixed;
    height:100%;
    padding-top:42px;
    background:rgba(7,21,0,.84);
    box-shadow:0 0 210px rgba(0,0,1,.7) inset;
    z-index:98
}
#input_window textarea{
    margin-top:35px;
    padding:7px 21px 14px 28px;
    width:100%;
    height:50%;
    background-color:rgba(14,14,14,.77);
    background-image:url(data:image/gif;
    base64,R0lGODlhAQABAIAAAGZmZv///yH5BAEAAAEALAAAAAABAAEAAAICRAEAOw==);
    background-repeat:repeat-y;
    background-position:21px;
    border-width:1px 0;
    color:#fff;
    vertical-align:top;
    font-family:courier new,courier,monospace
}
#input_window textarea:focus{
    outline:0;
    border-color:gold
}
#input_window .window_button{
    float:right;
    margin:0 21px 0 0;
    padding:11px;
    padding-bottom:7px;
    border:3px solid rgba(175,175,175,.7);
    border-top:0;
    border-bottom-right-radius:7px;
    border-bottom-left-radius:7px;
    cursor:pointer
}
#window_submit{
    margin-right:4%;
    background:rgba(14,70,14,.84);
    font-size:21px
}
#window_cancel{
    margin-right:14px;
    background:rgba(70,14,14,.84)
}
