html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; }

html { -webkit-text-size-adjust: 100%; }

ol, ul { list-style: none; }

table { border-collapse: collapse; border-spacing: 0; }

caption, th, td { text-align: center; font-weight: normal; vertical-align: middle; }

q, blockquote { quotes: none; }

q:before, q:after, blockquote:before, blockquote:after { content: ""; content: none; }

a img { border: none; }

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section, summary { display: block; }

img { max-width: 100%; vertical-align: middle; }

i { font-style: normal; }

h1, h2, h3, h4, h5, h6 { font-weight: normal; }

.clearfix:before, .clearfix:after { content: " "; display: table; }
.clearfix:after { clear: both; }

.col1of2, .col1of3, .col2of3, .col1of4, .col2of4, .col3of4, .col1of5, .col2of5, .col3of5, .col4of5, .col1of6, .col2of6, .col3of6, .col4of6, .col5of6 { float: left; }

.col1of2 { width: 50%; box-sizing: border-box; }

.col1of3 { width: 33.33333%; box-sizing: border-box; }

.col2of3 { width: 66.66667%; box-sizing: border-box; }

.col1of4 { width: 25%; box-sizing: border-box; }

.col2of4 { width: 50%; box-sizing: border-box; }

.col3of4 { width: 75%; box-sizing: border-box; }

.col1of5 { width: 20%; box-sizing: border-box; }

.col2of5 { width: 40%; box-sizing: border-box; }

.col3of5 { width: 60%; box-sizing: border-box; }

.col4of5 { width: 80%; box-sizing: border-box; }

.col1of6 { width: 16.66667%; box-sizing: border-box; }

.col2of6 { width: 33.33333%; box-sizing: border-box; }

.col3of6 { width: 50%; box-sizing: border-box; }

.col4of6 { width: 66.66667%; box-sizing: border-box; }

.col5of6 { width: 83.33333%; box-sizing: border-box; }

.row { width: 100%; position: relative; box-sizing: border-box; margin-left: auto; margin-right: auto; }
.row:before, .row:after { content: " "; display: table; }
.row:after { clear: both; }

.left { float: left; }

.right { float: right; }

.center { margin-left: auto; margin-right: auto; float: none; }

.hidden { display: none; }

.by-left { text-align: left; }

.by-right { text-align: right; }

.by-center { text-align: center; }

.flex { display: -webkit-box; display: -webkit-flex; display: flex; }

.vflex { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-flex-direction: column; flex-direction: column; -webkit-box-orient: vertical; box-orient: vertical; }

.vcenter { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; }

.hcenter { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; }

.acenter { display: -webkit-box; display: -webkit-flex; display: flex; -webkit-box-align: center; -webkit-align-items: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; justify-content: center; }

.flex0 { -webkit-box-flex: 0; -webkit-flex: 0; flex: 0; }

.flex1 { -webkit-box-flex: 1; -webkit-flex: 1; flex: 1; }

.flex2 { -webkit-box-flex: 2; -webkit-flex: 2; flex: 2; }

.flex3 { -webkit-box-flex: 3; -webkit-flex: 3; flex: 3; }

.flex4 { -webkit-box-flex: 4; -webkit-flex: 4; flex: 4; }

.flex5 { -webkit-box-flex: 5; -webkit-flex: 5; flex: 5; }

.flex6 { -webkit-box-flex: 6; -webkit-flex: 6; flex: 6; }

/** Should be used to modify the default spacing between objects (not between nodes of the same object) a, t, r, b, l, h, v = all,top,right,bottom,left,horizontal,vertical x, s, m, l, n       = space-x, space-s, space-m, space-l, none p, m                = padding,margin */
.ptn, .pvn, .pan { padding-top: 0; }

.ptx, .pvx, .pax { padding-top: 3px; }

.pts, .pvs, .pas { padding-top: 5px; }

.ptm, .pvm, .pam { padding-top: 10px; }

.ptl, .pvl, .pal { padding-top: 20px; }

.prn, .phn, .pan { padding-right: 0; }

.prx, .phx, .pax { padding-right: 3px; }

.prs, .phs, .pas { padding-right: 5px; }

.prm, .phm, .pam { padding-right: 10px; }

.prl, .phl, .pal { padding-right: 20px; }

.pbn, .pvn, .pan { padding-bottom: 0; }

.pbx, .pvx, .pax { padding-bottom: 3px; }

.pbs, .pvs, .pas { padding-bottom: 5px; }

.pbm, .pvm, .pam { padding-bottom: 10px; }

.pbl, .pvl, .pal { padding-bottom: 20px; }

.pln, .phn, .pan { padding-left: 0; }

.plx, .phx, .pax { padding-left: 3px; }

.pls, .phs, .pas { padding-left: 5px; }

.plm, .phm, .pam { padding-left: 10px; }

.pll, .phl, .pal { padding-left: 20px; }

