html{
height:100%;
margin:0;
}
body{
height:100%;
margin:0;
}
.keys{
width:100%;
height:100%;
display:-webkit-box;
display:   -moz-box;
display:    -ms-box;
display:     -o-box;
display:        box;
-webkit-box-orient:vertical;
   -moz-box-orient:vertical;
    -ms-box-orient:vertical;
     -o-box-orient:vertical;
        box-orient:vertical;
}
.rows{
display:-webkit-box;
display:   -moz-box;
display:    -ms-box;
display:     -o-box;
display:        box;
-webkit-box-orient:horizontal;
   -moz-box-orient:horizontal;
    -ms-box-orient:horizontal;
     -o-box-orient:horizontal;
        box-orient:horizontal;
-webkit-box-flex:1;
   -moz-box-flex:1;
    -ms-box-flex:1;
     -o-box-flex:1;
        box-flex:1;
}
.cols{
text-align:center;
vertical-align:middle;
border:3px outset #333333;
margin:5pt;
-webkit-box-flex:1;
   -moz-box-flex:1;
    -ms-box-flex:1;
     -o-box-flex:1;
        box-flex:1;
-webkit-box-sizing:border-box;
   -moz-box-sizing:border-box;
    -ms-box-sizing:border-box;
     -o-box-sizing:border-box;
        box-sizing:border-box;
/*font-family:monospace;*/
width:100px;
}