body { 
  background-color:white;
  font-family: Arial;
  font-size:20px; 
  padding:0;
  overflow-x:hidden!important; margin-top:10px; margin-bottom:70px; 
}
body.nav { margin-top:70px; }
body.bg { background:#4fd3f1 url(/skin/custom/dudu/pix/skybg.jpg) repeat-x; }
.logo { background:transparent url(/skin/custom/dudu/pix/logo.png) no-repeat; background-size:80px 80px; width:80px; height:80px; display:inline-block; vertical-align:middle; }
  .logo.v2 { background:transparent url(/skin/custom/dudu/pix/dd-logo.png) no-repeat; background-size:70px; width:69px; height:80px; margin-right:.5em; }
.logo { transform:rotate(0); transition:all .3s cubic-bezier(0.38, 1.31, 0.56, 1.43); }
  .logo.rotateit_ { transform:rotate(20deg); }

#cloud { background:url(/skin/custom/dudu/pix/cloud.png) repeat-x; position:fixed; bottom:0; height:150px; width:100%; }
#giraffe { background:url(/skin/custom/dudu/pix/giraffe.png) no-repeat right top; position:fixed; bottom:20px; right:100px; width:200px; height:500px; }

* { -webkit-user-select:none; -webkit-touch-callout:none; -webkit-tap-highlight-color:transparent; }
pre { -webkit-user-select: initial; }

.ecms-header { height:50px; position:fixed!important; top:0; left:0; z-index:900; width:100%; }
  .ecms-header .btns_ { text-align:right;}
  .ecms-header .pagemenu_ { width:100%; margin:auto; height:50px; }
    .ecms-header .pagemenu_ > *, .ecms-header .pagemenu_ label 
      { box-sizing:border-box; display:inline-table; height:50px; vertical-align:top; padding-top:15px; }
    .ecms-header .pagemenu_ label { padding-top:12px; }
    .ecms-header .pagemenu_ > * > * { vertical-align:middle; }
    .ecms-header .pagemenu_ > * > span { margin-left:6px; }
    .ecms-header .pagemenu_ .titlegroup_ { width:365px; display:inline-block; }
      .ecms-header .pagemenu_ .titlegroup_.center_ { display:block; text-align:center; margin:auto; }
      .ecms-header .pagemenu_ h1 { display:inline-block; margin-top:-.1em; font-weight:bold; font-size:20px; }
    .ecms-header .pagemenu_ img { }
  .ecms-header label, .ecms-header a { padding:10px 14px; cursor:pointer; }
  .ecms-header a.prev_, .ecms-header a.next_ { padding:15px 14px; }
  .ecms-header input[type=checkbox] { display:none; }


.ecms-footer { font-size:14px; position:fixed!important; bottom:0; left:0; z-index:200; width:100%; height:66px; }
  .ecms-footer .navmenu_ { display:table; width:100%; height:100%; border-top:1px solid #888; }
    .ecms-footer .navmenu_ > * { display:table-cell; float:initial; text-align:center; background-image:linear-gradient(#444,#2d2d2d); border-right:1px solid #000; width:10%; padding:8px; }
      .ecms-footer .navmenu_ > *:hover { background-image:linear-gradient(#666,#444); background-image:-webkit-linear-gradient(#666,#444);  }
      .ecms-footer .navmenu_ a.focus_ { background-image:linear-gradient(#5393c5,#6facd5); background-image:-webkit-linear-gradient(#5393c5,#6facd5); }

.ecms-box { background:#222; color:#fff; margin:0; -webkit-user-select:none; user-select:none; box-sizing:border-box; position:relative; }
    .ecms-box fieldset { border:none; padding:0!important; }
      .ecms-box fieldset > * { display:block; float:left; margin-right:1px; text-align:center; }
.ecms-box a { cursor:pointer; text-decoration:none; color:#fff!important; }
.ecms-box a.hover_, .ecms-box label.hover_ { background-color:#777; }

.ecms-message { font-size:24px; padding:1em 1em 1em 60px; border-radius:1ex; 
  background:rgba(27, 168, 243, 0.33) url(/rs/cc/icon/marine/info.png) no-repeat 18px 50%; background-size:30px 30px;  }

.ecms-helpbtn { width:12px; height:12px; display:inline-block; opacity:.5; background:url(/rs/cc/icon/graphite/help.png) no-repeat; background-size:12px 12px; cursor:context-menu; }
  .ecms-helpbtn:hover { opacity:.8; }

.ecms-tab { cursor:pointer; position:relative; text-decoration:none; color:#444!important; font-weight:bold; font-size:20px; background:#eee; background-image:linear-gradient(#eee,#e1e1e1); border-radius:15px; padding:8px 16px; text-align:center; margin-bottom:5px; display:inline-block; }
  .ecms-tab.nav_ { font-weight:normal; padding:8px; font-size:14px; }
    .Xbtn.nav_::before { content:'-'; position:relative; left:-7px; }
  .ecms-tab.hot_ { background-image:linear-gradient(#9acffe,#87b6df);}
  .ecms-tab.focus_ { background:#ffd47f; background-image:linear-gradient(#ffe0a2,#ffd47f);}
    .ecms-tab.focus_:before {
      content:''; position:absolute; bottom:-.8em; left:28px;
      width: 0; height: 0; 
      border-left: 1em solid transparent;
      border-right: 1em solid transparent;
      border-top: 1em solid #ffd47f;
    }

.ecms-popup { box-sizing:content-box; display:none; position:fixed; font-weight:normal; padding:4px; background-color:#f0f0f0; background-image: linear-gradient(#f0f0f0,#ddd); box-shadow:0 0 12px rgba(0,0,0,.6); border-radius:.6em;  text-shadow: none!important; color: #000; z-index:300; min-height:200px; }
  .ecms-popup .btn_.close_ { background:transparent url(/rs/part/dialog_close.png) no-repeat!important; width:36px; height:36px; position:absolute; top:-18px; right:-18px; cursor:pointer; padding:0; margin:0; }

.ecms-form { width:400px; }
  .ecms-form label { font-size:16px; opacity:.5; }
  .ecms-form input { display:block; font-size:20px; padding:4px 10px; border:1pt inset #E6E6E6; border-radius:1.5ex; margin:5px 0 15px; width:100%; -webkit-user-select:initial; }
    .ecms-form input:focus { outline:none; box-shadow:0 0 8px #4c6ffe; }
    .ecms-form input:disabled { font-weight:bold; margin-top:0px; padding-left:0px; border:none; box-shadow:none; background:none; clear:right; border-bottom:1px dotted #555; border-radius:0; }

    .ecms-form input[type=submit], .ecms-form button, a.button_ { position:relative; cursor:pointer; color:#444!important; font-weight:bold; font-size:16px; background:#eee; background-image:linear-gradient(#FFF8D3,#ecd671); border-radius:1.5ex; border:none; padding:10px 30px; text-align:center; margin-bottom:10px; box-shadow:1px 1px 2px #888; }
    a.button_.subdue_ { background:#eee; background-image:linear-gradient(#f3f3f3,#c3c3c3); }

  .ecms-form h3 { font-size:18px; margin-bottom:4px; }
  .ecms-form .info { font-size:16px; background:rgba(051, 156, 241, .4); padding:8px 8px 8px 35px; border-radius:1em; position:relative; width:100%; }
    .ecms-form .info:after { position:absolute; content:' '; top:8px; left:8px; width:20px; height:20px; background:no-repeat; background-size:20px 20px; background-image:url(/rs/cc/icon/onyx/info.png); }
  .ecms-form .error { font-size:16px; background:rgba(255, 173, 173, .8); padding:8px 8px 8px 35px; border-radius:1em; position:relative; width:100%; }
    .ecms-form .error:after { position:absolute; content:' '; top:8px; left:8px; width:20px; height:20px; background:no-repeat; background-size:20px 20px; background-image:url(/rs/cc/icon/onyx/minus.png); }

  .search_box { position:relative; }
    .search_box:after { pointer-events:none; content:" "; position:absolute; width:20px; height:100%; background:url(/rs/cc/icon/graphite/search.png) no-repeat 50% 50%; background-size:16px 16px; top:0; left:1ex; }
    .search_box input { color:#444!important; font-weight:bold; font-size:14px; background:#eee; border-radius:15px; padding:10px 10px 10px 25px; display:block; margin-bottom:10px; width:100%; width:210px\9; -webkit-user-select:initial; }
     .search_box input:focus { outline:none; }

/* popup, dialog, drawer and screen */
#ecms-screen { z-index:900; display:none; position:fixed; top:0; left:0; right:0; bottom:0; background:rgba(0,0,0,.3); }

#dialogPage { z-index:1000; min-width:650px; width:650px; padding:0; top:200px; left:200px; background:#fff!important; }
  #dialogPage .header_ { background:#222!important; color:#fff; padding:10px; text-align:center; border-radius: .3em .3em 0 0; font-size:160%; font-weight:bold; }
  #dialogPage .content_ { padding:10px; font-size:140%; }

#copyright { position:fixed; bottom:10px; z-index:200; right:18px; text-shadow:none; font-size:10px; opacity:.7; color:#000; }

#system_options { z-index:990; display:none; position:fixed; height:100%; top:48px; right:0; width:280px; padding:30px 15px; }
  body.touch-ui #system_options { top:0; }
  #system_options h2 { font-size:22px; }
  #system_options a { position:relative; display:block; text-align:left; padding-left:20px; }
  #Xsystem_options a { position:relative; color:#444!important; font-weight:bold; font-size:16px; background:#eee; background-image:linear-gradient(#eee,#ccc); border-radius:15px; padding:10px 10px 10px 20px; text-align:left; display:block; margin-bottom:10px; }

#show_system_options img { border:none; }
#show_english { z-index:1000; }

.ecms-drawer { z-index:990; display:none; position:fixed; height:100%; top:48px; right:0; width:280px; padding:0 15px 30px 15px; }
  .ecms-drawer h2 { font-size:22px; }
  .ecms-drawer .body_ tr:hover { cursor:pointer; background-color:rgba(255,255,255,.3); } 
  .ecms-drawer td { padding:2px; } 
  .ecms-drawer .title_ { font-size:16px; } 

#history_list .score_ { float:right; font-size:18px; font-weight: bold; color: #5fe6ff;} 
#history_list .others_ { opacity:.7; font-size:12px; } 

#notice_list { top:48px; right:0; width:480px; padding:0 15px 30px 15px; } 


#show_favs { position:relative; }
  #show_favs:after { content:attr(data-count); position:absolute; text-align:center; font-size:10px; 
    color: #eee; font-size: 10px; top: 8px; right: 11px; }


.offline-ui.offline-ui-down { display: block; position: fixed; bottom: 6px; left: 6px; z-index: 2000;
      background: black url(/rs/cc/icon/silver/cloud.png) no-repeat 50% 50%;
      width: 45px; height: 45px; color: #ddd; border-radius: 1ex; }
  .offline-ui.offline-ui-down .offline-ui-content:before {
      content: "?"; position: absolute; top: 15px; width: 95%; text-align: center;
      font-family:Verdana; font-size: 16px; font-weight: bold; color: #555; padding-top:1px;
  }
.offline-ui.offline-ui-up { display:none; }
/*  .offline-ui.offline-ui-up .offline-ui-content:before { content: "Connected"; } */