*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  background:#fff;
  color:#333;
  font-family:"宋体",SimSun,Arial,sans-serif;
  font-size:12px;
  line-height:150%;
}
td,input,select,textarea,button{font-family:"宋体",SimSun,Arial,sans-serif;font-size:12px}
a{color:#333;text-decoration:none}
a:hover{color:#ff6600;text-decoration:underline}
img{border:0}
.page{width:770px;margin:0 auto 42px;background:#fff}
.ys-head{width:770px;margin:0 auto}
.top-logo{display:flex;align-items:flex-start}
.top-logo .mark{width:143px;height:60px;flex:none}
.top-logo .ad{
  width:480px;height:60px;margin:0 0 0 0;
  display:flex;align-items:center;justify-content:center;
  border:1px solid #c8e6ff;background:#f7fbff;color:#228bd4;
  letter-spacing:2px;
}
.top-logo .tools{width:147px;margin-left:auto}
.toolbox{border:1px solid #78c8fe;border-left-color:#fff;border-top-color:#fff;border-collapse:separate;border-spacing:1px;width:100%}
.toolbox td{background:#a6d2ff;text-align:center;height:19px;color:#333}
.toolbox a{color:#004f99}
.navline{
  width:770px;border-collapse:collapse;margin:0 auto;
  background:#eaf4ff;border-top:1px solid #0094f7;border-bottom:1px solid #0094f7;
}
.navline td{height:22px;color:#0080e0}
.navline a{color:#0080e0;margin:0 2px}
.nav-right{width:115px;background:#eaf4ff;text-align:right;color:#fff}
.main3{display:flex;width:770px;margin:0 auto;align-items:flex-start}
.leftcol{width:158px;flex:none;background:#fff}
.midcol{width:423px;margin-left:12px;flex:none}
.rightcol{width:165px;margin-left:12px;flex:none}
.section-title{
  height:23px;background:#0c9cf2;color:#fff;line-height:23px;
  padding:0 6px;font-weight:bold;
}
.section-title a{color:#fff;text-decoration:none}
.sidebox{width:158px;background:#eaf4ff;margin-bottom:8px}
.sidebox .edge{border-left:1px solid #0094f7;border-right:1px solid #0094f7;padding:4px 5px;background:#fff}
.sidebox .edge.blue{background:#eaf4ff}
.sidebox .down{display:block;width:158px;height:11px}
.sidebox ul,.panel ul,.newslist{list-style:none;margin:0;padding:0}
.sidebox li{line-height:180%;white-space:nowrap}
.dot{color:#0080ff}
.cardgrid{width:90%;margin:4px auto;border-collapse:separate;border-spacing:4px}
.cardgrid td{text-align:center;vertical-align:top}
.cardgrid .thumb{background:#eaf4ff;padding:3px}
.login-mini{width:150px;margin:0 auto 5px;border:1px solid #cde7ff;background:#f7fbff;padding:4px}
.login-mini input{width:86px;border:1px solid #7fb8e9;height:18px}
.ys-btn{
  display:inline-block;border:1px solid #78c8fe;background:#eaf4ff;color:#005ca0;
  padding:1px 8px;line-height:16px;cursor:pointer;
}
.ys-btn:active{border-color:#006cbf #fff #fff #006cbf;background:#d5ecff}
.panel{border:1px solid #b9ddff;margin-bottom:8px;background:#fff}
.panel .h{height:23px;background:#0c9cf2;color:#fff;font-weight:bold;line-height:23px;padding:0 7px}
.panel .h a{color:#fff}
.panel .b{padding:6px 7px}
.panel.gray .h{background:#669933}
.panel.gray{border-color:#b5d29d}
.panel.light .h{background:#a6d2ff;color:#004f99}
.panel.light{border-color:#78c8fe}
.newslist li{display:flex;border-bottom:1px dotted #c7dff7;padding:2px 0;line-height:150%}
.newslist li a{flex:1}
.newslist li .date{color:#999;width:36px;text-align:right}
.bluebar{
  display:flex;height:23px;line-height:23px;background:#0c9cf2;color:#fff;margin-bottom:4px;
}
.bluebar .title{width:70px;background:#008ce0;text-align:center;font-weight:bold}
.bluebar .more{flex:1;text-align:right;padding-right:8px;color:#fff}
.bluebar a{color:#fff}
.two-news{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.local-list li{border-bottom:1px dotted #ddd;padding:2px 0}
.smallnote{color:#777;font-size:12px;line-height:160%}
.service-list td{background:#f5f5f5;padding:3px;border-bottom:1px solid #fff}
.service-list .cat{width:46px;text-align:center;color:#0080e0}
.rightad{
  background:#f7fbff;border:1px solid #b9ddff;margin-bottom:8px;padding:5px;text-align:center;
}
.rightad .banner{height:60px;background:#eaf4ff;border:1px solid #78c8fe;color:#0080e0;display:flex;align-items:center;justify-content:center;margin-bottom:5px}
.foot{
  width:770px;margin:10px auto 0;border-top:1px solid #cde7ff;padding:8px 0 14px;
  color:#777;text-align:center;line-height:170%;
}
.back-museum{
  position:fixed;right:8px;bottom:8px;z-index:95;
  font-size:12px;background:#ffffe0;border:1px solid #c0c000;
  padding:3px 8px;text-decoration:none;color:#c00;
  box-shadow:1px 1px 3px rgba(0,0,0,.3);
}
.back-museum:hover{background:#ffffc0;color:#c00}

/* Bliao pages */
.bliao-page{width:760px;margin:0 auto 42px;background:#fff}
.bliao-head{width:760px;height:64px;display:flex;align-items:center;border-bottom:3px solid #79b76f}
.bliao-head .logo{width:180px}
.bliao-head .slogan{flex:1;text-align:center;color:#669933;font-size:14px;letter-spacing:2px}
.bliao-head .slogan b{color:#f60}
.bliao-nav{background:#669933;color:#fff;height:24px;line-height:24px;padding:0 8px}
.bliao-nav a{color:#fff;margin-right:12px}
.bliao-layout{display:flex;border-left:1px solid #ddd;border-right:1px solid #ddd}
.bliao-side{width:231px;background:#eee;padding:8px 10px;flex:none}
.bliao-main{width:527px;background:#fff;padding:8px 10px}
.old-box{width:211px;margin:0 auto 10px}
.old-box .top,.old-box .bottom{display:block}
.old-box .inner{border-left:1px solid #d8d8d8;border-right:1px solid #d8d8d8;background:#fff;padding:5px 9px}
.old-box h4{margin:2px 0 4px;color:#669933;text-align:center;font-size:12px}
.old-box p{margin:3px 0}
.green-title{background:#669933;color:#fff;height:18px;line-height:18px;padding-left:8px;margin:0 0 4px}
.green-title a{color:#fff}
.room-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:10px}
.room-col{border-top:1px dotted #aaa;padding-top:4px;min-height:90px}
.room-col a{display:inline-block;margin:0 7px 3px 0;color:#333}
.room-table{width:100%;border-collapse:collapse;margin:5px 0 10px}
.room-table th{background:#e8f2e4;color:#336600;text-align:left;font-weight:normal;border:1px solid #c6ddb8;padding:3px}
.room-table td{border:1px solid #e2e2e2;padding:3px}
.room-table tr:hover td{background:#fffde8}
.join{color:#0080e0;cursor:pointer}
.chat-open{
  display:flex;gap:4px;align-items:center;border:1px solid #d8d8d8;background:#f6f6f6;padding:6px;margin:8px 0;
}
.chat-open input{border:1px solid #999;height:20px;width:80px}
.create-room{background:#f7fbff;border:1px solid #cde7ff;padding:7px;margin-top:8px}
.create-room input,.create-room select{border:1px solid #999;height:20px;margin-right:3px}

/* chat simulator */
.chat-shell{width:790px;margin:0 auto 42px;border:1px solid #808080;background:#d4d0c8}
.chat-titlebar{height:22px;background:#0054e3;color:#fff;line-height:22px;padding:0 8px;font-weight:bold}
.chat-menu{height:24px;line-height:24px;background:#ece9d8;border-bottom:1px solid #808080;padding:0 8px}
.chat-menu a{margin-right:14px;color:#000}
.chat-body{display:flex;height:420px;background:#fff}
.messages{width:610px;height:420px;overflow:auto;background:#fff;padding:6px;font-size:13px;line-height:160%}
.users{width:178px;border-left:1px solid #808080;background:#f6f6f6}
.users .uh{background:#669933;color:#fff;height:20px;line-height:20px;text-align:center}
.users ul{list-style:none;margin:0;padding:5px}
.users li{padding:2px 0;border-bottom:1px dotted #ccc}
.msg{white-space:pre-wrap}
.sys{color:#888}
.me{color:#0000cc}
.other{color:#006600}
.private{color:#c000c0}
.chat-input{display:flex;gap:5px;align-items:center;background:#ece9d8;border-top:1px solid #808080;padding:6px}
.chat-input input{height:23px;border:1px solid #808080}
.chat-input #nick{width:72px}
.chat-input #say{flex:1}
.chat-input button{height:23px;border:1px outset #fff;background:#d4d0c8;cursor:pointer}
.chat-status{height:20px;line-height:20px;background:#d4d0c8;border-top:1px solid #fff;padding:0 8px;color:#333}

/* card center */
.card-page{width:770px;margin:0 auto 42px}
.card-head{display:flex;align-items:flex-start;height:60px}
.card-head .logo{width:143px}
.card-head .ad{width:468px;height:60px;border:1px solid #c8e6ff;background:#f7fbff;margin-left:8px;display:flex;align-items:center;justify-content:center;color:#0080e0}
.card-wrap{display:flex;margin-top:8px}
.card-side{width:170px;flex:none}
.card-main{width:590px;margin-left:10px}
.card-list{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.ecard{border:1px solid #b9ddff;background:#f8fcff;text-align:center;padding:6px;cursor:pointer;min-height:112px}
.ecard:hover{background:#fffde8;border-color:#ffcc66}
.ecard img{width:40px;height:40px;image-rendering:auto}
.ecard .name{margin-top:4px;color:#005ca0}
.ecard .type{color:#888}
.preview-box{border:1px solid #b9ddff;background:#fff;padding:8px;margin-top:8px;display:flex;gap:10px}
.preview-stage{
  width:230px;height:160px;border:1px solid #78c8fe;background:linear-gradient(#eaf7ff,#fff);
  position:relative;overflow:hidden;flex:none;
}
.sun{position:absolute;width:36px;height:36px;border-radius:50%;background:#ffd65a;left:18px;top:18px;animation:floaty 3s ease-in-out infinite}
.heart{position:absolute;color:#f66;font-size:22px;animation:rise 4s linear infinite}
.heart.h1{left:80px;bottom:18px}.heart.h2{left:130px;bottom:6px;animation-delay:1s}.heart.h3{left:180px;bottom:26px;animation-delay:2s}
.wave{position:absolute;left:0;right:0;bottom:0;height:44px;background:repeating-linear-gradient(135deg,#78c8fe 0,#78c8fe 8px,#d8f2ff 8px,#d8f2ff 16px)}
@keyframes rise{0%{transform:translateY(0);opacity:.2}45%{opacity:1}100%{transform:translateY(-110px);opacity:0}}
@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(8px)}}
.send-form{flex:1}
.send-form label{display:block;margin:3px 0;color:#666}
.send-form input,.send-form textarea{width:100%;border:1px solid #999}
.send-form textarea{height:48px;resize:vertical}
@media(max-width:820px){
  .page,.ys-head,.navline,.main3,.foot,.card-page{width:770px}
  body{overflow-x:auto}
}