@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 { color: #333333; font: 400 14px/1.35 "Microsoft Yahei", Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; }

.container { width: 320px; background-color: rgba(0, 167, 30, 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: #333333; }
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 #333333; 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: #333333; }

.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: #333333; padding: 2px 4px; color: white; }

.footer { color: #fff; height: 70px; width: 100%; background-color: #999999; }
.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; }

a { -webkit-touch-callout: none; -webkit-tap-highlight-color: rgba(255, 255, 255, 0); }

html, body { height: 100%; }

.content { width: 100%; overflow-y: scroll; -webkit-overflow-scrolling: touch; }
.content ul { list-style: disc inside; }

.header { border-bottom: 1px solid #000; }

.footer { border-top: 1px solid #000; }