body,html{font-family:Verdana,Arial,Georgia;height:100%;margin:0;overflow:hidden;padding:0;user-select:none}*,:after,:before{box-sizing:border-box}P{line-height:1.6}.tools{display:flex;font-size:20px;left:20px;position:absolute;top:30px}.button{background-color:#fff;border-radius:5px;box-shadow:1px 1px 7px rgba(0,0,0,.3);color:#000;cursor:pointer;margin-right:20px;padding:10px 10px 5px;text-decoration:none}.popup-shadow{background-color:#000;bottom:0;opacity:0;top:0}.popup-body,.popup-shadow{left:0;position:fixed;right:0}.popup-body{background-color:#fff;border-radius:5px;box-shadow:1px 1px 7px rgba(0,0,0,.3);color:#000;margin:auto;padding:0 20px 10px;top:150px;width:600px}.menu{display:flex;flex-wrap:wrap;list-style-type:none;margin:15px 0 0;padding:0}.menu-item{background-color:#fff;border:0;border-radius:5px;color:#000;cursor:pointer;margin:0 10px 10px 0;padding:5px 7px}.menu-item-active,.menu-item:hover{background-color:#f1f1f1}.menu-item-active{color:#f44336}UL{background-color:#fff;box-shadow:1px 1px 7px rgba(0,0,0,.3);color:#000;cursor:pointer;left:20px;list-style-type:none;margin:0;padding:5px;position:fixed;top:100px}UL,UL LI{border-radius:5px}UL LI{margin:5px;padding:10px}UL LI:hover{background-color:#eee}