:root {
    --scale: 1.22;
}

div #fwkeyboard {
    margin-top: calc(10px * var(--scale));
    position: unset;
    z-index: unset;
    left: unset;
}

ul.fwkeyboard-ul {
    background: unset!important;
    box-shadow: unset!important;
}

div.mlkeyboard {
    font-family: Tahoma, Arial, sans-serif;
    position: fixed;
    z-index: 999;
    left: calc(50% - (335px *  var(--scale)));
}

div.mlkeyboard-bottom {
    bottom: 2%;
}

div.mlkeyboard-top {
    top: 2%;
}

div.mlkeyboard ul, div.mlkeyboard li {
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}

div.mlkeyboard ul {
    background: #ccc;
    list-style: none;
    font-size: calc(16px * var(--scale));
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    box-shadow: 0 0 calc(4px * var(--scale)) #808080;
}

@media screen and (min-width: 700px) {
    div.mlkeyboard ul {
        width: calc(670px * var(--scale));
        height: calc(230px * var(--scale));
        margin: 0 auto;
        padding: calc(4px * var(--scale));
        border-radius: calc(5px * var(--scale));
    }
}

div.mlkeyboard ul li {
    float: left;
    margin: 0 0 0.5% 0.5%;
    width: 6%;
    text-align: center;
    background: #fff;
    border: calc(1px * var(--scale)) solid #aaaaaa;
    -moz-border-radius: calc(5px * var(--scale));
    -webkit-border-radius: calc(5px * var(--scale));
    cursor: pointer;
}
/*div.mlkeyboard ul li:hover {
    background-color: #FFD488;
    border-color: #FFAE6E;
}*/

@media screen and (min-width: 700px) {
    div.mlkeyboard ul li {
        width: calc(40px * var(--scale));
        height: calc(40px * var(--scale));
        line-height: calc(40px * var(--scale));
        margin: calc(2px * var(--scale));
    }
}



div.mlkeyboard ul li.a {
    background-color: #E6FFD8;
    border-color: #6FDA54;
}

div.mlkeyboard ul li.i {
    background-color: #dddddd;
    border-color: #aaaaaa;
    cursor: default;
}
div.mlkeyboard ul li.i:hover {
    background-color: #dddddd;
    border-color: #aaaaaa;
}

div.mlkeyboard ul .mlkeyboard-capslock, div.mlkeyboard ul .mlkeyboard-tab, div.mlkeyboard ul .mlkeyboard-lshift {
    clear: left;
}

@media screen and (min-width: 700px) {
    div.mlkeyboard ul .mlkeyboard-backspace {
        width: calc(66px * var(--scale));
        font-size: calc(22px * var(--scale));
    }
}

div.mlkeyboard ul .mlkeyboard-tab {
    width: 9%;
}

@media screen and (min-width: 700px) {
    div.mlkeyboard ul .mlkeyboard-tab {
        width: calc(65px * var(--scale));
    }
}

div.mlkeyboard ul .mlkeyboard-capslock {
    width: 12%;
}

@media screen and (min-width: 700px) {
    div.mlkeyboard ul .mlkeyboard-capslock {
        width: calc(75px * var(--scale));
    }
}

div.mlkeyboard ul .mlkeyboard-return {
    width: 8%;
}

@media screen and (min-width: 700px) {
    div.mlkeyboard ul .mlkeyboard-return {
        width: calc(76px * var(--scale));
        font-size: calc(22px * var(--scale));
    }
}

div.mlkeyboard ul .mlkeyboard-updown {
    font-size: calc(20px * var(--scale));
}

div.mlkeyboard ul .mlkeyboard-lshift {
    width: 16%;
}

@media screen and (min-width: 700px) {
    div.mlkeyboard ul .mlkeyboard-lshift {
        width: calc(111px * var(--scale));
    }
}

div.mlkeyboard ul .mlkeyboard-space {
    clear: left;
    width: 98%;
}

@media screen and (min-width: 700px) {
    div.mlkeyboard ul .mlkeyboard-space {
        width: calc(663px * var(--scale));
    }
    .fwkeyboard-keyboard {
        width: calc(86px * var(--scale)) !important;
    }
}

.fwnumpad-div {
    display: grid;
    grid-template-columns: auto auto auto auto;
    text-align: center;
    font-size: calc(20px * var(--scale))
}

.mlnumpad-return {
    grid-row: 2/4;
    grid-column: 4;
    align-self: center;
    height: calc(103.5px * var(--scale)) !important;
    line-height: calc(103.5px * var(--scale)) !important;
}

.fwnumpad-div > btn {
    height: calc(50.5px * var(--scale));
    line-height: calc(50.5px * var(--scale));
    margin: calc(2.5px * var(--scale));
    margin: 0 0 0.625% 0.625%;
    text-align: center;
    background: #fff;
    border: calc(1.25px * var(--scale)) solid #aaaaaa;
    -moz-border-radius: calc(5px * var(--scale));
    -webkit-border-radius: calc(5px * var(--scale));
    cursor: pointer;
}