.mtn, .mvn, .man { margin-top: 0px !important; }

.mtx, .mvx, .max { margin-top: 3px; }

.mts, .mvs, .mas { margin-top: 5px; }

.mtm, .mvm, .mam { margin-top: 10px; }

.mtl, .mvl, .mal { margin-top: 20px; }

.mrn, .mhn, .man { margin-right: 0px !important; }

.mrx, .mhx, .max { margin-right: 3px; }

.mrs, .mhs, .mas { margin-right: 5px; }

.mrm, .mhm, .mam { margin-right: 10px; }

.mrl, .mhl, .mal { margin-right: 20px; }

.mbn, .mvn, .man { margin-bottom: 0px !important; }

.mbx, .mvx, .max { margin-bottom: 3px; }

.mbs, .mvs, .mas { margin-bottom: 5px; }

.mbm, .mvm, .mam { margin-bottom: 10px; }

.mbl, .mvl, .mal { margin-bottom: 20px; }

.mln, .mhn, .man { margin-left: 0px !important; }

.mlx, .mhx, .max { margin-left: 3px; }

.mls, .mhs, .mas { margin-left: 5px; }

.mlm, .mhm, .mam { margin-left: 10px; }

.mll, .mhl, .mal { margin-left: 20px; }

.h0 { font-size: 14px; }

h1, .h1 { font-size: 36px; }

h1 { margin-bottom: .5em; }

h2, .h2 { font-size: 30px; }

h2 { margin-bottom: .5em; }

h3, .h3 { font-size: 24px; }

h3 { margin-bottom: .5em; }

h4, .h4 { font-size: 18px; }

h4 { margin-bottom: .5em; }

h5, .h5 { font-size: 16px; }

h5 { margin-bottom: .5em; }

h6, .h6 { font-size: 12px; }

h6 { margin-bottom: .5em; }

