@import url(http://fonts.googleapis.com/css?family=Play&subset=latin,cyrillic);
@import url(http://fonts.googleapis.com/css?family=Open+Sans&subset=latin,cyrillic);
body{
    font-family: 'Open Sans', sans-serif;
    background-image: url('../img/ricepaper_v3.png');
}
button {
    border: 1px solid #646464;
    background: #b4b4b4;
    background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#b4b4b4));
    background: -webkit-linear-gradient(top, #ffffff, #b4b4b4);
    background: -moz-linear-gradient(top, #ffffff, #b4b4b4);
    background: -ms-linear-gradient(top, #ffffff, #b4b4b4);
    background: -o-linear-gradient(top, #ffffff, #b4b4b4);
    background-image: -ms-linear-gradient(top, #ffffff 0%, #b4b4b4 100%);
    padding: 5px;
    margin: 10px 2px;
    width: 92px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    -webkit-box-shadow: rgba(255,255,255,0.4) 0 0px 0, inset rgba(255,255,255,0.4) 0 1px 0;
    -moz-box-shadow: rgba(255,255,255,0.4) 0 0px 0, inset rgba(255,255,255,0.4) 0 1px 0;
    box-shadow: rgba(255,255,255,0.4) 0 0px 0, inset rgba(255,255,255,0.4) 0 1px 0;
    color: #323232;
    font-size: 20px;
    text-decoration: none;
    vertical-align: middle;
}
button:hover {
    border: 1px solid #323232;
    background: #969696;
    background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#969696));
    background: -webkit-linear-gradient(top, #ffffff, #969696);
    background: -moz-linear-gradient(top, #ffffff, #969696);
    background: -ms-linear-gradient(top, #ffffff, #969696);
    background: -o-linear-gradient(top, #ffffff, #969696);
    background-image: -ms-linear-gradient(top, #ffffff 0%, #969696 100%);
    color: #323232;
}
button:active {
    border: 1px solid #323232;
    background: #ffffff;
    background: -webkit-gradient(linear, left top, left bottom, from(#969796), to(#969696));
    background: -webkit-linear-gradient(top, #969796, #ffffff);
    background: -moz-linear-gradient(top, #969796, #ffffff);
    background: -ms-linear-gradient(top, #969796, #ffffff);
    background: -o-linear-gradient(top, #969796, #ffffff);
    background-image: -ms-linear-gradient(top, #969796 0%, #ffffff 100%);
    color: #323232;
}
a{
    text-decoration: none;
    color: black;
}
#error{color: red}
#keyboard{
    width: 300px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}
#keyboard button{
    width: 34px;
    margin: 1px;
}
.context{
    display: block;
    width: 300px;
    margin-left: auto;
    margin-right: auto;
}
#content input{
    font-size: 32px;
    font-family: 'Play', sans-serif;
    width: 52px;
    text-align: center;
    background-color: rgb(221,221,221);
    border: 1px solid grey;
    margin: 2px;
    padding: 1px;
    border-radius: 4px;
}
#substrate{
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 1000;
    width: 100%;
    height: 100%;
    padding-top: 66px;
    background: rgba(100,100,100,0.5);
}
.column-left{float: left}
.column-right{margin-left: 150px}
.hide{display: none}
.show{display: block}
.select{background-color: yellow !important}
.add{color: red !important}
.block{
    padding-left: 2px;
    padding-right: 2px;
}