body,html{margin:0;padding:0}html{display:flex;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;background-color:#f1f1f1;font-family:Arial,Helvetica,sans-serif}body *,html *{-moz-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none;user-select:none}#wrapper{display:flex;flex-direction:column;align-items:center;background-color:#fff;text-align:center;max-width:360px;margin:5px;border:1px solid #dedede}#wrapper #errors,#wrapper #title{width:100%;height:40px;min-height:40px;display:flex;flex-direction:column;justify-content:center;align-items:center}#wrapper #title{background-color:#fdba30}#wrapper #errors{color:#fff;background-color:red}#wrapper #display{background-color:#f4f4f4;height:80px;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:center;font-size:30px;color:#000;width:100%}#wrapper #keyboard{background-color:#fff;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:center;padding:10px 0}#wrapper #keyboard div{background-color:#fdba30;margin:2px;height:80px;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:center;color:#000;font-size:30px;text-transform:uppercase}#wrapper #keyboard .backspace,#wrapper #keyboard .enter,#wrapper #keyboard .number{min-width:90px;max-width:105px}#wrapper #keyboard .enter{font-size:20px}#wrapper #not_supported{display:none}@media screen and (min-width:350px){#wrapper #keyboard .backspace,#wrapper #keyboard .enter,#wrapper #keyboard .number{flex-grow:1}}@media screen and (max-height:429px){#wrapper #display,#wrapper #keyboard .backspace,#wrapper #keyboard .enter,#wrapper #keyboard .number{height:50px;font-size:20px}}@media screen and (min-height:430px) and (max-height:539px){#wrapper #display,#wrapper #keyboard .backspace,#wrapper #keyboard .enter,#wrapper #keyboard .number{height:60px;font-size:20px}}@media screen and (min-width:299px) and (max-width:360px) and (min-height:379px) and (max-height:592px){html{justify-content:flex-start}body,html{height:100%}#wrapper{width:100%;border:0;margin:0;height:100%}#wrapper #display{flex-grow:1}}@media screen and (max-width:299px){html{justify-content:center}#wrapper{background-color:transparent;border:0 solid transparent}#wrapper #display,#wrapper #errors,#wrapper #keyboard,#wrapper #title{display:none}#wrapper #not_supported{display:block}}@media screen and (max-height:379px){html{justify-content:center}#wrapper{background-color:transparent;border:0 solid transparent}#wrapper #display,#wrapper #errors,#wrapper #keyboard,#wrapper #title{display:none}#wrapper #not_supported{display:block}}