/* JMIplay 5.28.910: true responsive navigation and always-visible live clock.
   Clock participates in layout instead of floating to a negative left offset. */
html,body{min-width:0;max-width:100%;overflow-x:clip}
#FlexContainer2{width:100%!important;max-width:100%!important;min-width:0!important;box-sizing:border-box!important;
  padding:9px clamp(8px,1.5vw,20px)!important;overflow:visible!important}
#wb_CssMenu1{display:block!important;width:100%!important;max-width:100%!important;min-width:0!important;
  margin:0 auto!important;box-sizing:border-box!important;overflow:visible!important}
#wb_CssMenu1 ul#CssMenu1{display:flex!important;align-items:center!important;justify-content:center!important;
  align-content:center!important;flex-wrap:wrap!important;gap:4px 6px!important;
  width:100%!important;max-width:100%!important;min-width:0!important;
  margin:0!important;padding:0!important;box-sizing:border-box!important;overflow:visible!important}
#CssMenu1>li{float:none!important;flex:0 1 auto!important;min-width:0;max-width:100%;
  margin:2px 2px!important;box-sizing:border-box!important}
/* The settings toggle still removes the whole clock; while enabled the clock is a normal first item. */
html:not([data-jmi-site-ui-clock="off"]) #CssMenu1>li.nav-live-clock{
  display:flex!important;position:relative!important;inset:auto!important;left:auto!important;top:auto!important;
  flex:0 0 auto!important;width:clamp(120px,13vw,182px)!important;
  min-width:120px!important;max-width:182px!important;height:55px!important;
  margin:2px 8px 2px 2px!important;padding:0!important;
  align-self:center!important;align-items:center!important;justify-content:center!important;
  transform:none!important;opacity:1!important;visibility:visible!important;animation:none!important;
  pointer-events:none;box-sizing:border-box!important}
html[data-jmi-site-ui-clock="off"] #CssMenu1>li.nav-live-clock{display:none!important}
#CssMenu1 .jmi-live-clock{display:inline-flex!important;flex-direction:column!important;justify-content:center!important;
  align-items:center!important;max-width:100%!important;width:max-content!important;height:auto!important;min-height:40px;
  overflow:visible!important}
#CssMenu1 .jmi-live-clock__time{max-width:100%;height:31px;display:flex;align-items:center;justify-content:center;
  white-space:nowrap;box-sizing:border-box}
#CssMenu1 .jmi-live-clock__date{margin-top:1px;max-width:100%;line-height:15px;font-size:11px;letter-spacing:.65px}
#CssMenu1 .jmi-live-clock__seconds{flex:none;transform:translateY(2px)}
@media(max-width:1350px){
  #wb_CssMenu1 #CssMenu1>li:not(.nav-live-clock)>a{padding:9px 12px!important;font-size:13px!important}
  #CssMenu1>li{margin:2px 1px!important}
}
@media(max-width:900px){
  #FlexContainer2{padding:7px 7px!important}
  #wb_CssMenu1 ul#CssMenu1{gap:4px!important}
  html:not([data-jmi-site-ui-clock="off"]) #CssMenu1>li.nav-live-clock{
    flex:0 0 100%!important;width:100%!important;min-width:0!important;max-width:100%!important;
    height:58px!important;margin:0 0 3px!important;order:-100!important}
  #CssMenu1>li:not(.nav-live-clock){margin:1px 2px!important}
  #wb_CssMenu1 #CssMenu1>li:not(.nav-live-clock)>a{font-size:12px!important;
    padding:9px 10px!important;max-width:100%;box-sizing:border-box}
  #CssMenu1 .jmi-live-clock__date{font-size:11px}
}
@media(max-width:480px){
  #wb_CssMenu1 ul#CssMenu1{gap:3px 4px!important}
  #CssMenu1>li:not(.nav-live-clock){margin:1px!important}
  #wb_CssMenu1 #CssMenu1>li:not(.nav-live-clock)>a{
     font-size:11px!important;letter-spacing:0!important;padding:8px 8px!important}
  #CssMenu1>li.nav-pin,#CssMenu1>li.nav-theme,#CssMenu1>li.nav-anim-bg{flex:0 0 40px!important}
  #CssMenu1 .jmi-live-clock__date{font-size:10.5px}
}
/* Body content: never force a wider canvas than the device viewport. */
@media(max-width:900px){
  #jmi-main,main,.page-wrap,.main-wrap{max-width:100%;min-width:0;box-sizing:border-box}
  :where(.cab-wrap,.pf-wrap,.mon-wrap,.mon-control-panel,.mon-server-group,.wt-workspace,.ab-wrap,.tk-wrap){max-width:100%;box-sizing:border-box}
  img,video{max-width:100%;height:auto}
}
/* Hover menus remain above content; these rules do not hide or break submenus. */
