File: /www/wwwroot/hk.wecheng.top/static/css/style.css
body{background: #fff;}
#page{max-width:750px; }
* {margin:0;} html,body,#page { padding: 0; margin: 0;font-family: 微软雅黑;}
body {background:#fff; margin:0; padding:0;font-family:Helvetica,Arial,san-serif;font-size:16px;}
a,a:visited { text-decoration:none;}ul,ol,li { list-style:none;}
.fl{float:left}.fr{float:right}
.clearfix:after{content:".";display:block;height:0;clear:both;overflow:hidden;visibility: hidden;}
.clearfix {display: inline-block;} .clr{clear:both}.hidden{display:none!important}
/*add set*/
*,*:after,*:before { -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; }
html,body,header,nav,footer,article,section,form,fieldset,p,div,ul,ol,li,h1,h2,h3,h4,h5,h6 {-webkit-text-size-adjust:none;} /*改变文字大小*/
-webkit-tap-highlight-color:{rgba(0,0,0,0);}-moz-tap-highlight-color:{rgba(0,0,0,0);}/*链接高亮*/
-webkit-touch-callout:{none;}-moz-touch-callout:{none;}/*长按弹出选项菜单*/
.dn{display:block;}
.sj{display:none;}
#page { margin:0 auto; padding:0; width:100%;height:auto;min-height:100%; }
header {margin:0 auto; padding:0; width:100%;text-align:center; line-height:40px; height:40px; background:#000;color:#fff; white-space:nowrap; overflow:hidden;}
header img {height:40px;margin:0;padding:0;}
header h1 {font-size:26px;margin: auto;line-height: 40px;font-weight: bold;}
header h2,header h3 { width:15%; display:inline;font-size:0.8em; background:#000; }
header h2 { position: absolute; left:0; top:0;}
header h3 { position:absolute; right:0; top:0;}
header h2 a,header h3 a { padding:5px 6px;border:1px solid #666; border-radius:4px; color:#ddd;}
header a.icon {display:block;height:40px;line-height:40px;padding:0;border:0;color:#333;text-indent:100em;opacity:.7;filter:alpha(opacity=70);-moz-opacity:.7;/*FF*/ overflow:hidden;}
header a.fresh{ background:url("http://dou.xyzkb.com/images/fresh.png") 50% 50% no-repeat; background-size: 32px 32px;}
header a.home { background:url("http://dou.xyzkb.com/images/home.png") 50% 50% no-repeat; background-size: 36px 36px;}
header a.tel { background:url("http://dou.xyzkb.com/images/call.png") 50% 50% no-repeat; background-size: 36px 36px;}
section.topfixed{margin:0 auto; padding:0; width:100%;position: fixed;text-align:left; line-height:25px; height:auto;
background:rgba(68,54,28,0.9);box-shadow:0 3px 3px rgba(30,30,30,0.6);color:#fff; overflow:hidden;text-shadow:none;}
section.topfixed p {padding:5px;margin:0;}
.lv {background:#000;height:40px; width:100%;text-align:center;margin:0; padding:0;}
.banner {margin:0;padding:0;text-align:center;width:100%;height:auto;overflow:hidden;-webkit-animation:fadeIn .6s .2s ease both;-moz-animation:fadeIn .6s .2s ease both;position: relative;}
.banner img {border:0;width:auto;max-width:100%; float:left; margin:0 auto; padding:0;}
.banner p {width:100%;font-size:26px;color:#fff;font-weight:bold; text-shadow:1px 1px 0 #000;}
.nian {position:absolute;left:61.875%;top:5.75%;font-size:45px;}
nav {margin:0 auto; padding:0; width:100%;position:fixed; left:0; bottom:0;
-webkit-animation:fadeInUpBig 1s 0.2s ease both;-moz-animation:fadeInUpBig 1s 0.2s ease both; }
nav ul {margin:0 auto;padding:0 0; height:45px; width:100%; background:#e30; overflow:hidden;}
nav ul li { width:33.3%; float:left; text-align:center;}
nav ul li a { display:block; line-height:45px;width:100%;color:#fff;font-size:0.8em; }
nav ul li a strong { display:block; position: relative;top:10px;left:0; font-weight:normal;}
nav ul.Transverse {position:relative;}
nav ul.Transverse li a {border-right:1px dotted #f66;}
nav ul.Transverse li:last-child a {border-right:0px;}
nav ul.Transverse li a strong{ display:inline; position: inherit;font-weight:normal;padding-left:32px; line-height:45px;font-size:14px;}
nav ul.Transverse li a:hover,nav ul.Transverse li a strong:hover{ color:#fff; text-decoration:none;}
nav ul.Transverse li:nth-child(1) a strong{background:url("http://dou.xyzkb.com/images/catalogue.png") left center no-repeat; background-size: 28px 28px;}
nav ul.Transverse li:nth-child(2) a strong{background:url("http://dou.xyzkb.com/images/praise.png") left center no-repeat; background-size: 28px 28px;}
nav ul.Transverse li:nth-child(3) a strong{background:url("http://dou.xyzkb.com/images/buy.png") left center no-repeat; background-size: 28px 28px;}
nav ul.Transverse li:nth-child(1) a.home strong{background:url("http://dou.xyzkb.com/images/home.png") left center no-repeat; background-size: 28px 28px;}
nav ul.Transverse li span {color:#333}
section ul {margin:0 auto; padding:0; height:auto; overflow:hidden;}
section ul li {width:50%; margin:0; padding:0; float:left;}
section ul li a { display:block; height:60px; width:100%; margin:0; text-align:center;}
section ul li a img {height:50px; width:60px; vertical-align:middle; margin:5px auto;}
section ul li:nth-child(1) a { float:right;background:#f00;-webkit-animation:fadeInLeftTopBig 1s .2s ease both;-moz-animation:fadeInLeftTopBig 1s .2s ease both;}
section ul li:nth-child(2) a { float:left;background:#ff0;-webkit-animation:fadeInRightTopBig 1s .2s ease both;-moz-animation:fadeInRightTopBig 1s .2s ease both;}
section ul li:nth-child(3) a { float:right;background:#00f;-webkit-animation:fadeInLeftBottomBig 1s .2s ease both;-moz-animation:fadeInLeftBottomBig 1s .2s ease both;}
section ul li:nth-child(4) a { float:left;background:#0f0;-webkit-animation:fadeInRightBottomBig 1s .2s ease both;-moz-animation:fadeInRightBottomBig 1s .2s ease both;}
section.buy {width:100%; height:auto; background:#44361C; padding:5px 0 15px;text-shadow:none;text-align:center; overflow:hidden;
-webkit-animation:bounceInkeep .3s .2s linear both;-moz-animation:bounceInkeep .3s .2s linear both;-o-animation:bounceInkeep .3s .2s linear both;}
.row1,.row2 {width:96%; height:auto;margin:0 auto;padding:0; clear:both;}
.row2 {border-top:1px dotted #524524; padding:10px 0; line-height:30px; height:50px; overflow:hidden;}
.row1 strong { display:block;width:35%;float:left;font-size:48px;color:#ff0;text-shadow:1px 1px 0px #000; line-height:60px;}
.row1 ol {width:65%; height:inherit;margin:0;padding:0; overflow:hidden;}
.row1 ol li {width:33%; float:left;color:#886536; line-height:30px; }
.row1 ol li p{color:#9A9B74;}
.row2 strong {display:block;width:35%;line-height:30px; height:30px;float:left;font-size:20px;color:#9A7C48;}
.row2 .djs {width:65%; line-height:30px; height:30px;margin:0;padding:0; color:#dd9;overflow:hidden;}
.row2 .djs input {color:#D0740A;background:none;font-size:26px; text-align:right;}
section.buy a.button,section.buy button{display:block; width:96%; margin:0 auto; height:46px; line-height:42px;font-size:26px;border-radius:4px;
border:1px solid #EE3B1A;text-shadow:0 1px 0 #000;color:#fff;
background:-webkit-linear-gradient(top,#F9A58B 0%,#F9A58B 3%,#F1714A 6%,#F37751 49%,#EC3B07 51%,#EA3001 100%);
background:-moz-linear-gradient(top,#F9A58B 0%,#F9A58B 3%,#F1714A 6%,#F37751 49%,#EC3B07 51%,#EA3001 100%);
background:-o-linear-gradient(top,#F9A58B 0%,#F9A58B 3%,#F1714A 6%,#F37751 49%,#EC3B07 51%,#EA3001 100%);
background:-ms-linear-gradient(top,#F9A58B 0%,#F9A58B 3%,#F1714A 6%,#F37751 49%,#EC3B07 51%,#EA3001 100%);
background:linear-gradient(top,#F9A58B 0%,#F9A58B 3%,#F1714A 6%,#F37751 49%,#EC3B07 51%,#EA3001 100%);}
section.buy a.btn{border-color: #F40;background: #F40;
display:block;width:96%;margin:5px auto; padding:10px 0; text-align:center;color:#fff;text-shadow:1px 1px 1px #333;border-radius:6px;}
section.Glist { background:#f0f0f0;}
section.Glist ul { height:auto; width:100%; margin:0 auto; padding:20px 10px; overflow:hidden; text-shadow:none;border-top:1px solid #fff; border-bottom:1px solid #ddd;}
section.Glist ul li img {border:0px;}
section.Glist ul li:nth-child(1) {width:100%; padding:0; line-height:30px; font-weight:bold; font-size:16px;color:#4F4F4F;}
section.Glist ul li:nth-child(2) { width:35%; float:left;}
section.Glist ul li:nth-child(2) img { width:100%; height:220px; padding:0px 5px;}
section.Glist ul li:nth-child(3) { width:65%; float:left; padding:0;}
section.Glist ul li:nth-child(3) dl { padding:18px 0; height:auto; width:100%; overflow:hidden;}
section.Glist ul li:nth-child(3) dl:nth-child(1) dt { width:40%; float:left;font-size:32px; color:#f30}
section.Glist ul li:nth-child(3) dl:nth-child(1) dd { width:60%; float:left;font-size:12px; color:#333; text-align:right;}
section.Glist ul li:nth-child(3) dl:nth-child(1) dd p {font-weight:bold;color:#600;}
section.Glist ul li:nth-child(3) dl:nth-child(2) { border-top:1px dotted #ddd; border-bottom:1px dotted #ddd;}
section.Glist ul li:nth-child(3) dl:nth-child(2) dt { width:100%;font-size:16px; color:#300; line-height:20px;}
section.Glist ul li:nth-child(3) dl:nth-child(2) dd { width:100%;font-size:16px; color:#333;}
section.Glist ul li:nth-child(3) dl:nth-child(2) dt b,section.Glist ul li:nth-child(3) dl:nth-child(2) dd span { display:block;width:33.3%; float:left; text-align:center;color:#600;}
section.Glist ul li:nth-child(3) dl:nth-child(2) dt b {color:#666;}
section.Glist ul li:nth-child(4) { width:65%;float:left; padding:0;}
section.Glist ul li:nth-child(4) strong { display:block;width:100%; height:40px; line-height:40px; background:#f30;color:#fff;border-radius:6px; text-align:center; margin:12px 0 0;}
section.Glist ul:first-child {border-top:0;}section.Glist ul:last-child {border-bottom:0;}
@media only screen and (max-width: 480px) {
header h1 {font-size:16px;}
.row1 ol li {width:33%; float:left;color:#886536; line-height:30px;font-size:12px; }
.row1 ol li p{color:#9A9B74;font-size:16px;}
section.Glist ul li:nth-child(2) {width:45%;}
section.Glist ul li:nth-child(3) {width:55%;}
section.Glist ul li:nth-child(2) img { width:100%; height:135px; padding:10px 5px;}
section.Glist ul li:nth-child(3) dl { padding:15px 0;}
section.Glist ul li:nth-child(3) dl:nth-child(1) dt { width:38%; float:left;font-size:16px; color:#f30}
section.Glist ul li:nth-child(3) dl:nth-child(1) dd { width:62%; float:left;font-size:10px; color:#333; text-align:right;}
section.Glist ul li:nth-child(3) dl:nth-child(2) { border-top:1px dotted #ddd; border-bottom:1px dotted #ddd;}
section.Glist ul li:nth-child(3) dl:nth-child(2) dt { width:100%;font-size:12px; color:#300; line-height:20px;}
section.Glist ul li:nth-child(3) dl:nth-child(2) dd { width:100%;font-size:12px; color:#333;}
section.Glist ul li:nth-child(4) { width:100%;float:left; padding:0;}
section.Glist ul li:nth-child(4) strong { display:block;width:100%; height:40px; line-height:40px; background:#f30;color:#fff;border-radius:6px; text-align:center; margin:0 auto;}
}
@media only screen and (max-width: 320px) {
section.Glist ul li:nth-child(2) img { width:100%; height:115px; padding:10px 5px;}
section.Glist ul li:nth-child(3) dl:nth-child(1) dt { width:30%; float:left;font-size:16px; line-height:20px; color:#f30}
section.Glist ul li:nth-child(3) dl:nth-child(1) dd { width:70%; float:left;font-size:10px; color:#333; text-align:right;}
section.Glist ul li:nth-child(3) dl:nth-child(2) { border-top:1px dotted #ddd; border-bottom:1px dotted #ddd;}
section.Glist ul li:nth-child(3) dl:nth-child(2) dt { width:100%;font-size:12px; color:#300; line-height:16px;}
section.Glist ul li:nth-child(3) dl:nth-child(2) dd { width:100%;font-size:12px; color:#333;}
section.Glist ul li:nth-child(4) { width:100%;float:left; padding:0;}
section.Glist ul li:nth-child(4) strong { display:block;width:100%; height:40px; line-height:40px; background:#f30;color:#fff;border-radius:6px; text-align:center; margin:0 auto;}
}
article.showcontent {margin:0; padding:0;width:100%; height:auto;overflow:hidden;}
article.showcontent h2,.banner h2,article h2{background:#EEE9E6;color:#6C594D;font-size:18px; line-height:30px; padding:0 10px;margin:0; width:100%; clear:both; text-align:left;}
article.showcontent h2:before,.banner h2:before,article h2:before {content:"▼";color:#948157;}
article.showcontent img {border:none;margin:0; padding:0; text-align:center;width:auto;max-width:100%;}
article.showcontent p{line-height:1.6em;}
/*timer*/
.time-count{text-align:center; margin:0; font-size:14px;}
.time-count span{font-weight:bold; padding:0 0 0 5px ; color:#D0740A;font-size:26px;}
article.des {width:94%;margin:0 auto;padding:10px 0; text-align:left;border-top:1px dotted #524524;color:#856D35;text-shadow:1px 1px 1px #33250C}
article.showcontent .btn {padding:10px;}
article.showcontent .btn a[href^="tel:"]{background-../images/:url("http://dou.xyzkb.com/images/call.png");}
article.showcontent .btn a[href^="sms:"]{background-../images/:url("http://dou.xyzkb.com/images/sms.png");}
article.showcontent .btn a[href^="http:"]{background-../images/:none;}
article.showcontent .btn a[href^="sms:"],article.showcontent .btn a[href^="mailto:"],article.showcontent .btn a[href^="tel:"],article.showcontent .btn a[href^="http:"]{
background-position:10% 50%;background-size: 32px 32px;background-repeat:no-repeat; background-color:#ff5600;
display:block;width:100%;margin:5px 0; text-align:center;color:#fff;text-shadow:1px 1px 1px #333;border-radius:6px;}
article.showcontent .btn a[href^="http:"]{background-size: 24px 24px;}
footer {text-align:center;margin:0px auto 0; padding-top:10px;margin-top:50px;width:100%; clear:both;font-size: 14px;}
footer p {font-size:16px; padding-top:5px;}
footer p img {max-width:98%;margin:0 auto;}
about {text-align:center;margin:0px auto 0; padding:0;width:100%; clear:both}
about p {font-size:14px; padding-top:5px;}
about p img {max-width:98%;margin:0 auto;}
@media(max-width:768px) {
.dn{display:none!important;}
.sj{display:block!important;}
}
@media only screen and (max-width: 480px) {
.row1 strong { display:block;width:35%;float:left;font-size:36px;color:#ff0;text-shadow:1px 1px 0px #000;}
.row2 strong {display:block;width:35%;float:left;font-size:12px;color:#9A7C48;}
.row2 .djs {width:65%; height:inherit;margin:0;padding:0; color:#dd9;overflow:hidden;}
.row2 .djs input {color:#D0740A;background:none;font-size:12px; text-align:right;}
.time-count{text-align:center; margin:0; font-size:12px;}
.time-count span{font-weight:bold; padding:0 5px; color:#D0740A;font-size:14px;}
}
article {width:100%; margin:0 auto; padding:0px 0; line-height:24px;font-size:1.0em;
-webkit-animation:bounceInkeep .3s .2s linear both;-moz-animation:bounceInkeep .3s .2s linear both;}
nav a.thisclass, #home.thisclass,#about.thisclass, #shop.thisclass, #case.thisclass, #call.thisclass, #navi.thisclass, #sms.thisclass, #contact.thisclass, #write.thisclass{ background-color:#333;}
.btn {width:100%;height:auto;clear:both;padding:5px 0;overflow:hidden;}
article~div.btn { padding-top:0px;}
#logo{text-align:left;padding:6px 0.4em;background:#000;}
.header {margin:0;padding:0;border:none;}
.copy {font-size:12px;text-align:center;}
input,select,textarea{font:100% Microsoft YaHei,\5FAE\8F6F\96C5\9ED1,SimSun,\5B8B\4F53,Arial,Verdana;}em{font-style:normal;color:#F00;margin-right:5px;}img{border:0 none;vertical-align:middle;}.red{color:#F00;}#order{margin:0 auto;}.warp{width:auto;height:100%;}.title{height:36px;line-height:36px;color:#FFF;font-size:18px;vertical-align:middle;margin-bottom:10px;padding-left:8px;}.warp label.bdxx{float:left;display:inline;overflow:hidden;width:24%;_width:23%;text-align:right;padding-right:2%;}.warp label.bdxxcp{float:left;display:block;width:95%;height:20px;line-height:20px;padding-left:5%;}.dxbox,.xlbox,.textbox,.text2box,.text3box{float:left;display:inline;overflow:hidden;width:74%;_width:73%;}.dxboxcp{float:left;display:block;width:85%;padding:0 5% 0 10%;margin-top:8px;font-weight:bold;font-size:14px;line-height:1.7em;}.dxbox,.text2box,.text3box{line-height:1.5em;}.bdbox{float:left;width:100%;margin-bottom:10px;*margin-bottom:7px;}.dxboxcp label{margin-left:6px;cursor:pointer;}.dxbox label{margin-left:6px;margin-right:4px;cursor:pointer;}.textbox input{width:90%;font-size:16px;color:#666;padding:3px 5px;_padding:2px 5px;}.text3box #showprice{clear:both;display:inline;font-family:Arial,Verdana;font-size:14px;font-weight:bold;color:#F60;margin:0 5px;}.xlbox select.cpxl{font-size:16px;width:96%;height:28px;border:1px solid #a0a0a0;background:#FCFCFC;}.xlbox select.dqxl{width:30.15%;height:26px;border:1px solid #a0a0a0;}.text2box textarea{width:90%;height:40px;padding:4px 5px;background:#FFF;}.text3box input{width:40px;font:16px Arial;color:#666;font-weight:bold;text-align:center;vertical-align:middle;margin-right:8px;padding:4px 5px 3px;background:#FFF;}.text3box .code{width:100px;height:29px;}.text3box a{font-size:12px;margin-left:6px;}.subbox{width:100%;float:left;text-align:center;padding-bottom:10px;}.subbox input{width:200px;height:36px;line-height:36px;color:#FFF;font-size:18px;vertical-align:middle;cursor:pointer;border:0;}#fahuo{width:100%;font-size:12px;line-height:200%;background:#EFEFEF;text-align:left;border-top:1px solid #DDDDDD;}#fahuo ul{padding:10px;height:105px;overflow:hidden;}#fahuo span{color:#0C3;}
#order{width:100%;#fcfcfc;padding-top:20px;}
.subbox input{
background-color: #ff5600;
display: block;
line-height:100%;
margin: 5px auto;
margin-bottom: 20px;
padding: 10px 0;
text-align: center;
color: #fff;
text-shadow: 1px 1px 1px #333;
border-radius: 6px;}
.container {
max-width:400px;
width:100%;
margin:0 auto;
position:relative;
}
#contact input[type="text"], #contact input[type="email"], #contact input[type="tel"], #contact input[type="url"], #contact textarea, #contact button[type="submit"] { font:400 12px/16px "Open Sans", Helvetica, Arial, sans-serif; }
#contact {
background:#F9F9F9;
padding:25px 25px 0 25px;
margin:5px 0;
}
#contact h3 {
color: #F96;
display: block;
font-size: 30px;
font-weight: 400;
}
#contact h4 {
margin:5px 0 15px;
display:block;
font-size:13px;
}
fieldset {
border: medium none !important;
margin: 0 0 10px;
min-width: 100%;
padding: 0;
width: 100%;
}
#contact input[type="text"], #contact input[type="email"], #contact input[type="tel"], #contact input[type="url"], #contact textarea {
width:100%;
border:1px solid #CCC;
background:#FFF;
margin:0 0 5px;
padding:10px;
}
#contact input[type="text"]:hover, #contact input[type="email"]:hover, #contact input[type="tel"]:hover, #contact input[type="url"]:hover, #contact textarea:hover {
-webkit-transition:border-color 0.3s ease-in-out;
-moz-transition:border-color 0.3s ease-in-out;
transition:border-color 0.3s ease-in-out;
border:1px solid #AAA;
}
#contact textarea {
height:80px;
max-width:100%;
resize:none;
}
#contact button[type="submit"] {
cursor:pointer;
width:100%;
border:none;
background:#0CF;
color:#FFF;
margin:0 0 5px;
padding:10px;
font-size:15px;
}
#contact button[type="submit"]:hover {
background:#09C;
-webkit-transition:background 0.3s ease-in-out;
-moz-transition:background 0.3s ease-in-out;
transition:background-color 0.3s ease-in-out;
}
#contact button[type="submit"]:active { box-shadow:inset 0 1px 3px rgba(0, 0, 0, 0.5); }
#contact input:focus, #contact textarea:focus {
outline:0;
border:1px solid #999;
}
::-webkit-input-placeholder {
color:#888;
}
:-moz-placeholder {
color:#888;
}
::-moz-placeholder {
color:#888;
}
:-ms-input-placeholder {
color:#888;
}
/*pj*/
#pj{width:100%;height:380px;overflow:hidden;margin:10px 0;}
#pj ul.allpj{margin:0;padding:0;}
#pj li{width:95%;margin:5px 2.5% 25px;padding:0;}
#pj .le{text-align:left;}
#pj .ri{text-align:right;}
#pj .touxiang{width:40px;height:40px;background:url(http://dou.xyzkb.com/images/touxiang.png);background-size:40px 40px;padding:0px;margin:0px;display:inline-block;vertical-align:top;}
#pj .lj{margin-top:20px;vertical-align:top;}
#pj section{max-width:80%;min-width:50%;margin-top:0.7em;padding:8px;text-align:left;border-radius:1em;display:inline-block;}
#pj section.l{margin-left:-0.4em;background-color: rgb(255, 228, 200);}
#pj section.r{margin-right:-0.4em;background-color: rgb(188, 227, 249);}
/*END*/
@font-face {
font-family: 'Mistral';
src: url("http://dou.xyzkb.com/css/fonts/mistral.ttf");
}
/**bootstrap 重定义**/
.container-fluid, .row-fluid {
padding: 0px;
margin: 0px;
width: 100%;
}
.row-fluid.header {
background-color: #4d5158;
}
.row-fluid.nav {
background-color: #FFFFFF;
}
.row-fluid.panels {
}
.row-fluid.panels.bg {
background-color: #FFFFFF;
}
.row-fluid.footer {
background-color: #4d5158;
}
.row-fluid img {
max-width: 100%;
}
.modal .modal-content {
border-radius: 0px;
}
.modal .btn {
padding: 10px 25px;
border-radius: 0px;
margin-left: 14px!important;
}
.modal .btn.btn-default {
color: #F40;
border-color: #F40;
}
.modal .btn.btn-primary {
color: #FFFFFF;
background-color: #F40;
border-color: #F40;
}
.modal .modal-header {
padding-top: 20px;
padding-left: 20px;
}
.modal .modal-header button {
font-size: 28px;
}
.modal .modal-body {
font-size: 16px;
line-height: 32px;
}
.modal .modal-body p {
margin-top: 10px;
text-indent: 2em;
}
.modal .modal-body .form-control {
height: 42px;
border-radius: 0px;
line-height: 40px;
}
.modal .modal-body label {
line-height: 36px;
}
.modal .modal-body label.checkbox-inline span, .modal .modal-body label.radio-inline span {
display: inline-block;
vertical-align: center;
}
.modal .modal-body label.checkbox-inline span:before, .modal .modal-body label.radio-inline span:before {
width: 20px;
height: 20px;
padding: 2px 3px;
margin-right: 8px;
border-radius: 16px;
border: 1px solid silver;
font-family: 'Glyphicons Halflings';
content: '\e013';
font-size: 14px;
line-height: 14px;
color: silver;
}
.modal .modal-body input[type=checkbox], .modal .modal-body input[type=radio] {
display: none;
}
.modal .modal-body input[type=checkbox]:checked + span:before, .modal .modal-body input[type=radio]:checked + span:before {
background-color: #F40;
border-color: #F40;
color: #FFFFFF;
}
.swiper-container {
overflow: hidden;
}
.swiper-container .swiper-wrapper {
height: auto;
}
.swiper-container .swiper-wrapper .swiper-slide {
height: auto;
overflow-y: hidden;
}
.thumbnail {
border-radius: 0px;
}
/**pep原生**/
html {
width: 100%;
font-size: 14px;
color: #000000;
background-color: #f5f5f5;
}
a:hover {
text-decoration: none;
}
.pep {
width: 100rem;
width: 100%;
clear: both;
display: block;
margin: 0px auto;
font-size: 16px;
}
.pep .score {
font-size: 150px;
color: #FF0000;
font-family: Mistral;
letter-spacing: 20px;
position: absolute;
top: 40px;
left: 400px;
opacity: 0.9;
z-index: 9;
transform: rotate(-10deg);
}
.pep.header {
color: #FFFFFF;
padding: 10px;
font-size: 0.9rem;
overflow: hidden;
line-height: 1.8rem;
}
.pep.header a {
color: #FFFFFF;
text-decoration: none;
}
.pep.header a:hover {
color: #FFFFFF;
}
.pep.header ul {
margin: 0px;
}
.pep.header ul li {
padding-left: 5px;
padding-right: 5px;
}
.pep.nav {
color: #000000;
padding: 10px;
}
.pep.nav a {
color: #000000;
text-decoration: none;
}
.pep.nav a:hover {
color: #F40;
}
.pep.nav .btn {
padding: 10px 25px;
border-radius: 0px;
}
.pep.nav .btn-default {
color: #F40;
border-color: #F40;
}
.pep.nav .btn-primary {
color: #FFFFFF;
background-color: #F40;
border-color: #F40;
}
.pep.nav .btn-primary:hover {
color: #FFFFFF;
}
.pep.nav ul {
margin: 0px;
}
.pep.nav ul li {
padding-left: 2rem;
padding-right: 2rem;
font-size: 16px;
line-height: 4.2rem;
font-weight: bold;
}
.pep.nav ul li.nopadding {
padding-left: 0px;
}
.pep.nav .menu {
padding-top: 10px;
}
.pep.nav .title {
font-size: 2rem;
line-height: 80px;
}
.pep.panels {
overflow: hidden;
color: #000000;
padding-top: 1rem;
}
.pep.panels .btn:active {
box-shadow: none;
}
.pep.panels.bg {
background-color: #FFFFFF;
}
.pep.panels:last-child {
padding-bottom: 1rem;
}
.pep.panels .nopadding {
padding-left: 0px;
padding-right: 0px;
}
.pep.panels .leftmenu {
margin: 0rem;
background-color: #FFFFFF;
border: 1px silver solid;
}
.pep.panels .leftmenu .title {
font-size: 1.5rem;
line-height: 3rem;
padding-bottom: 5px;
margin-bottom: 20px;
font-weight: bold;
border-bottom: 1px solid silver;
margin-top: -10px;
}
.pep.panels .leftmenu.padding {
padding: 2rem 1rem 1rem 1rem;
}
.pep.panels .leftmenu.noborder {
border: 0px;
}
.pep.panels .leftmenu .questionindex {
height: 540px;
padding: 1.5rem 1.5rem;
overflow-y: hidden;
}
.pep.panels .leftmenu .btn {
width: 42px;
height: 42px;
line-height: 40px;
padding: 0px;
text-align: center;
margin-bottom: 10px;
margin-left: 10px;
color: #FFFFFF;
}
.pep.panels .leftmenu .btn.btn-default {
color: #F40;
border-color: #F40;
}
.pep.panels .leftmenu .btn.btn-primary {
color: #FFFFFF;
background-color: #F40;
border-color: #F40;
}
.pep.panels .leftmenu .topbox {
background-color: #4d5158;
color: #FFFFFF;
font-size: 20px;
text-align: center;
line-height: 60px;
}
.pep.panels .leftmenu ul {
padding: 1.5rem 2rem;
}
.pep.panels .leftmenu ul li {
font-size: 16px;
line-height: 52px;
display: block;
overflow: hidden;
color: #6A6A6A;
border-bottom: 1px solid #f5f5f5;
font-weight: bold;
}
.pep.panels .leftmenu ul li:last-child {
border-bottom: 0px;
}
.pep.panels .leftmenu ul li .glyphicon {
line-height: 42px;
color: #6A6A6A;
margin-right: 20px;
}
.pep.panels .leftmenu ul li .glyphicon:last-child {
margin-right: 0rem;
font-size: 12px;
line-height: 48px;
}
.pep.panels .leftmenu ul li.active {
color: #F40;
}
.pep.panels .leftmenu ul li.active .glyphicon {
color: #F40;
}
.pep.panels .breadcrumb {
background-color: #FFFFFF;
line-height: 40px;
border: 1px solid silver;
margin-bottom: 10px;
}
.pep.panels .breadcrumb li {
font-size: 14px;
}
.pep.panels .pagebox {
border-radius: 0px;
overflow: hidden;
}
.pep.panels .pagebox.bg {
background-color: #FFFFFF;
}
.pep.panels .pagebox.margin {
margin-top: 1rem;
}
.pep.panels .pagebox.border {
border: none;
}
.pep.panels .pagebox.padding {
padding: 2rem;
}
.pep.panels .pagebox.notes {
padding: 0rem 1rem;
border-bottom: 1px solid #f0f0f0;
margin-bottom: 1rem;
}
.pep.panels .pagebox.notes:last-child {
border-bottom: 0px;
}
.pep.panels .pagebox.notes p {
line-height: 28px;
text-indent: 2em;
}
.pep.panels .pagebox .progress-bar {
background-color: #F40;
}
.pep.panels .pagebox .box {
padding: 1rem;
}
.pep.panels .pagebox .panel-heading {
line-height: 40px;
text-align: center;
font-weight: bold;
font-size: 20px;
background:#fff;
border:none;
color:#000;
}
.pep.panels .pagebox .panel-heading.blod {
font-weight: bold;
}
.pep.panels .pagebox .panel-body {
padding: 1rem;
}
.pep.panels .pagebox .panel-body .playing {
color: #F40;
}
.pep.panels .pagebox .panel-body .intros {
font-size: 1rem;
margin: auto 20px auto 0px;
}
.pep.panels .pagebox .panel-body .pagination {
border-radius: 0px;
}
.pep.panels .pagebox .panel-body .pagination li a {
padding: 10px 18px;
border-radius: 0px;
}
.pep.panels .pagebox .panel-body .pagination li a.current {
background-color: #F40;
color: #FFFFFF;
}
.pep.panels .pagebox .panel-body .contenttext {
padding: 10px;
}
.pep.panels .pagebox .panel-body .contenttext p {
text-indent: 2em;
line-height: 32px;
}
.pep.panels .pagebox .panel-body .form-group {
line-height: 40px;
clear: both;
padding-top: 2px;
padding-bottom: 2px;
}
.pep.panels .pagebox .panel-body .form-group.nomargin {
margin-bottom: 0px;
}
.pep.panels .pagebox .panel-body .form-group label {
line-height: 36px;
}
.pep.panels .pagebox .panel-body .form-group label.checkbox-inline span, .pep.panels .pagebox .panel-body .form-group label.checkbox-inline a, .pep.panels .pagebox .panel-body .form-group label.radio-inline span {
display: inline-block;
vertical-align: center;
border: 1px solid silver;
color: #000000;
padding: 0px 10px;
border-radius: 3px;/**
&:before{
width: 20px;
height: 20px;
padding: 2px 3px;
margin-right: 8px;
border-radius: 16px;
border: 1px solid @bordercolor;
font-family: 'Glyphicons Halflings';
content:'\e013';
font-size: 14px;
line-height: 14px;
color: @bordercolor;
}
*/
}
.pep.panels .pagebox .panel-body .form-group input {
height: 42px;
border-radius: 0px;
}
.pep.panels .pagebox .panel-body .form-group input[type=checkbox], .pep.panels .pagebox .panel-body .form-group input[type=radio] {
width: 16px;
height: 16px;
display: none;
}
.pep.panels .pagebox .panel-body .form-group input[type=checkbox]:checked + span, .pep.panels .pagebox .panel-body .form-group input[type=radio]:checked + span {
border-color: #F40;
color: #F40;
}
.pep.panels .pagebox .panel-body .form-group select {
height: 42px;
line-height: 42px;
border-radius: 0px;
}
.pep.panels .pagebox .panel-body ul li {
overflow: hidden;
line-height: 40px;
}
.pep.panels .pagebox .panel-body ul li.list-group-item {
border-radius: 0px;
border: 0px;
border-top: 1px solid #f0f0f0;
}
.pep.panels .pagebox .panel-body ul li.list-group-item:first-child {
border-top: 0px;
}
.pep.panels .pagebox .panel-body table tr th, .pep.panels .pagebox .panel-body table tr td {
line-height: 45px;
}
.pep.panels .pagebox .panel-body table tr th:first-child, .pep.panels .pagebox .panel-body table tr td:first-child {
text-indent: 0em;
}
.pep.panels .pagebox .panel-body .question {
line-height: 36px;
}
.pep.panels .pagebox .panel-body .question .form-inline .form-control {
width: auto;
display: inline-block;
}
.pep.panels .pagebox .panel-body .question .clear {
clear: both;
}
.pep.panels .pagebox .panel-body .question div {
overflow: hidden;
}
.pep.panels .pagebox .panel-body .question hr {
margin: 0px;
}
.pep.panels .pagebox .panel-body .question .selectbox {
display: inline-block;
font-weight: normal;
cursor: pointer;
line-height: 36px;
}
.pep.panels .pagebox .panel-body .question .selectbox.float {
float: left;
}
.pep.panels .pagebox .panel-body .question .selectbox + p {
margin-left: 50px;
padding-top: 10px;
}
.pep.panels .pagebox .panel-body .question .selectbox .selector {
width: 32px;
height: 32px;
line-height: 30px;
text-align: center;
font-size: 16px;
display: inline-block;
margin-right: 10px;
border: 1px solid silver;
border-radius: 32px;
font-weight: normal;
text-align: -webkit-center;
color: silver;
}
.pep.panels .pagebox .panel-body .question .selectbox .selector.selected {
border-color: #F40 !important;
background-color: #F40 !important;
color: #FFFFFF !important;
}
.pep.panels .pagebox .panel-body .question .selectbox .selector.sign {
background-color: #FF7B77 !important;
color: #FFFFFF !important;
border-color: #FF7B77 !important;
}
.pep.panels .pagebox .panel-body .question .selectbox .selector-addon {
margin-left: -8px;
margin-right: 15px;
font-size: 21px;
font-weight: 500;
}
.pep.panels .pagebox .panel-body .question .selectbox:last-child {
margin-right: 0rem;
}
.pep.panels .pagebox .panel-body .question .selectbox.radio input {
display: none;
}
.pep.panels .pagebox .panel-body .question .selectbox.radio input:checked + .selector {
border-color: #F40;
border-width: 2px;
line-height: 28px;
color: #F40;
}
.pep.panels .pagebox .panel-body .question .selectbox.radio input:checked + .selector.right {
background-color: #18B8A0 !important;
color: #FFFFFF !important;
border-color: #18B8A0 !important;
}
.pep.panels .pagebox .panel-body .question .selectbox.radio input:checked + .selector.wrong {
background-color: #FF7B77 !important;
color: #FFFFFF !important;
border-color: #FF7B77 !important;
}
.pep.panels .pagebox .panel-body .question .selectbox.radio .selector {
border-radius: 32px;
border: 2px solid silver;
line-height: 28px;
box-sizing: border-box;
font-size: 20px!important;
}
.pep.panels .pagebox .panel-body .question .selectbox.checkbox input {
display: none;
}
.pep.panels .pagebox .panel-body .question .selectbox.checkbox input:checked + .selector {
border-color: #F40;
border-width: 2px;
line-height: 28px;
color: #F40;
}
.pep.panels .pagebox .panel-body .question .selectbox.checkbox input:checked + .selector.right {
background-color: #18B8A0 !important;
color: #FFFFFF !important;
border-color: #18B8A0 !important;
}
.pep.panels .pagebox .panel-body .question .selectbox.checkbox input:checked + .selector.wrong {
background-color: #FF7B77 !important;
color: #FFFFFF !important;
border-color: #FF7B77 !important;
}
.pep.panels .pagebox .panel-body .question .selectbox.checkbox .selector {
border-radius: 32px;
border: 2px solid silver;
line-height: 28px;
box-sizing: border-box;
font-size: 20px!important;
}
.pep.panels .pagebox .panel-group {
margin: 0px;
}
.pep.panels .pagebox .panel-group .panel {
border-bottom: 1px solid silver;
border-radius: 0px;
margin-top: 0px;
}
.pep.panels .pagebox .panel-group .panel .panel-heading {
font-size: 16px;
line-height: 40px;
padding-left: 2em;
}
.pep.panels .pagebox .panel-group .panel .panel-collapse ul.list-group {
border-color: #f0f0f0;
}
.pep.panels .pagebox .panel-group .panel .panel-collapse ul li {
font-size: 15px;
line-height: 40px;
padding-left: 4em;
border-color: #f5f5f5;
list-style-type: circle;
clear: both;
}
.pep.panels .pagebox .panel-group .panel .panel-collapse ul li .price {
color: #F40;
font-size: 18px;
font-weight: bold;
}
.pep.panels .pagebox .panel-group .panel .panel-collapse ul li .progress {
margin-bottom: 0px;
display: inline-block;
width: 120px;
vertical-align: middle;
margin-right: 1rem;
}
.pep.panels .pagebox .panel-group .panel .panel-collapse ul li a {
color: #6A6A6A;
}
.pep.panels .pagebox .panel-group .panel .panel-collapse ul li a.btn-default {
color: #F40;
border-color: #F40;
}
.pep.panels .pagebox .fx {
padding: 2rem 0rem;
}
.pep.panels .pagebox .btn {
margin-right: 2rem;
padding: 10px 25px;
border-radius: 0px;
}
.pep.panels .pagebox .btn.btn-primary {
color: #FFFFFF;
background-color: #F40;
border-color: #F40;
text-shadow: 1px 1px 1px #333;
}
.pep.panels .pagebox .btn.btn-danger {
color: #FFFFFF;
}
.pep.panels .pagebox .title {
font-size: 1.75rem;
line-height: 3rem;
text-align: left;
}
.pep.panels .pagebox .sub {
font-size: 1.2rem;
}
.pep.panels .pagebox .intro {
font-size: 1.1rem;
line-height: 2rem;
}
.pep.panels a {
color: #000000;
text-decoration: none;
}
.pep.panels a:hover {
color: #000000;
}
.pep .regbox {
width: 30%;
margin: auto;
margin-top: 60px;
margin-bottom: 60px;
width: 88%;
margin-top: 10px;
}
.pep .regbox .input-group {
margin-bottom: 30px;
}
.pep .regbox .input-group.form-group {
padding: 0px!important;
}
.pep .regbox .input-group .input-group-addon {
border-radius: 0px;
font-size: 16px;
border-color: #F40;
background-color: #FFFFFF;
}
.pep .regbox .input-group .input-group-addon .glyphicon {
margin-left: 10px;
margin-right: 10px;
color: #F40;
}
.pep .regbox input {
border-radius: 0px;
font-size: 16px;
line-height: 40px;
height: 48px!important;
padding-left: 15px;
border-color: #F40;
}
.pep .regbox .tips {
line-height: 24px;
font-size: 14px;
}
.pep .regbox .loginBnttonArea {
padding: 5px 0px;
}
.pep .regbox .loginBnttonArea .btn {
padding: 12px 30px;
border-radius: 0px;
}
.pep .regbox .loginBnttonArea .btn.btn-default {
color: #F40;
border-color: #F40;
}
.pep .regbox .loginBnttonArea .btn.btn-primary {
color: #FFFFFF;
background-color: #F40;
border-color: #F40;
}
.pep.footer {
color: #FFFFFF;
overflow: hidden;
padding-top: 2rem;
padding-bottom: 2rem;
}
.pep.footer a {
color: #FFFFFF;
text-decoration: none;
}
.pep.footer a:hover {
color: #FFFFFF;
}
/**user模块**/
.form-control.normalinput {
width: 18rem;
}
.form-control.shortinput {
width: 12rem;
}
.form-control.middleinput {
width: 24rem;
}
.pep{width: 100%;}
.pep .regbox{width: 88%;margin-top: 10px;}
.fahuo{margin-top: 0px;color:#999}
.fahuo li{padding: 10px 5px;overflow:hidden;list-style-type:none;font-size: 14px;}
.fahuo li span{padding-right: 10px;}
#marqueebox {
height: 454px;
overflow: hidden;
}
@media (max-width: 768px) {
#marqueebox {
height: 260px;
}
}
input{width: 100%;
height: 45px;
border-radius: 10px;
border-color: #e0e0e0;
border: solid 1px #e0e0e0;}
tr{text-align: center;border-spacing:10px 0;}
.tbd{ text-align:left; width:80px;}
.tbd em{ color:red}
td span{ width:15%;}
.data-show-box{text-align: center;
padding: 20px 0;
background: #02ae62;
color: #fff;
font-size: 1.5em;
font-weight: bold;
}
footer {
position: fixed;
max-width: 750px;
bottom: 0;
width: 100%;
left: 50%;
transform: translateX(-50%);
height: 56px;
padding: 6px;}
footer .btns {
display: flex;
justify-content: center;
}
footer .btns .btn {
height: 44px;
line-height: 34px;
width: 100%;
border-radius: 30px;
margin: 0 5px;
text-align: center;
font-size: 16px;
}
footer .btns .btn.bg-red {
background-color: #e6322e;
color: #fff;
}
footer .btns .btn span {
font-weight: bold;
}
#app header {
height: 56px;
max-width: 750px;
position: fixed;
bottom: 0;
left: 50%;
transform: translateX(-50%);
width: 100%;
background-color: #fff;
display: flex;
justify-content: space-between;
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.06);
font-size: 15px;
}
#app header .prompt {
line-height: 56px;
padding: 0px 15px;
box-sizing: border-box;
color:#000;
}
#app header .add-wechat {
line-height: 56px;
padding: 0px 20px;
font-weight: bold;
color: #fff;
background-color: #1aad17;
}
.popup {
position: fixed;
width: 100%;
height: 100%;
top: 0;
left: 0;
}
.popup .bg {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.4);
z-index: 1;
}
.popup .popup-main {
background-color: #fff;
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 80%;
border-radius: 20px;
z-index: 2;
display: flex;
flex-direction: column;
padding: 20px 0;
align-items: center;
}
.popup .popup-main i.iconfont.close {
position: absolute;
right: 10px;
top: 10px;
font-size: 24px;
color: #666;
}
.popup .popup-main .success-icon img{
width: 38px;
height: 38px;
margin: 0 auto 10px;
}
.popup .popup-main h2 {
font-weight: bold;
font-size: 18px;
}
.popup .popup-main p {
font-size: 14px;
color: #666;
}
.popup .popup-main a.open-wechat {
width: 40%;
height: 40px;
background-color: #1aad17;
color: #fff;
text-align: center;
line-height: 40px;
border-radius: 8px;
margin-top: 20px;
font-size: 15px;
}
#app aside.tel-fixed {
transform: scale(1);
overflow: hidden;
transform-origin: right top 0px;
border-radius: 100px;
position: fixed;
right: 15px;
bottom:200px;
width: 54px;
height: 53px;
background-image: url(../image/wechat_logo.png);
background-size: 100% 100%;
}
#app aside.tel-fixed .tel-img {
width: 54px;
height: 53px;
position: absolute;
top: 0px;
left: -10px;
animation: move 3s both infinite;
transform-origin: center center;
}
#app aside.tel-fixed .tel-img img{ max-width:100%;}
#app aside.tel-fixed p {
position: absolute;
font-size: 12px;
font-weight: bold;
bottom: 4px;
color: #fff;
left: 17px;
}
@keyframes move {
0% {
left: -50px;
opacity: 0.6;
}
25% {
left: 100%;
opacity: 0.2;
}
50% {
left: 100%;
opacity: 0.2;
}
75% {
left: -50px;
opacity: 0.6;
}
100% {
left: -50px;
opacity: 0.6;
}
}
#app footer {
position: fixed;
max-width: 750px;
bottom: 0;
width: 100%;
left: 50%;
transform: translateX(-50%);
height: 56px;
padding: 6px;
box-sizing: border-box;
box-shadow: 0 -10px 20px rgba(0, 0, 0, 0.06);
}
#app footer .btns {
display: flex;
justify-content: center;
}
#app footer .btns .btn1 {
height: 44px;
line-height: 44px;
width: calc(100% - 20px);
border-radius: 30px;
margin: 0 5px;
text-align: center;
font-size: 15px;
background: #1aad17;
}
#app footer .btns .btn1 span {
font-weight: bold;
}
#app footer .btns .btn1.border-red {
border: 1px solid #1aad17;
color: #fff;
}
#app footer .btns .btn1.bg-red {
background-color: #e6322e;
color: #fff;
}
#header1 {
height: 56px;
max-width: 750px;
width: 100%;
background-color: #fff;
display: flex;
justify-content: space-between;
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.06);
font-size: 15px;
}
#header1 .prompt {
color:#333;
line-height: 56px;
padding: 0px 15px;
box-sizing: border-box;
}
#header1 .add-wechat {
line-height: 56px;
padding: 0px 20px;
font-weight: bold;
color: #fff;
background-color: #1aad17;
}