@charset "utf-8"; @import "/wap/css2/iconfont.css"; body { background: #F0F0F0 } .f06c { color: #06c } .ff30 { color: #f30 } .f333 { color: #333 } .px12 { font-size: 12px } .f999, .gray { color: #999 } em, i { font-style: normal } /* 改版新加 2015-1-21 */ #body { border-bottom: none; padding: 0 10px;background: #fff; } #toTop { display: none} .p10 { padding: 0 10px } .icon-male { color: #0099FF !important; font-size: 14px; vertical-align: middle } .icon-female { color: #FF6666 !important; font-size: 14px; vertical-align: middle } .icon-level { display: inline-block; vertical-align: middle; width: 16px; height: 20px; background: url(/wap/images/bbsicon.png) 0 0 no-repeat; background-size: 16px; color: #fff; font-size: 12px; text-align: center; margin: 0 2px; line-height: 20px } .followers { border-top: 1px solid #e2e2e2; border-bottom: 1px solid #e2e2e2; padding: 5px 10px; background: #fff; height: 40px; overflow: hidden } .followers .right { color: #929292; font-size: 14px; line-height: 40px; float: right; display: inline } .followers a { margin-right: 5px;display:inline-block;margin-bottom:10px } .followers a img { width: 40px; height: 40px; border-radius: 100%; vertical-align: bottom } .fix-bottom { position: fixed; bottom: 0; width: 100%; box-sizing: border-box; background: #fff; z-index: 999 } .fix-bottom.f3>* { width: 33.3% } .fix-bottom>* { text-align: center; width: 50%; display: inline-block; color: #4D515B; font-size: 18px; line-height: 42px; box-sizing: border-box; position: relative } .fix-bottom>*:not(:last-child)::after { content: ''; position: absolute; height: 60%; right: 0; top: 20%; background: #D8D8D8; width: 1px } .fix-bottom .iconfont { font-size: 24px; margin-right: 3px } .fix-bottom .icon-like { font-size: 26px; position: relative; top: -1px } .fix-bottom .icon-comment { position: relative; top: 2px } /* 评论 输入 */ .review { font-size: 16px; position: fixed; top: 0; width: 100%; z-index: 999; height: 100%; background: rgba(0, 0, 0, 0.5); display: none ; margin: 0px; padding: 0px; max-width: 1024px;} .review.friendlist { font-size: 16px; position: static; top: 0; left: 0; width: 100%; z-index: 999; height: 100%; background: rgba(0, 0, 0, 0.5); display: none } .review textarea { width: 100%; padding: 10px; font-size: 14px; font-family: \5FAE\8F6F\96C5\9ED1; box-sizing: border-box; overflow: visible; height: 200px; border: none; border-radius: 0; } .review .location { position: absolute; color: #999; font-size: 12px; height: 20px; line-height: 20px; background: #F0F0F0; padding-left: 3px; top: 175px; border-radius: 20px; cursor: pointer; left: 10px } .review.post .location{top:300px;} .review .location #addr { padding-right: 6px } .review .location .icon-mappin { color: #86BC40 } .review .location span.close { display: none } .review .location.open span.close { display: inline-block; border-left: 1px solid #e2e2e2; padding: 0 5px; height: 20px; line-height: 20px } .review .location.open .icon-close { font-size: 10px; position: relative; top: -1px } .review .tools { border-top: 1px solid #e2e2e2; background: #f8f8f8; height: 42px; padding: 0 10px; line-height: 42px; border-bottom: 1px solid #e2e2e2 } .review .tools::before { content: ''; width: 0; height: 100%; vertical-align: middle; display: inline-block } .review .tools .right { float: right; display: inline } .review .tools a { display: inline-block; position: relative; vertical-align: middle; margin-right:10px; } .review .tools .icon-face, .review .tools .icon-image, .review .tools .icon-at { font-size: 32px; color: #b5b5b5; line-height: 1em; left: 0; top: 0; position: absolute; display: none } .review .tools .active .icon-face, .review .tools .active .icon-image, .review .tools .active .icon-at { color: #f60 } /* .review .tools .face.active::after, .review .tools .file.active::after, .review .tools .at.active::after { content: ''; position: absolute; width: 10px; height: 10px; bottom: -13px; left: 50%; margin-left: -6px; -webkit-transform: rotate(-45deg); border-top: 1px solid #e2e2e2; border-right: 1px solid #e2e2e2; background: #fff } */ .middle { content: ''; display: inline-block; width: 0; height: 100%; vertical-align: middle } .review .tools .right a { border: 1px solid #e2e2e2; padding: 5px 10px; font-size: 14px; line-height: 1em; margin-top: -2px } .review .tools .cancel { color: #b5b5b5; background: #fff; margin-right: 5px } .review .tools .submit { background: #86bc40;background:-o-linear-gradient(0deg, #86bc40, #86bc40);background:linear-gradient(0deg, #86bc40, #86bc40); color: #fff; border-color: #86bc40 !important } .review .tools .face { height: 32px; width: 32px; background: url(/wap/images/bbsicon.png) 0 -644px no-repeat; background-size: 32px auto } .review .tools .face.active { background-position: 0 -675px } .review .tools .file { height: 25px; width: 33px; background: url(/wap/images/bbsicon.png) 0 -707px no-repeat; background-size: 32px auto } .review .tools .file .count { position: absolute; color: #fff; font-size: 10px; background: #FF9900; width: 12px; height: 12px; line-height: 13px; text-align: center; border-radius: 100%; right: 0; top: -4px; } .review .tools .file.active { background-position: 0 -733px } .review .tools .video { height: 25px; width: 33px; background: url(/wap/images/bbsicon.png) 0 -898px no-repeat; background-size: 32px auto } .review .tools .video.active { background-position: 0 -924px } .review .tools .at { height: 32px; width: 32px; background: url(/wap/images/bbsicon.png) 0 -759px no-repeat; background-size: 32px } .review .tools .at.active { background-position: 0 -793px } .review .rich { background: #fff } .review .rich .faces { display: none; overflow: hidden; padding: 15px 0 } .review .rich .faces .facelist { width: 400%; overflow: hidden; position: relative } .review .rich .faces .facelist li { float: left; width: 25% } .review .rich .faces .facelist li a { display: inline-block; width: 12.5%; text-align: center; padding: 5px; box-sizing: border-box } .review .rich .faces .facelist li a img { max-width: 24px; max-height: 24px } .review .rich .fileupload { overflow: hidden; padding-left: 10px; display: none; padding: 15px 0 15px 10px } .review .rich span{ font-size: 13px; color: #666;} .review .rich .fileupload .uploadwrap {overflow: hidden;width:100%} .review .rich .fileupload .uploadwrap li { float: left; margin:0 10px 10px 0; position: relative; border-radius: 5px } .review .rich .fileupload .uploadwrap li img { width: 60px; height: 60px; border-radius: 5px; vertical-align: bottom } .review .rich .fileupload .uploadwrap li.loaded {box-shadow: 1px 1px 3px 0px rgba(0, 0, 0, 0.4) } .review .rich .fileupload .uploadwrap li.loaded span {position: absolute; top: 2px; right: 2px; background: rgba(187, 39, 17, 0.85); border-radius: 100%; width: 16px; height: 16px; cursor: pointer } .review .rich .fileupload .uploadwrap li.loaded span i:first-child { position: absolute; height: 2px; background: #fff; width: 10px; border-radius: 2px; top: 50%; margin-top: -1px; left: 3px } .review .rich .fileupload .uploadwrap li.loading { } .review .rich .fileupload .uploadwrap li.loading span { top: 0; left: 0; width: 100%; height: 100%; border-radius: 5px; background: rgba(0, 0, 0, 0.5); position: absolute } .review .rich .fileupload .uploadwrap li.loading span i { width: 74%; height: 6px; position: absolute; top: 50%; margin-top: -3px; background: rgba(0, 0, 0, 0.7); border-radius: 6px; left: 13%; z-index: 1 } .review .rich .fileupload .uploadwrap li.loading span i:first-child { } .review .rich .fileupload .uploadwrap li.loading span i:last-child { background: rgba(255, 255, 255, 0.6); width: 0% } .review .rich .fileupload .uploadwrap li.plus { width: 60px; height: 60px; background: #b5b5b5; border-radius: 5px; position: relative } .review .rich .fileupload .uploadwrap li.plus::before { content: ''; width: 80%; background: #fff; height: 6px; position: absolute; border-radius: 6px; top: 50%; margin-top: -3px; left: 10% } .review .rich .fileupload .uploadwrap li.plus::after { content: ''; position: absolute; height: 80%; background: #fff; border-radius: 6px; top: 10%; left: 50%; margin-left: -3px; width: 6px } .review .rich .fileupload .uploadwrap li.plus input { position: absolute; width: 100%; height: 100%; opacity: 0; cursor: pointer } .review .rich .fileupload .tip { color: #b5b5b5; font-size: 12px; margin-top: 6px } .review .rich .at { display: none } .review .rich .at ul { padding: 15px 2px 0; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; overflow: hidden } .review .rich .at ul li { float: left; width: 25%; text-align: center; padding: 0 2px; -webkit-box-sizing: border-box; -ms-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; margin-bottom: 15px } .review .rich .at ul li .pic{height:60px;overflow:hidden} .review .rich .at a { color: #06C; font-size: 12px; display: block; width: 100%; max-width: 60px; margin: 0 auto; position: relative } .review .rich .at .cur a::after { content: ""; width: 25px; height: 25px; border-radius: 100%; background: #8ebd00; position: absolute; right: -5px; top: -5px; z-index: 1; } .review .rich .at .cur a::before { content: ""; width: 7px; height: 12px; border-bottom: 3px solid #fff; border-right: 3px solid #fff; position: absolute; right: 2px; top: -2px; z-index: 2; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); } .review .rich .at img { width: 100%; max-width: 60px; height: auto } .review .rich .at p { height: 16px; line-height: 16px; overflow: hidden } .archor { text-align: center } .archor a, .archor span { display: inline-block; color: #666; vertical-align: middle; width: 5px; height: 5px; border-radius: 100%; background: #b5b5b5; margin-right: 5px } .archor a.active, .archor span.active, .archor a:hover, .archor span:hover { background: #bc2510 } /* 2015 首页列表 */ .feed-list { font-size: 16px; background: #f0f0f0 } .feed-list.forum h3 { border-bottom: none; } .feed-list .timeline { height: 48px; line-height: 48px; position: relative; font-size: 14px; color: #929292; padding-left: 28px } .feed-list .timeline span { display: block; border-left: 4px solid #c5c1c0; font-size: 12px; padding-left: 15px } .feed-list .timeline::before { content: ''; position: absolute; width: 20px; height: 20px; background: #dc393a; border-radius: 100%; left: 30px; top: 50%; margin-top: -14px; margin-left: -14px; border: 4px solid #f0f0f0 } .feed-list .timeline::after { content: ''; position: absolute; width: 10px; height: 10px; border-radius: 100%; background: #dc393a; left: 30px; margin-left: -8px; top: 50%; margin-top: -8px; border: 3px solid #f0f0f0 } .feed-list .timeline+.feed { margin-bottom: 0 } .feed-list .feed { border-top: 1px solid #e2e2e2; border-bottom: 1px solid #e2e2e2; margin-bottom: 10px; padding-top: 10px; background: #fff; position: relative } .feed-list .feed:first-child { border-top: none; } .feed-list .feed>a { display: block; position: relative } .feed-list .feed .spec { width: 20px; padding-top: 1px; background: #E03016; display: block; position: absolute; top: -11px; right: 6px; color: #fff; font-size: 12px; text-align: center; line-height: 12px; padding-bottom: 10px } .feed-list .feed .spec::after { content: ""; display: block; width: 0; height: 0; position: absolute; left: 0; bottom: 0; border-top: none; border-left: 9px solid transparent; border-right: 9px solid transparent; border-bottom: 8px solid #fff } .feed-list .feed i.a, .feed-list .feed i.b, .feed-list .feed i.c { width: 18px; height: 45px; padding-top: 2px; background: #FF686C; display: block; position: absolute; top: -1px; right: 6px; color: #fff; font-size: 12px; text-align: center; line-height: 12px } .feed-list .feed i.b { background: #ABC729 } .feed-list .feed i.c { background: #50C7C7 } .feed-list .feed i.a::after, .feed-list .feed i.b::after, .feed-list .feed i.c::after { content: ""; display: block; width: 0; height: 0; position: absolute; left: 0; bottom: 0; border-top: none; border-left: 9px solid transparent; border-right: 9px solid transparent; border-bottom: 8px solid #fff } .feed-list .feed .top { overflow: hidden; padding: 0 10px } .feed-list .feed .top img.avatar { width: 40px; height: 40px; border-radius: 100%; float: left; margin-right: 10px } .feed-list .feed .top .msg .right { font-size: 12px; background: #dd3b39; color: #fff; border-radius: 2px; padding: 1px 5px; margin-top: 7px; margin-right: 10px } .feed-list .feed .top .username { display: block; padding: 5px 0 2px; font-size: 14px; line-height: normal; color: #666 } .feed-list .feed .top span.time { font-size: 12px; color: #ccc; display: block } .icon-map-png { width: 12px; background: url(/wap/images/bbsicon.png) center -151px no-repeat; background-size: 30px; display: inline-block; height: 14px; vertical-align: middle; margin-right: 0px; margin-top: -1px } .feed-list .feed .content { margin-top: 5px; overflow: hidden; padding: 0 10px } .feed-list .feed .content h4 { line-height:25px;overflow:hidden;color: #06C; font-weight: normal;margin-bottom:8px} .feed-list .feed .content h4 .fabu_fm{ float:right; background:url(/wap/images/fabu.fw.png) no-repeat 0 8px; background-size:14px; padding-left:18px;} .feed-list .feed .content p { color: #999; font-size: 15px; line-height: 21px; overflow: hidden; max-height: 42px } .feed-list .feed .content .images { overflow: hidden; margin-top: 10px;max-height:100px} .feed-list .feed .content .images .inner { position: relative; overflow: hidden; padding: 0; width: 100%;display:table} .feed-list .feed .content .images .inner li {text-align: center; vertical-align:top; padding-right: 5px; width: 33.3%; box-sizing: border-box; max-width: 300px; max-height: 100px;position:relative;float:left;} .feed-list .feed .content .images .inner li .biaoqian{ padding:1px 3px; position:absolute; bottom:0; right:5px; color:#fff; font-weight:bold;} .feed-list .feed .content .images .inner li .mengbao_show{ background:rgba(153,153,0,0.7);} .feed-list .feed .content .images .inner li .boy_show{ background:rgba(0,153,153,0.7);} .feed-list .feed .content .images .inner li .girl_show{ background:rgba(254,109,167,0.7);} .feed-list .feed .content .images .inner li img { margin-right: 5px; vertical-align:top; width: 100%; } .feed-list .feed .tools { border-collapse: collapse; background: #fff; border-top: 1px solid #e2e2e2; padding: 5px 0 } .feed-list .feed .tools.right { text-align: right; padding-right: 15px; border-top: none; color: #ccc } .feed-list .feed .tools.right>* { display: inline; border: none; margin-left: 10px; vertical-align: middle } .feed-list .feed .tools a { display: inline-block; text-align: center; color: #939393; border-right: 1px solid #e2e2e2; line-height: 22px; width: 33.3%; box-sizing: border-box; font-size: 12px } .feed-list .feed .tools span .iconfont { font-size: 18px; position: relative; color: #CFCFCF } .feed-list .feed .tools a .iconfont.icon-comment { } .feed-list .feed .tools .like { } @keyframes likeAnimation { 0% { font-size: 12px; color: #ff6600 } 100% { font-size: 30px; opacity: 0 } } @-webkit-keyframes likeAnimation { 0% { font-size: 12px; color: #ff6600 } 100% { font-size: 30px; opacity: 0 } } @-moz-keyframes likeAnimation { 0% { font-size: 12px; color: #ff6600 } 100% { font-size: 30px; opacity: 0 } } @-o-keyframes likeAnimation { 0% { font-size: 12px; color: #ff6600 } 100% { font-size: 30px; opacity: 0 } } @-ms-keyframes likeAnimation { 0% { font-size: 12px; color: #ff6600 } 100% { font-size: 30px; opacity: 0 } } .feed-list .feed .tools .like em { position: relative } .feed-list .feed .tools .like em i { position: absolute; left: 0; top: 0; font-size: 12px; color: #f60; line-height: 16px } .feed-list .feed .tools .like.ed { color: #ff6600 } .feed-list .followers { border-top: 1px solid #e2e2e2; border-bottom: 1px solid #e2e2e2; padding: 0 10px 10px; background: #fff } .feed-list .followers .right { color: #929292; font-size: 14px; line-height: 40px } .feed-list .followers a { margin-right: 10px; display: inline-block; margin-top: 5px; } .feed-list .followers a img { width: 40px; height: 40px; border-radius: 100%; vertical-align: bottom } /* detail.html */ .topic_top { padding: 10px; background: #fff; border-bottom: 1px solid #d5d5d5 } .topic_top h1 { font-size: 18px; font-weight: normal; color: #333; margin-bottom: 20px } .h1_bot { overflow: hidden; font-size: 14px } .h1_bot a.l { height: 28px; line-height: 28px; border: 1px solid #d1d1d1; background: #f1f1f1; border-radius: 3px; color: #666; text-align: center;padding:0 5px;} .h1_bot .r { color: #999 } .h1_bot .r span { padding-left: 25px; background: url(/wap/images/bbsicon.png) 0 -39px no-repeat; background-size: 32px auto; line-height: 30px; display: inline-block } .h1_bot .r span:last-child { background: url(/wap/images/bbsicon.png) 0 -114px no-repeat; background-size: 32px auto; margin-left: 15px; padding: 2px 0 1px 25px } #body .edit { display: none } .louzhu { padding: 15px 0 } .talk_list li{ } .talk_list li span { font-size: 14px;color:#999} .talk_list li i { margin-left:5px;font-size: 14px;color:#666} .talk_bot img { max-width: 300px;} .talk_bot .face { width: 24px;height: 24px;} .talk_list>li { background: #fff;padding: 12px 10px 10px; border-bottom: 1px solid #D9D9D9; } .talk_list>li:first-child { } .talk_list>li:last-child { border-bottom: none } .talk_top { display: table; width: 100% } .talk_top dt { display: table-cell; width: 30px; height: 30px; border-radius: 100%; vertical-align: middle } .talk_top dt img { width: 30px; height: 30px; border-radius: 100% } .talk_top dd { padding-left: 10px; display: table-cell; vertical-align: middle } .talk_top dd .r.dianed{background:#00a5e0;color:#fff} .talk_top dd p { font-size: 12px; color: #ccc; clear: both } .showpos{color:#999} .showpos i{color:#789f00} .talk_top dd p .gray { padding-left: 5px } .talk_top dd p .gray:hover { color: #999; } .talk_top dd .uname { font-size: 14px; color: #06C; float: none; vertical-align: middle; margin-right: 3px } .talk_top dd i.l { width: 20px; height: 18px; line-height: 17px; background: url(/wap/images/bbsicon.png) 0 -156px no-repeat; background-size: 32px auto; font-style: normal; color: #fff; text-align: center; font-size: 12px } .talk_top dd .r { width: 45px; height: 20px; line-height: 20px; text-align: center; border: 1px solid #d9d9d9; border-radius: 3px; font-size: 12px; color: #666; background: #f0f0f0 } .talk_bot { line-height: 28px; font-size: 16px; padding-top: 5px; word-wrap: break-word;} .topic_n_see{border:1px dashed #ccc;color:#F60;padding:0 10px;} .talk_bot a.blue { color: #999 } .lzteb { font-size: 12px; color: #FFF; background: #44A7DE; border-radius: 3px; line-height: 18px; padding: 0 3px; margin-left: 2px; vertical-align: middle } .talk_tools a { float: right; margin-top: 5px; font-size: 14px; color: #06C; background: url(/wap/images/bbsicon.png) 0 1px no-repeat; background-size: 25px auto; padding-left: 22px; height: 19px; line-height: 19px; margin-left: 15px; cursor: pointer } .talk_tools a.replay { background-position: 0 -155px } .talk_tools a.dianzan { background-position: 0 -65px } .talk_tools a.xiugai { background-position: 0 -360px } .talk_tools a.del { margin-right: 10px; background: url(/wap/images/bbsicon.png) 0 -420px no-repeat; background-size: 29px auto } .gotopage { display: table; width: 100%; background: #F0F0F0; border-top: 1px solid #d5d5d5; border-bottom: 1px solid #d5d5d5; margin-bottom: 15px } .nocomments { padding: 0 10px; display: block; margin-top: 10px } .gotopage a { color: #999 } .gotopage a.f06c { color: #06c } .gotopage li { display: table-cell; height: 44px; line-height: 44px; text-align: center; border-right: 1px solid #d5d5d5; vertical-align: middle; font-size: 16px; color: #999 } .gotopage li:last-child { border-right: none } .gotopage li.inputli { width: 130px; position: relative; background: #EAEAEA } #goPage { position: absolute; left: 0; bottom: 44px; background: #EAEAEA; border: 1px solid #d5d5d5; display: none } .gotopage li.inputli input { width: 100%; -webkit-box-sizing: border-box; box-sizing: border-box; border: none; height: 44px; float: left; background: #EAEAEA; text-align: center; color: #06c; font-size: 16px; font-family: 'Microsoft Yahei', 'Simsun' } .editarea { padding: 15px 10px 0 } .replytxt { width: 100%; height: 100px; border: 1px solid #dadada; padding: 10px; box-sizing: border-box; -webkit-box-sizing: border-box; font-family: 'Microsoft Yahei', 'Simsun'; color: #333; font-size: 16px } .editbot { padding: 10px 10px 20px; position: relative; overflow: hidden } .editbot .reply { position: absolute; right: 10px; top: 10px; padding: 0 10px; height: 35px; line-height: 35px; text-align: center; background: #f90; border-radius: 3px; color: #fff; border: none; font-family: 'Microsoft Yahei', 'Simsun'; font-size: 16px } .editarea .editbot { padding: 10px 0 20px } .editbot .reply { right: 0 } .editbot .l i { float: left; width: 35px; height: 36px; background: url(/wap/images/bbsicon.png) 0 -270px no-repeat; background-size: 35px auto; margin-right: 14px; position: relative } .editbot .l i.cur::after { content: ""; width: 15px; height: 15px; background: #fff; position: absolute; z-index: 20; bottom: -30px; left: 8px; border-top: 1px solid #d9dadb; border-left: 1px solid #d9dadb; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); -moz-transform: rotate(45deg); transform: rotate(45deg) } .editbot .l i#facebot { background-position: 0 -214px } .editbot .l i#atfrd { background-position: 0 -325px } /* 回复层主内容 */ .replay_con { width: 100%; background: #e7e7e7; border: 1px solid #d9dadc; border-radius: 3px; position: relative; margin-top: 10px } .replay_con::after { content: ""; position: absolute; background: #e7e7e7; left: 27px; top: -6px; width: 10px; height: 10px; border-left: 1px solid #d9dadc; border-top: 1px solid #d9dadc; -webkit-transform: rotate(45deg); tranform: rotate(45deg) } .con_li { padding: 10px; border-top: 1px solid #dddee2 } .replay_con .curr { background: #DDD } .replay_con .con_li:first-child { border: none } .con_li_con { font-size: 14px; color: #666; margin-bottom: 10px;word-wrap: break-word;} .con_li_con span { color: #06c } .con_li .time { color: #bebebe; font-size: 12px } .con_li .time .r{color:#06C} .con_li i { font-style: normal } .more_btn { text-align: right; color: #06c; font-size: 12px; padding: 5px 10px; cursor: pointer } .con_li_con .lzteb { float: none } /* 详情 */ .sub-feed { background: #f0f0f0; margin: 0 } .sub-feed .feed { padding: 10px 0; margin: 0; border-bottom: none; background: #f0f0f0 } .sub-feed .feed .top .msg .reply { float: right; color: #999; font-size: 12px; border: 1px solid #d9d9d9; padding: 3px 8px; cursor: pointer } .sub-feed .feed .content { padding-left: 60px; color: #333 } .sub-feed .feed .content p { color: #333; font-size: 14px } .sub-feed .feed .func { overflow: hidden } .sub-feed .feed .func .reply { color: #278edd } .sub-feed .feed .func .reply::before { content: '' } .sub-feed .feed .func { overflow: hidden; padding-right: 10px; margin-top: 5px } .sub-feed .feed .func .reply { color: #278de1; font-size: 12px } .sub-feed .feed .replys { margin: 5px 10px 0 60px; border: 1px solid #dadada; position: relative; padding: 10px 10px 0; clear: left; background: #e7e7e7; border-radius: 3px } .sub-feed .feed .replys::before, .sub-feed .feed .replys::after { content: ''; position: absolute; border: 8px solid transparent; border-bottom-color: #dadada; top: -16px; left: 10px } .sub-feed .feed .replys::after { border-bottom-color: #e7e7e7 !important; top: -15px !important } .sub-feed .feed .replys .replys-item { font-size: 12px; margin-bottom: 5px } .sub-feed .feed .replys .replys-item p { } .sub-feed .feed .replys .replys-item p .username { color: #248de0 } .sub-feed .feed .replys .replys-item .time { color: #c3c3c3 } /* index.html */ .forum { } .forum h3 { background: #f0f0f0; height: 32px; line-height: 32px; font-size: 14px; padding: 0 10px 0 20px; position: relative; border-top: 1px solid #E2E2E2; border-bottom: 1px solid #E2E2E2; } .forum h3::before { content: ''; background: #cc3300; width: 4px; height: 4px; border-radius: 100%; vertical-align: middle; position: absolute; top: 50%; margin-top: -2px; left: 10px } .forum h3 .right { color: #666; float: right; } .forum .inner { padding: 10px 10px 15px; box-sizing: border-box; background: #fff; } .forum .effect { position: relative; width: 100%; padding: 15px 0; display: block; overflow: hidden; background-color: slategrey; } .forum .effect::before { content: ''; width: 0; height: 100%; display: inline-block; vertical-align: middle } .forum .effect canvas { top: 0 !important; left: 0 !important } .forum .effect .bg { position: absolute; width: 100%; top: 0; left: 0; vertical-align: bottom } .forum .effect .avatar { z-index: 2; position: relative; display: inline-block; width: 100px; padding-left: 10px; vertical-align: middle; height: 100px; border-radius: 100%; overflow: hidden; } .forum .effect .avatar img { border-radius: 100%; width: 90px; height: 90px; box-shadow: 0px 0px 0 5px #fff; margin-top: 5px; } .forum .effect .text { position: relative; z-index: 2; display: inline-block; vertical-align: middle; padding-left: 10px;box-sizing: border-box; font-size: 11px; float: right } .forum .effect .text h2 { font-weight: bold; color: #ffff99; background: rgba(0, 0, 0, 0.5); padding: 2px 7px; font-size: 1.76em; display: inline-block; line-height: 30px; overflow: hidden; height: 30px; float: right; text-align: left; word-break: break-all } .forum .effect .text strong { color: #ffff00; font-size: 1.40em; background: rgba(221, 58, 59, 0.6); padding: 3px 5px; float: right; clear: both; line-height: 1.6em; overflow: hidden; height: 1.6em } .forum .effect .text p { color: #fff; background: rgba(255, 255, 255, 0.4); text-align: right; padding: 0 5px; font-size: 1em; max-height: 4.2em; overflow: hidden; line-height: 1.4em; border-top: 4px solid transparent; border-bottom: 4px solid transparent; display: inline-block; float: right; clear: both; max-width: 12em } @media screen and (max-width:374px) { .forum .effect .text { font-size: 11px } } @media screen and (max-width:330px) { .forum .effect .text { font-size: 9px } } .inner { margin: 0; padding: 0 } img.bg { font-family: "Microsoft Yahei" } /* index.html */ .index-nav { height: 42px; line-height: 42px; font-size: 18px; position: fixed; bottom: 0; left: 0; width: 100%; z-index: 9 } .index-nav a { color: #fff; background: #86bc40; display: inline-block; width: 50%; text-align: center; position: relative; height: 42px; line-height: 42px } .index-nav a:first-child { background: #F27D09 } .index-nav a:first-child::after { content: ''; right: -12px; top: 0px; position: absolute; background: #f78719; height: 100%; -webkit-transform: skew(-27deg); width: 35px; z-index: 9; border-right: 2px solid #fff } .index-nav .icon-cover, .index-nav .icon-rank { font-size: 20px; vertical-align: middle; margin-right: 5px; position: relative; top: -1px } /* show.html */ .showTop { position: relative; width: 100%; padding: 15px 10px; box-sizing: border-box; overflow: hidden; height: 157px; background: url(/wap/images/cover_detail_showTop.jpg) center center no-repeat; background-size: cover } .showTop .blur {-webkit-filter: blur(10px);-moz-filter: blur(10px); -ms-filter: blur(10px);filter: blur(10px);} .showTop .shadow { position: absolute; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.4); top: 0; left: 0; z-index: 1 } .showTop .bg { width: 100%; position: absolute; top: -50%; left: 0 } .showTop .left { z-index: 2; text-align: center; float: left; position: relative } .showTop .left .avatar { display: block; margin: 0 auto; border-radius: 100%; padding: 8px; width: 100px } .showTop .left .avatar img { width: 100px; height: 100px; box-shadow: 0 0 0 4px #fff; border-radius: 100%; box-sizing: border-box; vertical-align: bottom } .audio { display: block; position: relative; width: 32px; height: 32px; margin: 0 auto; cursor: pointer; margin-top: -22px; background: url(/wap/images/icon-play.png) 0 0 no-repeat; background-size: 32px } .audio.pause { background-position: 0 -34px } .showTop .left .audio audio { position: absolute; width: 100%; height: 100%; opacity: 0; left: 0; top: 0; z-index: -1; } .showTop .right { float: left; position: relative; z-index: 2; color: #fff; padding-top: 30px; padding-left: 10px } .showTop .right p { color: #fff; font-size: 14px; clear: both; display: block; margin-bottom: 10px; line-height: 24px; height: 24px; } .showTop .right p .icon { display: inline-block; width: 20px; background: url(/wap/images/bbsicon.png) center -518px no-repeat; background-size: 20px; box-shadow: none; height: 24px; float: left; margin-right: 3px; } .showTop .right p b { font-size: 18px; margin-right: 5px; float: left; font-weight: normal; } .showTop .right p span { float: left; } .showTop .right ul { font-size: 14px; position: relative; padding: 15px 0 0 20px } .showTop .right ul::before { content: ''; position: absolute; width: 3px; height: 40%; top: 18px; left: 3px; background: rgba(255, 255, 255, 0.6) } .showTop .right ul li { height: 19px; line-height: 19px; overflow: hidden; word-break: break-all } .showTop .right .like { background: #cd3738; color: #fff; border-radius: 20px; font-size: 14px; position: relative; padding: 6px 15px 6px } .showTop .right .like.ed { -webkit-transition: width 1s; transition: width 1s } .showTop .right .like i { position: absolute; left: 50%; top: 50%; margin-top: -0.5em; margin-left: -0.5em } .showTop .right .like::before { content: '\e649'; font-family: "iconfont" !important; font-size: 16px; font-style: normal; -webkit-font-smoothing: antialiased; -webkit-text-stroke-width: 0.2px; -moz-osx-font-smoothing: grayscale; margin-right: 4px } .invite { display: table; height: 36px; line-height: 36px; color: #dd3a3b; box-sizing: border-box; font-size: 14px; text-align: center; width: 100%; overflow: hidden } @media screen and (max-width:370px) { .invite { font-size: 12px } } @media screen and (max-width:319px) { .invite { font-size: 10px } } .invite span { background: #fae1b6; display: table-cell; padding: 0 10px 0 21px } .invite span:first-child { color: #ffffcc; background: #dd3a3b; display: table-cell; padding: 0 0 0 10px; position: relative } .invite span:first-child:before { content: ''; position: absolute; top: 0; height: 0; width: 0; border-left: 21px solid #dd3a3b; border-top: 18px solid transparent; border-right: 0 solid transparent; border-bottom: 18px solid transparent; right: -21px } .paper { background: #fff; border-radius: 10px; position: relative; box-shadow: 0 1px 2px 0px rgba(0, 0, 0, 0.2); margin: 10px 0; padding: 10px; } .paper.cover_photo::before { content: ''; position: absolute; width: 18px; height: 48px; background: url(data:image/png;base64,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) 0 0 no-repeat; background-size: contain; right: 25px; top: -5px } .paper.non::before { display: none; } .paper>h4 { font-size: 16px; color: #45545C; font-weight: bolder; padding: 5px 0 10px; border-bottom: 1px solid #ccc } .paper>h4 .right { float: right; font-size: 14px; } .paper>h4 .right .icon-edit1 { margin-right: 2px; } .paper .userinfo { background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAcCAYAAACgXdXMAAAABHNCSVQICAgIfAhkiAAAAAlwSFlzAAALEgAACxIB0t1+/AAAABZ0RVh0Q3JlYXRpb24gVGltZQAwMi8wNS8xNdftw7UAAAAcdEVYdFNvZnR3YXJlAEFkb2JlIEZpcmV3b3JrcyBDUzbovLKMAAAAGUlEQVQImWO4++zLf4b///8zMDEwMAwsAQCZ5wboG972lAAAAABJRU5ErkJggg==) 0 -1px repeat; font-size: 14px; line-height: 28px } .paper .userinfo p { line-height: 28px; font-size: 14px } .paper .say { background: #F3F5FA; font-size: 14px; line-height: 28px; padding: 10px; margin-top: 10px; color: #45535B } .paper .album { box-sizing: border-box } .paper .album img { display: block; margin: 0 auto; max-width: 100%; padding-top: 10px } .paper .album p { } #index-wrapper { position: absolute; width: 100%; overflow: auto; height: 100% } #index-scroller { position: absolute; width: 100% } #index-slideDown { text-align: center; height: 32px; line-height: 32px; font-size: 14px; color: #666; margin-top: -10px } .loading #index-slideDown { display: block } /* figurelist.html */ .fbody { background: url(../images/micbg.jpg) 0 0 no-repeat; background-size: 100% 100%; padding-bottom: 45px; background-attachment: fixed; } .figure { top: 0; width: 100%; } .figure .top { height: 45px; position: relative; padding: 0.375rem 1.8572rem 0; box-sizing: border-box; } .figure .top .c { position: relative; height: 2.5rem; } .figure .top .c::before { content: ''; position: absolute; background: #654845; height: 2px; top: 50%; margin-top: -1px; width: 100%; } .figure .top .clock { position: absolute; height: 2.5rem; width: 3.4642rem; text-align: center; left: 0; background: url(../images/corner.png) center center no-repeat; background-size: 100% 100%; } .figure .top .clock::after { content: ''; background: #7d5955; left: 3rem; position: fixed; width: 0.1875rem; height: 300px; z-index: -1; } /* .figure .top .clock::after { content: ''; position: absolute; border-left: 20px solid rgba(0, 0, 0, 0.3); border-top: 12px solid transparent; border-right: 12px solid transparent; border-bottom: 12px solid transparent; top: 8px; } */ #wrapper { width: 100%; overflow: auto; } .figure .top .clock .iconfont { color: #dfd731; font-size: 34px; margin-left: -2px; text-shadow: 0px 0px 2px rgba(0, 0, 0, 0.6); } .figure .top .year { border-top: 1px solid #654845; border-bottom: 1px solid #654845; height: 1.25rem; display: inline-block; position: absolute; top: 50%; margin-top: -0.625rem; right: 0; border-radius: 3px; line-height: 1rem; } .figure .top .year a { display: inline-block; width: 5rem; text-align: center; font-size: 0.75rem; color: #dca892; background: #7d5955; height: 1.25rem; vertical-align: middle; line-height: 1.25rem; margin-top: -2px; } .figure .top .year a.cur { background: -moz-linear-gradient(top, #7c5955, #654845); background: -webkit-gradient(linear, 0 0, 0 bottom, from(#7c5955), to(#654845)); background: -o-linear-gradient(top, #7c5955, #654845); color: #dad133; border-left: 1px solid #654845; border-right: 1px solid #654845; } .figure .f-item { width: 100%; position: relative; padding-top: 10px; } .figure .f-item .line { content: ''; width: 0.1875rem; height: 100%; position: absolute; background: #7d5955; left: 3rem; top: -10px; opacity: 0.5; } span.nianfeng { position: relative; color: #fff; font-size: 14px; background: rgba(0, 0, 0, 0.4); border-radius: 24px; line-height: 24px; height: 24px; display: inline-block; left: 3rem; width: 60px; text-align: center; margin: -24px 0 0 -30px; top: 24px; } .figure.loading { } .figure.loading .f-item { } .figure .f-item .ani { } .figure.loading .f-item .ani { display: block; position: absolute; left: 48px; width: 3px; bottom: -20px; height: 20px; } .figure.loading .f-item .ani i { background: #7d5955; height: 3px; display: block; animation: ani 1s ease-in-out infinite; -webkit-animation: ani linear 1s infinite; -o-animation: ani linear 1s infinite; -moz-animation: ani linear 1s infinite; -ms-animation: ani linear 1s infinite; animation-delay: .25s; -webkit-animation-delay: .25s; -o-animation-delay: .25s; -moz-animation-delay: .25s; -ms-animation-delay: .25s; } @-webkit-keyframes ani { 0% { -webkit-transform: translate3D(0, 0, 0); } 25% { -webkit-transform: translate3D(-5px, 0, 0); } 50% { -webkit-transform: translate3D(0, 0, 0); } 75% { -webkit-transform: translate3D(5px, 0, 0); } 100% { -webkit-transform: translate3D(0, 0, 0); } } .figure.loading .f-item .ani i:first-child { animation-delay: 0s; -webkit-animation-delay: 0s; -o-animation-delay: 0s; -moz-animation-delay: 0s; -ms-animation-delay: 0s; height: 5px; } .figure.loading .f-item .ani i:nth-child(2) { animation-delay: 0.5s; -webkit-animation-delay: 0.5s; -o-animation-delay: 0.5s; -moz-animation-delay: 0.5s; -ms-animation-delay: 0.5s; height: 4px; } .figure.loading .f-item .ani i:last-child { animation-delay: 0.75s; -webkit-animation-delay: 0.75s; -o-animation-delay: 0.75s; -moz-animation-delay: 0.75s; -ms-animation-delay: 0.75s; height: 3px; } .figure.loading .f-item .line { } .figure .f-item a { display: block; overflow: hidden; height: 7.8125rem; margin-bottom: 10px; position: relative; padding-left: 6.25rem; box-sizing: border-box; color: #fff; font-size: 14px; } .figure .f-item a .issues { width: 3.375rem; height: 3.375rem; background: #dfd731; border: 0.1875rem solid #fff; border-radius: 100%; position: absolute; color: #8c6664; text-align: center; vertical-align: middle; font-size: 0.875rem; box-sizing: border-box; top: 50%; margin-top: -1.6875rem; left: 1.375rem; } .figure .f-item a .issues::before { content: ''; display: inline-block; height: 100%; width: 0; vertical-align: middle; } .figure .f-item a .i { width: 100%; height: 100%; background: rgba(0, 0, 0, 0.25); border-radius: 120px 0 0 120px; } .figure .f-item a .i::after { content: ''; position: absolute; right: 1rem; width: 1rem; height: 1rem; border-top: 2px solid #fff; border-right: 2px solid #fff; top: 50%; margin-top: -0.3535rem; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); } .figure .f-item a .i .avatar { position: absolute; width: 5rem; height: 5rem; top: 50%; margin-top: -2.5rem; border: 2px solid #fff; border-radius: 100%; left: 7rem; } .figure .f-item a .i .avatar img { vertical-align: bottom; width: 100%; height: 100%; border-radius: 100%; } .figure .f-item a .i span { position: absolute; left: 13.125rem; height: 100%; vertical-align: middle; line-height: 1.125rem; box-sizing: border-box; font-size: 0.875rem; } .figure .f-item a .i span::after { content: ''; display: inline-block; width: 0; height: 100%; vertical-align: middle; } .figure .f-item a .i span em { vertical-align: middle; display: inline-block; } /* .figure .f-item a .i span::before { content: ''; display: inline-block; height: 100%; width: 0; vertical-align: middle } */ /* show2.html 2014-12-31 */ .sbody { font-size: 16px } #contaienr { /* position: absolute; -webkit-transition: all 0.5s ease-in-out; -moz-transition: all 0.5s ease-in-out; -o-transition: all 0.5s ease-in-out; -webkit-transition: all 0.5s ease-in-out; */ width: 100% } .magazine { position: relative; width: 100%; overflow: hidden; height: 100vh } .magazine::before { content: ''; background: -moz-linear-gradient(top, rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0)); background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0)); background: -webkit-gradient(linear, center top, center bottom, from(rgba(0, 0, 0, 0.45)), to(rgba(0, 0, 0, 0))); background: -o-linear-gradient(top, rgba(0, 0, 0, 0.45), rgba(0, 0, 0, 0)); position: absolute; top: 0; left: 0; width: 100%; z-index: 9; height: 6% } .magazine .images { position: relative; height: 100%; z-index: 0; width: 100% } .magazine .pre, .magazine .next { position: absolute; width: 1.5rem; height: 2.5rem; color: #fff; z-index: 999; top: 50%; margin-top: -3.75rem; font-size: 3em; cursor: pointer; -webkit-animation: arrowLeft 1.5s infinite; left: 10px } .magazine .next { left: auto; right: 10px; -webkit-transform: rotateY(180deg); -moz-transform: rotateY(180deg); -o-transform: rotateY(180deg); transform: rotateY(180deg); -webkit-animation: arrowRight 1.5s infinite } .magazine .images li { height: 100%; overflow: hidden; width: 100%; position: absolute; background: #333; display: none; text-align: center; } .magazine .images li:first-child::after { content: ''; position: absolute; width: 60%; height: 100px; bottom: 80px; left: 20%; background: url(/wap/images/writing.png) center center no-repeat; background-size: contain } .magazine .images li:first-child>div { /* background-size: cover; */margin-top: 0; } .magazine .images li>div { width: 100%; height: 100%; background-repeat: no-repeat; background-position: 50% 50%; margin-top: -38px; background-size: contain; } .magazine .images li.cur { z-index: 10; display: block } .magazine .images li.action { z-index: 11; display: block } .magazine .images li.animated { -webkit-transition: .3s ease-in-out } .magazine .images>li:first-child>img { max-width: none; max-height: none } .magazine .images .tiny { position: absolute; top: 22%; width: 100%; height: 54%; z-index: 1 } .magazine .images .tiny::before, .magazine .images .tiny::after { content: ''; background: #000033; width: 100%; height: 100%; position: absolute; opacity: 0.4; -webkit-transform: skewY(4deg); -moz-transform: skewY(4deg); transform: skewY(4deg); -webkit-transform-origin: 50% 0; left: 0 } .magazine .images .tiny::after { -webkit-transform: skewY(-4deg); -moz-transform: skewY(-4deg); transform: skewY(-4deg) } .magazine .images .info { position: absolute; background: transparent; height: 50%; width: 100%; padding: 0 3.25rem; top: 23%; box-sizing: border-box; font-size: 1rem; color: #fff; z-index: 1 } .magazine .images .info::before { content: ''; display: inline-block; width: 0; height: 100%; vertical-align: middle } .magazine .images .info ul { float: none; display: inline-block; vertical-align: middle } .magazine .images .info li { float: none; width: 100%; height: 1.7rem; overflow: hidden; background: transparent; text-align: left; line-height: 1.7rem; position: static; display: block } .magazine .writing { position: absolute; width: 19.0625rem; height: 6.4375rem; bottom: 6.25rem; left: 50%; margin-left: -9.53125rem; background: url(../images/writing.png) center center no-repeat; background-size: 100% 100%; z-index: 1 } .magazine .writing i { position: absolute; font-size: 1.0625rem; bottom: 0; right: 5.5rem; line-height: 1.0625rem } .magazine .archor { position: absolute; font-size: 1.125rem; bottom: 7.6875rem; z-index: 1; right: 10px } .magazine .shadow { position: absolute; left: 0; height: 75px; background: rgba(0, 0, 0, 0.75); bottom: 0; width: 100%; display: table; table-layout: fixed; overflow: hidden; box-sizing: border-box; padding-left: 80px } .magazine .shadow .stable { display: table; width: 100%; height: 100%; vertical-align: middle; table-layout: fixed } .magazine .shadow .avatar { height: 100%; padding: 0 7px; position: absolute; left: 0 } .magazine .shadow .avatar::before { content: ''; height: 100%; width: 0; vertical-align: middle; display: inline-block } .magazine .shadow .avatar img { width: 60px; height: 60px; border-radius: 100%; vertical-align: middle; box-shadow: 0 0 0 2px #fff } .magazine .shadow .right { color: #fff; float: none; display: table-cell; vertical-align: middle; max-height: 100% } .magazine .shadow .right::before { height: 100%; width: 0; display: inline-block; vertical-align: middle } .magazine .shadow .right i { vertical-align: middle; display: inline-block; font-size: 14px; overflow: hidden } .magazine .shadow .right h2 { font-size: 15px; font-weight: bold; text-shadow: 1px 0 1px #000; margin-bottom: 3px; height: 24px; overflow: hidden; line-height: 24px; word-break: break-all } .magazine .shadow .right h2 em { font-weight: bold; font-size: 15px } .magazine .shadow .right em { color: #ffff00; font-size: 14px } .magazine .shadow .audio { text-align: center; display: inline-block; height: 100%; float: right; padding-right: 1rem } .magazine .shadow .audio::before { content: ''; height: 100%; display: inline-block; width: 0; vertical-align: middle } .magazine .shadow .audio audio { opacity: 0; position: absolute; width: 100%; height: 100%; z-index: 2; left: 0; top: 0 } .magazine .shadow .audio .c { height: 2.6875rem; display: inline-block; vertical-align: middle; position: relative; cursor: pointer; width: 2.6875rem } .magazine .shadow .audio .c.pause { } .magazine .shadow .audio .c::after { content: '\e644'; font-family: "iconfont" !important; font-size: 2.6875rem; font-style: normal; -webkit-font-smoothing: antialiased; -webkit-text-stroke-width: 0.2px; -moz-osx-font-smoothing: grayscale; color: #c1e82a; position: absolute; top: 0; left: 0 } .magazine .shadow .audio .c.pause::after { content: '\e643' } .magazine .shadow .audio .c i { color: #c1e82a; font-size: 0.5625rem; position: absolute; bottom: -0.7825rem; width: 100%; text-align: center; left: 0 } .magazine .shadow .view { font-size: 16px; display: table-cell; padding-left: 8px; vertical-align: middle; min-width: 6em; text-align: right; padding-right: 10px; box-sizing: border-box } .magazine .shadow .view a { color: #ccc } .magazine .shadow .view i { display: inline-block; height: 18px; width: 25px; background: url(/wap/images/bbsicon.png) center -872px no-repeat; background-size: 32px; vertical-align: middle; margin-right: 0.3em; margin-top: -3px } .magazine .media { position: absolute; width: 32px; height: 33px; top: 20px; right: 10px; overflow: hidden; background: url(/wap/images/icon-play.png) 0 0px no-repeat; background-size: 32px } .magazine .media.close { background-position: 0 -34px } .magazine .media audio { width: 100%; height: 100%; opacity: 0 } .magazine .counter { position: absolute; right: 10px; bottom: 85px; color: #fff; z-index: 999; font-size: 12px; } .info { background: #fff; overflow: hidden } .profile { background: #fff; width: 100%; box-sizing: border-box; position: relative; padding: 10px 0 20px 135px } .profile>* { vertical-align: middle } .profile .left { color: #4D515B; font-size: 14px; position: absolute; width: 135px; left: 0; height: 100%; top: 0; box-sizing: border-box; padding: 20px 0; text-align: center } .profile .left strong { color: #2f333f; font-size: 22px; font-weight: bolder; display: block; text-align: center; margin: 13px 0 } .profile .left ul { line-height: 22px; display: inline-block; text-align: left } .profile .left ul li { } .profile .right { float: none; padding: 10px 10px 10px 22px; font-size: 14px; line-height: 24px; width: 100%; display: block; position: relative } .profile .right i.line { position: absolute; width: 3px; background: #74787f; border-radius: 3px; height: 40%; left: 9px; top: 14px } .reflect { padding: 10px; font-size: 16px; line-height: 28px; background-color: #f2f2f2 } .reflect p { background: url(../images/l-writing.png) right bottom no-repeat; background-size: 70px; padding-bottom: 20px } .fbody .fix-bottom { position: fixed; width: 100%; left: 0; bottom: 0; height: 45px; line-height: 45px; background: rgba(90, 60, 60, 0.9) } .fbody .fix-bottom a { width: 50%; box-sizing: border-box; display: inline-block; text-align: center; color: #fff; float: left; } .fbody .fix-bottom a .listicon{width:30px;height:30px;background:url(/wap/images/list_icon.png) 0 0 no-repeat;display:inline-block;vertical-align:middle} .fbody .fix-bottom a:first-child { border-right: 1px solid #4e3831 } .fbody .fix-bottom a .iconfont { font-size: 20px; margin-right: 5px; vertical-align: middle } .userInfo { font-size: 14px; padding: 10px 0 } .userInfo li { } /* rank.html */ .rank { background: #fff; } .rank h3 { color: #DD3A3B; background: #fff; height: 42px; overflow: hidden; padding-left: 10px; font: normal 16px/42px '微软雅黑'; } .rank #content { padding: 10px 5px 0; box-sizing: border-box; background: #f0f0f0; } .rank #content li { display: inline-block; padding: 0 5px; margin-bottom: 10px; min-height: 100px; vertical-align: top; overflow: hidden; box-sizing: border-box; } @media screen and (min-width:420px) and (max-width:620px) { .rank #content li { width: 33.3333% } } @media screen and (max-width:420px) { .rank #content li { width: 50% } } @media screen and (min-width:620px) { .rank #content { display: flex; -webkit-flex-wrap: wrap; } .rank #content li { max-width: 250px; width: 200px; -webkit-flex-grow: 1; } } .rank #content li a { display: block; } .rank li a .img { display: inline-block; width: 100%; overflow: hidden; position: relative; } .rank li a .ranker { position: absolute; color: #fff; width: 32px; height: 32px; overflow: hidden; font-size: 14px; padding: 2px 0 0 3px; box-sizing: border-box; text-align: left } .rank li a .ranker::before { content: ''; background: #FF3300; position: absolute; width: 45px; height: 45px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); left: -22px; top: -22px; z-index: 0 } .rank li a .ranker em { position: absolute; z-index: 1 } .rank li a img { vertical-align: bottom; width: 100%; } .rank li a .bottom { position: absolute; overflow: hidden; bottom: 0px; left: 0; color: #fff; height: 40px; width: 100%; background: -moz-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.7)); background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.7)); background: -webkit-gradient(linear, center top, center bottom, from(rgba(0, 0, 0, 0)), to(rgba(0, 0, 0, 0.7))); background: -o-linear-gradient(top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.7)); text-align: left; } .rank li a .bottom span { position: absolute; width: 100%; bottom: 0; height: 30px; line-height: 30px; padding: 0 5px; box-sizing: border-box; overflow: hidden; font-size: 14px; } .rank li a .bottom .right { vertical-align: bottom; float: right; } .rank li a .bottom .right .iconfont { vertical-align: middle; top: -1px; position: relative; margin-right: 3px; } .rank+#pagepush { margin: 0 auto 60px; } .fix-bottom { position: fixed; bottom: 0; width: 100%; box-sizing: border-box; background: #fff } .fix-bottom.f3>* { width: 33.3% } .fix-bottom>* { text-align: center; width: 50%; display: inline-block; color: #4D515B; font-size: 18px; line-height: 42px; box-sizing: border-box; position: relative } .fix-bottom>*:not(:last-child)::after { content: ''; position: absolute; height: 60%; right: 0; top: 20%; background: #D8D8D8; width: 1px } .fix-bottom .iconfont { font-size: 24px; margin-right: 3px } .fix-bottom .icon-like { font-size: 26px; position: relative; top: -1px } .fix-bottom .icon-comment { position: relative; top: 2px } /* loading 效果 */ .spinner { width: 20px; height: 20px; top: 50%; left: 50%; margin-top: -10px; margin-left: -10px; z-index: 991; display: none; position: absolute } .status .spinner { position: relative; top: 0; left: 0; margin: 0 auto } .status .spinner .container1 > div, .status .spinner .container2 > div, .status .spinner .container3 > div { background-color: #ccc } .container1 > div, .container2 > div, .container3 > div { width: 6px; height: 6px; background-color: #AED028; border-radius: 100%; position: absolute; -webkit-animation: bouncedelay 1.2s infinite ease-in-out; animation: bouncedelay 1.2s infinite ease-in-out; -webkit-animation-fill-mode: both; animation-fill-mode: both } .spinner .spinner-container { position: absolute; width: 100%; height: 100% } .container2 { -webkit-transform: rotateZ(45deg); transform: rotateZ(45deg) } .container3 { -webkit-transform: rotateZ(90deg); transform: rotateZ(90deg) } .circle1 { top: 0; left: 0 } .circle2 { top: 0; right: 0 } .circle3 { right: 0; bottom: 0 } .circle4 { left: 0; bottom: 0 } .container2 .circle1 { -webkit-animation-delay: -1.1s; animation-delay: -1.1s } .container3 .circle1 { -webkit-animation-delay: -1.0s; animation-delay: -1.0s } .container1 .circle2 { -webkit-animation-delay: -0.9s; animation-delay: -0.9s } .container2 .circle2 { -webkit-animation-delay: -0.8s; animation-delay: -0.8s } .container3 .circle2 { -webkit-animation-delay: -0.7s; animation-delay: -0.7s } .container1 .circle3 { -webkit-animation-delay: -0.6s; animation-delay: -0.6s } .container2 .circle3 { -webkit-animation-delay: -0.5s; animation-delay: -0.5s } .container3 .circle3 { -webkit-animation-delay: -0.4s; animation-delay: -0.4s } .container1 .circle4 { -webkit-animation-delay: -0.3s; animation-delay: -0.3s } .container2 .circle4 { -webkit-animation-delay: -0.2s; animation-delay: -0.2s } .container3 .circle4 { -webkit-animation-delay: -0.1s; animation-delay: -0.1s } @-webkit-keyframes bouncedelay { 0%, 80%, 100% { -webkit-transform: scale(0.0) } 40% { -webkit-transform: scale(1.0) } } @keyframes bouncedelay { 0%, 80%, 100% { transform: scale(0.0); -webkit-transform: scale(0.0) } 40% { transform: scale(1.0); -webkit-transform: scale(1.0) } } @-webkit-keyframes arrowLeft { 0% { -webkit-transform: translateX(0px) scale(0.6) } 20% { -webkit-transform: translateX(0px) scale(0.6) } 35% { -webkit-transform: translateX(12px) scale(0.6) } 50% { -webkit-transform: translateX(-18px) scale(0.6) } 65% { -webkit-transform: translateX(0px) scale(0.6) } 80% { -webkit-transform: translateX(-12px) scale(0.6) } 100% { -webkit-transform: translateX(0px) scale(0.6) } } @-webkit-keyframes arrowRight { 0% { -webkit-transform: translateX(0px) scale(0.6) rotateY(180deg) } 20% { -webkit-transform: translateX(0px) scale(0.6) rotateY(180deg) } 35% { -webkit-transform: translateX(-12px) scale(0.6) rotateY(180deg) } 50% { -webkit-transform: translateX(18px) scale(0.6) rotateY(180deg) } 65% { -webkit-transform: translateX(0px) scale(0.6) rotateY(180deg) } 80% { -webkit-transform: translateX(12px) scale(0.6) rotateY(180deg) } 100% { -webkit-transform: translateX(0px) scale(0.6) rotateY(180deg) } } /* 底部 */ .fix-bottom2 {height: 31px; background: #EAEAEA; width: 100%;line-height: 31px; border-top: 1px solid #ccc; color: #929292; font-size: 16px; padding: 7px 0; display: table; z-index: 2;position:fixed;bottom:0;margin: 0px; padding: 0px; max-width: 1024px; } .fix-bottom2>a, .fix-bottom2>span { color: #769CDC; display: table-cell; text-align: center; cursor: pointer; position: relative; font-size: 16px; border-right: 1px solid #ccc; height: 35px } .fix-bottom2>a *, .fix-bottom2>span * { vertical-align: middle } .fix-bottom2>a.active { background: #dd3a3b } .fix-bottom2 .icon-edit { font-size: 26px; vertical-align: middle; position: relative; top: -1px } .fix-bottom2 .return { border-right: 1px solid #ccc; width: 50px } .fix-bottom2 .return::after { content: '\e63c'; font-family: "iconfont" !important; font-size: 25px; font-style: normal; -webkit-font-smoothing: antialiased; -webkit-text-stroke-width: 0.2px; -moz-osx-font-smoothing: grayscale; position: absolute; right: 15px; color: #769CDC; top: 1px } .fix-bottom2 .share { width: 50px } .fix-bottom2 .share .iconfont { font-size: 24px } .fix-bottom2 .more, .fix-bottom2 .more2 { width: 50px; position: relative; border-right: none; float: none } .fix-bottom2 .more i, .fix-bottom2 .more::before, .fix-bottom2 .more::after { content: ''; position: absolute; width: 4px; height: 4px; background: #769CDC; border-radius: 100%; top: 50%; left: 23px; margin-top: -3px } .fix-bottom2 .more::before { left: 15px !important } .fix-bottom2 .more::after { left: 31px !important } .fix-bottom2 .tips { position: absolute; color: #fff; background: #E03016; border: 1px solid #fff; width: 12px; height: 12px; font-family: Arial; text-align: center; font-size: 10px; line-height: 12px; border-radius: 100%; top: -3px; right: 7px } .fix-bottom2 .more em { } .fix-bottom2 .menu { position: absolute; bottom: 50px; text-align: center; border: 1px solid #d7d7d7; border-radius: 3px; width: 86px; right: 0; display: none } .fix-bottom2 .menu a { color: #999; border-bottom: 1px solid #d7d7d7; display: block; line-height: 36px; background: #f9f9f9 } .fix-bottom2 .menu a:last-child { border: none } .fix-bottom2 .menu .share { background: #f4f4f4 } .fix-bottom2 .like em { position: relative } .fix-bottom2 .like em i { position: absolute; left: 0; top: 0; font-size: 12px; color: #f60; line-height: 16px } .fix-bottom2 .user { width: 42px } .fix-bottom2 .user .iconfont { font-size: 20px } .fix-bottom2.detail .like { border: 1px solid #ccc; border-radius: 3px; width: 100%; display: block; text-align: center; box-sizing: border-box; color: #769CDC; background: #F0F0F0; } .fix-bottom2.detail .reply { border: 1px solid #ccc; border-radius: 3px; display: block; text-align: center; box-sizing: border-box; color: #769CDC; background: #F0F0F0; } .fix-bottom2 .oper { padding: 0 5px; box-sizing: border-box; text-align: left } .fix-bottom2 .oper>span { display: inline-block; vertical-align: middle; width: 50%; line-height: 28px; padding: 0 5px; box-sizing: border-box } /* 首页头部 */ .top2015 { border-bottom: 1px solid #E4E4E4 } .top2015 .profile { padding: 10px; box-sizing: border-box; font-size: 14px; overflow: hidden; background: url(/wap/images/forum-top.jpg) 0 0 no-repeat; background-size: 100% 100% } .top2015 .profile .avatar { vertical-align: top; float: left } .top2015 .profile .avatar img { width: 80px; height: 80px; vertical-align: bottom; border-radius: 100%; } .top2015 .profile .right { box-sizing: border-box; padding: 10px 0 5px 90px } .top2015 .profile .right p { color: #fff; font-size: 14px } .top2015 .profile .right .oper { width: 100% } .top2015 .profile .right .oper .sign { color: #fff; border-radius: 3px; font-size: 14px; padding: 4px 8px; margin-top: -4px; float: right; background: #ff9900 } .top2015 .profile .right .oper .sign.ed { background: #999 } .top2015 .profile .right .oper .sign i { display: inline-block; width: 17px; height: 16px; background: url(/wap/images/bbsicon.png) center -50px no-repeat; background-size: 30px; vertical-align: middle; margin-top: -2px } .top2015 .profile .right .oper .sign.ed i { display: none } .top2015 .profile .right .oper .progress { position: relative; box-sizing: border-box; margin: 20px 45px 0 6px } .top2015 .profile .right .oper .progress i { position: absolute; background: url(/wap/images/bbsicon.png) center 0 no-repeat; width: 30px; background-size: 27px auto; height: 30px; left: -11px; top: -11px; text-align: center; line-height: 30px; color: #fff } .top2015 .profile .right .oper .progress #total { display: inline-block; width: 150px; background: #E6E6E6; line-height: 16px; height: 16px; border-radius: 16px; position: relative } .top2015 .profile .right .oper .progress #level { border-radius: 16px; min-width: 20px; width: 20px; background-color: #99cc00; -webkit-transition: width 0.5s; height: 16px } @media screen and (max-width:400px) { .top2015 .profile .right .oper .progress #total { width: 120px } } @media screen and (max-width:370px) { .top2015 .profile .right .oper .progress #total { width: 100px } } @media screen and (max-width:340px) { .top2015 .profile .right .oper .progress #total { width: 80px } .top2015 .profile .right .oper .progress #num { font-size: 12px } .top2015 .profile .right .oper #sign { padding: 2px 4px; font-size: 12px; margin-top: -1px } } .top2015 .profile .right .oper #num { color: #fff } .top2015 .info { line-height: 36px; height: 36px; font-size: 12px; text-align: center; background: url(/wap/images/forum-top-2.jpg) 0 0 no-repeat; background-size: 100% 100%; color: #fff } .top2015 .info span { } .subs { padding: 0 10px; background: #fff; font-size: 16px; border-top: 1px solid #E4E4E4; border-bottom: 1px solid #E4E4E4; margin-bottom: 10px } .subs a { display: block; line-height: 48px; height: 48px; border-bottom: 1px solid #E4E4E4; overflow: hidden } .subs a:last-child { border-bottom: none } .subs .mark { background: #E03016; color: #fff; font-size: 14px; padding: 1px 3px; border-radius: 3px; margin-right: 3px } .fix-table { position: fixed; width: 100%; display: table; bottom: 0; left: 0; font-size: 12px; color: #4C515A; background: #EAEAEA; height: 48px; text-align: center; padding: 4px 0 4px; border-top: 1px solid #ccc;z-index:9 } .fix-table a { display: table-cell; vertical-align: middle; padding: 0 10px } .fix-table a:nth-child(3) { padding: 0 } .fix-table a:hover, .fix-table a:active, .fix-table a:visited { color: #4C515A } .fix-table a i { background: url(/wap/images/bbsicon.png) center -231px no-repeat; background-size: 30px auto; width: 30px; height: 30px; display: block; margin: 0 auto } .fix-table #tb i { background-position: center -275px } .fix-table #tb:hover i, .fix-table #tb.active i { background-position: center -230px } .fix-table #sq i { background-position: center -369px } .fix-table #sq:hover i, .fix-table #sq.active i { background-position: center -323px } .fix-table #edit i { background-position: center -176px; background-color: #E03016; padding: 8px; border-radius: 100%; border: 2px solid #fff } .fix-table #edit:hover i { } .fix-table #hd i { background-position: center -468px } .fix-table #hd:hover i, .fix-table #hd.active i { background-position: center -419px } .fix-table #more i { background-position: center -561px } .fix-table #more:hover i, .fix-table #more.active i { background-position: center -512px } /* 社区 版块 2015-1-23 */ .board { background: #fff; margin-bottom: 10px; font-size: 14px; border-bottom: 1px solid #e4e4e4; border-top: 1px solid #e4e4e4 } .board h3 { line-height: 38px; height: 38px; font-weight: normal; font-size: 16px; padding-left: 20px; position: relative; border-bottom: 1px solid #e4e4e4 } .board h3::before { content: ''; background: #e03016; width: 3px; position: absolute; height: 16px; border-radius: 2px; top: 50%; left: 10px; margin-top: -8px } .board .blist { padding: 0 10px } .board .blist>li { display: table; width: 100%; border-bottom: 1px solid #e4e4e4; } .board .blist>li>a { display: table-cell; overflow: hidden; padding: 10px 0; } .board .blist .gz { display: table-cell; vertical-align: middle } .board .blist>li:last-child>a { border: none } .board .blist a h4 { margin: 3px 0 3px; font-weight: normal } .board .blist a p { color: #999; font-size: 12px; line-height: 16px; height: 16px; text-overflow: ellipsis; overflow: hidden; padding: normal } .board .blist a .right { float: right } .board .blist img { width: 40px; height: 40px; float: left; margin-right: 10px; border-radius: 100% } a.bbsjoin { width: 40px; height: 25px; line-height: 27px; border: 1px solid #d9d9d9; background: #f3f3f3; border-radius: 3px; font-size: 14px; text-align: center; float: right; position: relative; padding-left: 20px; color: #333; } span.bbsjoin { width: 60px; height: 25px; line-height: 27px; border: 1px solid #d9d9d9; background: #f3f3f3; border-radius: 3px; font-size: 14px; text-align: center; color: #999; float: right; } a.bbsjoin i { position: absolute; width: 13px; height: 3px; background: #58b951; border-radius: 2px; left: 8px; top: 11px; } a.bbsjoin i::after { content: ""; position: absolute; height: 13px; width: 3px; background: #58b951; border-radius: 2px; left: 5px; top: -5px; } .board-nav { height: 42px; margin-bottom: 10px; border-bottom: 1px solid #E4E4E4; border-top: 1px solid #E4E4E4; position: relative; z-index: 1; overflow: hidden; background: #fff } /* .board-nav.animate { display: block } .board-nav.animate .board-nav-c { display: block; width: auto; margin-right: -1000px } .board-nav.animate .board-nav-c a { display: inline-block; min-width: 6.5em; } .board-nav.animate::before { content: ''; position: absolute; height: 100%; width: 40px; top: 0; left: 0; background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0)); background: -o-linear-gradient(left, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0)); background: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0)); z-index: 999; } .board-nav.animate::after { content: ''; position: absolute; height: 100%; width: 40px; top: 0; right: 0; background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.9)); background: -o-linear-gradient(left, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.9)); background: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.9)); z-index: 999; } */ .board-nav.endLeft::before { content: ''; position: absolute; height: 90%; width: 40px; top: 5%; left: 0; background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0)); background: -o-linear-gradient(left, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0)); background: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0)); z-index: 999; } .board-nav.endRight::after { content: ''; position: absolute; height: 90%; width: 40px; top: 5%; right: 0; background: -webkit-linear-gradient(left, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.9)); background: -o-linear-gradient(left, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.9)); background: linear-gradient(to right, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.9)); z-index: 999; } .board-nav-c { background: #fff; display: table; width: 100%; font-size: 16px; height: 40px; line-height: 40px; position: relative; } .board-nav-c.fixed { position: fixed; top: 0; left: 0; z-index: 10; width: 100%; opacity: 0.95; border-bottom-color: #FFF; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2); box-sizing: border-box } .board-nav a { display: table-cell; text-align: center; box-sizing: border-box;} .board-nav a.active { border-bottom: 2px solid #E03016 } /* 弹出菜单 */ .pop { position: fixed; height: 100%; background: rgba(0, 0, 0, 0); top: 0; right: 0px; overflow: hidden; -webkit-transition: all 0; z-index: 99; display: none; width: 100%; } .pop .pop-inner { position: absolute; width: 70%; top: 0; height: 100%; -webkit-transition: all 0; opacity: 0; right: 0 } .pop ul { font-size: 16px; color: #4C5159; text-align: left; line-height: normal; overflow-y: scroll; } .pop ul li { border-bottom: 1px solid #E2E2E2 } .pop ul li>a.title { display: block; padding: 0 0 0 5px; text-align: left; line-height: 36px; height: 36px } .pop ul li div { background: #F6F6F6; padding: 5px; border-top: 1px solid #E2E2E2; z-index: 2; position: relative } .pop ul li div i { position: absolute; width: 16px; height: 7px; display: block; overflow: hidden; top: -7px; left: 20px } .pop ul li div i::before { content: ''; -webkit-transform: rotate(45deg); width: 10px; height: 10px; background: #F6F6F6; border: 1px solid #e2e2e2; position: absolute; left: 2px; top: 2px } .pop ul li div a { display: block; line-height: 30px; padding-left: 10px; color: #0066CC; font-size: 14px; height: 30px; overflow: hidden } .pop .bottom { text-align: left; box-sizing: border-box; font-size: 16px; height: 50px; line-height: 50px; background: #F6F6F6; border-top: 1px solid #e2e2e2; position: absolute; bottom: 0; left: 0; width: 100%; padding-left: 10px; color: #769CDC; z-index: 2 } .pop .bottom .iconfont { position: relative; font-size: 22px } .pop .bottom .iconfont em { position: absolute; color: #fff; background: #E03016; border: 1px solid #fff; width: 12px; height: 12px; font-family: Arial; text-align: center; font-size: 10px; line-height: 12px; border-radius: 100%; top: -8px; right: -9px } .pop.active { background: rgba(0, 0, 0, 0.4); display: block; } .pop.active .pop-inner { width: 70%; background: #fff; opacity: 1 } .nocomments { display: block; padding: 10px } /* 版块发布页 */ a.link { display: block; line-height: 42px; height: 42px; overflow: hidden; padding-left: 10px; box-sizing: border-box; background: #F0F0F0; color: #666; position: relative; font-size: 16px; border-bottom: 1px solid #D9D9D9 } a.link::after { content: ''; position: absolute; width: 12px; height: 12px; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; margin-top: -7px; right: 10px; -webkit-transform: rotate(-45deg); top: 50% } form #catogary { color: #333 } #c-list { background: rgba(0, 0, 0, 0.4); position: fixed; top: 0; width: 100%; height: 100%; /*visibility: hidden;*/ z-index: 99;display:none } #c-list.show { display: block } #c-list .c-list-c { position: absolute; width: 70%; right: 0; top: 0; background: #fff; color: #333; height: 100%; overflow-y: scroll;} #c-list .c-itemwrap{padding:50px 0 100px} #c-list .c-item { } #c-list .c-item>a { display: block; border-bottom: 1px solid #e6e6e6; height: 36px; line-height: 36px; overflow: hidden; padding-left: 10px; font-size: 15px } #c-list .c-item ul { padding-left: 10px; line-height: 32px; background: #F6F6F6; -webkit-transition: all 1s; overflow: hidden;display:none } #c-list .c-item ul li { height: 32px; overflow: hidden; color: #0066CC; font-size: 16px; border-bottom: 1px solid #e6e6e6 } #c-list .c-item ul li.sub { font-size: 14px } #c-list .c-item ul li:last-child { border: none } #c-list .c-item ul li span {cursor: pointer;display:block} #c-list .unfold { } #c-list .unfold ul { opacity: 1 } .review.post #title { display: block; border: none; border-bottom: 1px solid #D9D9D9; width: 100%; padding: 10px 0 10px 10px;font-size: 16px; font-family: 'Microsoft Yahei', 'Simsun'; box-sizing: border-box; } .review.post #content { } /* 用户个人主页 profile.html */ .pTop { background: #fff; margin-bottom: 10px; border-bottom: 1px solid #D9D9D9; padding: 15px 10px; overflow: hidden; font-size: 16px; color: #666 } .pTop .avatar { float: left; margin-right: 10px } .pTop .avatar img { width: 60px; height: 60px } .pTop p { margin: 5px 0 5px; line-height: normal } .pTop .edit { float: right; color: #fff; background: #86BC40; font-size: 14px; padding: 2px 5px; border-radius: 3px } .pTop small { font-size: 12px; color: #999 } section.p10 { background: #fff; padding: 0 10px; border-top: 1px solid #D9D9D9; border-bottom: 1px solid #D9D9D9; margin-bottom: 10px } section.p10 a.link { background: #fff; color: #333 } section.p10 a.link::after { content: '\e634'; font-family: "iconfont" !important; font-size: 14px; font-style: normal; -webkit-font-smoothing: antialiased; -webkit-text-stroke-width: 0.2px; -moz-osx-font-smoothing: grayscale; -webkit-transform: rotate(0); color: #ccc; border: none; top: 0; margin-top: 0 } section.p10 a.link:last-child { border: none } section.p10 a.link span { position: absolute; background: #E03016; font-size: 12px; color: #fff; line-height: 14px; text-align: center; border-radius: 100%; height: 14px; width: 14px; right: 25px; margin-top: -7px; top: 50% } /* 个人信息页面 message.html */ #mPage .timeline { background: #F0F0F0; color: #999; font-size: 14px; height: 40px; line-height: 40px; padding-left: 20px; position: relative; border-bottom: 1px solid #E2E2E2 } #mPage .timeline::before { content: ''; position: absolute; width: 2px; height: 100%; background: #D9D9D9; left: 10px } #mPage .timeline::after { content: ''; position: absolute; width: 6px; height: 6px; border-radius: 100%; background: #D9D9D9; left: 7px; top: 50%; margin-top: -3px; border: 1px solid #F0F0F0 } #mPage .message { background: #fff; overflow: hidden } #mPage .message p { border-bottom: 1px solid #E2E2E2; padding: 10px; font-size: 14px; color: #666; line-height: 30px; overflow: hidden; height: 30px } #mPage .message p .avatar { float: left; margin-right: 10px } #mPage .message p a { color: #0066CC } #mPage .message p .avatar img { width: 30px; height: 30px; vertical-align: bottom; border-radius: 100% } #mPage .message p.topic { color: #333; padding: 5px 10px; background: #F6F6F6; overflow: visible; height: auto; line-height: 24px } :hover .iconfont { } .tools.right { border-right: none } .stor_page2 { margin:10px 10px 35px; border: 1px solid #E5E5E5; background: rgba(255, 255, 255, 0.8); height: 37px; background: white; line-height: 37px; text-align: center; font-size: 14px; border-radius: 3px; color: #666 } /* 分享 */ #tip { position: fixed; width: 100%; height: 100%; left: 0; top: 0; background: rgba(0, 0, 0, 0.6); display: none; z-index: 999; } #tipcon { width: 250px; height: 180px; background: url(/wap/images/txt1.png) 0 0 no-repeat; background-size: 250px auto; margin: 30px 30px 0 0; float: right } /* 用户个人主页 user.html */ .user-profile { height: 120px; background: url(/wap/images/user-top.jpg) 0 0 no-repeat; background-size: cover; padding: 15px; box-sizing: border-box; font-size: 16px; color: #fff; } .user-profile .user-avatar { width: 80px; height: 80px; border-radius: 100%; box-shadow: 0px 0px 0px 5px rgba(255, 255, 255, 0.6); vertical-align: bottom; float: left; margin: 5px 15px 0 0; } .user-profile b { font-weight: normal; display: block; } .user-profile b .iconfont { background: #ea68a2; color: #fff !important; padding: 3px; border-radius: 100%; font-size: 10px; margin-left: 5px; } .user-profile span { padding: 10px 0; display: block; font-size: 15px; } .user-profile .user-befriend { color: #fff; background: #f76249; font-size: 14px; height: 24px; display: inline-block; line-height: 24px; padding: 0 5px 0 20px; border-radius: 2px; position: relative; } .user-profile .user-befriend::before { content: ''; position: absolute; width: 2px; height: 12px; background: #fff; left: 10px; top: 6px; } .user-profile .user-befriend::after { content: ''; position: absolute; height: 2px; width: 12px; background: #fff; left: 5px; top: 11px; } .user-profile .user-befriend.seperate { background: #b2b2b2; padding-left: 5px; } .user-profile .user-befriend.seperate::before { display: none } .user-profile .user-befriend.seperate::after { display: none } .user-nav { height: 32px; line-height: 32px; text-align: center; background: #fff; font-size: 16px; margin-bottom: 1px; padding: 4px 0; border-bottom: 1px solid #d9d9d9; } .user-nav a { width: 50%; float: left; position: relative; } .user-nav a:first-child { border-right: 1px solid #d9d9d9; box-sizing: border-box; } .user-nav a:hover, .user-nav a.active { color: #1085cb; } .user-nav a:hover::after, .user-nav a.active::after { content: ''; position: absolute; width: 90%; height: 2px; background: #1085cb; left: 5%; bottom: -4px; } .user-list { color: #444; font-size: 14px; } .user-list { color: #444; font-size: 14px; } .user-list .list { } .user-list .list>li { border-bottom: 1px solid #d9d9d9; padding: 5px 10px; } .user-list .list>li a { } .user-list .list>li a .bt { color: #c4c4c4; padding-top: 5px; } .user-list .list>li a .bt span { float: right; } .user-list .tz h4 { font-weight: normal; font-size: 16px; line-height: 32px; color: #444; } .user-list .tz p { color: #8e8e8e; } .user-list .tz .images { position: relative; overflow: hidden; padding: 0; width: 100%; margin-top: 5px; } .user-list .tz .images li { display: inline-block; text-align: center; vertical-align: middle; padding-right: 5px; width: 33.3%; box-sizing: border-box; max-width: 300px; } .user-list .tz .images img { margin-right: 5px; vertical-align: bottom; width: 100%; max-height: 100%; min-width: 30px; } .user-list .hf li { padding: 0; } .user-list .hf .bt { padding: 0 10px; line-height: 32px; } .user-list .hf p { color: #8e8e8e; line-height: 32px; font-size: 15px; padding: 0 10px; height: 32px; text-overflow: ellipsis; overflow: hidden; } .user-list .hf p.title { color: #444; background: #f2f2f2; font-size: 16px; } /* 爆料 */ .baoliao { border-top: 1px solid #e4e4e4; border-bottom: 1px solid #e4e4e4; background: #fff; display: table; width: 100%; } .baoliao a { display: table-cell; text-align: center; vertical-align: middle; font-size: 16px; padding: 10px 0; position: relative; width: 50%; } .baoliao a:first-child::after { content: ''; width: 1px; height: 80%; background: #e4e4e4; position: absolute; top: 10%; right: 0px; } .baoliao a .icon-volumn { display: block; width: 48px; height: 45px; background: url(/wap/images/icon64.png) center 0 no-repeat; margin: 0 auto 10px; background-size: 48px; background-size: 47px; background-size: 48px; } .baoliao a .icon-user2 { width: 48px; height: 48px; display: block; margin: 0 auto 6px; background: url(/wap/images/icon64.png) 0 -52px no-repeat; background-size: 48px; } .singleline { border-top: 1px solid #e4e4e4; border-bottom: 1px solid #e4e4e4; background: #fff; margin: 10px 0; font-size: 16px; padding: 10px 0 10px 10px; line-height: 22px; } /*问事*/ .wd_qusbox{border:2px solid #FADEC4; background:#FFFEFB; margin:0 0 10px;} .wdqstit{line-height:20px; font-size:14px; padding:5px; color:#999;} .wdorbox{background:#F93; color:#FFF; padding:3px; margin-right:5px;} .wdcont{padding:5px 7px 7px;} .quote{font-size:12px;color:#999} .nav1 { background:#F27D09;height: 42px; line-height: 42px; font-size: 18px; position: fixed; bottom: 0; left: 0; width: 100%; z-index: 9 } .nav1 a { color: #fff; background: #F27D09; display: inline-block; width:100%; text-align: center; position: relative; height: 42px; line-height: 42px } .nav1 .sfmbtn{display:block;width:327px;height:45px;background:url(../images/fabu.png) 0 0 no-repeat;margin:0 auto;position:relative;color:#FFFDDF;line-height:47px} /*问事*/ .wd_qusbox{border:2px solid #FADEC4; background:#FFFEFB; margin:0 0 10px;} .wdqstit{line-height:20px; font-size:14px; padding:5px; color:#999;} .wdorbox{background:#F93; color:#FFF; padding:3px; margin-right:5px;} .wdcont{padding:5px 7px 7px;} .quote{font-size:12px;color:#999} /*投票*/ .qianglou{background:#f3f9fb; border:1px dashed #bdcfdd; padding:3px 7px; font-size:14px;} .qltit{text-align:center; font-weight:bold; border-bottom:1px dashed #bdcfdd; font-size:16px; line-height:35px; color:#F60;} .toupiao{padding:7px; font-size:16px;} .toupiao input{vertical-align:middle; margin-right:5px;} .toupiao label span{color:#999; font-size:14px; padding-left:7px;} .toupiao .bstp{height:15px; border-radius:10px; background:#E8E6D9; margin:5px 0;} .toupiao .bstp div{width:0%; height:15px; border-radius:10px;-webkit-transition:width 0.5s ease-in-out;} .toupiao .z0{background:#319D0D;} .toupiao .z1{background:#FCAA40;} .toupiao .z2{background:#43A6D3;} .toupiao .z3{background:#00CCCC;} .toupiao .z4{background:#99CC00;} .toupiao .z5{background:#CC6600;} .toupiao .z6{background:#CC6699;} .toupiao .z7{background:#3399CC;} .toupiao .z8{background:#6666CC;} .toupiao .z9{background:#CC3300;} .tpbtm{padding:10px 0; color:#999;} #tpbuton{width:130px; height:32px; background:#F90; color:#FFF; border:none; border-radius:3px;} .allpltit{border-top:1px solid #e2e2e2;border-bottom:1px solid #e2e2e2;height:40px;line-height:40px;border-left:3px solid #00a5e0;background:#f5f5f5;box-sizing:border-box;-webkit-box-sizing:border-box;padding:0 10px;margin-top:10px} .allpltit .pxbtn{float:right;color:#999;font-size:14px} .allpltit .pxbtn i{float:left;width:22px;height:18px;background:url(images/paixu.png) 0 0 no-repeat;margin:12px 5px 0 0} .allpltit .pxbtn i.dx{background:url(images/paixu.png) 0 -21px no-repeat;}