html { height:100%; width:100%; margin: 0; padding:0;}
body { height:100%; width:100%; margin: 0; padding:0; background:#ffffff; color:#000000;}

a:link {text-decoration: none; color: #EEEEEE}
a:visited{text-decoration: none; color: #EEEEEE}
a:hover {text-decoration: underline; color: #FFFFFF}


BODY, TD, TR, P, UL, OL, LI, INPUT, SELECT, DL, DD, DT, FONT
{ font-family: 微軟正黑體, Verdana,  Arial, Clean, Helvetica, sans-serif, Monotype Corsiva; font-size: 12px;overflow:hidden;}

.logoclass {position:absolute;z-index:1001;padding:8px;border:1px #888 solid;top:10px;left:10px;background:#fff;-webkit-user-select:none;pointer-events:none;}
.logosvg   {float:left;height:21px;}
.logostr   {float:left;margin-left:5px;line-height:21px;font-family:'Poiret One',sans-serif;color:#234e94;font-size:22px;font-weight:bold;}
.legendclass{position:absolute;z-index:1001;top:52px;left:10px;max-width:240px;-webkit-user-select:none;pointer-events:none;}
.mapclass {position:absolute;z-index:100;top:0px;float:top;width:100%;height:100%;background:#4d4d4d;overflow:hidden;-webkit-transition: 1s ease-in-out;;-webkit-user-select:none;}
.menuclass {position:absolute;z-index:2000;top:0px;right:-203px;padding:0px;width:240px;height:100%;color:#fff;font-size:14px;background:rgba(66,66,66,0);border-radius:4px;box-Shadow:0px 0px 0px 0px rgba(0,0,0,0);overflow:hidden;-webkit-transition: all 0.5s;pointer-events:none;}

.timectrlclass{position:absolute;z-index:1001;bottom:-42px;left:0;width:100%;height:42px;background:rgba(30,30,30,0.8);box-Shadow:0px -1px 5px 0px rgba(30,30,30,0.5);-webkit-transition: 1s ease-in-out;-webkit-user-select:none;}
.timectrltop_mo{float:top;width:100%;height:1px;background:#111;overflow:visible;}
.timectrltopstd_mo{position:relative;z-index:1002;float:left;top:-3px;left:81px;width:1px;height:45px;background:#fff;display:block;-webkit-user-select:none;pointer-events:none;}
.timectrltopstr_mo{position:relative;float:left;z-index:1002;top:-33px;left:6px;width:110px;height:30px;line-height:30px;font-size:14px;text-align:center;color:#fff;background:rgba(30,30,30,0.8);border:1px #111 solid;border-radius:30px;border-bottom-left-radius:0px;border-top-right-radius:0px;box-Shadow:0px -1px 5px 0px rgba(30,30,30,0.5);opacity:1;-webkit-transition: all 0.5s ease 0s;pointer-events:none;-webkit-user-select:none;}
.timectrltopfobk{position:relative;float:left;z-index:1002;top:-33px;left:6px;margin-right:5px;width:30px;height:30px;line-height:30px;font-size:14px;text-align:center;color:#fff;background:rgba(30,30,30,0.8);border:1px #111 solid;border-radius:30px;opacity:1;-webkit-transition: all 0.5s ease 0s;cursor:pointer;-webkit-user-select:none;pointer-events:auto;}
.timectrltopzoom{position:relative;float:right;z-index:1002;top:-33px;right:6px;margin-left:5px;width:30px;height:30px;line-height:30px;font-size:14px;text-align:center;color:#fff;background:rgba(30,30,30,0.8);border:1px #111 solid;border-radius:30px;opacity:1;-webkit-transition: all 0.5s ease 0s;cursor:pointer;-webkit-user-select:none;pointer-events:auto;}

.timectrlbtn_mo{position:relative;z-index:1001;top:-44px;float:top;width:100%;height:calc(100% - 1px);overflow:hidden;pointer-events:auto;}
.timectrlbtnblk_mo{position:relative;z-index:1001;left:0px;width:1400px;height:100%;line-height:14px;font-size:14px;color:#fff;pointer-events:none;}

.menurightcls{float:top;width:100%;height:calc(100% - 35px);line-height:30px;font-size:13px;text-align:left;display:inline-block;overflow-x:hidden;overflow-y:scroll;-webkit-transition: all 0.5s;-webkit-user-select:none;}
.menurightcls::-webkit-scrollbar { width:10px;background:#424242;border-radius:0px;}
.menurightcls::-webkit-scrollbar-track { width:10px;background: #4d4d4d;border-radius:10px; }
.menurightcls::-webkit-scrollbar-thumb { width:10px;background: #888;border-radius:10px; }

.menuitemhead{float:top;padding-left:10px;padding-right:10px;min-width:50px;height:20px;line-height:20px;border-top:1px solid #353535;border-right:1px solid #353535;text-align:center;background:#4d4d4d;display:inline-block;}

div.tooltip_track {
    float:top;
    position:absolute;
    text-align:center;
    width:180px;
    line-height:20px;
    min-height:20px;
    max-height:50px;
    padding-top:3px;
    font:18px 'Microsoft JhengHei',sans-serif;
    font-weight:bold;
    background:rgba(0,0,0,0.3);
    color:#000000;
    border:0px;
    border-radius:5px;
    pointer-events:none;
    z-index:1000;
}

@media screen and (min-height: 640px)  {
   .timectrlclass{bottom:-50px;height:50px;}
   .timectrltopstd_mo{height:53px;}
   .timectrlbtn_mo{top:-52px;}
   .timectrlbtnblk_mo{line-height:17px;font-size:15px;}
}