.word { color: #fffef1; }

.bg-word { background-color: #fffef1; }

.opaque { color: #444444; }

.bg-opaque { background-color: #444444; }

.neutral { color: #999999; }

.bg-neutral { background-color: #999999; }

.pale { color: #aaaaaa; }

.bg-pale { background-color: #aaaaaa; }

.bare { color: #cccccc; }

.bg-bare { background-color: #cccccc; }

.firm { color: #70b85d; }

.bg-firm { background-color: #70b85d; }

.bright { color: #54d0ed; }

.bg-bright { background-color: #54d0ed; }

.sharp { color: #00ccff; }

.bg-sharp { background-color: #00ccff; }

.contrast { color: white; }

.bg-contrast { background-color: white; }

.positive { color: #2c5e2e; }

.bg-positive { background-color: #2c5e2e; }

.negative { color: #0c273d; }

.bg-negative { background-color: #0c273d; }

.black { color: black; }

.bg-black { background-color: black; }

.blue { color: #3498db; }

.bg-blue { background-color: #3498db; }

.gray { color: #bdc3c7; }

.bg-gray { background-color: #bdc3c7; }

.green { color: #27ae60; }

.bg-green { background-color: #27ae60; }

.orange { color: orange; }

.bg-orange { background-color: orange; }

.red { color: #e74c3c; }

.bg-red { background-color: #e74c3c; }

.white { color: white; }

.bg-white { background-color: white; }

.yellow { color: #f1c40f; }

.bg-yellow { background-color: #f1c40f; }

a { color: #196fee; text-decoration: none; }

.border-box { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

.closed-box { overflow: hidden; position: relative; }
.closed-box:before, .closed-box:after { content: " "; display: table; }
.closed-box:after { clear: both; }

.ios-scroll { overflow-y: scroll; -webkit-overflow-scrolling: touch; }

.notap { -webkit-tap-highlight-color: rgba(255, 255, 255, 0); }

.nocall { -webkit-touch-callout: none; }

.noselect { -webkit-user-select: none; user-select: none; }

.relative { position: relative; }

.text-overflow { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

@font-face { font-family: "food"; src: url('../../../font/icomoon.ttf') format("truetype"); font-weight: normal; font-style: normal; }

.icon, .bicon:before, .aicon:after { font-family: 'food'; }

.bicon:before, .aicon:after { content: attr(data-content); }

.line-list:before, .line-list:after { content: " "; display: table; }
.line-list:after { clear: both; }
.line-list li { float: left; }

.p { word-wrap: break-word; -ms-word-wrap: break-word; text-justify: inter-ideograph; hyphens: auto; text-indent: 2em; margin-bottom: 1.2em; }

body { background-image: url('../../../img/chengxinba/bg.png?1401254076'); background-color: #70b85d; }

html, body { height: 100%; }

body { color: #fffef1; font: 400 14px/1.35 "Microsoft Yahei", Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; }

.v-container { height: 100%; }

.container { width: 320px; background-color: rgba(112, 184, 93, 0.1); }

.wraper { width: 300px; position: relative; box-sizing: border-box; margin-left: auto; margin-right: auto; }
.wraper:before, .wraper:after { content: " "; display: table; }
.wraper:after { clear: both; }

.row { width: 100%; position: relative; box-sizing: border-box; margin-left: auto; margin-right: auto; }
.row:before, .row:after { content: " "; display: table; }
.row:after { clear: both; }

.form-row { padding-bottom: 1.8em; }

input, button { -webkit-tap-highlight-color: rgba(255, 255, 255, 0); outline: none; }

input[type='text'], input[type='password'] { border: 1px solid #cccccc; height: 40px; padding: 0 8px; font-size: 16px; box-sizing: border-box; -webkit-appearance: none; border-radius: 2px; color: #fffef1; }
input[type='text']:focus, input[type='password']:focus { -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1); -moz-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1); box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1); border-color: #3498db; }
input[type='text'].success, input[type='password'].success { border-color: #27ae60; }
input[type='text'].error, input[type='password'].error { border-color: #e74c3c; }

.error-msg { color: #e74c3c; position: absolute; left: 0; top: 40px; font-size: 10px; }

input[type='button'], button { -webkit-appearance: none; appearance: none; border: 1px solid #fffef1; padding: 8px 18px; font-size: 16px; border-radius: 2px; box-shadow: inset 0 0 3px #FFF; -webkit-transition: 200ms; -moz-transition: 200ms; -o-transition: 200ms; transition: 200ms; -webkit-user-select: none; user-select: none; }
input[type='button']:active, button:active { box-shadow: inset 0 0 5px #000; }

.article-content { font-size: 14px; line-height: 20px; }
.article-content img { display: block; margin: 0 auto 10px; }
.article-content p { word-wrap: break-word; -ms-word-wrap: break-word; text-justify: inter-ideograph; hyphens: auto; text-indent: 2em; margin-bottom: 1.2em; }
.article-content h2, .article-content h3 { font-size: 16px; font-weight: 400; color: #444444; }
.article-content h4, .article-content h5 { font-size: 14px; font-weight: 400; color: #444444; }
.article-content ul { list-style: disc inside; }
.article-content ol { list-style: decimal inside; }
.article-content ul p, .article-content ol p { margin-bottom: 10px; }
.article-content ul, .article-content ol { list-style-position: inside; padding-left: 2em; }
.article-content blockquote, .article-content pre { margin-left: 2em; padding-left: 10px; padding-right: 20px; border-left: 3px solid #bdc3c7; margin-bottom: 10px; word-wrap: break-word; background-color: white; color: #fffef1; }

.index .header { height: 80px; font-size: 24px; font-weight: 700; color: white; }
.index .footer { height: 40px; }

.header .nav { overflow: hidden; height: 50px; line-height: 50px; }
.header .nav a { color: white; display: block; -webkit-transition: 400ms; -moz-transition: 400ms; -o-transition: 400ms; transition: 400ms; }
.header .nav a.active, .header .nav a:active { background-color: #444444; }

.block p { word-wrap: break-word; -ms-word-wrap: break-word; text-justify: inter-ideograph; hyphens: auto; text-indent: 0; margin-bottom: 1.2em; line-height: 1.6em; }

.demo { min-height: 10px; background-color: #cccccc; color: white; padding: 1em 0; margin-bottom: .6em; }
.demo .demo-sugar { min-height: 40px; background-color: #999999; border: 1px solid #444444; box-sizing: border-box; }
.demo .demo-sugar .class { word-wrap: break-word; -ms-word-wrap: break-word; text-justify: inter-ideograph; hyphens: auto; text-indent: 2em; margin-bottom: 1.2em; text-indent: 2px; }
.demo .demo-sgr { box-sizing: border-box; min-height: 40px; }
.demo .demo-sgr .class { word-wrap: break-word; -ms-word-wrap: break-word; text-justify: inter-ideograph; hyphens: auto; text-indent: 2em; margin-bottom: 1.2em; text-indent: 2px; }
.demo .demo-sgr:hover { background-color: #999999; border: 1px solid #444444; }
.demo th, .demo td { border: 1px solid #444444; height: 30px; }

code { background-color: #999999; }

pre, code { background-color: #fffef1; padding: 2px 4px; color: white; }

.footer { color: #fff; width: 100%; }
.footer .torch-phone { position: relative; }
.footer .torch-phone:before { content: '\f10b'; text-align: center; font-size: 50px; }
.footer .torch-ui { width: 150px; position: relative; box-sizing: border-box; margin-left: auto; margin-right: auto; }
.footer .torch-ui:before, .footer .torch-ui:after { content: " "; display: table; }
.footer .torch-ui:after { clear: both; }

.torch-slogon { margin-left: 30px; }
.torch-slogon .ft-title { line-height: 35px; font-size: 18px; position: relative; top: 6px; }