/*+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
style.css
*/
@charset 'UTF-8';
html {
  color: #000;
  background: #f3f3f3;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}
article,
aside,
blockquote,
body,
button,
code,
dd,
details,
div,
dl,
dt,
fieldset,
figcaption,
figure,
footer,
form,
h1,
h2,
h3,
h4,
h5,
h6,
header,
hgroup,
hr,
input,
legend,
li,
menu,
nav,
ol,
p,
pre,
section,
td,
textarea,
th,
ul {
  margin: 0;
  padding: 0;
}
input,
select,
textarea {
  font-size: 100%;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
fieldset,
img {
  border: 0;
}
abbr,
acronym {
  border: 0;
  font-variant: normal;
}
del {
  text-decoration: line-through;
}
address,
caption,
cite,
code,
dfn,
em,
th,
var {
  font-style: normal;
  font-weight: 500;
}
ol,
ul {
  list-style: none;
}
caption,
th {
  text-align: left;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 100%;
  font-weight: 500;
}
q:after,
q:before {
  content: '';
}
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}
sup {
  top: -0.5em;
}
sub {
  bottom: -0.25em;
}
a,
ins {
  text-decoration: none;
}
html {
  -webkit-tap-highlight-color: transparent;
}
body,
html {
  font-family: sans-serif;
}
ul,
li {
  list-style-type: none;
}
img {
  display: block;
}

    @keyframes 'slideIn'{
        from {bottom: -250px;}
        to {bottom: 0px;}
    }
    
    @-webkit-keyframes 'slideIn'{
        from {bottom: -250px;}
        to {bottom: 0px;}
    }
    
    @keyframes 'slideOut'{
       from {bottom: 0px;}
       to {bottom: -250px;}
    }
    
    @-webkit-keyframes 'slideOut'{
       from {bottom: 0px;}
       to {bottom: -250px;}
    }
    
    .bar{
        width:100%;
        height: 0;
        /*margin:.5%;
        margin-top: 1%;
        margin-bottom: 0;
        height: 4%;
        line-height: 1.5em;*/
        float:left;
        text-align:center;
        font-size: 1em;
        font-style:italic;
        color:#fff;
        background-color: #cbcbcb;
        display:block;
    }
    .row1{
        width: 100%;
        height: 25%;
        float: left;
    }
    
    .row2{
        width: 100%;
        margin:0px 5%;
        height: 25%;
        float: left;
    }
    
    .row3{
        width: 100%;
        height: 25%;
        float: left;
    }
    
    .row4{
        width: 100%;
        height: 24%;
        float: left;
    }
    .row5{
        width: 100%;
        height: 25%;
        float: left;
    }
    
    .row1pwd{
        width:10%;
        margin:0;
        height: 100%;
        line-height: 1.6em;
        float: left;
        text-align:center;
        font-size: 1.5em;
        color:#202020;
        background-color: transparent;
    }
    
    .row2pwd{
        width:10%;
        margin:0%;
        height: 100%;
        line-height: 1.6em;
        float: left;
        text-align:center;
        font-size: 1.5em;
        color:#202020;
        background-color: transparent;
    }
    
    .row3pwda{
        width:15%;
        margin:0;
        height: 100%;
        line-height: 1.6em;
        float: left;
        text-align:center;
        font-size: 1.5em;
        color:#202020;
        background-color: transparent;
    }
    
    .row3pwdb{
        width:10%;
        margin:0;
        height: 100%;
        line-height: 1.6em;
        float: left;
        text-align:center;
        font-size: 1.5em;
        color:#202020;
        background-color: transparent;
    }
    
    .row3pwdc{
        width:15%;
        margin:0;
        height: 100%;
        line-height: 2.1em;
        float: left;
        text-align:center;
        font-size: 1.2em;
        color:#202020;
        background-color: transparent;
    }
    
    .row3pwdd{
        width:14%;
        margin:0;
        height: 100%;
        line-height: 1.6em;
        float: left;
        text-align:center;
        font-size: 1.5em;
        color:#202020;
        background-color: transparent;
    }
    
    .row4pwda{
        width:25%;
        margin:0;
        height: 100%;
        line-height: 2.1em;
        float: left;
        text-align:center;
        font-size: 1.3em;
        color:#202020;
        background-color: transparent;
    }
    
    .row4pwdb{
        width:50%;
        margin:0;
        height: 100%;
        line-height: 1.6em;
        float: left;
        text-align:center;
        font-size: 1.5em;
        color:#202020;
        background-color: transparent;
    }
    .rowalone .fd{
    	line-height: 80px; !important
    }
    .rowlonely .fd{
    	line-height: 20px; !important
    }
    .pwd{
        width:33.3%;
        margin:0;
        height: 100%;
        line-height: 1.6em;
        float: left;
        text-align:center;
        font-size: 1.5em;
        color:#202020;
        background-color: transparent;
    }
    
    .pwdtap{
        width:33.3%;
        margin:0;
        height: 100%;
        line-height: 1.6em;
        float:left;
        text-align:center;
        border: 1px solid #090909; 
        border-radius:3px;
        -webkit-border-radius:3px;
        -moz-border-radius:3px;
        color:#202020;
        webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        font-size: 1.5em;
        -webkit-box-shadow: 3px 3px 5px #cc9999;
        -moz-box-shadow: 3px 3px 5px #cc9999;
        background-color: gray;
    }
    
    .pwdkeyboard {
    	font-size: 16px;
        position: fixed;
        width: 100%;
        z-index: 1001;
        background: #cbcbcb;
        bottom: 0;
        user-select: none;
        -moz-user-select: none;
        -webkit-user-select: none;
        -ms-user-select: none;
        -webkit-touch-callout:none;
        display: none;
        float: left;
        margin-top: 0;
        height: 213px;
        -webkit-animation-name: 'slideIn';
        -webkit-animation-duration: 0.3s;

    }
    
    .pwdkeyboardout {
        position: fixed;
        width: 100%;
        z-index: 1001;
        background: #cbcbcb;
        bottom: 0;
        user-select: none;
        -moz-user-select: none;
        -webkit-user-select: none;
        -ms-user-select: none;
        display: none;
        float: left;
        margin-top: 0;
        height: 213px;
        -webkit-animation-name: 'slideOut';
        -webkit-animation-duration: 0.3s;
    }
    .pwdkeyboardout2 {
   		position: fixed;
        width: 100%;
        z-index: 1001;
        background: #cbcbcb;
        bottom: -300px;
        user-select: none;
        -moz-user-select: none;
        -webkit-user-select: none;
        -ms-user-select: none;
        display: none;
        float: left;
        margin-top: 0;
        height: 213px;
    }
/*++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
keyboard.css
*/
.low{text-transform:lowercase;}
.upp{text-transform:uppercase;}

.showKb{
	visibility: visible;
}
audio{
	width: 0;
	height: 0;
	margin: 0;
	padding: 0;
}
html{
	width: 100%;
	height: auto;
}
body{
	width: 100%;
	height: auto;
}