.clearfix:after,.clearfix:before,.container-fluid:after,.container-fluid:before,.container:after,.container:before,.dl-horizontal dd:after,.dl-horizontal dd:before,.form-horizontal .form-group:after,.form-horizontal .form-group:before,.modal-footer:after,.modal-footer:before,.modal-header:after,.modal-header:before,.nav:after,.nav:before,.navbar-collapse:after,.navbar-collapse:before,.navbar-header:after,.navbar-header:before,.navbar:after,.navbar:before,.panel-body:after,.panel-body:before,.row:after,.row:before {
    content: " ";
    display: table
}

.clearfix:after,.container-fluid:after,.container:after,.dl-horizontal dd:after,.form-horizontal .form-group:after,.modal-footer:after,.modal-header:after,.nav:after,.navbar-collapse:after,.navbar-header:after,.navbar:after,.panel-body:after,.row:after {
    clear: both
}

.center-block {
    display: block;
    margin-left: auto;
    margin-right: auto
}

.pull-right {
    float: right!important
}

.pull-left {
    float: left!important
}

.hide {
    display: none!important
}

.show {
    display: block!important
}

.invisible {
    visibility: hidden
}

.text-hide {
    font: 0/0 a;
    color: transparent;
    text-shadow: none;
    background-color: transparent;
    border: 0
}

.hidden {
    display: none!important
}

.affix {
    position: fixed
}

@-ms-viewport {
    width: device-width
}

.visible-lg,.visible-lg-block,.visible-lg-inline,.visible-lg-inline-block,.visible-md,.visible-md-block,.visible-md-inline,.visible-md-inline-block,.visible-sm,.visible-sm-block,.visible-sm-inline,.visible-sm-inline-block,.visible-xs,.visible-xs-block,.visible-xs-inline,.visible-xs-inline-block {
    display: none!important
}

@media (max-width: 767px) {
    .visible-xs {
        display:block!important
    }

    table.visible-xs {
        display: table!important
    }

    tr.visible-xs {
        display: table-row!important
    }

    td.visible-xs,th.visible-xs {
        display: table-cell!important
    }
}

@media (max-width: 767px) {
    .visible-xs-block {
        display:block!important
    }
}

@media (max-width: 767px) {
    .visible-xs-inline {
        display:inline!important
    }
}

@media (max-width: 767px) {
    .visible-xs-inline-block {
        display:inline-block!important
    }
}

@media (min-width: 768px) and (max-width:1399px) {
    .visible-sm {
        display:block!important
    }

    table.visible-sm {
        display: table!important
    }

    tr.visible-sm {
        display: table-row!important
    }

    td.visible-sm,th.visible-sm {
        display: table-cell!important
    }
}

@media (min-width: 768px) and (max-width:1399px) {
    .visible-sm-block {
        display:block!important
    }
}

@media (min-width: 768px) and (max-width:1399px) {
    .visible-sm-inline {
        display:inline!important
    }
}

@media (min-width: 768px) and (max-width:1399px) {
    .visible-sm-inline-block {
        display:inline-block!important
    }
}

@media (min-width: 1400px) and (max-width:1599px) {
    .visible-md {
        display:block!important
    }

    table.visible-md {
        display: table!important
    }

    tr.visible-md {
        display: table-row!important
    }

    td.visible-md,th.visible-md {
        display: table-cell!important
    }
}

@media (min-width: 1400px) and (max-width:1599px) {
    .visible-md-block {
        display:block!important
    }
}

@media (min-width: 1400px) and (max-width:1599px) {
    .visible-md-inline {
        display:inline!important
    }
}

@media (min-width: 1400px) and (max-width:1599px) {
    .visible-md-inline-block {
        display:inline-block!important
    }
}

@media (min-width: 1600px) {
    .visible-lg {
        display:block!important
    }

    table.visible-lg {
        display: table!important
    }

    tr.visible-lg {
        display: table-row!important
    }

    td.visible-lg,th.visible-lg {
        display: table-cell!important
    }
}

@media (min-width: 1600px) {
    .visible-lg-block {
        display:block!important
    }
}

@media (min-width: 1600px) {
    .visible-lg-inline {
        display:inline!important
    }
}

@media (min-width: 1600px) {
    .visible-lg-inline-block {
        display:inline-block!important
    }
}

@media (max-width: 767px) {
    .hidden-xs {
        display:none!important
    }
}

@media (min-width: 768px) and (max-width:1399px) {
    .hidden-sm {
        display:none!important
    }
}

@media (min-width: 1400px) and (max-width:1599px) {
    .hidden-md {
        display:none!important
    }
}

@media (min-width: 1600px) {
    .hidden-lg {
        display:none!important
    }
}

.visible-print {
    display: none!important
}

@media print {
    .visible-print {
        display: block!important
    }

    table.visible-print {
        display: table!important
    }

    tr.visible-print {
        display: table-row!important
    }

    td.visible-print,th.visible-print {
        display: table-cell!important
    }
}

.visible-print-block {
    display: none!important
}

@media print {
    .visible-print-block {
        display: block!important
    }
}

.visible-print-inline {
    display: none!important
}

@media print {
    .visible-print-inline {
        display: inline!important
    }
}

.visible-print-inline-block {
    display: none!important
}

@media print {
    .visible-print-inline-block {
        display: inline-block!important
    }
}

@media print {
    .hidden-print {
        display: none!important
    }
}

html {
    position: relative;
    min-height: 100%
}

body,button,input,select,textarea {
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -moz-font-feature-settings: "liga","kern"
}

.row-eq-height {
    display: -ms-flexbox;
    display: flex
}

.none-spacing {
    padding: 0!important;
    margin: 0!important
}

h1,h2,h3 {
    margin-top: 0;
    margin-bottom: 20px;
    font-weight: 400
}

h1.primary,h2.primary,h3.primary {
    color: #00a786
}

h1.disabled,h2.disabled,h3.disabled {
    color: #a9a9a9
}

.modal-content {
    box-shadow: 0 2px 3px hsla(0,0%,76%,.5)!important
}

.btn-lg {
    font-size: 14px!important;
    font-weight: 700!important;
    padding: 11px 22px!important
}

.btn-cancel-link {
    color: silver
}

.btn-cancel-link:active,.btn-cancel-link:focus,.btn-cancel-link:hover {
    color: #999!important;
    box-shadow: none!important
}

.breadcrumb,.breadcrumb a,.breadcrumb a:hover {
    color: #ababab;
    text-decoration: none
}

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

@media (max-width: 767px) {
    .no-screen-xs {
        display:none!important
    }
}

@media (min-width: 767px) {
    .show-screen-xs {
        display:none!important
    }
}

.text-expander {
    position: relative
}

.text-expander.expand .text-content-wrapper {
    max-height: inherit!important
}

.text-expander .text-content-wrapper {
    overflow: hidden
}

.text-expander .text-content-actual {
    position: relative
}

.text-expander .more {
    position: absolute;
    right: 0;
    bottom: 0;
    padding: 0 10px;
    background: #fff
}

.text-expander .more:active,.text-expander .more:focus,.text-expander .more:hover {
    text-decoration: none
}

img.lazy.loading {
    background: hsla(0,0%,100%,.5) url(/static/img/loader.gif) 50% no-repeat;
    border-style: none;
    content: ""
}

.lk-cheat-wrp {
    position: fixed;
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    visibility: hidden;
    opacity: 0;
    z-index: 999999999;
    transition: visibility 0s linear .4s,opacity .4s linear
}

.lk-cheat-wrp.show {
    visibility: visible;
    transition-delay: 0s;
    opacity: 1
}

.lk-cheat-wrp .lk-cheat-panel {
    width: 200px;
    height: 200px;
    left: 50%;
    bottom: 17.2%;
    margin-left: -100px;
    border-radius: 20px;
    font-size: 1.2em;
    line-height: 200px;
    text-align: center;
    position: absolute;
    background: hsla(30,12%,93%,.8);
    -webkit-backdrop-filter: blur(12px)
}

.lk-cheat-wrp .lk-cheat-panel .lk-cheat-icon {
    left: 0;
    top: 0;
    bottom: 0;
    right: 0;
    position: absolute;
    background: url(/static/img/glasses.png) 50% no-repeat
}

[class*=" icon-"],[class^=icon-] {
    display: inline-block;
    width: 20px;
    height: 20px;
    *margin-right: .3em;
    vertical-align: middle;
    background: url(/static/img/icon.61ad871.png) no-repeat 14px 14px;
    margin-top: -2px
}

.icon-dot {
    width: 14px;
    height: 14px;
    padding: 3px;
    border-radius: 2px;
    background-color: #00a786
}

.icon-traditional {
    background-position: center -570px
}

.icon-simplified {
    background-position: center -10px
}

.icon-user {
    background-position: center -50px
}

.icon-book {
    background-position: center -90px
}

.icon-upload {
    background-position: center -130px
}

.icon-search {
    background-position: center -170px
}

.icon-refresh {
    background-position: center -210px
}

.icon-meter {
    background-position: center -276px
}

.icon-qr {
    background-position: center -244px
}

.icon-like {
    background-position: center -760px
}

.icon-left-white {
    background-position: center -840px
}

.icon-left {
    background-position: center -530px
}

.icon-right-white {
    background-position: center -800px
}

.icon-right {
    background-position: center -490px
}

.icon-clock {
    background-position: center -610px
}

.icon-user-hollow {
    background-position: center -650px
}

.icon-comment {
    background-position: center -690px
}

.icon-clock-white {
    background-position: center -931px
}

.icon-user-hollow-white {
    background-position: center -971px
}

.icon-comment-white {
    background-position: center -1011px
}

.icon-book-white {
    background-position: center -1051px
}

.icon-upload-white {
    background-position: center -890px
}

.icon-off {
    background-position: center -1090px
}

.icon-mail {
    background-position: center -1170px
}

.icon-male {
    background-position: center -1370px
}

.icon-female {
    background-position: center -1330px
}

.icon-bisexual {
    background-position: center -1411px
}

.icon-slab {
    height: 10px;
    border-left: 2px solid #00a786;
    margin-top: 5px;
    margin-bottom: 5px
}

.icon-grid {
    background: url(/static/img/grid.f202420.png) 50% no-repeat
}

.icon-grid.disabled {
    background: url(/static/img/grid_disabled.f95c603.png) 50% no-repeat
}

.icon-list {
    background: url(/static/img/list.24c0901.png) 50% no-repeat
}

.icon-list.disabled {
    background: url(/static/img/list_disabled.af93d21.png) 50% no-repeat
}

.icon-edit {
    width: 14px;
    height: 14px;
    background: url(/static/img/pen.cb7085e.png) 50% no-repeat
}

.icon-light {
    width: 20px;
    height: 20px;
    background: url(/static/img/light.c1b320a.png) 50% no-repeat
}

.icon-diamond-white {
    width: 20px;
    height: 20px;
    background: url(/static/img/diamond_white.b5baae8.png) 50% no-repeat
}

.icon-droplet-white {
    width: 20px;
    height: 20px;
    background: url(/static/img/drop_white.2063749.png) 50% no-repeat
}

.icon-sign-in {
    width: 32px;
    height: 32px;
    background: url(/static/img/signin.6fdf2ae.png) 50% no-repeat
}

.icon-charge {
    width: 32px;
    height: 32px;
    background: url(/static/img/charge.2a0f433.png) 50% no-repeat
}

.icon-hot-red {
    width: 20px;
    height: 20px;
    background: url(/static/img/hot-red.3260933.png) 50% no-repeat
}

.icon-bookmark-grey {
    width: 20px;
    height: 20px;
    background: url(/static/img/bookmark.471ce60.png) 50% no-repeat;
    background-size: 70%
}

.icon-wallet-grey {
    width: 20px;
    height: 20px;
    background: url(/static/img/wallet.13896ba.png) 50% no-repeat;
    background-size: 70%
}

.icon-talk-grey {
    width: 20px;
    height: 20px;
    background: url(/static/img/talk.b1f7408.png) 50% no-repeat;
    background-size: 70%
}

.icon-folder-grey {
    width: 20px;
    height: 20px;
    background: url(/static/img/folder.522f234.png) 50% no-repeat;
    background-size: 70%
}

.icon-home-grey {
    width: 20px;
    height: 20px;
    background: url(/static/img/home.a87f668.png) 50% no-repeat;
    background-size: 70%
}

.icon-exit {
    background: url(/static/img/exit.6eb1cc9.png) 50% no-repeat;
    background-size: 70%
}

.icon-bell,.icon-exit {
    width: 20px;
    height: 20px
}

.icon-bell {
    background: url(/static/img/bell.931d4d0.png) 50% no-repeat;
    background-size: 70%
}

.icon-trend {
    width: 20px;
    height: 20px;
    background: url(/static/img/trend.8440c82.png) 50% no-repeat;
    background-size: 70%
}

.icon-hot {
    background: url(/static/img/hot.0b62d55.png) 50% no-repeat
}

.icon-right-green {
    background: url(/static/img/right.090f610.png) 50% no-repeat;
    width: 16px;
    height: 16px
}

/*! normalize.css v3.0.3 | MIT License | github.com/necolas/normalize.css */
html {
    font-family: sans-serif;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%
}

body {
    margin: 0
}

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

audio,canvas,progress,video {
    display: inline-block;
    vertical-align: baseline
}

audio:not([controls]) {
    display: none;
    height: 0
}

[hidden],template {
    display: none
}

a {
    background-color: transparent
}

a:active,a:hover {
    outline: 0
}

abbr[title] {
    border-bottom: 1px dotted
}

b,strong {
    font-weight: 700
}

dfn {
    font-style: italic
}

h1 {
    font-size: 2em;
    margin: .67em 0
}

mark {
    background: #ff0;
    color: #000
}

small {
    font-size: 80%
}

sub,sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

sup {
    top: -.5em
}

sub {
    bottom: -.25em
}

img {
    border: 0
}

svg:not(:root) {
    overflow: hidden
}

figure {
    margin: 1em 40px
}

hr {
    box-sizing: content-box;
    height: 0
}

pre {
    overflow: auto
}

code,kbd,pre,samp {
    font-family: monospace,monospace;
    font-size: 1em
}

button,input,optgroup,select,textarea {
    color: inherit;
    font: inherit;
    margin: 0
}

button {
    overflow: visible
}

button,select {
    text-transform: none
}

button,html input[type=button],input[type=reset],input[type=submit] {
    -webkit-appearance: button;
    cursor: pointer
}

button[disabled],html input[disabled] {
    cursor: default
}

button::-moz-focus-inner,input::-moz-focus-inner {
    border: 0;
    padding: 0
}

input {
    line-height: normal
}

input[type=checkbox],input[type=radio] {
    box-sizing: border-box;
    padding: 0
}

input[type=number]::-webkit-inner-spin-button,input[type=number]::-webkit-outer-spin-button {
    height: auto
}

input[type=search] {
    -webkit-appearance: textfield;
    box-sizing: content-box
}

input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration {
    -webkit-appearance: none
}

fieldset {
    border: 1px solid silver;
    margin: 0 2px;
    padding: .35em .625em .75em
}

textarea {
    overflow: auto
}

optgroup {
    font-weight: 700
}

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

td,th {
    padding: 0
}

*,:after,:before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box
}

:after,:before {
    box-sizing: border-box
}

html {
    font-size: 10px;
    -webkit-tap-highlight-color: rgba(0,0,0,0)
}

button,input,select,textarea {
    font-family: inherit;
    font-size: inherit;
    line-height: inherit
}

a {
    color: #00a786;
    text-decoration: none
}

a:focus,a:hover {
    color: #005b49;
    text-decoration: underline
}

a:focus {
    outline: thin dotted;
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px
}

figure {
    margin: 0
}

img {
    vertical-align: middle
}

.carousel-inner>.item>a>img,.carousel-inner>.item>img,.img-responsive,.thumbnail>img,.thumbnail a>img {
    display: block;
    max-width: 100%;
    height: auto
}

.img-rounded {
    border-radius: 6px
}

.img-thumbnail {
    padding: 0;
    line-height: 1.42857143;
    background-color: #fff;
    border: 1px solid transparent;
    border-radius: 4px;
    transition: all .2s ease-in-out;
    display: inline-block;
    max-width: 100%;
    height: auto
}

.img-circle {
    border-radius: 50%
}

hr {
    margin-top: 20px;
    margin-bottom: 20px;
    border: 0;
    border-top: 1px solid #eee
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0,0,0,0);
    border: 0
}

.sr-only-focusable:active,.sr-only-focusable:focus {
    position: static;
    width: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    clip: auto
}

[role=button] {
    cursor: pointer
}

.h1,.h2,.h3,.h4,.h5,.h6,h1,h2,h3,h4,h5,h6 {
    font-family: inherit;
    font-weight: 500;
    line-height: 1.1;
    color: inherit
}

.h1 .small,.h1 small,.h2 .small,.h2 small,.h3 .small,.h3 small,.h4 .small,.h4 small,.h5 .small,.h5 small,.h6 .small,.h6 small,h1 .small,h1 small,h2 .small,h2 small,h3 .small,h3 small,h4 .small,h4 small,h5 .small,h5 small,h6 .small,h6 small {
    font-weight: 400;
    line-height: 1;
    color: #777
}

.h1,.h2,.h3,h1,h2,h3 {
    margin-top: 20px;
    margin-bottom: 10px
}

.h1 .small,.h1 small,.h2 .small,.h2 small,.h3 .small,.h3 small,h1 .small,h1 small,h2 .small,h2 small,h3 .small,h3 small {
    font-size: 65%
}

.h4,.h5,.h6,h4,h5,h6 {
    margin-top: 10px;
    margin-bottom: 10px
}

.h4 .small,.h4 small,.h5 .small,.h5 small,.h6 .small,.h6 small,h4 .small,h4 small,h5 .small,h5 small,h6 .small,h6 small {
    font-size: 75%
}

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

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

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

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

.h5,h5 {
    font-size: 14px
}

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

p {
    margin: 0 0 10px
}

.lead {
    margin-bottom: 20px;
    font-size: 16px;
    font-weight: 300;
    line-height: 1.4
}

@media (min-width: 768px) {
    .lead {
        font-size:21px
    }
}

.small,small {
    font-size: 85%
}

.mark,mark {
    background-color: #fcf8e3;
    padding: .2em
}

.text-left {
    text-align: left
}

.text-right {
    text-align: right
}

.text-center {
    text-align: center
}

.text-justify {
    text-align: justify
}

.text-nowrap {
    white-space: nowrap
}

.text-lowercase {
    text-transform: lowercase
}

.text-uppercase {
    text-transform: uppercase
}

.text-capitalize {
    text-transform: capitalize
}

.text-muted {
    color: #777
}

.text-primary {
    color: #00a786
}

a.text-primary:focus,a.text-primary:hover {
    color: #00745d
}

.text-success {
    color: #3c763d
}

a.text-success:focus,a.text-success:hover {
    color: #2b542c
}

.text-info {
    color: #31708f
}

a.text-info:focus,a.text-info:hover {
    color: #245269
}

.text-warning {
    color: #8a6d3b
}

a.text-warning:focus,a.text-warning:hover {
    color: #66512c
}

.text-danger {
    color: #a94442
}

a.text-danger:focus,a.text-danger:hover {
    color: #843534
}

.bg-primary {
    color: #fff;
    background-color: #00a786
}

a.bg-primary:focus,a.bg-primary:hover {
    background-color: #00745d
}

.bg-success {
    background-color: #dff0d8
}

a.bg-success:focus,a.bg-success:hover {
    background-color: #c1e2b3
}

.bg-info {
    background-color: #d9edf7
}

a.bg-info:focus,a.bg-info:hover {
    background-color: #afd9ee
}

.bg-warning {
    background-color: #fcf8e3
}

a.bg-warning:focus,a.bg-warning:hover {
    background-color: #f7ecb5
}

.bg-danger {
    background-color: #f2dede
}

a.bg-danger:focus,a.bg-danger:hover {
    background-color: #e4b9b9
}

.page-header {
    padding-bottom: 9px;
    margin: 40px 0 20px;
    border-bottom: 1px solid #eee
}

ol,ul {
    margin-top: 0;
    margin-bottom: 10px
}

ol ol,ol ul,ul ol,ul ul {
    margin-bottom: 0
}

.list-inline,.list-unstyled {
    padding-left: 0;
    list-style: none
}

.list-inline {
    margin-left: -5px
}

.list-inline>li {
    display: inline-block;
    padding-left: 5px;
    padding-right: 5px
}

dl {
    margin-top: 0;
    margin-bottom: 20px
}

dd,dt {
    line-height: 1.42857143
}

dt {
    font-weight: 700
}

dd {
    margin-left: 0
}

@media (min-width: 768px) {
    .dl-horizontal dt {
        float:left;
        width: 160px;
        clear: left;
        text-align: right;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap
    }

    .dl-horizontal dd {
        margin-left: 180px
    }
}

abbr[data-original-title],abbr[title] {
    cursor: help;
    border-bottom: 1px dotted #777
}

.initialism {
    font-size: 90%;
    text-transform: uppercase
}

blockquote {
    padding: 10px 20px;
    margin: 0 0 20px;
    font-size: 17.5px;
    border-left: 5px solid #eee
}

blockquote ol:last-child,blockquote p:last-child,blockquote ul:last-child {
    margin-bottom: 0
}

blockquote .small,blockquote footer,blockquote small {
    display: block;
    font-size: 80%;
    line-height: 1.42857143;
    color: #777
}

blockquote .small:before,blockquote footer:before,blockquote small:before {
    content: "\2014   \A0"
}

.blockquote-reverse,blockquote.pull-right {
    padding-right: 15px;
    padding-left: 0;
    border-right: 5px solid #eee;
    border-left: 0;
    text-align: right
}

.blockquote-reverse .small:before,.blockquote-reverse footer:before,.blockquote-reverse small:before,blockquote.pull-right .small:before,blockquote.pull-right footer:before,blockquote.pull-right small:before {
    content: ""
}

.blockquote-reverse .small:after,.blockquote-reverse footer:after,.blockquote-reverse small:after,blockquote.pull-right .small:after,blockquote.pull-right footer:after,blockquote.pull-right small:after {
    content: "\A0   \2014"
}

address {
    margin-bottom: 20px;
    font-style: normal;
    line-height: 1.42857143
}

.container {
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px
}

@media (min-width: 768px) {
    .container {
        width:990px
    }
}

@media (min-width: 1400px) {
    .container {
        width:1170px
    }
}

@media (min-width: 1600px) {
    .container {
        width:1170px
    }
}

.container-fluid {
    margin-right: auto;
    margin-left: auto;
    padding-left: 15px;
    padding-right: 15px
}

.row {
    margin-left: -15px;
    margin-right: -15px
}

.col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12,.col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12,.col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12,.col-xs-1,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9,.col-xs-10,.col-xs-11,.col-xs-12 {
    position: relative;
    min-height: 1px;
    padding-left: 15px;
    padding-right: 15px
}

.col-xs-1,.col-xs-2,.col-xs-3,.col-xs-4,.col-xs-5,.col-xs-6,.col-xs-7,.col-xs-8,.col-xs-9,.col-xs-10,.col-xs-11,.col-xs-12 {
    float: left
}

.col-xs-12 {
    width: 100%
}

.col-xs-11 {
    width: 91.66666667%
}

.col-xs-10 {
    width: 83.33333333%
}

.col-xs-9 {
    width: 75%
}

.col-xs-8 {
    width: 66.66666667%
}

.col-xs-7 {
    width: 58.33333333%
}

.col-xs-6 {
    width: 50%
}

.col-xs-5 {
    width: 41.66666667%
}

.col-xs-4 {
    width: 33.33333333%
}

.col-xs-3 {
    width: 25%
}

.col-xs-2 {
    width: 16.66666667%
}

.col-xs-1 {
    width: 8.33333333%
}

.col-xs-pull-12 {
    right: 100%
}

.col-xs-pull-11 {
    right: 91.66666667%
}

.col-xs-pull-10 {
    right: 83.33333333%
}

.col-xs-pull-9 {
    right: 75%
}

.col-xs-pull-8 {
    right: 66.66666667%
}

.col-xs-pull-7 {
    right: 58.33333333%
}

.col-xs-pull-6 {
    right: 50%
}

.col-xs-pull-5 {
    right: 41.66666667%
}

.col-xs-pull-4 {
    right: 33.33333333%
}

.col-xs-pull-3 {
    right: 25%
}

.col-xs-pull-2 {
    right: 16.66666667%
}

.col-xs-pull-1 {
    right: 8.33333333%
}

.col-xs-pull-0 {
    right: auto
}

.col-xs-push-12 {
    left: 100%
}

.col-xs-push-11 {
    left: 91.66666667%
}

.col-xs-push-10 {
    left: 83.33333333%
}

.col-xs-push-9 {
    left: 75%
}

.col-xs-push-8 {
    left: 66.66666667%
}

.col-xs-push-7 {
    left: 58.33333333%
}

.col-xs-push-6 {
    left: 50%
}

.col-xs-push-5 {
    left: 41.66666667%
}

.col-xs-push-4 {
    left: 33.33333333%
}

.col-xs-push-3 {
    left: 25%
}

.col-xs-push-2 {
    left: 16.66666667%
}

.col-xs-push-1 {
    left: 8.33333333%
}

.col-xs-push-0 {
    left: auto
}

.col-xs-offset-12 {
    margin-left: 100%
}

.col-xs-offset-11 {
    margin-left: 91.66666667%
}

.col-xs-offset-10 {
    margin-left: 83.33333333%
}

.col-xs-offset-9 {
    margin-left: 75%
}

.col-xs-offset-8 {
    margin-left: 66.66666667%
}

.col-xs-offset-7 {
    margin-left: 58.33333333%
}

.col-xs-offset-6 {
    margin-left: 50%
}

.col-xs-offset-5 {
    margin-left: 41.66666667%
}

.col-xs-offset-4 {
    margin-left: 33.33333333%
}

.col-xs-offset-3 {
    margin-left: 25%
}

.col-xs-offset-2 {
    margin-left: 16.66666667%
}

.col-xs-offset-1 {
    margin-left: 8.33333333%
}

.col-xs-offset-0 {
    margin-left: 0
}

@media (min-width: 768px) {
    .col-sm-1,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-10,.col-sm-11,.col-sm-12 {
        float:left
    }

    .col-sm-12 {
        width: 100%
    }

    .col-sm-11 {
        width: 91.66666667%
    }

    .col-sm-10 {
        width: 83.33333333%
    }

    .col-sm-9 {
        width: 75%
    }

    .col-sm-8 {
        width: 66.66666667%
    }

    .col-sm-7 {
        width: 58.33333333%
    }

    .col-sm-6 {
        width: 50%
    }

    .col-sm-5 {
        width: 41.66666667%
    }

    .col-sm-4 {
        width: 33.33333333%
    }

    .col-sm-3 {
        width: 25%
    }

    .col-sm-2 {
        width: 16.66666667%
    }

    .col-sm-1 {
        width: 8.33333333%
    }

    .col-sm-pull-12 {
        right: 100%
    }

    .col-sm-pull-11 {
        right: 91.66666667%
    }

    .col-sm-pull-10 {
        right: 83.33333333%
    }

    .col-sm-pull-9 {
        right: 75%
    }

    .col-sm-pull-8 {
        right: 66.66666667%
    }

    .col-sm-pull-7 {
        right: 58.33333333%
    }

    .col-sm-pull-6 {
        right: 50%
    }

    .col-sm-pull-5 {
        right: 41.66666667%
    }

    .col-sm-pull-4 {
        right: 33.33333333%
    }

    .col-sm-pull-3 {
        right: 25%
    }

    .col-sm-pull-2 {
        right: 16.66666667%
    }

    .col-sm-pull-1 {
        right: 8.33333333%
    }

    .col-sm-pull-0 {
        right: auto
    }

    .col-sm-push-12 {
        left: 100%
    }

    .col-sm-push-11 {
        left: 91.66666667%
    }

    .col-sm-push-10 {
        left: 83.33333333%
    }

    .col-sm-push-9 {
        left: 75%
    }

    .col-sm-push-8 {
        left: 66.66666667%
    }

    .col-sm-push-7 {
        left: 58.33333333%
    }

    .col-sm-push-6 {
        left: 50%
    }

    .col-sm-push-5 {
        left: 41.66666667%
    }

    .col-sm-push-4 {
        left: 33.33333333%
    }

    .col-sm-push-3 {
        left: 25%
    }

    .col-sm-push-2 {
        left: 16.66666667%
    }

    .col-sm-push-1 {
        left: 8.33333333%
    }

    .col-sm-push-0 {
        left: auto
    }

    .col-sm-offset-12 {
        margin-left: 100%
    }

    .col-sm-offset-11 {
        margin-left: 91.66666667%
    }

    .col-sm-offset-10 {
        margin-left: 83.33333333%
    }

    .col-sm-offset-9 {
        margin-left: 75%
    }

    .col-sm-offset-8 {
        margin-left: 66.66666667%
    }

    .col-sm-offset-7 {
        margin-left: 58.33333333%
    }

    .col-sm-offset-6 {
        margin-left: 50%
    }

    .col-sm-offset-5 {
        margin-left: 41.66666667%
    }

    .col-sm-offset-4 {
        margin-left: 33.33333333%
    }

    .col-sm-offset-3 {
        margin-left: 25%
    }

    .col-sm-offset-2 {
        margin-left: 16.66666667%
    }

    .col-sm-offset-1 {
        margin-left: 8.33333333%
    }

    .col-sm-offset-0 {
        margin-left: 0
    }
}

@media (min-width: 1400px) {
    .col-md-1,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-10,.col-md-11,.col-md-12 {
        float:left
    }

    .col-md-12 {
        width: 100%
    }

    .col-md-11 {
        width: 91.66666667%
    }

    .col-md-10 {
        width: 83.33333333%
    }

    .col-md-9 {
        width: 75%
    }

    .col-md-8 {
        width: 66.66666667%
    }

    .col-md-7 {
        width: 58.33333333%
    }

    .col-md-6 {
        width: 50%
    }

    .col-md-5 {
        width: 41.66666667%
    }

    .col-md-4 {
        width: 33.33333333%
    }

    .col-md-3 {
        width: 25%
    }

    .col-md-2 {
        width: 16.66666667%
    }

    .col-md-1 {
        width: 8.33333333%
    }

    .col-md-pull-12 {
        right: 100%
    }

    .col-md-pull-11 {
        right: 91.66666667%
    }

    .col-md-pull-10 {
        right: 83.33333333%
    }

    .col-md-pull-9 {
        right: 75%
    }

    .col-md-pull-8 {
        right: 66.66666667%
    }

    .col-md-pull-7 {
        right: 58.33333333%
    }

    .col-md-pull-6 {
        right: 50%
    }

    .col-md-pull-5 {
        right: 41.66666667%
    }

    .col-md-pull-4 {
        right: 33.33333333%
    }

    .col-md-pull-3 {
        right: 25%
    }

    .col-md-pull-2 {
        right: 16.66666667%
    }

    .col-md-pull-1 {
        right: 8.33333333%
    }

    .col-md-pull-0 {
        right: auto
    }

    .col-md-push-12 {
        left: 100%
    }

    .col-md-push-11 {
        left: 91.66666667%
    }

    .col-md-push-10 {
        left: 83.33333333%
    }

    .col-md-push-9 {
        left: 75%
    }

    .col-md-push-8 {
        left: 66.66666667%
    }

    .col-md-push-7 {
        left: 58.33333333%
    }

    .col-md-push-6 {
        left: 50%
    }

    .col-md-push-5 {
        left: 41.66666667%
    }

    .col-md-push-4 {
        left: 33.33333333%
    }

    .col-md-push-3 {
        left: 25%
    }

    .col-md-push-2 {
        left: 16.66666667%
    }

    .col-md-push-1 {
        left: 8.33333333%
    }

    .col-md-push-0 {
        left: auto
    }

    .col-md-offset-12 {
        margin-left: 100%
    }

    .col-md-offset-11 {
        margin-left: 91.66666667%
    }

    .col-md-offset-10 {
        margin-left: 83.33333333%
    }

    .col-md-offset-9 {
        margin-left: 75%
    }

    .col-md-offset-8 {
        margin-left: 66.66666667%
    }

    .col-md-offset-7 {
        margin-left: 58.33333333%
    }

    .col-md-offset-6 {
        margin-left: 50%
    }

    .col-md-offset-5 {
        margin-left: 41.66666667%
    }

    .col-md-offset-4 {
        margin-left: 33.33333333%
    }

    .col-md-offset-3 {
        margin-left: 25%
    }

    .col-md-offset-2 {
        margin-left: 16.66666667%
    }

    .col-md-offset-1 {
        margin-left: 8.33333333%
    }

    .col-md-offset-0 {
        margin-left: 0
    }
}

@media (min-width: 1600px) {
    .col-lg-1,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-10,.col-lg-11,.col-lg-12 {
        float:left
    }

    .col-lg-12 {
        width: 100%
    }

    .col-lg-11 {
        width: 91.66666667%
    }

    .col-lg-10 {
        width: 83.33333333%
    }

    .col-lg-9 {
        width: 75%
    }

    .col-lg-8 {
        width: 66.66666667%
    }

    .col-lg-7 {
        width: 58.33333333%
    }

    .col-lg-6 {
        width: 50%
    }

    .col-lg-5 {
        width: 41.66666667%
    }

    .col-lg-4 {
        width: 33.33333333%
    }

    .col-lg-3 {
        width: 25%
    }

    .col-lg-2 {
        width: 16.66666667%
    }

    .col-lg-1 {
        width: 8.33333333%
    }

    .col-lg-pull-12 {
        right: 100%
    }

    .col-lg-pull-11 {
        right: 91.66666667%
    }

    .col-lg-pull-10 {
        right: 83.33333333%
    }

    .col-lg-pull-9 {
        right: 75%
    }

    .col-lg-pull-8 {
        right: 66.66666667%
    }

    .col-lg-pull-7 {
        right: 58.33333333%
    }

    .col-lg-pull-6 {
        right: 50%
    }

    .col-lg-pull-5 {
        right: 41.66666667%
    }

    .col-lg-pull-4 {
        right: 33.33333333%
    }

    .col-lg-pull-3 {
        right: 25%
    }

    .col-lg-pull-2 {
        right: 16.66666667%
    }

    .col-lg-pull-1 {
        right: 8.33333333%
    }

    .col-lg-pull-0 {
        right: auto
    }

    .col-lg-push-12 {
        left: 100%
    }

    .col-lg-push-11 {
        left: 91.66666667%
    }

    .col-lg-push-10 {
        left: 83.33333333%
    }

    .col-lg-push-9 {
        left: 75%
    }

    .col-lg-push-8 {
        left: 66.66666667%
    }

    .col-lg-push-7 {
        left: 58.33333333%
    }

    .col-lg-push-6 {
        left: 50%
    }

    .col-lg-push-5 {
        left: 41.66666667%
    }

    .col-lg-push-4 {
        left: 33.33333333%
    }

    .col-lg-push-3 {
        left: 25%
    }

    .col-lg-push-2 {
        left: 16.66666667%
    }

    .col-lg-push-1 {
        left: 8.33333333%
    }

    .col-lg-push-0 {
        left: auto
    }

    .col-lg-offset-12 {
        margin-left: 100%
    }

    .col-lg-offset-11 {
        margin-left: 91.66666667%
    }

    .col-lg-offset-10 {
        margin-left: 83.33333333%
    }

    .col-lg-offset-9 {
        margin-left: 75%
    }

    .col-lg-offset-8 {
        margin-left: 66.66666667%
    }

    .col-lg-offset-7 {
        margin-left: 58.33333333%
    }

    .col-lg-offset-6 {
        margin-left: 50%
    }

    .col-lg-offset-5 {
        margin-left: 41.66666667%
    }

    .col-lg-offset-4 {
        margin-left: 33.33333333%
    }

    .col-lg-offset-3 {
        margin-left: 25%
    }

    .col-lg-offset-2 {
        margin-left: 16.66666667%
    }

    .col-lg-offset-1 {
        margin-left: 8.33333333%
    }

    .col-lg-offset-0 {
        margin-left: 0
    }
}

fieldset {
    margin: 0;
    min-width: 0
}

fieldset,legend {
    padding: 0;
    border: 0
}

legend {
    display: block;
    width: 100%;
    margin-bottom: 20px;
    font-size: 21px;
    line-height: inherit;
    color: #333;
    border-bottom: 1px solid #e5e5e5
}

label {
    display: inline-block;
    max-width: 100%;
    margin-bottom: 5px;
    font-weight: 700
}

input[type=search] {
    box-sizing: border-box
}

input[type=checkbox],input[type=radio] {
    margin: 4px 0 0;
    margin-top: 1px\9;
    line-height: normal
}

input[type=file] {
    display: block
}

input[type=range] {
    display: block;
    width: 100%
}

select[multiple],select[size] {
    height: auto
}

input[type=checkbox]:focus,input[type=file]:focus,input[type=radio]:focus {
    outline: thin dotted;
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px
}

output {
    padding-top: 7px
}

.form-control,output {
    display: block;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555
}

.form-control {
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 0;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out
}

.form-control:focus {
    border-color: #00a786;
    outline: 0;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(0,167,134,.6)
}

.form-control::-moz-placeholder {
    color: #999;
    opacity: 1
}

.form-control:-ms-input-placeholder {
    color: #999
}

.form-control::-webkit-input-placeholder {
    color: #999;
    color: #aaa
}

.form-control:-moz-placeholder,.form-control::-moz-placeholder {
    color: #aaa
}

.form-control:-ms-input-placeholder {
    color: #aaa
}

.form-control::-ms-expand {
    border: 0;
    background-color: transparent
}

.form-control[disabled],.form-control[readonly],fieldset[disabled] .form-control {
    background-color: #eee;
    opacity: 1
}

.form-control[disabled],fieldset[disabled] .form-control {
    cursor: not-allowed
}

textarea.form-control {
    height: auto
}

input[type=search] {
    -webkit-appearance: none
}

@media screen and (-webkit-min-device-pixel-ratio: 0) {
    input[type=date].form-control,input[type=datetime-local].form-control,input[type=month].form-control,input[type=time].form-control {
        line-height:34px
    }

    .input-group-sm input[type=date],.input-group-sm input[type=datetime-local],.input-group-sm input[type=month],.input-group-sm input[type=time],input[type=date].input-sm,input[type=datetime-local].input-sm,input[type=month].input-sm,input[type=time].input-sm {
        line-height: 30px
    }

    .input-group-lg input[type=date],.input-group-lg input[type=datetime-local],.input-group-lg input[type=month],.input-group-lg input[type=time],input[type=date].input-lg,input[type=datetime-local].input-lg,input[type=month].input-lg,input[type=time].input-lg {
        line-height: 46px
    }
}

.form-group {
    margin-bottom: 15px
}

.checkbox,.radio {
    position: relative;
    display: block;
    margin-top: 10px;
    margin-bottom: 10px
}

.checkbox label,.radio label {
    min-height: 20px;
    padding-left: 20px;
    margin-bottom: 0;
    font-weight: 400;
    cursor: pointer
}

.checkbox-inline input[type=checkbox],.checkbox input[type=checkbox],.radio-inline input[type=radio],.radio input[type=radio] {
    position: absolute;
    margin-left: -20px;
    margin-top: 4px\9
}

.checkbox+.checkbox,.radio+.radio {
    margin-top: -5px
}

.checkbox-inline,.radio-inline {
    position: relative;
    display: inline-block;
    padding-left: 20px;
    margin-bottom: 0;
    vertical-align: middle;
    font-weight: 400;
    cursor: pointer
}

.checkbox-inline+.checkbox-inline,.radio-inline+.radio-inline {
    margin-top: 0;
    margin-left: 10px
}

.checkbox-inline.disabled,.checkbox.disabled label,.radio-inline.disabled,.radio.disabled label,fieldset[disabled] .checkbox-inline,fieldset[disabled] .checkbox label,fieldset[disabled] .radio-inline,fieldset[disabled] .radio label,fieldset[disabled] input[type=checkbox],fieldset[disabled] input[type=radio],input[type=checkbox].disabled,input[type=checkbox][disabled],input[type=radio].disabled,input[type=radio][disabled] {
    cursor: not-allowed
}

.form-control-static {
    padding-top: 7px;
    padding-bottom: 7px;
    margin-bottom: 0;
    min-height: 34px
}

.form-control-static.input-lg,.form-control-static.input-sm {
    padding-left: 0;
    padding-right: 0
}

.input-sm {
    height: 30px;
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px
}

select.input-sm {
    height: 30px;
    line-height: 30px
}

select[multiple].input-sm,textarea.input-sm {
    height: auto
}

.form-group-sm .form-control {
    height: 30px;
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px
}

.form-group-sm select.form-control {
    height: 30px;
    line-height: 30px
}

.form-group-sm select[multiple].form-control,.form-group-sm textarea.form-control {
    height: auto
}

.form-group-sm .form-control-static {
    height: 30px;
    min-height: 32px;
    padding: 6px 10px;
    font-size: 12px;
    line-height: 1.5
}

.input-lg {
    height: 46px;
    padding: 10px 16px;
    font-size: 18px;
    line-height: 1.3333333;
    border-radius: 6px
}

select.input-lg {
    height: 46px;
    line-height: 46px
}

select[multiple].input-lg,textarea.input-lg {
    height: auto
}

.form-group-lg .form-control {
    height: 46px;
    padding: 10px 16px;
    font-size: 18px;
    line-height: 1.3333333;
    border-radius: 6px
}

.form-group-lg select.form-control {
    height: 46px;
    line-height: 46px
}

.form-group-lg select[multiple].form-control,.form-group-lg textarea.form-control {
    height: auto
}

.form-group-lg .form-control-static {
    height: 46px;
    min-height: 38px;
    padding: 11px 16px;
    font-size: 18px;
    line-height: 1.3333333
}

.has-feedback {
    position: relative
}

.has-feedback .form-control {
    padding-right: 42.5px
}

.form-control-feedback {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2;
    display: block;
    width: 34px;
    height: 34px;
    line-height: 34px;
    text-align: center;
    pointer-events: none
}

.form-group-lg .form-control+.form-control-feedback,.input-group-lg+.form-control-feedback,.input-lg+.form-control-feedback {
    width: 46px;
    height: 46px;
    line-height: 46px
}

.form-group-sm .form-control+.form-control-feedback,.input-group-sm+.form-control-feedback,.input-sm+.form-control-feedback {
    width: 30px;
    height: 30px;
    line-height: 30px
}

.has-success .checkbox,.has-success .checkbox-inline,.has-success.checkbox-inline label,.has-success.checkbox label,.has-success .control-label,.has-success .help-block,.has-success .radio,.has-success .radio-inline,.has-success.radio-inline label,.has-success.radio label {
    color: #3c763d
}

.has-success .form-control {
    border-color: #3c763d;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075)
}

.has-success .form-control:focus {
    border-color: #2b542c;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #67b168
}

.has-success .input-group-addon {
    color: #3c763d;
    border-color: #3c763d;
    background-color: #dff0d8
}

.has-success .form-control-feedback {
    color: #3c763d
}

.has-warning .checkbox,.has-warning .checkbox-inline,.has-warning.checkbox-inline label,.has-warning.checkbox label,.has-warning .control-label,.has-warning .help-block,.has-warning .radio,.has-warning .radio-inline,.has-warning.radio-inline label,.has-warning.radio label {
    color: #8a6d3b
}

.has-warning .form-control {
    border-color: #8a6d3b;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075)
}

.has-warning .form-control:focus {
    border-color: #66512c;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #c0a16b
}

.has-warning .input-group-addon {
    color: #8a6d3b;
    border-color: #8a6d3b;
    background-color: #fcf8e3
}

.has-warning .form-control-feedback {
    color: #8a6d3b
}

.has-error .checkbox,.has-error .checkbox-inline,.has-error.checkbox-inline label,.has-error.checkbox label,.has-error .control-label,.has-error .help-block,.has-error .radio,.has-error .radio-inline,.has-error.radio-inline label,.has-error.radio label {
    color: #a94442
}

.has-error .form-control {
    border-color: #a94442;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075)
}

.has-error .form-control:focus {
    border-color: #843534;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 6px #ce8483
}

.has-error .input-group-addon {
    color: #a94442;
    border-color: #a94442;
    background-color: #f2dede
}

.has-error .form-control-feedback {
    color: #a94442
}

.has-feedback label~.form-control-feedback {
    top: 25px
}

.has-feedback label.sr-only~.form-control-feedback {
    top: 0
}

.help-block {
    display: block;
    margin-top: 5px;
    margin-bottom: 10px;
    color: #737373
}

@media (min-width: 768px) {
    .form-inline .form-group {
        display:inline-block;
        margin-bottom: 0;
        vertical-align: middle
    }

    .form-inline .form-control {
        display: inline-block;
        width: auto;
        vertical-align: middle
    }

    .form-inline .form-control-static {
        display: inline-block
    }

    .form-inline .input-group {
        display: inline-table;
        vertical-align: middle
    }

    .form-inline .input-group .form-control,.form-inline .input-group .input-group-addon,.form-inline .input-group .input-group-btn {
        width: auto
    }

    .form-inline .input-group>.form-control {
        width: 100%
    }

    .form-inline .control-label {
        margin-bottom: 0;
        vertical-align: middle
    }

    .form-inline .checkbox,.form-inline .radio {
        display: inline-block;
        margin-top: 0;
        margin-bottom: 0;
        vertical-align: middle
    }

    .form-inline .checkbox label,.form-inline .radio label {
        padding-left: 0
    }

    .form-inline .checkbox input[type=checkbox],.form-inline .radio input[type=radio] {
        position: relative;
        margin-left: 0
    }

    .form-inline .has-feedback .form-control-feedback {
        top: 0
    }
}

.form-horizontal .checkbox,.form-horizontal .checkbox-inline,.form-horizontal .radio,.form-horizontal .radio-inline {
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 7px
}

.form-horizontal .checkbox,.form-horizontal .radio {
    min-height: 27px
}

.form-horizontal .form-group {
    margin-left: -15px;
    margin-right: -15px
}

@media (min-width: 768px) {
    .form-horizontal .control-label {
        text-align:right;
        margin-bottom: 0;
        padding-top: 7px
    }
}

.form-horizontal .has-feedback .form-control-feedback {
    right: 15px
}

@media (min-width: 768px) {
    .form-horizontal .form-group-lg .control-label {
        padding-top:11px;
        font-size: 18px
    }
}

@media (min-width: 768px) {
    .form-horizontal .form-group-sm .control-label {
        padding-top:6px;
        font-size: 12px
    }
}

.fade {
    opacity: 0;
    transition: opacity .15s linear
}

.fade.in {
    opacity: 1
}

.collapse {
    display: none
}

.collapse.in {
    display: block
}

tr.collapse.in {
    display: table-row
}

tbody.collapse.in {
    display: table-row-group
}

.collapsing {
    position: relative;
    height: 0;
    overflow: hidden;
    transition-property: height,visibility;
    transition-duration: .35s;
    transition-timing-function: ease
}

.btn {
    display: inline-block;
    margin-bottom: 0;
    font-weight: 400;
    text-align: center;
    vertical-align: middle;
    touch-action: manipulation;
    cursor: pointer;
    background-image: none;
    border: 1px solid transparent;
    white-space: nowrap;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    border-radius: 2px;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.btn.active.focus,.btn.active:focus,.btn.focus,.btn:active.focus,.btn:active:focus,.btn:focus {
    outline: thin dotted;
    outline: 5px auto -webkit-focus-ring-color;
    outline-offset: -2px
}

.btn.focus,.btn:focus,.btn:hover {
    color: #00a786;
    text-decoration: none
}

.btn.active,.btn:active {
    outline: 0;
    background-image: none;
    box-shadow: inset 0 3px 5px rgba(0,0,0,.125)
}

.btn.disabled,.btn[disabled],fieldset[disabled] .btn {
    cursor: not-allowed;
    zoom:1;filter: alpha(opacity=65);
    -webkit-opacity: .65;
    -moz-opacity: .65;
    opacity: .65;
    box-shadow: none
}

a.btn.disabled,fieldset[disabled] a.btn {
    pointer-events: none
}

.btn-default {
    color: #00a786;
    background-color: #fff;
    border-color: #00a786
}

.btn-default.focus,.btn-default:focus {
    color: #00a786;
    background-color: #e6e6e6;
    border-color: #002820
}

.btn-default.active,.btn-default:active,.btn-default:hover,.open>.dropdown-toggle.btn-default {
    color: #00a786;
    background-color: #e6e6e6;
    border-color: #006a55
}

.btn-default.active.focus,.btn-default.active:focus,.btn-default.active:hover,.btn-default:active.focus,.btn-default:active:focus,.btn-default:active:hover,.open>.dropdown-toggle.btn-default.focus,.open>.dropdown-toggle.btn-default:focus,.open>.dropdown-toggle.btn-default:hover {
    color: #00a786;
    background-color: #d4d4d4;
    border-color: #002820
}

.btn-default.active,.btn-default:active,.open>.dropdown-toggle.btn-default {
    background-image: none
}

.btn-default.disabled.focus,.btn-default.disabled:focus,.btn-default.disabled:hover,.btn-default[disabled].focus,.btn-default[disabled]:focus,.btn-default[disabled]:hover,fieldset[disabled] .btn-default.focus,fieldset[disabled] .btn-default:focus,fieldset[disabled] .btn-default:hover {
    background-color: #fff;
    border-color: #00a786
}

.btn-default .badge,.btn-primary {
    color: #fff;
    background-color: #00a786
}

.btn-primary {
    border-color: #008e72
}

.btn-primary.focus,.btn-primary:focus {
    color: #fff;
    background-color: #00745d;
    border-color: #000e0b
}

.btn-primary.active,.btn-primary:active,.btn-primary:hover,.open>.dropdown-toggle.btn-primary {
    color: #fff;
    background-color: #00745d;
    border-color: #005040
}

.btn-primary.active.focus,.btn-primary.active:focus,.btn-primary.active:hover,.btn-primary:active.focus,.btn-primary:active:focus,.btn-primary:active:hover,.open>.dropdown-toggle.btn-primary.focus,.open>.dropdown-toggle.btn-primary:focus,.open>.dropdown-toggle.btn-primary:hover {
    color: #fff;
    background-color: #005040;
    border-color: #000e0b
}

.btn-primary.active,.btn-primary:active,.open>.dropdown-toggle.btn-primary {
    background-image: none
}

.btn-primary.disabled.focus,.btn-primary.disabled:focus,.btn-primary.disabled:hover,.btn-primary[disabled].focus,.btn-primary[disabled]:focus,.btn-primary[disabled]:hover,fieldset[disabled] .btn-primary.focus,fieldset[disabled] .btn-primary:focus,fieldset[disabled] .btn-primary:hover {
    background-color: #00a786;
    border-color: #008e72
}

.btn-primary .badge {
    color: #00a786;
    background-color: #fff
}

.btn-success {
    color: #fff;
    background-color: #5cb85c;
    border-color: #4cae4c
}

.btn-success.focus,.btn-success:focus {
    color: #fff;
    background-color: #449d44;
    border-color: #255625
}

.btn-success.active,.btn-success:active,.btn-success:hover,.open>.dropdown-toggle.btn-success {
    color: #fff;
    background-color: #449d44;
    border-color: #398439
}

.btn-success.active.focus,.btn-success.active:focus,.btn-success.active:hover,.btn-success:active.focus,.btn-success:active:focus,.btn-success:active:hover,.open>.dropdown-toggle.btn-success.focus,.open>.dropdown-toggle.btn-success:focus,.open>.dropdown-toggle.btn-success:hover {
    color: #fff;
    background-color: #398439;
    border-color: #255625
}

.btn-success.active,.btn-success:active,.open>.dropdown-toggle.btn-success {
    background-image: none
}

.btn-success.disabled.focus,.btn-success.disabled:focus,.btn-success.disabled:hover,.btn-success[disabled].focus,.btn-success[disabled]:focus,.btn-success[disabled]:hover,fieldset[disabled] .btn-success.focus,fieldset[disabled] .btn-success:focus,fieldset[disabled] .btn-success:hover {
    background-color: #5cb85c;
    border-color: #4cae4c
}

.btn-success .badge {
    color: #5cb85c;
    background-color: #fff
}

.btn-info {
    color: #fff;
    background-color: #5bc0de;
    border-color: #46b8da
}

.btn-info.focus,.btn-info:focus {
    color: #fff;
    background-color: #31b0d5;
    border-color: #1b6d85
}

.btn-info.active,.btn-info:active,.btn-info:hover,.open>.dropdown-toggle.btn-info {
    color: #fff;
    background-color: #31b0d5;
    border-color: #269abc
}

.btn-info.active.focus,.btn-info.active:focus,.btn-info.active:hover,.btn-info:active.focus,.btn-info:active:focus,.btn-info:active:hover,.open>.dropdown-toggle.btn-info.focus,.open>.dropdown-toggle.btn-info:focus,.open>.dropdown-toggle.btn-info:hover {
    color: #fff;
    background-color: #269abc;
    border-color: #1b6d85
}

.btn-info.active,.btn-info:active,.open>.dropdown-toggle.btn-info {
    background-image: none
}

.btn-info.disabled.focus,.btn-info.disabled:focus,.btn-info.disabled:hover,.btn-info[disabled].focus,.btn-info[disabled]:focus,.btn-info[disabled]:hover,fieldset[disabled] .btn-info.focus,fieldset[disabled] .btn-info:focus,fieldset[disabled] .btn-info:hover {
    background-color: #5bc0de;
    border-color: #46b8da
}

.btn-info .badge {
    color: #5bc0de;
    background-color: #fff
}

.btn-warning {
    color: #fff;
    background-color: #f0ad4e;
    border-color: #eea236
}

.btn-warning.focus,.btn-warning:focus {
    color: #fff;
    background-color: #ec971f;
    border-color: #985f0d
}

.btn-warning.active,.btn-warning:active,.btn-warning:hover,.open>.dropdown-toggle.btn-warning {
    color: #fff;
    background-color: #ec971f;
    border-color: #d58512
}

.btn-warning.active.focus,.btn-warning.active:focus,.btn-warning.active:hover,.btn-warning:active.focus,.btn-warning:active:focus,.btn-warning:active:hover,.open>.dropdown-toggle.btn-warning.focus,.open>.dropdown-toggle.btn-warning:focus,.open>.dropdown-toggle.btn-warning:hover {
    color: #fff;
    background-color: #d58512;
    border-color: #985f0d
}

.btn-warning.active,.btn-warning:active,.open>.dropdown-toggle.btn-warning {
    background-image: none
}

.btn-warning.disabled.focus,.btn-warning.disabled:focus,.btn-warning.disabled:hover,.btn-warning[disabled].focus,.btn-warning[disabled]:focus,.btn-warning[disabled]:hover,fieldset[disabled] .btn-warning.focus,fieldset[disabled] .btn-warning:focus,fieldset[disabled] .btn-warning:hover {
    background-color: #f0ad4e;
    border-color: #eea236
}

.btn-warning .badge {
    color: #f0ad4e;
    background-color: #fff
}

.btn-danger {
    color: #fff;
    background-color: #d9534f;
    border-color: #d43f3a
}

.btn-danger.focus,.btn-danger:focus {
    color: #fff;
    background-color: #c9302c;
    border-color: #761c19
}

.btn-danger.active,.btn-danger:active,.btn-danger:hover,.open>.dropdown-toggle.btn-danger {
    color: #fff;
    background-color: #c9302c;
    border-color: #ac2925
}

.btn-danger.active.focus,.btn-danger.active:focus,.btn-danger.active:hover,.btn-danger:active.focus,.btn-danger:active:focus,.btn-danger:active:hover,.open>.dropdown-toggle.btn-danger.focus,.open>.dropdown-toggle.btn-danger:focus,.open>.dropdown-toggle.btn-danger:hover {
    color: #fff;
    background-color: #ac2925;
    border-color: #761c19
}

.btn-danger.active,.btn-danger:active,.open>.dropdown-toggle.btn-danger {
    background-image: none
}

.btn-danger.disabled.focus,.btn-danger.disabled:focus,.btn-danger.disabled:hover,.btn-danger[disabled].focus,.btn-danger[disabled]:focus,.btn-danger[disabled]:hover,fieldset[disabled] .btn-danger.focus,fieldset[disabled] .btn-danger:focus,fieldset[disabled] .btn-danger:hover {
    background-color: #d9534f;
    border-color: #d43f3a
}

.btn-danger .badge {
    color: #d9534f;
    background-color: #fff
}

.btn-link {
    color: #00a786;
    font-weight: 400;
    border-radius: 0
}

.btn-link,.btn-link.active,.btn-link:active,.btn-link[disabled],fieldset[disabled] .btn-link {
    background-color: transparent;
    box-shadow: none
}

.btn-link,.btn-link:active,.btn-link:focus,.btn-link:hover {
    border-color: transparent
}

.btn-link:focus,.btn-link:hover {
    color: #005b49;
    text-decoration: underline;
    background-color: transparent
}

.btn-link[disabled]:focus,.btn-link[disabled]:hover,fieldset[disabled] .btn-link:focus,fieldset[disabled] .btn-link:hover {
    color: #777;
    text-decoration: none
}

.btn-lg {
    padding: 10px 16px;
    font-size: 18px;
    line-height: 1.3333333;
    border-radius: 2px
}

.btn-sm {
    padding: 5px 10px
}

.btn-sm,.btn-xs {
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px
}

.btn-xs {
    padding: 1px 5px
}

.btn-block {
    display: block;
    width: 100%
}

.btn-block+.btn-block {
    margin-top: 5px
}

input[type=button].btn-block,input[type=reset].btn-block,input[type=submit].btn-block {
    width: 100%
}

.input-group {
    position: relative;
    display: table;
    border-collapse: separate
}

.input-group[class*=col-] {
    float: none;
    padding-left: 0;
    padding-right: 0
}

.input-group .form-control {
    position: relative;
    z-index: 2;
    float: left;
    width: 100%;
    margin-bottom: 0
}

.input-group-lg>.form-control,.input-group-lg>.input-group-addon,.input-group-lg>.input-group-btn>.btn {
    height: 46px;
    padding: 10px 16px;
    font-size: 18px;
    line-height: 1.3333333;
    border-radius: 6px
}

select.input-group-lg>.form-control,select.input-group-lg>.input-group-addon,select.input-group-lg>.input-group-btn>.btn {
    height: 46px;
    line-height: 46px
}

select[multiple].input-group-lg>.form-control,select[multiple].input-group-lg>.input-group-addon,select[multiple].input-group-lg>.input-group-btn>.btn,textarea.input-group-lg>.form-control,textarea.input-group-lg>.input-group-addon,textarea.input-group-lg>.input-group-btn>.btn {
    height: auto
}

.input-group-sm>.form-control,.input-group-sm>.input-group-addon,.input-group-sm>.input-group-btn>.btn {
    height: 30px;
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
    border-radius: 3px
}

select.input-group-sm>.form-control,select.input-group-sm>.input-group-addon,select.input-group-sm>.input-group-btn>.btn {
    height: 30px;
    line-height: 30px
}

select[multiple].input-group-sm>.form-control,select[multiple].input-group-sm>.input-group-addon,select[multiple].input-group-sm>.input-group-btn>.btn,textarea.input-group-sm>.form-control,textarea.input-group-sm>.input-group-addon,textarea.input-group-sm>.input-group-btn>.btn {
    height: auto
}

.input-group-addon,.input-group-btn,.input-group .form-control {
    display: table-cell
}

.input-group-addon:not(:first-child):not(:last-child),.input-group-btn:not(:first-child):not(:last-child),.input-group .form-control:not(:first-child):not(:last-child) {
    border-radius: 0
}

.input-group-addon,.input-group-btn {
    width: 1%;
    white-space: nowrap;
    vertical-align: middle
}

.input-group-addon {
    padding: 6px 12px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1;
    color: #555;
    text-align: center;
    background-color: #eee;
    border: 1px solid #ccc;
    border-radius: 0
}

.input-group-addon.input-sm {
    padding: 5px 10px;
    font-size: 12px;
    border-radius: 3px
}

.input-group-addon.input-lg {
    padding: 10px 16px;
    font-size: 18px;
    border-radius: 6px
}

.input-group-addon input[type=checkbox],.input-group-addon input[type=radio] {
    margin-top: 0
}

.input-group-addon:first-child,.input-group-btn:first-child>.btn,.input-group-btn:first-child>.btn-group>.btn,.input-group-btn:first-child>.dropdown-toggle,.input-group-btn:last-child>.btn-group:not(:last-child)>.btn,.input-group-btn:last-child>.btn:not(:last-child):not(.dropdown-toggle),.input-group .form-control:first-child {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0
}

.input-group-addon:first-child {
    border-right: 0
}

.input-group-addon:last-child,.input-group-btn:first-child>.btn-group:not(:first-child)>.btn,.input-group-btn:first-child>.btn:not(:first-child),.input-group-btn:last-child>.btn,.input-group-btn:last-child>.btn-group>.btn,.input-group-btn:last-child>.dropdown-toggle,.input-group .form-control:last-child {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0
}

.input-group-addon:last-child {
    border-left: 0
}

.input-group-btn {
    font-size: 0;
    white-space: nowrap
}

.input-group-btn,.input-group-btn>.btn {
    position: relative
}

.input-group-btn>.btn+.btn {
    margin-left: -1px
}

.input-group-btn>.btn:active,.input-group-btn>.btn:focus,.input-group-btn>.btn:hover {
    z-index: 2
}

.input-group-btn:first-child>.btn,.input-group-btn:first-child>.btn-group {
    margin-right: -1px
}

.input-group-btn:last-child>.btn,.input-group-btn:last-child>.btn-group {
    z-index: 2;
    margin-left: -1px
}

.nav {
    margin-bottom: 0;
    padding-left: 0;
    list-style: none
}

.nav>li,.nav>li>a {
    position: relative;
    display: block
}

.nav>li>a {
    padding: 10px 15px
}

.nav>li>a:focus,.nav>li>a:hover {
    text-decoration: none;
    background-color: #eee
}

.nav>li.disabled>a {
    color: #777
}

.nav>li.disabled>a:focus,.nav>li.disabled>a:hover {
    color: #777;
    text-decoration: none;
    background-color: transparent;
    cursor: not-allowed
}

.nav .open>a,.nav .open>a:focus,.nav .open>a:hover {
    background-color: #eee;
    border-color: #00a786
}

.nav .nav-divider {
    height: 1px;
    margin: 9px 0;
    overflow: hidden;
    background-color: #e5e5e5
}

.nav>li>a>img {
    max-width: none
}

.nav-tabs {
    border-bottom: 1px solid #ddd
}

.nav-tabs>li {
    float: left;
    margin-bottom: -1px
}

.nav-tabs>li>a {
    margin-right: 2px;
    line-height: 1.42857143;
    border: 1px solid transparent;
    border-radius: 4px 4px 0 0
}

.nav-tabs>li>a:hover {
    border-color: #eee #eee #ddd
}

.nav-tabs>li.active>a,.nav-tabs>li.active>a:focus,.nav-tabs>li.active>a:hover {
    color: #555;
    background-color: #fff;
    border: 1px solid #ddd;
    border-bottom-color: transparent;
    cursor: default
}

.nav-tabs.nav-justified {
    width: 100%;
    border-bottom: 0
}

.nav-tabs.nav-justified>li {
    float: none
}

.nav-tabs.nav-justified>li>a {
    text-align: center;
    margin-bottom: 5px
}

.nav-tabs.nav-justified>.dropdown .dropdown-menu {
    top: auto;
    left: auto
}

@media (min-width: 768px) {
    .nav-tabs.nav-justified>li {
        display:table-cell;
        width: 1%
    }

    .nav-tabs.nav-justified>li>a {
        margin-bottom: 0
    }
}

.nav-tabs.nav-justified>li>a {
    margin-right: 0;
    border-radius: 4px
}

.nav-tabs.nav-justified>.active>a,.nav-tabs.nav-justified>.active>a:focus,.nav-tabs.nav-justified>.active>a:hover {
    border: 1px solid #ddd
}

@media (min-width: 768px) {
    .nav-tabs.nav-justified>li>a {
        border-bottom:1px solid #ddd;
        border-radius: 4px 4px 0 0
    }

    .nav-tabs.nav-justified>.active>a,.nav-tabs.nav-justified>.active>a:focus,.nav-tabs.nav-justified>.active>a:hover {
        border-bottom-color: #fff
    }
}

.nav-pills>li {
    float: left
}

.nav-pills>li>a {
    border-radius: 0
}

.nav-pills>li+li {
    margin-left: 2px
}

.nav-pills>li.active>a,.nav-pills>li.active>a:focus,.nav-pills>li.active>a:hover {
    color: #fff;
    background-color: #00a786
}

.nav-stacked>li {
    float: none
}

.nav-stacked>li+li {
    margin-top: 2px;
    margin-left: 0
}

.nav-justified {
    width: 100%
}

.nav-justified>li {
    float: none
}

.nav-justified>li>a {
    text-align: center;
    margin-bottom: 5px
}

.nav-justified>.dropdown .dropdown-menu {
    top: auto;
    left: auto
}

@media (min-width: 768px) {
    .nav-justified>li {
        display:table-cell;
        width: 1%
    }

    .nav-justified>li>a {
        margin-bottom: 0
    }
}

.nav-tabs-justified {
    border-bottom: 0
}

.nav-tabs-justified>li>a {
    margin-right: 0;
    border-radius: 4px
}

.nav-tabs-justified>.active>a,.nav-tabs-justified>.active>a:focus,.nav-tabs-justified>.active>a:hover {
    border: 1px solid #ddd
}

@media (min-width: 768px) {
    .nav-tabs-justified>li>a {
        border-bottom:1px solid #ddd;
        border-radius: 4px 4px 0 0
    }

    .nav-tabs-justified>.active>a,.nav-tabs-justified>.active>a:focus,.nav-tabs-justified>.active>a:hover {
        border-bottom-color: #fff
    }
}

.tab-content>.tab-pane {
    display: none
}

.tab-content>.active {
    display: block
}

.nav-tabs .dropdown-menu {
    margin-top: -1px;
    border-top-right-radius: 0;
    border-top-left-radius: 0
}

.navbar {
    min-height: 50px;
    margin-bottom: 0;
    border: 1px solid transparent
}

@media (min-width: 768px) {
    .navbar {
        border-radius:4px
    }
}

@media (min-width: 768px) {
    .navbar-header {
        float:left
    }
}

.navbar-collapse {
    overflow-x: visible;
    padding-right: 15px;
    padding-left: 15px;
    border-top: 1px solid transparent;
    box-shadow: inset 0 1px 0 hsla(0,0%,100%,.1);
    -webkit-overflow-scrolling: touch
}

.navbar-collapse.in {
    overflow-y: auto
}

@media (min-width: 768px) {
    .navbar-collapse {
        width:auto;
        border-top: 0;
        box-shadow: none
    }

    .navbar-collapse.collapse {
        display: block!important;
        height: auto!important;
        padding-bottom: 0;
        overflow: visible!important
    }

    .navbar-collapse.in {
        overflow-y: visible
    }

    .navbar-fixed-bottom .navbar-collapse,.navbar-fixed-top .navbar-collapse,.navbar-static-top .navbar-collapse {
        padding-left: 0;
        padding-right: 0
    }
}

.navbar-fixed-bottom .navbar-collapse,.navbar-fixed-top .navbar-collapse {
    max-height: 340px
}

@media (max-device-width: 480px) and (orientation:landscape) {
    .navbar-fixed-bottom .navbar-collapse,.navbar-fixed-top .navbar-collapse {
        max-height:200px
    }
}

.container-fluid>.navbar-collapse,.container-fluid>.navbar-header,.container>.navbar-collapse,.container>.navbar-header {
    margin-right: -15px;
    margin-left: -15px
}

@media (min-width: 768px) {
    .container-fluid>.navbar-collapse,.container-fluid>.navbar-header,.container>.navbar-collapse,.container>.navbar-header {
        margin-right:0;
        margin-left: 0
    }
}

.navbar-static-top {
    z-index: 1000;
    border-width: 0 0 1px
}

@media (min-width: 768px) {
    .navbar-static-top {
        border-radius:0
    }
}

.navbar-fixed-bottom,.navbar-fixed-top {
    position: fixed;
    right: 0;
    left: 0;
    z-index: 1030
}

@media (min-width: 768px) {
    .navbar-fixed-bottom,.navbar-fixed-top {
        border-radius:0
    }
}

.navbar-fixed-top {
    top: 0;
    border-width: 0 0 1px
}

.navbar-fixed-bottom {
    bottom: 0;
    margin-bottom: 0;
    border-width: 1px 0 0
}

.navbar-brand {
    float: left;
    padding: 15px;
    font-size: 18px;
    line-height: 20px;
    height: 50px
}

.navbar-brand:focus,.navbar-brand:hover {
    text-decoration: none
}

.navbar-brand>img {
    display: block
}

@media (min-width: 768px) {
    .navbar>.container-fluid .navbar-brand,.navbar>.container .navbar-brand {
        margin-left:-15px
    }
}

.navbar-toggle {
    position: relative;
    float: right;
    margin-right: 15px;
    padding: 9px 10px;
    margin-top: 8px;
    margin-bottom: 8px;
    background-color: transparent;
    background-image: none;
    border: 1px solid transparent;
    border-radius: 4px
}

.navbar-toggle:focus {
    outline: 0
}

.navbar-toggle .icon-bar {
    display: block;
    width: 22px;
    height: 2px;
    border-radius: 1px
}

.navbar-toggle .icon-bar+.icon-bar {
    margin-top: 4px
}

@media (min-width: 768px) {
    .navbar-toggle {
        display:none
    }
}

.navbar-nav {
    margin: 7.5px -15px
}

.navbar-nav>li>a {
    padding-top: 10px;
    padding-bottom: 10px;
    line-height: 20px
}

@media (max-width: 767px) {
    .navbar-nav .open .dropdown-menu {
        position:static;
        float: none;
        width: auto;
        margin-top: 0;
        background-color: transparent;
        border: 0;
        box-shadow: none
    }

    .navbar-nav .open .dropdown-menu .dropdown-header,.navbar-nav .open .dropdown-menu>li>a {
        padding: 5px 15px 5px 25px
    }

    .navbar-nav .open .dropdown-menu>li>a {
        line-height: 20px
    }

    .navbar-nav .open .dropdown-menu>li>a:focus,.navbar-nav .open .dropdown-menu>li>a:hover {
        background-image: none
    }
}

@media (min-width: 768px) {
    .navbar-nav {
        float:left;
        margin: 0
    }

    .navbar-nav>li {
        float: left
    }

    .navbar-nav>li>a {
        padding-top: 15px;
        padding-bottom: 15px
    }
}

.navbar-form {
    margin: 8px -15px;
    padding: 10px 15px;
    border-top: 1px solid transparent;
    border-bottom: 1px solid transparent;
    box-shadow: inset 0 1px 0 hsla(0,0%,100%,.1),0 1px 0 hsla(0,0%,100%,.1)
}

@media (min-width: 768px) {
    .navbar-form .form-group {
        display:inline-block;
        margin-bottom: 0;
        vertical-align: middle
    }

    .navbar-form .form-control {
        display: inline-block;
        width: auto;
        vertical-align: middle
    }

    .navbar-form .form-control-static {
        display: inline-block
    }

    .navbar-form .input-group {
        display: inline-table;
        vertical-align: middle
    }

    .navbar-form .input-group .form-control,.navbar-form .input-group .input-group-addon,.navbar-form .input-group .input-group-btn {
        width: auto
    }

    .navbar-form .input-group>.form-control {
        width: 100%
    }

    .navbar-form .control-label {
        margin-bottom: 0;
        vertical-align: middle
    }

    .navbar-form .checkbox,.navbar-form .radio {
        display: inline-block;
        margin-top: 0;
        margin-bottom: 0;
        vertical-align: middle
    }

    .navbar-form .checkbox label,.navbar-form .radio label {
        padding-left: 0
    }

    .navbar-form .checkbox input[type=checkbox],.navbar-form .radio input[type=radio] {
        position: relative;
        margin-left: 0
    }

    .navbar-form .has-feedback .form-control-feedback {
        top: 0
    }
}

@media (max-width: 767px) {
    .navbar-form .form-group {
        margin-bottom:5px
    }

    .navbar-form .form-group:last-child {
        margin-bottom: 0
    }
}

@media (min-width: 768px) {
    .navbar-form {
        width:auto;
        border: 0;
        margin-left: 0;
        margin-right: 0;
        padding-top: 0;
        padding-bottom: 0;
        box-shadow: none
    }
}

.navbar-nav>li>.dropdown-menu {
    margin-top: 0;
    border-top-right-radius: 0;
    border-top-left-radius: 0
}

.navbar-fixed-bottom .navbar-nav>li>.dropdown-menu {
    margin-bottom: 0;
    border-top-right-radius: 4px;
    border-top-left-radius: 4px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0
}

.navbar-btn {
    margin-top: 8px;
    margin-bottom: 8px
}

.navbar-btn.btn-sm {
    margin-top: 10px;
    margin-bottom: 10px
}

.navbar-btn.btn-xs {
    margin-top: 14px;
    margin-bottom: 14px
}

.navbar-text {
    margin-top: 15px;
    margin-bottom: 15px
}

@media (min-width: 768px) {
    .navbar-text {
        float:left;
        margin-left: 15px;
        margin-right: 15px
    }
}

@media (min-width: 768px) {
    .navbar-left {
        float:left!important
    }

    .navbar-right {
        float: right!important;
        margin-right: -15px
    }

    .navbar-right~.navbar-right {
        margin-right: 0
    }
}

.navbar-default {
    background-color: #fff;
    border-color: #eee
}

.navbar-default .navbar-brand {
    color: #222
}

.navbar-default .navbar-brand:focus,.navbar-default .navbar-brand:hover {
    color: #080808;
    background-color: transparent
}

.navbar-default .navbar-text {
    color: #777
}

.navbar-default .navbar-nav>li>a {
    color: #222
}

.navbar-default .navbar-nav>li>a:focus,.navbar-default .navbar-nav>li>a:hover {
    color: #333;
    background-color: transparent
}

.navbar-default .navbar-nav>.active>a,.navbar-default .navbar-nav>.active>a:focus,.navbar-default .navbar-nav>.active>a:hover {
    color: #00866b;
    background-color: transparent
}

.navbar-default .navbar-nav>.disabled>a,.navbar-default .navbar-nav>.disabled>a:focus,.navbar-default .navbar-nav>.disabled>a:hover {
    color: #ccc;
    background-color: transparent
}

.navbar-default .navbar-toggle {
    border-color: transparent
}

.navbar-default .navbar-toggle:focus,.navbar-default .navbar-toggle:hover {
    background-color: #f5f5f5
}

.navbar-default .navbar-toggle .icon-bar {
    background-color: #00a786
}

.navbar-default .navbar-collapse,.navbar-default .navbar-form {
    border-color: #eee
}

.navbar-default .navbar-nav>.open>a,.navbar-default .navbar-nav>.open>a:focus,.navbar-default .navbar-nav>.open>a:hover {
    background-color: transparent;
    color: #00866b
}

@media (max-width: 767px) {
    .navbar-default .navbar-nav .open .dropdown-menu>li>a {
        color:#222
    }

    .navbar-default .navbar-nav .open .dropdown-menu>li>a:focus,.navbar-default .navbar-nav .open .dropdown-menu>li>a:hover {
        color: #333;
        background-color: transparent
    }

    .navbar-default .navbar-nav .open .dropdown-menu>.active>a,.navbar-default .navbar-nav .open .dropdown-menu>.active>a:focus,.navbar-default .navbar-nav .open .dropdown-menu>.active>a:hover {
        color: #00866b;
        background-color: transparent
    }

    .navbar-default .navbar-nav .open .dropdown-menu>.disabled>a,.navbar-default .navbar-nav .open .dropdown-menu>.disabled>a:focus,.navbar-default .navbar-nav .open .dropdown-menu>.disabled>a:hover {
        color: #ccc;
        background-color: transparent
    }
}

.navbar-default .navbar-link {
    color: #222
}

.navbar-default .navbar-link:hover {
    color: #333
}

.navbar-default .btn-link {
    color: #222
}

.navbar-default .btn-link:focus,.navbar-default .btn-link:hover {
    color: #333
}

.navbar-default .btn-link[disabled]:focus,.navbar-default .btn-link[disabled]:hover,fieldset[disabled] .navbar-default .btn-link:focus,fieldset[disabled] .navbar-default .btn-link:hover {
    color: #ccc
}

.navbar-inverse {
    background-color: #222;
    border-color: #080808
}

.navbar-inverse .navbar-brand {
    color: #9d9d9d
}

.navbar-inverse .navbar-brand:focus,.navbar-inverse .navbar-brand:hover {
    color: #fff;
    background-color: transparent
}

.navbar-inverse .navbar-nav>li>a,.navbar-inverse .navbar-text {
    color: #9d9d9d
}

.navbar-inverse .navbar-nav>li>a:focus,.navbar-inverse .navbar-nav>li>a:hover {
    color: #fff;
    background-color: transparent
}

.navbar-inverse .navbar-nav>.active>a,.navbar-inverse .navbar-nav>.active>a:focus,.navbar-inverse .navbar-nav>.active>a:hover {
    color: #fff;
    background-color: #080808
}

.navbar-inverse .navbar-nav>.disabled>a,.navbar-inverse .navbar-nav>.disabled>a:focus,.navbar-inverse .navbar-nav>.disabled>a:hover {
    color: #444;
    background-color: transparent
}

.navbar-inverse .navbar-toggle {
    border-color: #333
}

.navbar-inverse .navbar-toggle:focus,.navbar-inverse .navbar-toggle:hover {
    background-color: #333
}

.navbar-inverse .navbar-toggle .icon-bar {
    background-color: #fff
}

.navbar-inverse .navbar-collapse,.navbar-inverse .navbar-form {
    border-color: #101010
}

.navbar-inverse .navbar-nav>.open>a,.navbar-inverse .navbar-nav>.open>a:focus,.navbar-inverse .navbar-nav>.open>a:hover {
    background-color: #080808;
    color: #fff
}

@media (max-width: 767px) {
    .navbar-inverse .navbar-nav .open .dropdown-menu>.dropdown-header {
        border-color:#080808
    }

    .navbar-inverse .navbar-nav .open .dropdown-menu .divider {
        background-color: #080808
    }

    .navbar-inverse .navbar-nav .open .dropdown-menu>li>a {
        color: #9d9d9d
    }

    .navbar-inverse .navbar-nav .open .dropdown-menu>li>a:focus,.navbar-inverse .navbar-nav .open .dropdown-menu>li>a:hover {
        color: #fff;
        background-color: transparent
    }

    .navbar-inverse .navbar-nav .open .dropdown-menu>.active>a,.navbar-inverse .navbar-nav .open .dropdown-menu>.active>a:focus,.navbar-inverse .navbar-nav .open .dropdown-menu>.active>a:hover {
        color: #fff;
        background-color: #080808
    }

    .navbar-inverse .navbar-nav .open .dropdown-menu>.disabled>a,.navbar-inverse .navbar-nav .open .dropdown-menu>.disabled>a:focus,.navbar-inverse .navbar-nav .open .dropdown-menu>.disabled>a:hover {
        color: #444;
        background-color: transparent
    }
}

.navbar-inverse .navbar-link {
    color: #9d9d9d
}

.navbar-inverse .navbar-link:hover {
    color: #fff
}

.navbar-inverse .btn-link {
    color: #9d9d9d
}

.navbar-inverse .btn-link:focus,.navbar-inverse .btn-link:hover {
    color: #fff
}

.navbar-inverse .btn-link[disabled]:focus,.navbar-inverse .btn-link[disabled]:hover,fieldset[disabled] .navbar-inverse .btn-link:focus,fieldset[disabled] .navbar-inverse .btn-link:hover {
    color: #444
}

.jumbotron {
    padding-top: 30px;
    padding-bottom: 30px;
    margin-bottom: 30px;
    background-color: #eee
}

.jumbotron,.jumbotron .h1,.jumbotron h1 {
    color: inherit
}

.jumbotron p {
    margin-bottom: 15px;
    font-size: 21px;
    font-weight: 200
}

.jumbotron>hr {
    border-top-color: #d5d5d5
}

.container-fluid .jumbotron,.container .jumbotron {
    border-radius: 6px;
    padding-left: 15px;
    padding-right: 15px
}

.jumbotron .container {
    max-width: 100%
}

@media screen and (min-width: 768px) {
    .jumbotron {
        padding-top:48px;
        padding-bottom: 48px
    }

    .container-fluid .jumbotron,.container .jumbotron {
        padding-left: 60px;
        padding-right: 60px
    }

    .jumbotron .h1,.jumbotron h1 {
        font-size: 63px
    }
}

.label {
    display: inline;
    padding: .2em .6em .3em;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .25em
}

a.label:focus,a.label:hover {
    color: #fff;
    text-decoration: none;
    cursor: pointer
}

.label:empty {
    display: none
}

.btn .label {
    position: relative;
    top: -1px
}

.label-default {
    background-color: #777
}

.label-default[href]:focus,.label-default[href]:hover {
    background-color: #5e5e5e
}

.label-primary {
    background-color: #00a786
}

.label-primary[href]:focus,.label-primary[href]:hover {
    background-color: #00745d
}

.label-success {
    background-color: #5cb85c
}

.label-success[href]:focus,.label-success[href]:hover {
    background-color: #449d44
}

.label-info {
    background-color: #5bc0de
}

.label-info[href]:focus,.label-info[href]:hover {
    background-color: #31b0d5
}

.label-warning {
    background-color: #f0ad4e
}

.label-warning[href]:focus,.label-warning[href]:hover {
    background-color: #ec971f
}

.label-danger {
    background-color: #d9534f
}

.label-danger[href]:focus,.label-danger[href]:hover {
    background-color: #c9302c
}

.thumbnail {
    display: block;
    padding: 0;
    margin-bottom: 20px;
    line-height: 1.42857143;
    background-color: #fff;
    border: 1px solid transparent;
    border-radius: 4px;
    transition: border .2s ease-in-out
}

.thumbnail>img,.thumbnail a>img {
    margin-left: auto;
    margin-right: auto
}

a.thumbnail.active,a.thumbnail:focus,a.thumbnail:hover {
    border-color: #00a786
}

.thumbnail .caption {
    padding: 0;
    color: #333
}

.breadcrumb {
    padding: 8px 0;
    margin-bottom: 20px;
    list-style: none;
    background-color: transparent;
    border-radius: 4px
}

.breadcrumb>li {
    display: inline-block
}

.breadcrumb>li+li:before {
    content: ">\A0";
    padding: 0 5px;
    color: #ccc
}

.breadcrumb>.active {
    color: #777
}

.pagination {
    display: inline-block;
    padding-left: 0;
    margin: 20px 0;
    border-radius: 4px
}

.pagination>li {
    display: inline
}

.pagination>li>a,.pagination>li>span {
    position: relative;
    float: left;
    padding: 6px 12px;
    line-height: 1.42857143;
    text-decoration: none;
    color: #00a786;
    background-color: #fff;
    border: 1px solid #ddd;
    margin-left: -1px
}

.pagination>li:first-child>a,.pagination>li:first-child>span {
    margin-left: 0;
    border-bottom-left-radius: 4px;
    border-top-left-radius: 4px
}

.pagination>li:last-child>a,.pagination>li:last-child>span {
    border-bottom-right-radius: 4px;
    border-top-right-radius: 4px
}

.pagination>li>a:focus,.pagination>li>a:hover,.pagination>li>span:focus,.pagination>li>span:hover {
    z-index: 2;
    color: #005b49;
    background-color: #eee;
    border-color: #ddd
}

.pagination>.active>a,.pagination>.active>a:focus,.pagination>.active>a:hover,.pagination>.active>span,.pagination>.active>span:focus,.pagination>.active>span:hover {
    z-index: 3;
    color: #fff;
    background-color: #00a786;
    border-color: #00a786;
    cursor: default
}

.pagination>.disabled>a,.pagination>.disabled>a:focus,.pagination>.disabled>a:hover,.pagination>.disabled>span,.pagination>.disabled>span:focus,.pagination>.disabled>span:hover {
    color: #777;
    background-color: #fff;
    border-color: #ddd;
    cursor: not-allowed
}

.pagination-lg>li>a,.pagination-lg>li>span {
    padding: 10px 16px;
    font-size: 18px;
    line-height: 1.3333333
}

.pagination-lg>li:first-child>a,.pagination-lg>li:first-child>span {
    border-bottom-left-radius: 6px;
    border-top-left-radius: 6px
}

.pagination-lg>li:last-child>a,.pagination-lg>li:last-child>span {
    border-bottom-right-radius: 6px;
    border-top-right-radius: 6px
}

.pagination-sm>li>a,.pagination-sm>li>span {
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5
}

.pagination-sm>li:first-child>a,.pagination-sm>li:first-child>span {
    border-bottom-left-radius: 3px;
    border-top-left-radius: 3px
}

.pagination-sm>li:last-child>a,.pagination-sm>li:last-child>span {
    border-bottom-right-radius: 3px;
    border-top-right-radius: 3px
}

.carousel {
    position: relative
}

.carousel-inner {
    overflow: hidden;
    width: 100%
}

.carousel-inner>.item {
    display: none;
    position: relative;
    transition: left .6s ease-in-out
}

.carousel-inner>.item>a>img,.carousel-inner>.item>img {
    line-height: 1
}

@media (-webkit-transform-3d),(transform-3d) {
    .carousel-inner>.item {
        transition: transform .6s ease-in-out;
        -webkit-backface-visibility: hidden;
        backface-visibility: hidden;
        perspective: 1000px
    }

    .carousel-inner>.item.active.right,.carousel-inner>.item.next {
        transform: translate3d(100%,0,0);
        left: 0
    }

    .carousel-inner>.item.active.left,.carousel-inner>.item.prev {
        transform: translate3d(-100%,0,0);
        left: 0
    }

    .carousel-inner>.item.active,.carousel-inner>.item.next.left,.carousel-inner>.item.prev.right {
        transform: translateZ(0);
        left: 0
    }
}

.carousel-inner>.active,.carousel-inner>.next,.carousel-inner>.prev {
    display: block
}

.carousel-inner>.active {
    left: 0
}

.carousel-inner>.next,.carousel-inner>.prev {
    position: absolute;
    top: 0;
    width: 100%
}

.carousel-inner>.next {
    left: 100%
}

.carousel-inner>.prev {
    left: -100%
}

.carousel-inner>.next.left,.carousel-inner>.prev.right {
    left: 0
}

.carousel-inner>.active.left {
    left: -100%
}

.carousel-inner>.active.right {
    left: 100%
}

.carousel-control {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    width: 15%;
    zoom:1;filter: alpha(opacity=50);
    -webkit-opacity: .5;
    -moz-opacity: .5;
    opacity: .5;
    font-size: 20px;
    color: #fff;
    text-align: center;
    text-shadow: 0 1px 2px rgba(0,0,0,.6)
}

.carousel-control.left {
    background-image: linear-gradient(90deg,rgba(0,0,0,.5),rgba(0,0,0,.0001));
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#80000000",endColorstr="#00000000",GradientType=1)
}

.carousel-control.right {
    left: auto;
    right: 0;
    background-image: linear-gradient(90deg,rgba(0,0,0,.0001),rgba(0,0,0,.5));
    background-repeat: repeat-x;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00000000",endColorstr="#80000000",GradientType=1)
}

.carousel-control:focus,.carousel-control:hover {
    outline: 0;
    color: #fff;
    text-decoration: none;
    zoom:1;filter: alpha(opacity=90);
    -webkit-opacity: .9;
    -moz-opacity: .9;
    opacity: .9
}

.carousel-control .glyphicon-chevron-left,.carousel-control .glyphicon-chevron-right,.carousel-control .icon-next,.carousel-control .icon-prev {
    position: absolute;
    top: 50%;
    margin-top: -10px;
    z-index: 5;
    display: inline-block
}

.carousel-control .glyphicon-chevron-left,.carousel-control .icon-prev {
    left: 50%;
    margin-left: -10px
}

.carousel-control .glyphicon-chevron-right,.carousel-control .icon-next {
    right: 50%;
    margin-right: -10px
}

.carousel-control .icon-next,.carousel-control .icon-prev {
    width: 20px;
    height: 20px;
    line-height: 1;
    font-family: serif
}

.carousel-control .icon-prev:before {
    content: "\2039"
}

.carousel-control .icon-next:before {
    content: "\203A"
}

.carousel-indicators {
    position: absolute;
    bottom: 10px;
    left: 50%;
    z-index: 15;
    width: 60%;
    margin-left: -30%;
    padding-left: 0;
    list-style: none;
    text-align: center
}

.carousel-indicators li {
    display: inline-block;
    width: 10px;
    height: 10px;
    margin: 1px;
    text-indent: -999px;
    border: 1px solid #fff;
    border-radius: 10px;
    cursor: pointer;
    background-color: #000\9;
    background-color: transparent
}

.carousel-indicators .active {
    margin: 0;
    width: 12px;
    height: 12px;
    background-color: #fff
}

.carousel-caption {
    position: absolute;
    left: 15%;
    right: 15%;
    bottom: 20px;
    z-index: 10;
    padding-top: 20px;
    padding-bottom: 20px;
    color: #fff;
    text-align: center;
    text-shadow: 0 1px 2px rgba(0,0,0,.6)
}

.carousel-caption .btn {
    text-shadow: none
}

@media screen and (min-width: 768px) {
    .carousel-control .glyphicon-chevron-left,.carousel-control .glyphicon-chevron-right,.carousel-control .icon-next,.carousel-control .icon-prev {
        width:30px;
        height: 30px;
        margin-top: -15px;
        font-size: 30px
    }

    .carousel-control .glyphicon-chevron-left,.carousel-control .icon-prev {
        margin-left: -15px
    }

    .carousel-control .glyphicon-chevron-right,.carousel-control .icon-next {
        margin-right: -15px
    }

    .carousel-caption {
        left: 20%;
        right: 20%;
        padding-bottom: 30px
    }

    .carousel-indicators {
        bottom: 20px
    }
}

@font-face {
    font-family: Glyphicons Halflings;
    src: url(/static/fonts/glyphicons-halflings-regular.f4769f9.eot);
    src: url(/static/fonts/glyphicons-halflings-regular.f4769f9.eot?#iefix) format("embedded-opentype"),url(/static/fonts/glyphicons-halflings-regular.448c34a.woff2) format("woff2"),url(/static/fonts/glyphicons-halflings-regular.fa27723.woff) format("woff"),url(/static/fonts/glyphicons-halflings-regular.e18bbf6.ttf) format("truetype"),url(/static/img/glyphicons-halflings-regular.8988968.svg#glyphicons_halflingsregular) format("svg")
}

.glyphicon {
    position: relative;
    top: 1px;
    display: inline-block;
    font-family: Glyphicons Halflings;
    font-style: normal;
    font-weight: 400;
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.glyphicon-asterisk:before {
    content: "*"
}

.glyphicon-plus:before {
    content: "+"
}

.glyphicon-eur:before,.glyphicon-euro:before {
    content: "\20AC"
}

.glyphicon-minus:before {
    content: "\2212"
}

.glyphicon-cloud:before {
    content: "\2601"
}

.glyphicon-envelope:before {
    content: "\2709"
}

.glyphicon-pencil:before {
    content: "\270F"
}

.glyphicon-glass:before {
    content: "\E001"
}

.glyphicon-music:before {
    content: "\E002"
}

.glyphicon-search:before {
    content: "\E003"
}

.glyphicon-heart:before {
    content: "\E005"
}

.glyphicon-star:before {
    content: "\E006"
}

.glyphicon-star-empty:before {
    content: "\E007"
}

.glyphicon-user:before {
    content: "\E008"
}

.glyphicon-film:before {
    content: "\E009"
}

.glyphicon-th-large:before {
    content: "\E010"
}

.glyphicon-th:before {
    content: "\E011"
}

.glyphicon-th-list:before {
    content: "\E012"
}

.glyphicon-ok:before {
    content: "\E013"
}

.glyphicon-remove:before {
    content: "\E014"
}

.glyphicon-zoom-in:before {
    content: "\E015"
}

.glyphicon-zoom-out:before {
    content: "\E016"
}

.glyphicon-off:before {
    content: "\E017"
}

.glyphicon-signal:before {
    content: "\E018"
}

.glyphicon-cog:before {
    content: "\E019"
}

.glyphicon-trash:before {
    content: "\E020"
}

.glyphicon-home:before {
    content: "\E021"
}

.glyphicon-file:before {
    content: "\E022"
}

.glyphicon-time:before {
    content: "\E023"
}

.glyphicon-road:before {
    content: "\E024"
}

.glyphicon-download-alt:before {
    content: "\E025"
}

.glyphicon-download:before {
    content: "\E026"
}

.glyphicon-upload:before {
    content: "\E027"
}

.glyphicon-inbox:before {
    content: "\E028"
}

.glyphicon-play-circle:before {
    content: "\E029"
}

.glyphicon-repeat:before {
    content: "\E030"
}

.glyphicon-refresh:before {
    content: "\E031"
}

.glyphicon-list-alt:before {
    content: "\E032"
}

.glyphicon-lock:before {
    content: "\E033"
}

.glyphicon-flag:before {
    content: "\E034"
}

.glyphicon-headphones:before {
    content: "\E035"
}

.glyphicon-volume-off:before {
    content: "\E036"
}

.glyphicon-volume-down:before {
    content: "\E037"
}

.glyphicon-volume-up:before {
    content: "\E038"
}

.glyphicon-qrcode:before {
    content: "\E039"
}

.glyphicon-barcode:before {
    content: "\E040"
}

.glyphicon-tag:before {
    content: "\E041"
}

.glyphicon-tags:before {
    content: "\E042"
}

.glyphicon-book:before {
    content: "\E043"
}

.glyphicon-bookmark:before {
    content: "\E044"
}

.glyphicon-print:before {
    content: "\E045"
}

.glyphicon-camera:before {
    content: "\E046"
}

.glyphicon-font:before {
    content: "\E047"
}

.glyphicon-bold:before {
    content: "\E048"
}

.glyphicon-italic:before {
    content: "\E049"
}

.glyphicon-text-height:before {
    content: "\E050"
}

.glyphicon-text-width:before {
    content: "\E051"
}

.glyphicon-align-left:before {
    content: "\E052"
}

.glyphicon-align-center:before {
    content: "\E053"
}

.glyphicon-align-right:before {
    content: "\E054"
}

.glyphicon-align-justify:before {
    content: "\E055"
}

.glyphicon-list:before {
    content: "\E056"
}

.glyphicon-indent-left:before {
    content: "\E057"
}

.glyphicon-indent-right:before {
    content: "\E058"
}

.glyphicon-facetime-video:before {
    content: "\E059"
}

.glyphicon-picture:before {
    content: "\E060"
}

.glyphicon-map-marker:before {
    content: "\E062"
}

.glyphicon-adjust:before {
    content: "\E063"
}

.glyphicon-tint:before {
    content: "\E064"
}

.glyphicon-edit:before {
    content: "\E065"
}

.glyphicon-share:before {
    content: "\E066"
}

.glyphicon-check:before {
    content: "\E067"
}

.glyphicon-move:before {
    content: "\E068"
}

.glyphicon-step-backward:before {
    content: "\E069"
}

.glyphicon-fast-backward:before {
    content: "\E070"
}

.glyphicon-backward:before {
    content: "\E071"
}

.glyphicon-play:before {
    content: "\E072"
}

.glyphicon-pause:before {
    content: "\E073"
}

.glyphicon-stop:before {
    content: "\E074"
}

.glyphicon-forward:before {
    content: "\E075"
}

.glyphicon-fast-forward:before {
    content: "\E076"
}

.glyphicon-step-forward:before {
    content: "\E077"
}

.glyphicon-eject:before {
    content: "\E078"
}

.glyphicon-chevron-left:before {
    content: "\E079"
}

.glyphicon-chevron-right:before {
    content: "\E080"
}

.glyphicon-plus-sign:before {
    content: "\E081"
}

.glyphicon-minus-sign:before {
    content: "\E082"
}

.glyphicon-remove-sign:before {
    content: "\E083"
}

.glyphicon-ok-sign:before {
    content: "\E084"
}

.glyphicon-question-sign:before {
    content: "\E085"
}

.glyphicon-info-sign:before {
    content: "\E086"
}

.glyphicon-screenshot:before {
    content: "\E087"
}

.glyphicon-remove-circle:before {
    content: "\E088"
}

.glyphicon-ok-circle:before {
    content: "\E089"
}

.glyphicon-ban-circle:before {
    content: "\E090"
}

.glyphicon-arrow-left:before {
    content: "\E091"
}

.glyphicon-arrow-right:before {
    content: "\E092"
}

.glyphicon-arrow-up:before {
    content: "\E093"
}

.glyphicon-arrow-down:before {
    content: "\E094"
}

.glyphicon-share-alt:before {
    content: "\E095"
}

.glyphicon-resize-full:before {
    content: "\E096"
}

.glyphicon-resize-small:before {
    content: "\E097"
}

.glyphicon-exclamation-sign:before {
    content: "\E101"
}

.glyphicon-gift:before {
    content: "\E102"
}

.glyphicon-leaf:before {
    content: "\E103"
}

.glyphicon-fire:before {
    content: "\E104"
}

.glyphicon-eye-open:before {
    content: "\E105"
}

.glyphicon-eye-close:before {
    content: "\E106"
}

.glyphicon-warning-sign:before {
    content: "\E107"
}

.glyphicon-plane:before {
    content: "\E108"
}

.glyphicon-calendar:before {
    content: "\E109"
}

.glyphicon-random:before {
    content: "\E110"
}

.glyphicon-comment:before {
    content: "\E111"
}

.glyphicon-magnet:before {
    content: "\E112"
}

.glyphicon-chevron-up:before {
    content: "\E113"
}

.glyphicon-chevron-down:before {
    content: "\E114"
}

.glyphicon-retweet:before {
    content: "\E115"
}

.glyphicon-shopping-cart:before {
    content: "\E116"
}

.glyphicon-folder-close:before {
    content: "\E117"
}

.glyphicon-folder-open:before {
    content: "\E118"
}

.glyphicon-resize-vertical:before {
    content: "\E119"
}

.glyphicon-resize-horizontal:before {
    content: "\E120"
}

.glyphicon-hdd:before {
    content: "\E121"
}

.glyphicon-bullhorn:before {
    content: "\E122"
}

.glyphicon-bell:before {
    content: "\E123"
}

.glyphicon-certificate:before {
    content: "\E124"
}

.glyphicon-thumbs-up:before {
    content: "\E125"
}

.glyphicon-thumbs-down:before {
    content: "\E126"
}

.glyphicon-hand-right:before {
    content: "\E127"
}

.glyphicon-hand-left:before {
    content: "\E128"
}

.glyphicon-hand-up:before {
    content: "\E129"
}

.glyphicon-hand-down:before {
    content: "\E130"
}

.glyphicon-circle-arrow-right:before {
    content: "\E131"
}

.glyphicon-circle-arrow-left:before {
    content: "\E132"
}

.glyphicon-circle-arrow-up:before {
    content: "\E133"
}

.glyphicon-circle-arrow-down:before {
    content: "\E134"
}

.glyphicon-globe:before {
    content: "\E135"
}

.glyphicon-wrench:before {
    content: "\E136"
}

.glyphicon-tasks:before {
    content: "\E137"
}

.glyphicon-filter:before {
    content: "\E138"
}

.glyphicon-briefcase:before {
    content: "\E139"
}

.glyphicon-fullscreen:before {
    content: "\E140"
}

.glyphicon-dashboard:before {
    content: "\E141"
}

.glyphicon-paperclip:before {
    content: "\E142"
}

.glyphicon-heart-empty:before {
    content: "\E143"
}

.glyphicon-link:before {
    content: "\E144"
}

.glyphicon-phone:before {
    content: "\E145"
}

.glyphicon-pushpin:before {
    content: "\E146"
}

.glyphicon-usd:before {
    content: "\E148"
}

.glyphicon-gbp:before {
    content: "\E149"
}

.glyphicon-sort:before {
    content: "\E150"
}

.glyphicon-sort-by-alphabet:before {
    content: "\E151"
}

.glyphicon-sort-by-alphabet-alt:before {
    content: "\E152"
}

.glyphicon-sort-by-order:before {
    content: "\E153"
}

.glyphicon-sort-by-order-alt:before {
    content: "\E154"
}

.glyphicon-sort-by-attributes:before {
    content: "\E155"
}

.glyphicon-sort-by-attributes-alt:before {
    content: "\E156"
}

.glyphicon-unchecked:before {
    content: "\E157"
}

.glyphicon-expand:before {
    content: "\E158"
}

.glyphicon-collapse-down:before {
    content: "\E159"
}

.glyphicon-collapse-up:before {
    content: "\E160"
}

.glyphicon-log-in:before {
    content: "\E161"
}

.glyphicon-flash:before {
    content: "\E162"
}

.glyphicon-log-out:before {
    content: "\E163"
}

.glyphicon-new-window:before {
    content: "\E164"
}

.glyphicon-record:before {
    content: "\E165"
}

.glyphicon-save:before {
    content: "\E166"
}

.glyphicon-open:before {
    content: "\E167"
}

.glyphicon-saved:before {
    content: "\E168"
}

.glyphicon-import:before {
    content: "\E169"
}

.glyphicon-export:before {
    content: "\E170"
}

.glyphicon-send:before {
    content: "\E171"
}

.glyphicon-floppy-disk:before {
    content: "\E172"
}

.glyphicon-floppy-saved:before {
    content: "\E173"
}

.glyphicon-floppy-remove:before {
    content: "\E174"
}

.glyphicon-floppy-save:before {
    content: "\E175"
}

.glyphicon-floppy-open:before {
    content: "\E176"
}

.glyphicon-credit-card:before {
    content: "\E177"
}

.glyphicon-transfer:before {
    content: "\E178"
}

.glyphicon-cutlery:before {
    content: "\E179"
}

.glyphicon-header:before {
    content: "\E180"
}

.glyphicon-compressed:before {
    content: "\E181"
}

.glyphicon-earphone:before {
    content: "\E182"
}

.glyphicon-phone-alt:before {
    content: "\E183"
}

.glyphicon-tower:before {
    content: "\E184"
}

.glyphicon-stats:before {
    content: "\E185"
}

.glyphicon-sd-video:before {
    content: "\E186"
}

.glyphicon-hd-video:before {
    content: "\E187"
}

.glyphicon-subtitles:before {
    content: "\E188"
}

.glyphicon-sound-stereo:before {
    content: "\E189"
}

.glyphicon-sound-dolby:before {
    content: "\E190"
}

.glyphicon-sound-5-1:before {
    content: "\E191"
}

.glyphicon-sound-6-1:before {
    content: "\E192"
}

.glyphicon-sound-7-1:before {
    content: "\E193"
}

.glyphicon-copyright-mark:before {
    content: "\E194"
}

.glyphicon-registration-mark:before {
    content: "\E195"
}

.glyphicon-cloud-download:before {
    content: "\E197"
}

.glyphicon-cloud-upload:before {
    content: "\E198"
}

.glyphicon-tree-conifer:before {
    content: "\E199"
}

.glyphicon-tree-deciduous:before {
    content: "\E200"
}

.glyphicon-cd:before {
    content: "\E201"
}

.glyphicon-save-file:before {
    content: "\E202"
}

.glyphicon-open-file:before {
    content: "\E203"
}

.glyphicon-level-up:before {
    content: "\E204"
}

.glyphicon-copy:before {
    content: "\E205"
}

.glyphicon-paste:before {
    content: "\E206"
}

.glyphicon-alert:before {
    content: "\E209"
}

.glyphicon-equalizer:before {
    content: "\E210"
}

.glyphicon-king:before {
    content: "\E211"
}

.glyphicon-queen:before {
    content: "\E212"
}

.glyphicon-pawn:before {
    content: "\E213"
}

.glyphicon-bishop:before {
    content: "\E214"
}

.glyphicon-knight:before {
    content: "\E215"
}

.glyphicon-baby-formula:before {
    content: "\E216"
}

.glyphicon-tent:before {
    content: "\26FA"
}

.glyphicon-blackboard:before {
    content: "\E218"
}

.glyphicon-bed:before {
    content: "\E219"
}

.glyphicon-apple:before {
    content: "\F8FF"
}

.glyphicon-erase:before {
    content: "\E221"
}

.glyphicon-hourglass:before {
    content: "\231B"
}

.glyphicon-lamp:before {
    content: "\E223"
}

.glyphicon-duplicate:before {
    content: "\E224"
}

.glyphicon-piggy-bank:before {
    content: "\E225"
}

.glyphicon-scissors:before {
    content: "\E226"
}

.glyphicon-bitcoin:before,.glyphicon-btc:before,.glyphicon-xbt:before {
    content: "\E227"
}

.glyphicon-jpy:before,.glyphicon-yen:before {
    content: "\A5"
}

.glyphicon-rub:before,.glyphicon-ruble:before {
    content: "\20BD"
}

.glyphicon-scale:before {
    content: "\E230"
}

.glyphicon-ice-lolly:before {
    content: "\E231"
}

.glyphicon-ice-lolly-tasted:before {
    content: "\E232"
}

.glyphicon-education:before {
    content: "\E233"
}

.glyphicon-option-horizontal:before {
    content: "\E234"
}

.glyphicon-option-vertical:before {
    content: "\E235"
}

.glyphicon-menu-hamburger:before {
    content: "\E236"
}

.glyphicon-modal-window:before {
    content: "\E237"
}

.glyphicon-oil:before {
    content: "\E238"
}

.glyphicon-grain:before {
    content: "\E239"
}

.glyphicon-sunglasses:before {
    content: "\E240"
}

.glyphicon-text-size:before {
    content: "\E241"
}

.glyphicon-text-color:before {
    content: "\E242"
}

.glyphicon-text-background:before {
    content: "\E243"
}

.glyphicon-object-align-top:before {
    content: "\E244"
}

.glyphicon-object-align-bottom:before {
    content: "\E245"
}

.glyphicon-object-align-horizontal:before {
    content: "\E246"
}

.glyphicon-object-align-left:before {
    content: "\E247"
}

.glyphicon-object-align-vertical:before {
    content: "\E248"
}

.glyphicon-object-align-right:before {
    content: "\E249"
}

.glyphicon-triangle-right:before {
    content: "\E250"
}

.glyphicon-triangle-left:before {
    content: "\E251"
}

.glyphicon-triangle-bottom:before {
    content: "\E252"
}

.glyphicon-triangle-top:before {
    content: "\E253"
}

.glyphicon-console:before {
    content: "\E254"
}

.glyphicon-superscript:before {
    content: "\E255"
}

.glyphicon-subscript:before {
    content: "\E256"
}

.glyphicon-menu-left:before {
    content: "\E257"
}

.glyphicon-menu-right:before {
    content: "\E258"
}

.glyphicon-menu-down:before {
    content: "\E259"
}

.glyphicon-menu-up:before {
    content: "\E260"
}

.list-group {
    margin-bottom: 20px;
    padding-left: 0
}

.list-group-item {
    position: relative;
    display: block;
    padding: 10px 15px;
    margin-bottom: -1px;
    background-color: #fff;
    border: 1px solid #ddd
}

.list-group-item:first-child {
    border-top-right-radius: 4px;
    border-top-left-radius: 4px
}

.list-group-item:last-child {
    margin-bottom: 0;
    border-bottom-right-radius: 4px;
    border-bottom-left-radius: 4px
}

a.list-group-item,button.list-group-item {
    color: #555
}

a.list-group-item .list-group-item-heading,button.list-group-item .list-group-item-heading {
    color: #333
}

a.list-group-item:focus,a.list-group-item:hover,button.list-group-item:focus,button.list-group-item:hover {
    text-decoration: none;
    color: #555;
    background-color: #f5f5f5
}

button.list-group-item {
    width: 100%;
    text-align: left
}

.list-group-item.disabled,.list-group-item.disabled:focus,.list-group-item.disabled:hover {
    background-color: #eee;
    color: #777;
    cursor: not-allowed
}

.list-group-item.disabled .list-group-item-heading,.list-group-item.disabled:focus .list-group-item-heading,.list-group-item.disabled:hover .list-group-item-heading {
    color: inherit
}

.list-group-item.disabled .list-group-item-text,.list-group-item.disabled:focus .list-group-item-text,.list-group-item.disabled:hover .list-group-item-text {
    color: #777
}

.list-group-item.active,.list-group-item.active:focus,.list-group-item.active:hover {
    z-index: 2;
    color: #fff;
    background-color: #00a786;
    border-color: #00a786
}

.list-group-item.active .list-group-item-heading,.list-group-item.active .list-group-item-heading>.small,.list-group-item.active .list-group-item-heading>small,.list-group-item.active:focus .list-group-item-heading,.list-group-item.active:focus .list-group-item-heading>.small,.list-group-item.active:focus .list-group-item-heading>small,.list-group-item.active:hover .list-group-item-heading,.list-group-item.active:hover .list-group-item-heading>.small,.list-group-item.active:hover .list-group-item-heading>small {
    color: inherit
}

.list-group-item.active .list-group-item-text,.list-group-item.active:focus .list-group-item-text,.list-group-item.active:hover .list-group-item-text {
    color: #74ffe4
}

.list-group-item-success {
    color: #3c763d;
    background-color: #dff0d8
}

a.list-group-item-success,button.list-group-item-success {
    color: #3c763d
}

a.list-group-item-success .list-group-item-heading,button.list-group-item-success .list-group-item-heading {
    color: inherit
}

a.list-group-item-success:focus,a.list-group-item-success:hover,button.list-group-item-success:focus,button.list-group-item-success:hover {
    color: #3c763d;
    background-color: #d0e9c6
}

a.list-group-item-success.active,a.list-group-item-success.active:focus,a.list-group-item-success.active:hover,button.list-group-item-success.active,button.list-group-item-success.active:focus,button.list-group-item-success.active:hover {
    color: #fff;
    background-color: #3c763d;
    border-color: #3c763d
}

.list-group-item-info {
    color: #31708f;
    background-color: #d9edf7
}

a.list-group-item-info,button.list-group-item-info {
    color: #31708f
}

a.list-group-item-info .list-group-item-heading,button.list-group-item-info .list-group-item-heading {
    color: inherit
}

a.list-group-item-info:focus,a.list-group-item-info:hover,button.list-group-item-info:focus,button.list-group-item-info:hover {
    color: #31708f;
    background-color: #c4e3f3
}

a.list-group-item-info.active,a.list-group-item-info.active:focus,a.list-group-item-info.active:hover,button.list-group-item-info.active,button.list-group-item-info.active:focus,button.list-group-item-info.active:hover {
    color: #fff;
    background-color: #31708f;
    border-color: #31708f
}

.list-group-item-warning {
    color: #8a6d3b;
    background-color: #fcf8e3
}

a.list-group-item-warning,button.list-group-item-warning {
    color: #8a6d3b
}

a.list-group-item-warning .list-group-item-heading,button.list-group-item-warning .list-group-item-heading {
    color: inherit
}

a.list-group-item-warning:focus,a.list-group-item-warning:hover,button.list-group-item-warning:focus,button.list-group-item-warning:hover {
    color: #8a6d3b;
    background-color: #faf2cc
}

a.list-group-item-warning.active,a.list-group-item-warning.active:focus,a.list-group-item-warning.active:hover,button.list-group-item-warning.active,button.list-group-item-warning.active:focus,button.list-group-item-warning.active:hover {
    color: #fff;
    background-color: #8a6d3b;
    border-color: #8a6d3b
}

.list-group-item-danger {
    color: #a94442;
    background-color: #f2dede
}

a.list-group-item-danger,button.list-group-item-danger {
    color: #a94442
}

a.list-group-item-danger .list-group-item-heading,button.list-group-item-danger .list-group-item-heading {
    color: inherit
}

a.list-group-item-danger:focus,a.list-group-item-danger:hover,button.list-group-item-danger:focus,button.list-group-item-danger:hover {
    color: #a94442;
    background-color: #ebcccc
}

a.list-group-item-danger.active,a.list-group-item-danger.active:focus,a.list-group-item-danger.active:hover,button.list-group-item-danger.active,button.list-group-item-danger.active:focus,button.list-group-item-danger.active:hover {
    color: #fff;
    background-color: #a94442;
    border-color: #a94442
}

.list-group-item-heading {
    margin-top: 0;
    margin-bottom: 5px
}

.list-group-item-text {
    margin-bottom: 0;
    line-height: 1.3
}

.panel {
    margin-bottom: 20px;
    background-color: #fff;
    border: 1px solid transparent;
    border-radius: 0;
    box-shadow: 0 1px 1px rgba(0,0,0,.05)
}

.panel-body {
    padding: 15px
}

.panel-heading {
    padding: 10px 15px;
    border-bottom: 1px solid transparent;
    border-top-right-radius: -1;
    border-top-left-radius: -1
}

.panel-heading>.dropdown .dropdown-toggle,.panel-title {
    color: inherit
}

.panel-title {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 16px
}

.panel-title>.small,.panel-title>.small>a,.panel-title>a,.panel-title>small,.panel-title>small>a {
    color: inherit
}

.panel-footer {
    padding: 10px 15px;
    background-color: #f5f5f5;
    border-top: 1px solid #ddd;
    border-bottom-right-radius: -1;
    border-bottom-left-radius: -1
}

.panel>.list-group,.panel>.panel-collapse>.list-group {
    margin-bottom: 0
}

.panel>.list-group .list-group-item,.panel>.panel-collapse>.list-group .list-group-item {
    border-width: 1px 0;
    border-radius: 0
}

.panel>.list-group:first-child .list-group-item:first-child,.panel>.panel-collapse>.list-group:first-child .list-group-item:first-child {
    border-top: 0;
    border-top-right-radius: -1;
    border-top-left-radius: -1
}

.panel>.list-group:last-child .list-group-item:last-child,.panel>.panel-collapse>.list-group:last-child .list-group-item:last-child {
    border-bottom: 0;
    border-bottom-right-radius: -1;
    border-bottom-left-radius: -1
}

.panel>.panel-heading+.panel-collapse>.list-group .list-group-item:first-child {
    border-top-right-radius: 0;
    border-top-left-radius: 0
}

.list-group+.panel-footer,.panel-heading+.list-group .list-group-item:first-child {
    border-top-width: 0
}

.panel>.panel-collapse>.table,.panel>.table,.panel>.table-responsive>.table {
    margin-bottom: 0
}

.panel>.panel-collapse>.table caption,.panel>.table-responsive>.table caption,.panel>.table caption {
    padding-left: 15px;
    padding-right: 15px
}

.panel>.table-responsive:first-child>.table:first-child,.panel>.table-responsive:first-child>.table:first-child>tbody:first-child>tr:first-child,.panel>.table-responsive:first-child>.table:first-child>thead:first-child>tr:first-child,.panel>.table:first-child,.panel>.table:first-child>tbody:first-child>tr:first-child,.panel>.table:first-child>thead:first-child>tr:first-child {
    border-top-right-radius: -1;
    border-top-left-radius: -1
}

.panel>.table-responsive:first-child>.table:first-child>tbody:first-child>tr:first-child td:first-child,.panel>.table-responsive:first-child>.table:first-child>tbody:first-child>tr:first-child th:first-child,.panel>.table-responsive:first-child>.table:first-child>thead:first-child>tr:first-child td:first-child,.panel>.table-responsive:first-child>.table:first-child>thead:first-child>tr:first-child th:first-child,.panel>.table:first-child>tbody:first-child>tr:first-child td:first-child,.panel>.table:first-child>tbody:first-child>tr:first-child th:first-child,.panel>.table:first-child>thead:first-child>tr:first-child td:first-child,.panel>.table:first-child>thead:first-child>tr:first-child th:first-child {
    border-top-left-radius: -1
}

.panel>.table-responsive:first-child>.table:first-child>tbody:first-child>tr:first-child td:last-child,.panel>.table-responsive:first-child>.table:first-child>tbody:first-child>tr:first-child th:last-child,.panel>.table-responsive:first-child>.table:first-child>thead:first-child>tr:first-child td:last-child,.panel>.table-responsive:first-child>.table:first-child>thead:first-child>tr:first-child th:last-child,.panel>.table:first-child>tbody:first-child>tr:first-child td:last-child,.panel>.table:first-child>tbody:first-child>tr:first-child th:last-child,.panel>.table:first-child>thead:first-child>tr:first-child td:last-child,.panel>.table:first-child>thead:first-child>tr:first-child th:last-child {
    border-top-right-radius: -1
}

.panel>.table-responsive:last-child>.table:last-child,.panel>.table-responsive:last-child>.table:last-child>tbody:last-child>tr:last-child,.panel>.table-responsive:last-child>.table:last-child>tfoot:last-child>tr:last-child,.panel>.table:last-child,.panel>.table:last-child>tbody:last-child>tr:last-child,.panel>.table:last-child>tfoot:last-child>tr:last-child {
    border-bottom-right-radius: -1;
    border-bottom-left-radius: -1
}

.panel>.table-responsive:last-child>.table:last-child>tbody:last-child>tr:last-child td:first-child,.panel>.table-responsive:last-child>.table:last-child>tbody:last-child>tr:last-child th:first-child,.panel>.table-responsive:last-child>.table:last-child>tfoot:last-child>tr:last-child td:first-child,.panel>.table-responsive:last-child>.table:last-child>tfoot:last-child>tr:last-child th:first-child,.panel>.table:last-child>tbody:last-child>tr:last-child td:first-child,.panel>.table:last-child>tbody:last-child>tr:last-child th:first-child,.panel>.table:last-child>tfoot:last-child>tr:last-child td:first-child,.panel>.table:last-child>tfoot:last-child>tr:last-child th:first-child {
    border-bottom-left-radius: -1
}

.panel>.table-responsive:last-child>.table:last-child>tbody:last-child>tr:last-child td:last-child,.panel>.table-responsive:last-child>.table:last-child>tbody:last-child>tr:last-child th:last-child,.panel>.table-responsive:last-child>.table:last-child>tfoot:last-child>tr:last-child td:last-child,.panel>.table-responsive:last-child>.table:last-child>tfoot:last-child>tr:last-child th:last-child,.panel>.table:last-child>tbody:last-child>tr:last-child td:last-child,.panel>.table:last-child>tbody:last-child>tr:last-child th:last-child,.panel>.table:last-child>tfoot:last-child>tr:last-child td:last-child,.panel>.table:last-child>tfoot:last-child>tr:last-child th:last-child {
    border-bottom-right-radius: -1
}

.panel>.panel-body+.table,.panel>.panel-body+.table-responsive,.panel>.table+.panel-body,.panel>.table-responsive+.panel-body {
    border-top: 1px solid #ddd
}

.panel>.table>tbody:first-child>tr:first-child td,.panel>.table>tbody:first-child>tr:first-child th {
    border-top: 0
}

.panel>.table-bordered,.panel>.table-responsive>.table-bordered {
    border: 0
}

.panel>.table-bordered>tbody>tr>td:first-child,.panel>.table-bordered>tbody>tr>th:first-child,.panel>.table-bordered>tfoot>tr>td:first-child,.panel>.table-bordered>tfoot>tr>th:first-child,.panel>.table-bordered>thead>tr>td:first-child,.panel>.table-bordered>thead>tr>th:first-child,.panel>.table-responsive>.table-bordered>tbody>tr>td:first-child,.panel>.table-responsive>.table-bordered>tbody>tr>th:first-child,.panel>.table-responsive>.table-bordered>tfoot>tr>td:first-child,.panel>.table-responsive>.table-bordered>tfoot>tr>th:first-child,.panel>.table-responsive>.table-bordered>thead>tr>td:first-child,.panel>.table-responsive>.table-bordered>thead>tr>th:first-child {
    border-left: 0
}

.panel>.table-bordered>tbody>tr>td:last-child,.panel>.table-bordered>tbody>tr>th:last-child,.panel>.table-bordered>tfoot>tr>td:last-child,.panel>.table-bordered>tfoot>tr>th:last-child,.panel>.table-bordered>thead>tr>td:last-child,.panel>.table-bordered>thead>tr>th:last-child,.panel>.table-responsive>.table-bordered>tbody>tr>td:last-child,.panel>.table-responsive>.table-bordered>tbody>tr>th:last-child,.panel>.table-responsive>.table-bordered>tfoot>tr>td:last-child,.panel>.table-responsive>.table-bordered>tfoot>tr>th:last-child,.panel>.table-responsive>.table-bordered>thead>tr>td:last-child,.panel>.table-responsive>.table-bordered>thead>tr>th:last-child {
    border-right: 0
}

.panel>.table-bordered>tbody>tr:first-child>td,.panel>.table-bordered>tbody>tr:first-child>th,.panel>.table-bordered>tbody>tr:last-child>td,.panel>.table-bordered>tbody>tr:last-child>th,.panel>.table-bordered>tfoot>tr:last-child>td,.panel>.table-bordered>tfoot>tr:last-child>th,.panel>.table-bordered>thead>tr:first-child>td,.panel>.table-bordered>thead>tr:first-child>th,.panel>.table-responsive>.table-bordered>tbody>tr:first-child>td,.panel>.table-responsive>.table-bordered>tbody>tr:first-child>th,.panel>.table-responsive>.table-bordered>tbody>tr:last-child>td,.panel>.table-responsive>.table-bordered>tbody>tr:last-child>th,.panel>.table-responsive>.table-bordered>tfoot>tr:last-child>td,.panel>.table-responsive>.table-bordered>tfoot>tr:last-child>th,.panel>.table-responsive>.table-bordered>thead>tr:first-child>td,.panel>.table-responsive>.table-bordered>thead>tr:first-child>th {
    border-bottom: 0
}

.panel>.table-responsive {
    border: 0;
    margin-bottom: 0
}

.panel-group {
    margin-bottom: 20px
}

.panel-group .panel {
    margin-bottom: 0;
    border-radius: 0
}

.panel-group .panel+.panel {
    margin-top: 5px
}

.panel-group .panel-heading {
    border-bottom: 0
}

.panel-group .panel-heading+.panel-collapse>.list-group,.panel-group .panel-heading+.panel-collapse>.panel-body {
    border-top: 1px solid #ddd
}

.panel-group .panel-footer {
    border-top: 0
}

.panel-group .panel-footer+.panel-collapse .panel-body {
    border-bottom: 1px solid #ddd
}

.panel-default {
    border-color: #eee
}

.panel-default>.panel-heading {
    color: #333;
    background-color: #fff;
    border-color: #eee
}

.panel-default>.panel-heading+.panel-collapse>.panel-body {
    border-top-color: #eee
}

.panel-default>.panel-heading .badge {
    color: #fff;
    background-color: #333
}

.panel-default>.panel-footer+.panel-collapse>.panel-body {
    border-bottom-color: #eee
}

.panel-primary {
    border-color: #00a786
}

.panel-primary>.panel-heading {
    color: #fff;
    background-color: #00a786;
    border-color: #00a786
}

.panel-primary>.panel-heading+.panel-collapse>.panel-body {
    border-top-color: #00a786
}

.panel-primary>.panel-heading .badge {
    color: #00a786;
    background-color: #fff
}

.panel-primary>.panel-footer+.panel-collapse>.panel-body {
    border-bottom-color: #00a786
}

.panel-success {
    border-color: #d6e9c6
}

.panel-success>.panel-heading {
    color: #3c763d;
    background-color: #dff0d8;
    border-color: #d6e9c6
}

.panel-success>.panel-heading+.panel-collapse>.panel-body {
    border-top-color: #d6e9c6
}

.panel-success>.panel-heading .badge {
    color: #dff0d8;
    background-color: #3c763d
}

.panel-success>.panel-footer+.panel-collapse>.panel-body {
    border-bottom-color: #d6e9c6
}

.panel-info {
    border-color: #bce8f1
}

.panel-info>.panel-heading {
    color: #31708f;
    background-color: #d9edf7;
    border-color: #bce8f1
}

.panel-info>.panel-heading+.panel-collapse>.panel-body {
    border-top-color: #bce8f1
}

.panel-info>.panel-heading .badge {
    color: #d9edf7;
    background-color: #31708f
}

.panel-info>.panel-footer+.panel-collapse>.panel-body {
    border-bottom-color: #bce8f1
}

.panel-warning {
    border-color: #faebcc
}

.panel-warning>.panel-heading {
    color: #8a6d3b;
    background-color: #fcf8e3;
    border-color: #faebcc
}

.panel-warning>.panel-heading+.panel-collapse>.panel-body {
    border-top-color: #faebcc
}

.panel-warning>.panel-heading .badge {
    color: #fcf8e3;
    background-color: #8a6d3b
}

.panel-warning>.panel-footer+.panel-collapse>.panel-body {
    border-bottom-color: #faebcc
}

.panel-danger {
    border-color: #ebccd1
}

.panel-danger>.panel-heading {
    color: #a94442;
    background-color: #f2dede;
    border-color: #ebccd1
}

.panel-danger>.panel-heading+.panel-collapse>.panel-body {
    border-top-color: #ebccd1
}

.panel-danger>.panel-heading .badge {
    color: #f2dede;
    background-color: #a94442
}

.panel-danger>.panel-footer+.panel-collapse>.panel-body {
    border-bottom-color: #ebccd1
}

.modal,.modal-open {
    overflow: hidden
}

.modal {
    display: none;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1050;
    -webkit-overflow-scrolling: touch;
    outline: 0
}

.modal.fade .modal-dialog {
    transform: translateY(-25%);
    transition: transform .3s ease-out
}

.modal.in .modal-dialog {
    transform: translate(0)
}

.modal-open .modal {
    overflow-x: hidden;
    overflow-y: auto
}

.modal-dialog {
    position: relative;
    width: auto;
    margin: 10px
}

.modal-content {
    position: relative;
    background-color: #fff;
    border: 1px solid #999;
    border: 1px solid transparent;
    border-radius: 6px;
    box-shadow: 0 3px 9px rgba(0,0,0,.5);
    background-clip: padding-box;
    outline: 0
}

.modal-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1040;
    background-color: #000
}

.modal-backdrop.fade {
    zoom:1;filter: alpha(opacity=0);
    -webkit-opacity: 0;
    -moz-opacity: 0;
    opacity: 0
}

.modal-backdrop.in {
    zoom:1;filter: alpha(opacity=20);
    -webkit-opacity: .2;
    -moz-opacity: .2;
    opacity: .2
}

.modal-header {
    padding: 15px;
    border-bottom: 1px solid #e5e5e5
}

.modal-header .close {
    margin-top: -2px
}

.modal-title {
    margin: 0;
    line-height: 1.42857143
}

.modal-body {
    position: relative;
    padding: 15px
}

.modal-footer {
    padding: 15px;
    text-align: right;
    border-top: 1px solid #e5e5e5
}

.modal-footer .btn+.btn {
    margin-left: 5px;
    margin-bottom: 0
}

.modal-footer .btn-group .btn+.btn {
    margin-left: -1px
}

.modal-footer .btn-block+.btn-block {
    margin-left: 0
}

.modal-scrollbar-measure {
    position: absolute;
    top: -9999px;
    width: 50px;
    height: 50px;
    overflow: scroll
}

@media (min-width: 768px) {
    .modal-dialog {
        width:600px;
        margin: 30px auto
    }

    .modal-content {
        box-shadow: 0 5px 15px rgba(0,0,0,.5)
    }

    .modal-sm {
        width: 300px
    }
}

@media (min-width: 1400px) {
    .modal-lg {
        width:900px
    }
}

.media {
    margin-top: 15px
}

.media:first-child {
    margin-top: 0
}

.media,.media-body {
    zoom:1;overflow: hidden
}

.media-body {
    width: 10000px
}

.media-object {
    display: block;
    width: 240px;
    max-width: 480px
}

.media-object.img-thumbnail {
    max-width: none
}

.media-right,.media>.pull-right {
    padding-left: 10px
}

.media-left,.media>.pull-left {
    padding-right: 10px
}

.media-body,.media-left,.media-right {
    display: table-cell;
    vertical-align: top
}

.media-body a,.media-left a,.media-right a {
    display: block
}

.media-middle {
    vertical-align: middle
}

.media-bottom {
    vertical-align: bottom
}

.media-heading {
    margin-top: 0;
    margin-bottom: 5px
}

.media-list {
    padding-left: 0;
    list-style: none
}

.alert {
    padding: 15px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px
}

.alert h4 {
    margin-top: 0;
    color: inherit
}

.alert .alert-link {
    font-weight: 700
}

.alert>p,.alert>ul {
    margin-bottom: 0
}

.alert>p+p {
    margin-top: 5px
}

.alert-dismissable,.alert-dismissible {
    padding-right: 35px
}

.alert-dismissable .close,.alert-dismissible .close {
    position: relative;
    top: -2px;
    right: -21px;
    color: inherit
}

.alert-success {
    background-color: #dff0d8;
    border-color: #d6e9c6;
    color: #3c763d
}

.alert-success hr {
    border-top-color: #c9e2b3
}

.alert-success .alert-link {
    color: #2b542c
}

.alert-info {
    background-color: #d9edf7;
    border-color: #bce8f1;
    color: #31708f
}

.alert-info hr {
    border-top-color: #a6e1ec
}

.alert-info .alert-link {
    color: #245269
}

.alert-warning {
    background-color: #fcf8e3;
    border-color: #faebcc;
    color: #8a6d3b
}

.alert-warning hr {
    border-top-color: #f7e1b5
}

.alert-warning .alert-link {
    color: #66512c
}

.alert-danger {
    background-color: #f2dede;
    border-color: #ebccd1;
    color: #a94442
}

.alert-danger hr {
    border-top-color: #e4b9c0
}

.alert-danger .alert-link {
    color: #843534
}

table {
    background-color: transparent
}

caption {
    padding-top: 8px;
    padding-bottom: 8px;
    color: #777
}

caption,th {
    text-align: left
}

.table {
    width: 100%;
    max-width: 100%;
    margin-bottom: 20px
}

.table>tbody>tr>td,.table>tbody>tr>th,.table>tfoot>tr>td,.table>tfoot>tr>th,.table>thead>tr>td,.table>thead>tr>th {
    padding: 8px;
    line-height: 1.42857143;
    vertical-align: top;
    border-top: 1px solid #ddd
}

.table>thead>tr>th {
    vertical-align: bottom;
    border-bottom: 2px solid #ddd
}

.table>caption+thead>tr:first-child>td,.table>caption+thead>tr:first-child>th,.table>colgroup+thead>tr:first-child>td,.table>colgroup+thead>tr:first-child>th,.table>thead:first-child>tr:first-child>td,.table>thead:first-child>tr:first-child>th {
    border-top: 0
}

.table>tbody+tbody {
    border-top: 2px solid #ddd
}

.table .table {
    background-color: #fff
}

.table-condensed>tbody>tr>td,.table-condensed>tbody>tr>th,.table-condensed>tfoot>tr>td,.table-condensed>tfoot>tr>th,.table-condensed>thead>tr>td,.table-condensed>thead>tr>th {
    padding: 5px
}

.table-bordered,.table-bordered>tbody>tr>td,.table-bordered>tbody>tr>th,.table-bordered>tfoot>tr>td,.table-bordered>tfoot>tr>th,.table-bordered>thead>tr>td,.table-bordered>thead>tr>th {
    border: 1px solid #ddd
}

.table-bordered>thead>tr>td,.table-bordered>thead>tr>th {
    border-bottom-width: 2px
}

.table-striped>tbody>tr:nth-of-type(odd) {
    background-color: #f9f9f9
}

.table-hover>tbody>tr:hover {
    background-color: #f5f5f5
}

table col[class*=col-] {
    position: static;
    float: none;
    display: table-column
}

table td[class*=col-],table th[class*=col-] {
    position: static;
    float: none;
    display: table-cell
}

.table>tbody>tr.active>td,.table>tbody>tr.active>th,.table>tbody>tr>td.active,.table>tbody>tr>th.active,.table>tfoot>tr.active>td,.table>tfoot>tr.active>th,.table>tfoot>tr>td.active,.table>tfoot>tr>th.active,.table>thead>tr.active>td,.table>thead>tr.active>th,.table>thead>tr>td.active,.table>thead>tr>th.active {
    background-color: #f5f5f5
}

.table-hover>tbody>tr.active:hover>td,.table-hover>tbody>tr.active:hover>th,.table-hover>tbody>tr:hover>.active,.table-hover>tbody>tr>td.active:hover,.table-hover>tbody>tr>th.active:hover {
    background-color: #e8e8e8
}

.table>tbody>tr.success>td,.table>tbody>tr.success>th,.table>tbody>tr>td.success,.table>tbody>tr>th.success,.table>tfoot>tr.success>td,.table>tfoot>tr.success>th,.table>tfoot>tr>td.success,.table>tfoot>tr>th.success,.table>thead>tr.success>td,.table>thead>tr.success>th,.table>thead>tr>td.success,.table>thead>tr>th.success {
    background-color: #dff0d8
}

.table-hover>tbody>tr.success:hover>td,.table-hover>tbody>tr.success:hover>th,.table-hover>tbody>tr:hover>.success,.table-hover>tbody>tr>td.success:hover,.table-hover>tbody>tr>th.success:hover {
    background-color: #d0e9c6
}

.table>tbody>tr.info>td,.table>tbody>tr.info>th,.table>tbody>tr>td.info,.table>tbody>tr>th.info,.table>tfoot>tr.info>td,.table>tfoot>tr.info>th,.table>tfoot>tr>td.info,.table>tfoot>tr>th.info,.table>thead>tr.info>td,.table>thead>tr.info>th,.table>thead>tr>td.info,.table>thead>tr>th.info {
    background-color: #d9edf7
}

.table-hover>tbody>tr.info:hover>td,.table-hover>tbody>tr.info:hover>th,.table-hover>tbody>tr:hover>.info,.table-hover>tbody>tr>td.info:hover,.table-hover>tbody>tr>th.info:hover {
    background-color: #c4e3f3
}

.table>tbody>tr.warning>td,.table>tbody>tr.warning>th,.table>tbody>tr>td.warning,.table>tbody>tr>th.warning,.table>tfoot>tr.warning>td,.table>tfoot>tr.warning>th,.table>tfoot>tr>td.warning,.table>tfoot>tr>th.warning,.table>thead>tr.warning>td,.table>thead>tr.warning>th,.table>thead>tr>td.warning,.table>thead>tr>th.warning {
    background-color: #fcf8e3
}

.table-hover>tbody>tr.warning:hover>td,.table-hover>tbody>tr.warning:hover>th,.table-hover>tbody>tr:hover>.warning,.table-hover>tbody>tr>td.warning:hover,.table-hover>tbody>tr>th.warning:hover {
    background-color: #faf2cc
}

.table>tbody>tr.danger>td,.table>tbody>tr.danger>th,.table>tbody>tr>td.danger,.table>tbody>tr>th.danger,.table>tfoot>tr.danger>td,.table>tfoot>tr.danger>th,.table>tfoot>tr>td.danger,.table>tfoot>tr>th.danger,.table>thead>tr.danger>td,.table>thead>tr.danger>th,.table>thead>tr>td.danger,.table>thead>tr>th.danger {
    background-color: #f2dede
}

.table-hover>tbody>tr.danger:hover>td,.table-hover>tbody>tr.danger:hover>th,.table-hover>tbody>tr:hover>.danger,.table-hover>tbody>tr>td.danger:hover,.table-hover>tbody>tr>th.danger:hover {
    background-color: #ebcccc
}

.table-responsive {
    overflow-x: auto;
    min-height: .01%
}

@media screen and (max-width: 767px) {
    .table-responsive {
        width:100%;
        margin-bottom: 15px;
        overflow-y: hidden;
        -ms-overflow-style: -ms-autohiding-scrollbar;
        border: 1px solid #ddd
    }

    .table-responsive>.table {
        margin-bottom: 0
    }

    .table-responsive>.table>tbody>tr>td,.table-responsive>.table>tbody>tr>th,.table-responsive>.table>tfoot>tr>td,.table-responsive>.table>tfoot>tr>th,.table-responsive>.table>thead>tr>td,.table-responsive>.table>thead>tr>th {
        white-space: nowrap
    }

    .table-responsive>.table-bordered {
        border: 0
    }

    .table-responsive>.table-bordered>tbody>tr>td:first-child,.table-responsive>.table-bordered>tbody>tr>th:first-child,.table-responsive>.table-bordered>tfoot>tr>td:first-child,.table-responsive>.table-bordered>tfoot>tr>th:first-child,.table-responsive>.table-bordered>thead>tr>td:first-child,.table-responsive>.table-bordered>thead>tr>th:first-child {
        border-left: 0
    }

    .table-responsive>.table-bordered>tbody>tr>td:last-child,.table-responsive>.table-bordered>tbody>tr>th:last-child,.table-responsive>.table-bordered>tfoot>tr>td:last-child,.table-responsive>.table-bordered>tfoot>tr>th:last-child,.table-responsive>.table-bordered>thead>tr>td:last-child,.table-responsive>.table-bordered>thead>tr>th:last-child {
        border-right: 0
    }

    .table-responsive>.table-bordered>tbody>tr:last-child>td,.table-responsive>.table-bordered>tbody>tr:last-child>th,.table-responsive>.table-bordered>tfoot>tr:last-child>td,.table-responsive>.table-bordered>tfoot>tr:last-child>th {
        border-bottom: 0
    }
}

@keyframes progress-bar-stripes {
    0% {
        background-position: 40px 0
    }

    to {
        background-position: 0 0
    }
}

.progress {
    overflow: hidden;
    height: 20px;
    margin-bottom: 20px;
    background-color: #f5f5f5;
    border-radius: 4px;
    box-shadow: inset 0 1px 2px rgba(0,0,0,.1)
}

.progress-bar {
    float: left;
    width: 0;
    height: 100%;
    font-size: 12px;
    line-height: 20px;
    color: #fff;
    text-align: center;
    background-color: #00a786;
    box-shadow: inset 0 -1px 0 rgba(0,0,0,.15);
    transition: width .6s ease
}

.progress-bar-striped,.progress-striped .progress-bar {
    background-image: linear-gradient(45deg,hsla(0,0%,100%,.15) 25%,transparent 0,transparent 50%,hsla(0,0%,100%,.15) 0,hsla(0,0%,100%,.15) 75%,transparent 0,transparent);
    background-size: 40px 40px
}

.progress-bar.active,.progress.active .progress-bar {
    animation: progress-bar-stripes 2s linear infinite
}

.progress-bar-success {
    background-color: #5cb85c
}

.progress-striped .progress-bar-success {
    background-image: linear-gradient(45deg,hsla(0,0%,100%,.15) 25%,transparent 0,transparent 50%,hsla(0,0%,100%,.15) 0,hsla(0,0%,100%,.15) 75%,transparent 0,transparent)
}

.progress-bar-info {
    background-color: #5bc0de
}

.progress-striped .progress-bar-info {
    background-image: linear-gradient(45deg,hsla(0,0%,100%,.15) 25%,transparent 0,transparent 50%,hsla(0,0%,100%,.15) 0,hsla(0,0%,100%,.15) 75%,transparent 0,transparent)
}

.progress-bar-warning {
    background-color: #f0ad4e
}

.progress-striped .progress-bar-warning {
    background-image: linear-gradient(45deg,hsla(0,0%,100%,.15) 25%,transparent 0,transparent 50%,hsla(0,0%,100%,.15) 0,hsla(0,0%,100%,.15) 75%,transparent 0,transparent)
}

.progress-bar-danger {
    background-color: #d9534f
}

.progress-striped .progress-bar-danger {
    background-image: linear-gradient(45deg,hsla(0,0%,100%,.15) 25%,transparent 0,transparent 50%,hsla(0,0%,100%,.15) 0,hsla(0,0%,100%,.15) 75%,transparent 0,transparent)
}

.swiper-container {
    margin: 0 auto;
    position: relative;
    overflow: hidden;
    z-index: 1
}

.swiper-container-no-flexbox .swiper-slide {
    float: left
}

.swiper-container-vertical>.swiper-wrapper {
    -ms-flex-direction: column;
    flex-direction: column
}

.swiper-wrapper {
    position: relative;
    width: 100%;
    height: 100%;
    z-index: 1;
    display: -ms-flexbox;
    display: flex;
    transition-property: transform;
    box-sizing: content-box
}

.swiper-container-android .swiper-slide,.swiper-wrapper {
    transform: translateZ(0)
}

.swiper-container-multirow>.swiper-wrapper {
    -webkit-box-lines: multiple;
    -moz-box-lines: multiple;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap
}

.swiper-container-free-mode>.swiper-wrapper {
    transition-timing-function: ease-out;
    margin: 0 auto
}

.swiper-slide {
    -webkit-flex-shrink: 0;
    -ms-flex: 0 0 auto;
    flex-shrink: 0;
    width: 100%;
    height: 100%;
    position: relative
}

.swiper-container-autoheight,.swiper-container-autoheight .swiper-slide {
    height: auto
}

.swiper-container-autoheight .swiper-wrapper {
    -ms-flex-align: start;
    align-items: flex-start;
    transition-property: transform,height
}

.swiper-container .swiper-notification {
    position: absolute;
    left: 0;
    top: 0;
    pointer-events: none;
    opacity: 0;
    z-index: -1000
}

.swiper-wp8-horizontal {
    -ms-touch-action: pan-y;
    touch-action: pan-y
}

.swiper-wp8-vertical {
    -ms-touch-action: pan-x;
    touch-action: pan-x
}

.swiper-button-next,.swiper-button-prev {
    position: absolute;
    top: 50%;
    width: 27px;
    height: 44px;
    margin-top: -22px;
    z-index: 10;
    cursor: pointer;
    background-size: 27px 44px;
    background-position: 50%;
    background-repeat: no-repeat
}

.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled {
    opacity: .35;
    cursor: auto;
    pointer-events: none
}

.swiper-button-prev,.swiper-container-rtl .swiper-button-next {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M0 22L22 0l2.1 2.1L4.2 22l19.9 19.9L22 44 0 22z' fill='%23007aff'/%3E%3C/svg%3E");
    left: 10px;
    right: auto
}

.swiper-button-prev.swiper-button-black,.swiper-container-rtl .swiper-button-next.swiper-button-black {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M0 22L22 0l2.1 2.1L4.2 22l19.9 19.9L22 44 0 22z'/%3E%3C/svg%3E")
}

.swiper-button-prev.swiper-button-white,.swiper-container-rtl .swiper-button-next.swiper-button-white {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M0 22L22 0l2.1 2.1L4.2 22l19.9 19.9L22 44 0 22z' fill='%23fff'/%3E%3C/svg%3E")
}

.swiper-button-next,.swiper-container-rtl .swiper-button-prev {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M27 22L5 44l-2.1-2.1L22.8 22 2.9 2.1 5 0l22 22z' fill='%23007aff'/%3E%3C/svg%3E");
    right: 10px;
    left: auto
}

.swiper-button-next.swiper-button-black,.swiper-container-rtl .swiper-button-prev.swiper-button-black {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M27 22L5 44l-2.1-2.1L22.8 22 2.9 2.1 5 0l22 22z'/%3E%3C/svg%3E")
}

.swiper-button-next.swiper-button-white,.swiper-container-rtl .swiper-button-prev.swiper-button-white {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 27 44'%3E%3Cpath d='M27 22L5 44l-2.1-2.1L22.8 22 2.9 2.1 5 0l22 22z' fill='%23fff'/%3E%3C/svg%3E")
}

.swiper-pagination {
    position: absolute;
    text-align: center;
    transition: .3s;
    transform: translateZ(0);
    z-index: 10
}

.swiper-pagination.swiper-pagination-hidden {
    opacity: 0
}

.swiper-container-horizontal>.swiper-pagination-bullets,.swiper-pagination-custom,.swiper-pagination-fraction {
    bottom: 10px;
    left: 0;
    width: 100%
}

.swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    display: inline-block;
    border-radius: 100%;
    background: #000;
    opacity: .2
}

button.swiper-pagination-bullet {
    border: none;
    margin: 0;
    padding: 0;
    box-shadow: none;
    -ms-appearance: none;
    -webkit-appearance: none;
    appearance: none
}

.swiper-pagination-clickable .swiper-pagination-bullet {
    cursor: pointer
}

.swiper-pagination-white .swiper-pagination-bullet {
    background: #fff
}

.swiper-pagination-bullet-active {
    opacity: 1;
    background: #007aff
}

.swiper-pagination-white .swiper-pagination-bullet-active {
    background: #fff
}

.swiper-pagination-black .swiper-pagination-bullet-active {
    background: #000
}

.swiper-container-vertical>.swiper-pagination-bullets {
    right: 10px;
    top: 50%;
    transform: translate3d(0,-50%,0)
}

.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 5px 0;
    display: block
}

.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 5px
}

.swiper-pagination-progress {
    background: rgba(0,0,0,.25);
    position: absolute
}

.swiper-pagination-progress .swiper-pagination-progressbar {
    background: #007aff;
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    transform: scale(0);
    transform-origin: left top
}

.swiper-container-rtl .swiper-pagination-progress .swiper-pagination-progressbar {
    transform-origin: right top
}

.swiper-container-horizontal>.swiper-pagination-progress {
    width: 100%;
    height: 4px;
    left: 0;
    top: 0
}

.swiper-container-vertical>.swiper-pagination-progress {
    width: 4px;
    height: 100%;
    left: 0;
    top: 0
}

.swiper-pagination-progress.swiper-pagination-white {
    background: hsla(0,0%,100%,.5)
}

.swiper-pagination-progress.swiper-pagination-white .swiper-pagination-progressbar {
    background: #fff
}

.swiper-pagination-progress.swiper-pagination-black .swiper-pagination-progressbar {
    background: #000
}

.swiper-container-3d {
    -o-perspective: 1200px;
    perspective: 1200px
}

.swiper-container-3d .swiper-cube-shadow,.swiper-container-3d .swiper-slide,.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top,.swiper-container-3d .swiper-wrapper {
    transform-style: preserve-3d
}

.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    z-index: 10
}

.swiper-container-3d .swiper-slide-shadow-left {
    background-image: linear-gradient(270deg,rgba(0,0,0,.5),transparent)
}

.swiper-container-3d .swiper-slide-shadow-right {
    background-image: linear-gradient(90deg,rgba(0,0,0,.5),transparent)
}

.swiper-container-3d .swiper-slide-shadow-top {
    background-image: linear-gradient(0deg,rgba(0,0,0,.5),transparent)
}

.swiper-container-3d .swiper-slide-shadow-bottom {
    background-image: linear-gradient(180deg,rgba(0,0,0,.5),transparent)
}

.swiper-container-coverflow .swiper-wrapper,.swiper-container-flip .swiper-wrapper {
    -ms-perspective: 1200px
}

.swiper-container-cube,.swiper-container-flip {
    overflow: visible
}

.swiper-container-cube .swiper-slide,.swiper-container-flip .swiper-slide {
    pointer-events: none;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    z-index: 1
}

.swiper-container-cube .swiper-slide .swiper-slide,.swiper-container-flip .swiper-slide .swiper-slide {
    pointer-events: none
}

.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-active .swiper-slide-active,.swiper-container-flip .swiper-slide-active,.swiper-container-flip .swiper-slide-active .swiper-slide-active {
    pointer-events: auto
}

.swiper-container-cube .swiper-slide-shadow-bottom,.swiper-container-cube .swiper-slide-shadow-left,.swiper-container-cube .swiper-slide-shadow-right,.swiper-container-cube .swiper-slide-shadow-top,.swiper-container-flip .swiper-slide-shadow-bottom,.swiper-container-flip .swiper-slide-shadow-left,.swiper-container-flip .swiper-slide-shadow-right,.swiper-container-flip .swiper-slide-shadow-top {
    z-index: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden
}

.swiper-container-cube .swiper-slide {
    visibility: hidden;
    transform-origin: 0 0;
    width: 100%;
    height: 100%
}

.swiper-container-cube.swiper-container-rtl .swiper-slide {
    transform-origin: 100% 0
}

.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-next,.swiper-container-cube .swiper-slide-next+.swiper-slide,.swiper-container-cube .swiper-slide-prev {
    pointer-events: auto;
    visibility: visible
}

.swiper-container-cube .swiper-cube-shadow {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: #000;
    opacity: .6;
    filter: blur(50px);
    z-index: 0
}

.swiper-container-fade.swiper-container-free-mode .swiper-slide {
    transition-timing-function: ease-out
}

.swiper-container-fade .swiper-slide {
    pointer-events: none;
    transition-property: opacity
}

.swiper-container-fade .swiper-slide .swiper-slide {
    pointer-events: none
}

.swiper-container-fade .swiper-slide-active,.swiper-container-fade .swiper-slide-active .swiper-slide-active {
    pointer-events: auto
}

.swiper-scrollbar {
    border-radius: 10px;
    position: relative;
    -ms-touch-action: none;
    background: rgba(0,0,0,.1)
}

.swiper-container-horizontal>.swiper-scrollbar {
    position: absolute;
    left: 1%;
    bottom: 3px;
    z-index: 50;
    height: 5px;
    width: 98%
}

.swiper-container-vertical>.swiper-scrollbar {
    position: absolute;
    right: 3px;
    top: 1%;
    z-index: 50;
    width: 5px;
    height: 98%
}

.swiper-scrollbar-drag {
    height: 100%;
    width: 100%;
    position: relative;
    background: rgba(0,0,0,.5);
    border-radius: 10px;
    left: 0;
    top: 0
}

.swiper-scrollbar-cursor-drag {
    cursor: move
}

.swiper-lazy-preloader {
    width: 42px;
    height: 42px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -21px;
    margin-top: -21px;
    z-index: 10;
    transform-origin: 50%;
    animation: swiper-preloader-spin 1s steps(12) infinite
}

.swiper-lazy-preloader:after {
    display: block;
    content: "";
    width: 100%;
    height: 100%;
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpath id='a' stroke='%236c6c6c' stroke-width='11' stroke-linecap='round' d='M60 7v20'/%3E%3C/defs%3E%3Cuse xlink:href='%23a' opacity='.27'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(30 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(60 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(90 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(120 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(150 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.37' transform='rotate(180 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.46' transform='rotate(210 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.56' transform='rotate(240 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.66' transform='rotate(270 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.75' transform='rotate(300 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.85' transform='rotate(330 60 60)'/%3E%3C/svg%3E");
    background-position: 50%;
    background-size: 100%;
    background-repeat: no-repeat
}

.swiper-lazy-preloader-white:after {
    background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg viewBox='0 0 120 120' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cdefs%3E%3Cpath id='a' stroke='%23fff' stroke-width='11' stroke-linecap='round' d='M60 7v20'/%3E%3C/defs%3E%3Cuse xlink:href='%23a' opacity='.27'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(30 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(60 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(90 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(120 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.27' transform='rotate(150 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.37' transform='rotate(180 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.46' transform='rotate(210 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.56' transform='rotate(240 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.66' transform='rotate(270 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.75' transform='rotate(300 60 60)'/%3E%3Cuse xlink:href='%23a' opacity='.85' transform='rotate(330 60 60)'/%3E%3C/svg%3E")
}

@keyframes swiper-preloader-spin {
    to {
        transform: rotate(1turn)
    }
}

.navbar-brand {
    background: url(/static/img/logo.4331677.png) 50% no-repeat;
    background-size: 90%;
    text-indent: -9999px;
    width: 120px;
    height: 48px;
    overflow: hidden
}

.navbar-default {
    box-shadow: 0 0 3px 0 rgba(99,99,99,.2);
    position: relative;
    border-bottom: none
}

@media (max-width: 767px) {
    .navbar-default .visible-xs {
        display:inline-block!important
    }
}

.navbar-default .navbar-header {
    position: relative
}

@media (min-width: 768px) {
    .navbar-default .navbar-header.has-call-out {
        padding-right:100px
    }
}

.navbar-default .navbar-header .brand-call-out {
    height: 32px;
    line-height: 32px;
    width: 100px;
    text-align: center;
    padding: 0 5px;
    font-size: 12px;
    float: left;
    background: #00a786;
    position: absolute;
    top: 50%;
    font-weight: 700;
    color: #fff;
    border-radius: 4px;
    left: 110px;
    margin-top: -16px
}

@media (min-width: 768px) {
    .navbar-default .navbar-header .brand-call-out {
        left:95px
    }
}

.navbar-default .navbar-header .brand-call-out:before {
    content: "";
    width: 0;
    height: 0;
    border: 6px solid transparent;
    border-right: 6px solid #00a786;
    position: absolute;
    left: -12px;
    top: 50%;
    margin-top: -6px
}

.navbar-default .navbar-header .brand-call-out:active,.navbar-default .navbar-header .brand-call-out:focus,.navbar-default .navbar-header .brand-call-out:hover {
    text-decoration: none
}

.navbar-default .navbar-header .brand-call-out:active,.navbar-default .navbar-header .brand-call-out:hover {
    background: #008e72
}

.navbar-default .navbar-header .brand-call-out:active:before,.navbar-default .navbar-header .brand-call-out:hover:before {
    border-right: 6px solid #008e72
}

.navbar-default .nav-message-menu {
    position: relative
}

.navbar-default .nav-message-menu:hover .nav-sub-menu {
    height: 80px;
    opacity: 1
}

.navbar-default .nav-sub-menu {
    position: absolute;
    width: 90px;
    top: 50px;
    left: 50%;
    transition: all .3s;
    margin-left: -45px;
    opacity: 0;
    padding: 0;
    box-shadow: 0 3px 3px 0 rgba(99,99,99,.4);
    background: #fff;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    overflow: hidden;
    padding-bottom: 5px;
    height: 0
}

.navbar-default .nav-sub-menu li {
    display: block;
    text-align: center;
    list-style: none;
    height: 40px;
    padding: 0;
    margin: 0
}

.navbar-default .nav-sub-menu li a {
    position: relative;
    display: block;
    height: 40px;
    line-height: 40px;
    color: #333
}

.navbar-default .nav-sub-menu li a span {
    display: inline-block
}

.navbar-default .nav-sub-menu li a .counter {
    padding: 0;
    border-radius: 4px;
    vertical-align: middle;
    margin-top: -3px;
    padding: 0 2px;
    height: 16px;
    line-height: 16px;
    margin-left: 3px;
    text-align: center;
    font-size: 10px;
    background: #f05959;
    color: #fff;
    min-width: 20px;
    display: none;
    position: relative
}

.navbar-default .nav-sub-menu li a .counter.active {
    display: inline-block
}

.navbar-default .nav-sub-menu li a:focus,.navbar-default .nav-sub-menu li a:hover {
    background: #f6f7f8;
    text-decoration: none
}

.navbar-default .user-menu {
    position: relative
}

@media (max-width: 768px) {
    .navbar-default .user-menu {
        display:none
    }
}

.navbar-default .user-menu.hovered .notify-badge {
    opacity: 0
}

.navbar-default .user-menu.hovered .user-avatar {
    height: 50px
}

.navbar-default .user-menu.hovered .user-avatar .user-avatar-wrp {
    margin-left: -29px;
    margin-top: 35px;
    width: 58px;
    height: 58px
}

.navbar-default .user-menu .user-avatar {
    height: 50px;
    position: relative;
    padding: 0 8px;
    margin: 0!important;
    padding-left: 50px!important
}

@media (max-width: 768px) {
    .navbar-default .user-menu .user-avatar {
        padding-left:38px!important
    }
}

.navbar-default .user-menu .user-avatar .user-avatar-wrp {
    position: absolute;
    z-index: 999;
    left: 50%;
    top: 0;
    margin-top: 8px;
    margin-left: -17px;
    width: 34px;
    height: 34px;
    transition: all .3s;
    background: #fff;
    border-radius: 100%
}

@media (max-width: 768px) {
    .navbar-default .user-menu .user-avatar .user-avatar-wrp {
        left:15px;
        margin-top: -10px;
        width: 20px;
        height: 20px
    }
}

.navbar-default .user-menu .user-avatar .user-avatar-wrp .img-circle {
    display: block;
    width: 90%;
    height: 90%;
    margin: 5%
}

.navbar-default .user-menu .user-avatar .login-name {
    display: block;
    max-width: 100px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.navbar-default .user-menu .user-box {
    top: 50px;
    z-index: 100;
    left: 50%;
    margin-left: -100px;
    position: absolute;
    width: 209px;
    padding-bottom: 6px;
    overflow: hidden
}

.navbar-default .user-menu .user-box .user-box-wrp {
    opacity: 0;
    width: 200px;
    margin-left: 3px;
    height: 0;
    transition: all .3s;
    position: relative;
    background: #fff no-repeat 50%/30%;
    box-shadow: 0 3px 3px 0 rgba(99,99,99,.4);
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px
}

.navbar-default .user-menu .user-box .notify-badge {
    right: 8px;
    top: 8px
}

.navbar-default .user-menu .user-box.loading {
    background-image: url(/static/img/loading.5d941cc.gif)
}

.navbar-default .user-menu .user-box.loading .user-box-inner {
    opacity: 0;
    visibility: hidden
}

.navbar-default .user-menu .user-box.show .user-box-wrp {
    height: 225px;
    opacity: 1
}

.navbar-default .user-menu .user-box.show .user-box-wrp .user-box-inner {
    height: 215px;
    padding: 50px 0 10px
}

.navbar-default .user-menu .user-box.show .user-box-wrp .user-name {
    opacity: 1
}

.navbar-default .user-menu .user-box .user-box-inner {
    transition: all .3s;
    position: relative;
    padding: 0;
    height: 0
}

.navbar-default .user-menu .user-box .user-attention {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 120px;
    text-align: center
}

.navbar-default .user-menu .user-box .user-attention a {
    color: #777;
    line-height: 30px;
    font-size: 12px
}

.navbar-default .user-menu .user-box .user-attention .att-pic {
    display: block;
    height: 90px;
    background: #f6f7f8 50% no-repeat;
    background-size: cover
}

.navbar-default .user-menu .user-box .user-name {
    transition: opacity .1s;
    opacity: 0;
    font-size: 14px;
    text-align: center;
    font-weight: 700
}

.navbar-default .user-menu .user-box .user-pt-wrp {
    background: #48bfa8;
    position: absolute;
    top: 50%;
    margin-top: -23px;
    right: -6px;
    left: 10px;
    padding: 3px 5px;
    border-radius: 8px 4px 4px 8px;
    height: 56px
}

.navbar-default .user-menu .user-box .user-pt-wrp .pt-right {
    position: absolute;
    top: 5px;
    right: 18px;
    bottom: 5px
}

.navbar-default .user-menu .user-box .user-pt-wrp .pt-right a {
    width: 35px;
    height: 50px;
    display: block;
    float: left;
    color: #fff;
    text-align: center;
    font-size: 12px
}

.navbar-default .user-menu .user-box .user-pt-wrp .pt-right a:active,.navbar-default .user-menu .user-box .user-pt-wrp .pt-right a:focus,.navbar-default .user-menu .user-box .user-pt-wrp .pt-right a:hover {
    text-decoration: none
}

.navbar-default .user-menu .user-box .user-pt-wrp .pt-right a:hover {
    opacity: .8
}

.navbar-default .user-menu .user-box .user-pt-wrp .pt-right a i {
    margin-top: -3px
}

.navbar-default .user-menu .user-box .user-pt-wrp .pt-right a+a {
    margin-left: 10px
}

.navbar-default .user-menu .user-box .user-pt-wrp .pt-left {
    position: relative
}

.navbar-default .user-menu .user-box .user-pt-wrp .pt-left .pt-number {
    display: block;
    font-size: 13px;
    height: 25px;
    line-height: 25px;
    max-width: 90px;
    color: #fff;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.navbar-default .user-menu .user-box .user-pt-wrp .pt-left .pt-number i {
    margin-right: 3px
}

.navbar-default .user-menu .user-box .user-bell {
    position: absolute;
    left: 16px;
    top: 8px
}

.navbar-default .user-menu .user-box .user-bell .user-bell-counter {
    width: 18px;
    border-radius: 100%;
    height: 18px;
    line-height: 18px;
    font-size: 9px;
    font-weight: 700;
    position: absolute;
    text-align: center;
    color: #fff;
    background: #ff5d55;
    right: -6px;
    top: -6px
}

.navbar-default .user-menu .user-box .user-exit {
    position: absolute;
    right: 16px;
    top: 8px
}

.navbar-default .user-menu .user-box .user-menu {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 10px;
    height: 60px;
    padding: 0
}

.navbar-default .user-menu .user-box .user-menu li {
    list-style: none;
    float: left;
    height: 30px;
    line-height: 30px;
    width: 50%;
    padding-left: 15px;
    display: block
}

.navbar-default .user-menu .user-box .user-menu li a {
    font-size: 12px;
    color: #666
}

.navbar-default .user-menu .user-box .user-menu li a i {
    margin-right: 3px
}

.navbar-default .user-menu .user-box .user-menu li a:active,.navbar-default .user-menu .user-box .user-menu li a:focus,.navbar-default .user-menu .user-box .user-menu li a:hover {
    text-decoration: none
}

.navbar-default .user-menu .user-box .user-menu li a:hover {
    opacity: .8
}

.navbar-default .user-menu .user-box .user-hint {
    color: #777;
    font-size: 13px;
    text-align: center
}

.navbar-default .user-menu .user-box .user-hint a {
    font-weight: 700
}

.navbar-default .user-menu .user-box .user-hint+.user-hint {
    margin-top: 2px
}

.navbar-default .user-menu .user-box .user-avatar {
    border-radius: 100%;
    background: #fff;
    position: absolute;
    top: -15px;
    left: 50%;
    margin-left: -30px;
    width: 60px;
    height: 60px;
    display: block
}

.navbar-default .user-menu .user-box .user-avatar img {
    display: block;
    box-shadow: inset 0 0 4px #e7e7e7;
    position: absolute;
    top: 4px;
    left: 4px;
    width: 52px;
    height: 52px
}

.navbar-default .notify-badge {
    display: none;
    padding: 0;
    border-radius: 6px;
    margin-top: -2px;
    height: 8px;
    width: 8px;
    background: #f05959;
    color: #fff;
    position: absolute;
    right: 5px;
    top: 5px;
    opacity: 0;
    transition: opacity .3s
}

.navbar-default .notify-badge.show {
    opacity: 1;
    display: block
}

.navbar-default .navbar-form {
    margin: 0;
    padding: 7px 10px 0 0!important
}

@media (max-width: 480px) {
    .navbar-default .navbar-form {
        padding:15px 10px!important
    }
}

.navbar-default .nav-search-bar {
    border-radius: 60px;
    overflow: hidden;
    background: #f6f7f8;
    width: 180px;
    height: 36px;
    position: relative;
    border: 1px solid transparent;
    transition: all .3s
}

@media (max-width: 768px) {
    .navbar-default .nav-search-bar {
        width:100%
    }
}

@media (max-width: 1400px) and (min-width:768px) {
    .navbar-default .nav-search-bar {
        width:100px
    }
}

.navbar-default .nav-search-bar.focused,.navbar-default .nav-search-bar.hovered {
    border-color: #00a786;
    background: #fff
}

.navbar-default .nav-search-bar #nav_search_ipt {
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    width: 100%;
    padding-right: 36px!important;
    position: absolute;
    border-radius: 60px;
    display: block;
    border: none;
    box-shadow: none;
    transition: all .3s;
    background: none
}

.navbar-default .nav-search-bar .btn-default {
    border-top-right-radius: 60px;
    border-bottom-right-radius: 60px;
    border: none;
    position: absolute;
    top: 0;
    right: 0;
    height: 34px;
    width: 34px;
    vertical-align: middle;
    background: url(/static/img/icon.61ad871.png) no-repeat center -163px
}

.navbar-default .nav-search-bar .btn-default:focus,.navbar-default .nav-search-bar .btn-default:hover {
    outline: none;
    border: none
}

.navbar-default .navbar-nav>li {
    letter-spacing: 1px
}

.navbar-default .navbar-nav>li .icon-new {
    background: url(/static/img/icon-new.656691a.png) 50% no-repeat;
    width: 32px;
    height: 32px
}

@media (min-width: 768px) {
    .navbar-default .navbar-nav>li .icon-new {
        position:absolute;
        top: -8px;
        right: -22px
    }
}

@media (min-width: 768px) {
    .navbar-default .navbar-nav>li.show-in-xs {
        display:none
    }
}

.navbar-default .navbar-nav>li .sub-item {
    position: relative
}

.navbar-default .navbar-nav>li .sub-item .icon-mail {
    display: inline-block
}

.navbar-default .navbar-nav>li .sub-item .counter {
    padding: 0;
    border-radius: 20px;
    vertical-align: middle;
    line-height: 18px;
    height: 19px;
    text-align: center;
    width: 19px;
    font-size: 10px;
    background: #f05959;
    color: #fff;
    position: absolute;
    right: 5px;
    top: 10px;
    display: none
}

.navbar-default .navbar-nav>li .sub-item .counter.active {
    display: inline-block
}

.navbar-default .navbar-nav>li .sub-item>a {
    color: #333;
    display: block
}

.navbar-default .navbar-nav>li .sub-item>a:hover {
    text-decoration: none
}

@media (min-width: 768px) {
    .navbar-default .navbar-nav>li .sub-item {
        display:none!important
    }
}

@media (max-width: 768px) {
    .navbar-default .navbar-nav>li .sub-item {
        line-height:20px;
        padding: 8px 25px 8px 15px
    }
}

@media (max-width: 768px) {
    .navbar-default .navbar-nav .notify-badge {
        display:none!important
    }
}

@media (min-width: 768px) {
    .navbar-default .navbar-nav .nav-mobile-label {
        display:none
    }
}

@media (min-width: 1400px) {
    .navbar-default .navbar-nav .icon-off {
        display:none
    }

    .navbar-default .navbar-nav>li>a>i {
        margin-right: 5px
    }
}

@media (min-width: 768px) {
    .navbar-default .navbar-nav>li {
        position:relative
    }

    .navbar-default .navbar-nav>li>a {
        border-radius: 32px;
        padding: 8px 10px;
        margin: 6px 0;
        display: block
    }
}

.navbar-default .navbar-nav>li.submit-book {
    padding-left: 15px
}

@media (max-width: 768px) {
    .navbar-default .navbar-nav>li.submit-book {
        padding-right:15px
    }
}

.navbar-default .navbar-nav>li.submit-book i {
    margin-right: 2px
}

.navbar-default .navbar-nav>li.submit-book a.btn {
    border-radius: 0!important;
    color: #fff!important;
    padding: 0 10px!important;
    margin: 0;
    height: 50px;
    line-height: 48px;
    opacity: 1;
    border: none;
    background-color: #00c49d;
    background: linear-gradient(180deg,#00c49d,#00a87e);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#00c49d",endColorstr="#00a87e",GradientType=0);
    transition: opacity .3s
}

.navbar-default .navbar-nav>li.submit-book a.btn:hover {
    background-color: #00a786;
    opacity: .8
}

.navbar {
    z-index: 9998;
    position: relative;
    color: #333;
    font-size: .9em;
    border-top: none!important;
    border-left: none!important;
    border-right: none!important;
    border-radius: 0
}

.footer {
    background: #f6f7f8;
    width: 100%;
    padding: 15px 0 30px;
    font-size: 14px
}

@media (max-width: 1399px) {
    .footer {
        padding:0
    }
}

.footer p {
    margin: 0
}

.footer a {
    color: #666
}

.footer .container {
    padding: 0 15px
}

.footer .pr-link {
    font-size: 13px;
    margin-left: -15px;
    text-align: center
}

.footer .pr-link:after,.footer .pr-link:before {
    content: " ";
    display: table
}

.footer .pr-link:after {
    clear: both
}

.footer .pr-link,.footer .pr-link li {
    padding: 0;
    list-style: none;
    display: block
}

.footer .pr-link a,.footer .pr-link b {
    color: #888
}

.footer .pr-link li {
    margin-top: 5px;
    display: inline-block;
    margin-left: 15px
}

@media (max-width: 1399px) {
    .footer .pr-link li {
        float:left;
        display: block
    }
}

.footer .qr {
    font-size: 13px;
    margin: 15px 0;
    text-align: center
}

@media (max-width: 1399px) {
    .footer .qr {
        display:none
    }
}

.footer .qr img.qr-image {
    margin: -5px auto -10px;
    display: block;
    width: 140px;
    height: 140px
}

.footer .qr .icon {
    margin-top: -5px
}

.footer .qr p {
    margin-top: 5px
}

.footer .friend-link {
    max-width: 320px;
    margin: 0 -10px;
    text-align: right;
    float: right
}

.footer .friend-link .friend-link-title {
    margin: 15px 10px 6px
}

.footer .friend-link a {
    margin: 3px 10px;
    display: inline-block;
    font-size: 13px
}

@media (max-width: 1399px) {
    .footer .friend-link {
        float:left;
        text-align: left
    }
}

.footer .link-grid .grid {
    min-height: 170px;
    overflow: hidden
}

.footer .link-grid .grid p,.footer .link-grid .grid p.link-grid-title {
    margin: 15px 0
}

.footer .brand-image {
    display: block;
    width: 120px;
    height: 51px;
    margin: 0 auto 15px
}

.footer .brand {
    font-size: 13px;
    text-align: center;
    color: #888
}

.index-book-list,.l-book-list {
    margin-top: -25px;
    margin-left: -9px;
    margin-right: -9px;
    overflow: hidden
}

@media (min-width: 1400px) {
    .index-book-list,.l-book-list {
        margin-left:-7.5px;
        margin-right: -7.5px
    }
}

@media (min-width: 1600px) {
    .index-book-list,.l-book-list {
        margin-left:-13.5px;
        margin-right: -13.5px
    }
}

.index-book-list a:active,.index-book-list a:focus,.index-book-list a:hover,.l-book-list a:active,.l-book-list a:focus,.l-book-list a:hover {
    text-decoration: none
}

.index-book-list,.index-book-list li,.index-book-list ul,.l-book-list,.l-book-list li,.l-book-list ul {
    padding: 0;
    list-style: none;
    display: block
}

.index-book-list .book-item,.l-book-list .book-item {
    margin-top: 25px;
    display: block;
    float: left;
    height: 240px;
    width: 128px;
    overflow: hidden
}

.index-book-list .book-item.two,.l-book-list .book-item.two {
    width: 256px
}

.index-book-list .book-item .book-item-inner,.l-book-list .book-item .book-item-inner {
    display: block;
    margin: 0 auto;
    width: 110px
}

.index-book-list .book-item .book-item-inner.empty,.l-book-list .book-item .book-item-inner.empty {
    height: 240px;
    background: #eee;
    border-radius: 4px
}

@media (min-width: 1400px) {
    .index-book-list .book-item .book-item-inner,.l-book-list .book-item .book-item-inner {
        width:130px
    }
}

.index-book-list .book-item .book-item-inner .cover,.l-book-list .book-item .book-item-inner .cover {
    position: relative;
    display: block;
    margin: 0 auto;
    overflow: hidden;
    border-radius: 3px;
    width: 110px;
    height: 165px
}

@media (min-width: 1400px) {
    .index-book-list .book-item .book-item-inner .cover,.l-book-list .book-item .book-item-inner .cover {
        width:130px;
        height: 195px
    }
}

.index-book-list .book-item .book-item-inner .cover img,.l-book-list .book-item .book-item-inner .cover img {
    width: 100%;
    height: 100%;
    display: block;
    transition: all .2s
}

.index-book-list .book-item .book-item-inner .cover .status,.l-book-list .book-item .book-item-inner .cover .status {
    opacity: 0;
    border-radius: 3px;
    background: rgba(0,0,0,.55);
    position: absolute;
    bottom: 0;
    right: 0;
    left: 0;
    top: 0;
    padding: 10px;
    color: #fff;
    line-height: 22px;
    font-size: 13px;
    transition: opacity .2s
}

.index-book-list .book-item .book-item-inner .cover .status .status-author,.l-book-list .book-item .book-item-inner .cover .status .status-author {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-bottom: 20px
}

.index-book-list .book-item .book-item-inner .cover .status .status-fav,.l-book-list .book-item .book-item-inner .cover .status .status-fav {
    position: absolute;
    bottom: 10px;
    left: 10px;
    right: 10px;
    color: #ffa21c
}

.index-book-list .book-item .book-item-inner .cover .status .status-about,.l-book-list .book-item .book-item-inner .cover .status .status-about {
    font-size: 11px;
    max-height: 80px;
    line-height: 20px;
    overflow: hidden
}

@media (min-width: 1400px) {
    .index-book-list .book-item .book-item-inner .cover .status .status-about,.l-book-list .book-item .book-item-inner .cover .status .status-about {
        font-size:12px;
        max-height: 95px
    }
}

.index-book-list .book-item .book-item-inner .cover .status i,.l-book-list .book-item .book-item-inner .cover .status i {
    font-style: normal
}

.index-book-list .book-item .book-item-inner .cover .status .img-circle,.l-book-list .book-item .book-item-inner .cover .status .img-circle {
    margin-top: -3px;
    display: inline-block;
    border-radius: 100%;
    width: 20px;
    height: 20px
}

.index-book-list .book-item .book-item-inner .desc,.l-book-list .book-item .book-item-inner .desc {
    text-align: center;
    display: block;
    height: 18px;
    line-height: 18px;
    font-weight: 700;
    color: #999;
    font-size: 12px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.index-book-list .book-item .book-item-inner .desc i.icon-hot-red,.l-book-list .book-item .book-item-inner .desc i.icon-hot-red {
    width: 12px;
    height: 12px;
    background-size: cover
}

.index-book-list .book-item .book-item-inner .title,.l-book-list .book-item .book-item-inner .title {
    text-align: center;
    display: block;
    height: 25px;
    color: #333;
    margin-top: 5px;
    line-height: 25px;
    font-weight: 700;
    font-size: 14px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.index-book-list .book-item .book-item-inner:hover .cover>img,.l-book-list .book-item .book-item-inner:hover .cover>img {
    filter: blur(10px)
}

.index-book-list .book-item .book-item-inner:hover .cover .status,.l-book-list .book-item .book-item-inner:hover .cover .status {
    opacity: 1
}

.index-book-list .book-item.hot .desc,.l-book-list .book-item.hot .desc {
    color: #ff5d55
}

@media (min-width: 1400px) {
    .index-book-list .book-item,.l-book-list .book-item {
        width:145px
    }

    .index-book-list .book-item.two,.l-book-list .book-item.two {
        width: 290px
    }
}

@media (min-width: 1600px) {
    .index-book-list .book-item,.l-book-list .book-item {
        width:157px
    }

    .index-book-list .book-item.two,.l-book-list .book-item.two {
        width: 314px
    }
}

.featured {
    height: 460px
}

@media (max-width: 1600px) {
    .featured {
        height:379px
    }
}

@media (max-width: 1400px) {
    .featured {
        height:291px
    }
}

.featured .ft-control {
    position: absolute;
    width: 50px;
    height: 50px;
    line-height: 46px;
    text-align: center;
    font-weight: 700;
    border-radius: 100%;
    color: #fff;
    font-size: 2em;
    top: 50%;
    margin-top: -25px;
    background: rgba(0,0,0,.4) no-repeat 50%;
    background-size: 50% 50%;
    text-indent: -9999px;
    overflow: hidden
}

.featured .ft-control:hover {
    text-decoration: none
}

.featured .ft-control.ft-prev {
    left: 50%;
    margin-left: -850px;
    background-image: url(/static/img/arrow-prev.e607177.png);
    background-position-x: 10px
}

.featured .ft-control.ft-next {
    left: 50%;
    margin-left: 800px;
    background-image: url(/static/img/arrow-next.7299d3c.png);
    background-position-x: 14px
}

@media (max-width: 1700px) {
    .featured .ft-control.ft-prev {
        margin-left:auto;
        left: 5px
    }

    .featured .ft-control.ft-next {
        margin-left: auto;
        left: auto;
        right: 5px
    }
}

.featured .ft-list .ft-item {
    height: 460px
}

@media (max-width: 1600px) {
    .featured .ft-list .ft-item {
        height:379px
    }
}

@media (max-width: 1400px) {
    .featured .ft-list .ft-item {
        height:291px
    }
}

.featured .ft-list .ft-item .ft-banner-tpl {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0
}

.featured .ft-list .ft-item .ft-banner-tpl .ft-banner-bg {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-size: cover;
    -moz-filter: blur(64px);
    -ms-filter: blur(64px);
    filter: blur(64px)
}

.featured .ft-list .ft-item .ft-banner-tpl .ft-banner-bg,.featured .ft-list .ft-item .ft-banner-tpl _:-ms-lang(x) {
    opacity: .15
}

.featured .ft-list .ft-item .ft-inner-wrapper,.featured .ft-list .ft-item .ft-tint {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0
}

.featured .ft-list .ft-item .ft-inner-wrapper {
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMTAwJSI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0icmdiKDAsMCwwKSIgc3RvcC1vcGFjaXR5PSIwIi8+PHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSJyZ2IoMCwwLDApIiBzdG9wLW9wYWNpdHk9IjAiLz48c3RvcCBvZmZzZXQ9IjIwMCUiIHN0b3AtY29sb3I9InJnYigyNTUsIDI1NSwgMjU1KSIgc3RvcC1vcGFjaXR5PSIwLjE1Ii8+PHN0b3Agb2Zmc2V0PSIzMDAlIiBzdG9wLWNvbG9yPSJyZ2IoMjU1LCAyNTUsIDI1NSkiIHN0b3Atb3BhY2l0eT0iMC4xNSIvPjwvbGluZWFyR3JhZGllbnQ+PHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNsZXNzaGF0LWdlbmVyYXRlZCkiIC8+PC9zdmc+);
    background-image: repeating--webkit-linear-gradient(-45deg,transparent,transparent 2px,hsla(0,0%,100%,.15) 2px,hsla(0,0%,100%,.15) 4px);
    background-image: repeating--moz-linear-gradient(-45deg,transparent,transparent 2px,hsla(0,0%,100%,.15) 2px,hsla(0,0%,100%,.15) 4px);
    background-image: repeating--o-linear-gradient(-45deg,transparent,transparent 2px,hsla(0,0%,100%,.15) 2px,hsla(0,0%,100%,.15) 4px);
    background-image: repeating-linear-gradient(-45deg,transparent,transparent 2px,hsla(0,0%,100%,.15) 0,hsla(0,0%,100%,.15) 4px)
}

.featured .ft-list .ft-item .ft-banner-cover,.featured .ft-list .ft-item .ft-inner {
    z-index: 99;
    position: relative;
    height: 100%;
    display: block
}

.featured .ft-list .ft-item .ft-banner-cover img {
    display: block;
    width: 100%;
    height: auto
}

.featured .ft-list .ft-item .ft-right {
    position: absolute;
    right: 15px;
    top: 0;
    bottom: 0;
    padding-top: 30px;
    width: 40%
}

.featured .ft-list .ft-item .ft-title {
    background: #a5db70;
    padding: 4px 8px;
    font-size: 2em;
    font-weight: 700;
    display: inline-block;
    color: #fff;
    margin: 45px 0 0;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

.featured .ft-list .ft-item .ft-title a {
    color: #fff;
    text-decoration: none
}

.featured .ft-list .ft-item .ft-title a:focus,.featured .ft-list .ft-item .ft-title a:hover {
    text-decoration: none
}

@media (max-width: 1600px) {
    .featured .ft-list .ft-item .ft-title {
        margin:0
    }
}

@media (max-width: 1400px) {
    .featured .ft-list .ft-item .ft-title {
        font-size:1.6em
    }
}

.featured .ft-list .ft-item .ft-desc {
    font-weight: 700;
    font-size: 1.1em;
    margin-top: 15px;
    max-height: 10em;
    overflow: hidden
}

@media (max-width: 1600px) {
    .featured .ft-list .ft-item .ft-desc {
        font-size:1em;
        max-height: 8.6em
    }
}

@media (max-width: 1400px) {
    .featured .ft-list .ft-item .ft-desc {
        font-size:.8em;
        max-height: 6.8em
    }
}

.featured .ft-list .ft-item .ft-large-cover {
    width: 100%;
    height: 100%;
    display: block
}

.featured .ft-list .ft-item .ft-cover {
    top: 0;
    left: -5%;
    height: 460px;
    position: absolute;
    display: block
}

@media (max-width: 1600px) {
    .featured .ft-list .ft-item .ft-cover {
        height:379px
    }
}

@media (max-width: 1400px) {
    .featured .ft-list .ft-item .ft-cover {
        height:291px
    }
}

.featured .ft-list .ft-item .ft-cover img {
    display: block;
    height: 100%
}

.featured .ft-list .ft-item .ft-vol-title {
    font-weight: 700;
    bottom: 185px;
    height: 20px;
    line-height: 20px;
    left: 0;
    position: absolute;
    color: #999
}

@media (max-width: 1600px) {
    .featured .ft-list .ft-item .ft-vol-title {
        bottom:145px
    }
}

@media (max-width: 1400px) {
    .featured .ft-list .ft-item .ft-vol-title {
        font-size:.9em;
        bottom: 100px
    }
}

.featured .ft-list .ft-item .ft-vol-list {
    left: -5px;
    bottom: 60px;
    position: absolute
}

.featured .ft-list .ft-item .ft-vol-list:after,.featured .ft-list .ft-item .ft-vol-list:before {
    content: " ";
    display: table
}

.featured .ft-list .ft-item .ft-vol-list:after {
    clear: both
}

@media (max-width: 1600px) {
    .featured .ft-list .ft-item .ft-vol-list {
        margin-top:60px;
        bottom: 20px
    }
}

@media (max-width: 1400px) {
    .featured .ft-list .ft-item .ft-vol-list {
        margin-top:40px;
        width: 80%;
        left: -3px
    }
}

.featured .ft-list .ft-item .ft-vol-list .ft-vol {
    padding: 0 5px;
    display: block;
    float: left;
    position: relative
}

.featured .ft-list .ft-item .ft-vol-list .ft-vol+.ft-vol {
    margin-left: 10px
}

@media (max-width: 1400px) {
    .featured .ft-list .ft-item .ft-vol-list .ft-vol {
        padding:0 3px
    }
}

.featured .ft-list .ft-item .ft-vol-list .ft-vol .ft-vol-cover {
    width: 80px;
    height: 120px;
    display: block;
    box-shadow: 0 2px 3px #e7e7e7
}

@media (max-width: 1400px) {
    .featured .ft-list .ft-item .ft-vol-list .ft-vol .ft-vol-cover {
        width:50px;
        height: 75px
    }
}

.featured .ft-list .ft-item .ft-vol-list .ft-vol .ft-vol-badge {
    border-radius: 100%;
    position: absolute;
    background: #ff7577;
    color: #fff;
    right: -10px;
    top: -10px;
    z-index: 99;
    width: 35px;
    height: 35px;
    transform: rotate(45deg);
    font-size: .75em;
    text-align: center;
    font-weight: 700;
    line-height: 35px
}

.navigation {
    margin-top: 20px;
    position: relative;
    margin-bottom: 15px!important;
    background: #fff;
    border-radius: 4px;
    padding: 0;
    height: 95px;
    overflow: hidden
}

.navigation:after,.navigation:before {
    content: " ";
    display: table
}

.navigation:after {
    clear: both
}

.navigation .nav-title {
    color: #00a786;
    font-weight: 700;
    margin-right: 10px
}

@media (min-width: 1400px) {
    .navigation .nav-title {
        margin-right:20px
    }
}

.navigation .nav-menu {
    padding: 0;
    margin: 10px 0;
    display: block;
    float: left;
    padding: 0 10px;
    height: 75px;
    width: 33%;
    overflow: hidden
}

@media (min-width: 1400px) {
    .navigation .nav-menu {
        width:25%
    }
}

.navigation .nav-menu+.nav-menu {
    border-left: 1px solid #eaeaea
}

.navigation .nav-menu li {
    font-size: 13px;
    padding: 0;
    margin: 0;
    height: 25px;
    line-height: 25px;
    display: block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

.navigation .nav-menu.first {
    padding: 0
}

.navigation .nav-menu.first li {
    white-space: normal;
    text-overflow: clip;
    word-wrap: break-word;
    font-size: 17px;
    width: 80%;
    margin: 10px auto;
    height: 56px;
    line-height: 28px;
    text-align: center
}

.navigation .nav-menu.first li a {
    color: #ff5d55
}

.navigation .nav-menu .nav-menu-item {
    color: #333
}

.navigation .nav-menu .nav-menu-item.hot {
    color: #ff5d55
}

.user-card {
    margin-top: 15px;
    background: #fff;
    padding: 50px 0 10px;
    box-shadow: 0 2px 3px #e7e7e7;
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
    position: relative;
    height: 225px
}

.user-card .user-attention {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    height: 120px;
    text-align: center
}

.user-card .user-attention a {
    color: #777;
    line-height: 30px;
    font-size: 12px
}

.user-card .user-attention .att-pic {
    display: block;
    height: 90px;
    background: #f6f7f8 50% no-repeat;
    background-size: cover
}

.user-card .user-name {
    font-size: 14px;
    text-align: center;
    font-weight: 700
}

.user-card .user-pt-wrp {
    background: #48bfa8;
    position: absolute;
    top: 50%;
    margin-top: -28px;
    right: -6px;
    left: 10px;
    padding: 3px 5px;
    border-radius: 8px 4px 4px 8px;
    height: 56px
}

.user-card .user-pt-wrp .pt-right {
    position: absolute;
    top: 5px;
    right: 18px;
    bottom: 5px
}

.user-card .user-pt-wrp .pt-right a {
    width: 35px;
    height: 50px;
    display: block;
    float: left;
    color: #fff;
    text-align: center;
    font-size: 12px
}

.user-card .user-pt-wrp .pt-right a:active,.user-card .user-pt-wrp .pt-right a:focus,.user-card .user-pt-wrp .pt-right a:hover {
    text-decoration: none
}

.user-card .user-pt-wrp .pt-right a:hover {
    opacity: .8
}

.user-card .user-pt-wrp .pt-right a i {
    margin-top: -3px
}

.user-card .user-pt-wrp .pt-right a+a {
    margin-left: 10px
}

.user-card .user-pt-wrp .pt-left {
    position: relative
}

.user-card .user-pt-wrp .pt-left .pt-number {
    display: block;
    font-size: 13px;
    height: 25px;
    line-height: 25px;
    max-width: 90px;
    color: #fff;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.user-card .user-pt-wrp .pt-left .pt-number i {
    margin-right: 3px
}

.user-card .user-bell {
    position: absolute;
    left: 16px;
    top: 8px
}

.user-card .user-bell .user-bell-counter {
    width: 18px;
    border-radius: 100%;
    height: 18px;
    line-height: 18px;
    font-size: 9px;
    font-weight: 700;
    position: absolute;
    text-align: center;
    color: #fff;
    background: #ff5d55;
    right: -6px;
    top: -6px
}

.user-card .user-exit {
    position: absolute;
    right: 16px;
    top: 8px
}

.user-card .user-menu {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 10px;
    height: 60px;
    padding: 0
}

.user-card .user-menu li {
    list-style: none;
    float: left;
    height: 30px;
    line-height: 30px;
    width: 50%;
    padding-left: 15px;
    display: block
}

.user-card .user-menu li a {
    font-size: 12px;
    color: #666
}

.user-card .user-menu li a i {
    margin-right: 3px
}

.user-card .user-menu li a:active,.user-card .user-menu li a:focus,.user-card .user-menu li a:hover {
    text-decoration: none
}

.user-card .user-menu li a:hover {
    opacity: .8
}

.user-card .user-hint {
    color: #777;
    font-size: 13px;
    text-align: center
}

.user-card .user-hint a {
    font-weight: 700
}

.user-card .user-hint+.user-hint {
    margin-top: 2px
}

.user-card .user-avatar {
    border-radius: 100%;
    background: #fff;
    position: absolute;
    top: -15px;
    left: 50%;
    margin-left: -30px;
    width: 60px;
    height: 60px;
    display: block
}

.user-card .user-avatar img {
    display: block;
    box-shadow: inset 0 0 4px #e7e7e7;
    position: absolute;
    top: 4px;
    left: 4px;
    width: 52px;
    height: 52px
}

.categories {
    height: 1190px
}

.categories,.categories .l-side {
    position: relative
}

.categories .l-side.loading .loader {
    visibility: visible;
    opacity: 1
}

.categories .l-side .loader {
    transition: opacity 1s;
    background: hsla(0,0%,90%,.7) url(/static/img/loading.5d941cc.gif) no-repeat 50%;
    border-radius: 4px;
    position: absolute;
    z-index: 999;
    opacity: 0;
    visibility: hidden;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0
}

.categories .book-list-wrapper {
    overflow: hidden;
    height: 490px
}

.categories .book-list-wrapper+.book-list-wrapper {
    border-top: 1px solid #eee;
    margin-top: 25px;
    padding-top: 35px
}

@media (min-width: 1400px) {
    .categories .book-list-wrapper {
        height:510px
    }

    .categories .book-list-wrapper+.book-list-wrapper {
        height: 550px
    }
}

.categories .list-filter a:focus,.categories .list-filter a:hover {
    text-decoration: none
}

.categories .list-filter .picker {
    position: relative;
    margin-bottom: 16px
}

.categories .list-filter .picker .picker-list {
    background: #fff
}

.categories .list-filter .picker .picker-list,.categories .list-filter .picker .picker-list li,.categories .list-filter .picker .picker-list ul {
    padding: 0;
    list-style: none;
    display: block
}

.categories .list-filter .picker .picker-list:after,.categories .list-filter .picker .picker-list:before {
    content: " ";
    display: table
}

.categories .list-filter .picker .picker-list:after {
    clear: both
}

.categories .list-filter .picker .picker-list li {
    float: left;
    cursor: pointer;
    color: #777;
    font-size: 14px;
    height: 40px;
    line-height: 40px;
    padding: 0 8px
}

.categories .list-filter .picker .picker-list li.active {
    background: #00a786;
    color: #fff;
    cursor: default
}

@media (min-width: 1400px) {
    .categories .list-filter .picker .picker-list li {
        padding:0 20px
    }
}

.categories .list-filter .picker .picker-list li.pull-right {
    font-size: 16px;
    font-weight: 700;
    color: #00a786;
    float: right;
    padding-right: 10px
}

.categories .list-filter .picker .picker-list li.pull-right i {
    margin-top: -4px
}

.categories .list-filter .picker .picker-bar {
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    background: #00a786;
    position: absolute;
    left: 0;
    right: 0;
    height: 6px;
    bottom: -6px
}

.categories .list-filter .checker {
    height: 22px;
    margin-bottom: 17px;
    font-size: 13px;
    color: #777
}

.categories .list-filter .checker:after,.categories .list-filter .checker:before {
    content: " ";
    display: table
}

.categories .list-filter .checker:after {
    clear: both
}

.categories .list-filter .checker .pull-right {
    padding-right: 10px
}

.categories .list-filter .checker span {
    padding: 0 17px;
    display: block;
    line-height: 22px;
    float: left
}

.categories .list-filter .checker span.check-box {
    padding-right: 5px;
    cursor: pointer;
    background: url(/static/img/checkbox-2.c80cde4.png) 2px 2px no-repeat;
    padding-left: 30px
}

.categories .list-filter .checker span.check-box.active {
    background-image: url(/static/img/checkbox.bd361e4.png);
    color: #00a786;
    cursor: default
}

.categories .list-filter .checker span.check-box+.check-box {
    margin-left: 10px
}

@media (min-width: 1400px) {
    .categories .list-filter .checker span.check-box+.check-box {
        margin-left:20px
    }
}

.categories .list-filter .checker span.radio-box {
    padding-right: 5px;
    cursor: pointer;
    background: url(/static/img/radio-2.ef17c05.png) 2px 2px no-repeat;
    padding-left: 25px
}

.categories .list-filter .checker span.radio-box.active {
    background-image: url(/static/img/radio.5a104e2.png);
    color: #00a786;
    cursor: default
}

.categories .list-filter .checker span.radio-box+.radio-box {
    margin-left: 10px
}

.categories .list-filter .checker .label {
    margin-right: 5px;
    line-height: 20px;
    font-size: 15px;
    font-weight: 700;
    padding: 0 8px;
    color: #00a786
}

@media (min-width: 1400px) {
    .categories .list-filter .checker .label {
        padding:0 20px
    }
}

.index-hot .hot-topics {
    height: 490px;
    position: relative;
    overflow: hidden
}

@media (min-width: 1400px) {
    .index-hot .hot-topics {
        height:510px
    }
}

.index-hot .hot-topics.loading .loader {
    visibility: visible;
    opacity: 1
}

.index-hot .hot-topics .loader {
    transition: opacity 1s;
    background: hsla(0,0%,90%,.7) url(/static/img/loading.5d941cc.gif) no-repeat 50%;
    border-radius: 4px;
    position: absolute;
    z-index: 999;
    opacity: 0;
    visibility: hidden;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0
}

.index-hot .hot-topics .topic-list,.index-hot .hot-topics .topic-list li,.index-hot .hot-topics .topic-list ul {
    padding: 0;
    list-style: none;
    display: block
}

.index-hot .hot-topics .topic-list a:active,.index-hot .hot-topics .topic-list a:focus,.index-hot .hot-topics .topic-list a:hover {
    text-decoration: none
}

.index-hot .hot-topics .topic-list:after,.index-hot .hot-topics .topic-list:before {
    content: " ";
    display: table
}

.index-hot .hot-topics .topic-list:after {
    clear: both
}

.index-hot .hot-topics .topic-list .book-item.topic-picker {
    padding: 0 9px;
    position: relative
}

@media (min-width: 1400px) {
    .index-hot .hot-topics .topic-list .book-item.topic-picker {
        padding:0 7.5px
    }
}

@media (min-width: 1600px) {
    .index-hot .hot-topics .topic-list .book-item.topic-picker {
        padding:0 13.5px
    }
}

.index-hot .hot-topics .topic-list .book-item.topic-picker .topic-bar {
    left: 9px;
    top: 0;
    width: 6px;
    position: absolute;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    background: #00a786;
    height: 240px
}

@media (min-width: 1400px) {
    .index-hot .hot-topics .topic-list .book-item.topic-picker .topic-bar {
        left:7.5px
    }
}

@media (min-width: 1600px) {
    .index-hot .hot-topics .topic-list .book-item.topic-picker .topic-bar {
        left:13.5px
    }
}

.index-hot .hot-topics .topic-list .book-item.topic-picker .topic-picker-list {
    margin-left: 10px;
    height: 240px;
    background: #fff;
    position: relative
}

.index-hot .hot-topics .topic-list .book-item.topic-picker .topic-picker-list li {
    height: 40px;
    line-height: 40px;
    overflow: hidden
}

.index-hot .hot-topics .topic-list .book-item.topic-picker .topic-picker-list li:hover {
    opacity: .7;
    background: #fafafa
}

.index-hot .hot-topics .topic-list .book-item.topic-picker .topic-picker-list li a,.index-hot .hot-topics .topic-list .book-item.topic-picker .topic-picker-list li span {
    height: 40px;
    line-height: 40px;
    display: block;
    color: #666;
    padding: 0 13px;
    font-size: 14px;
    cursor: pointer;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.index-hot .hot-topics .topic-list .book-item.topic-picker .topic-picker-list li.active {
    margin-left: -8px;
    background: #00a786
}

.index-hot .hot-topics .topic-list .book-item.topic-picker .topic-picker-list li.active a,.index-hot .hot-topics .topic-list .book-item.topic-picker .topic-picker-list li.active span {
    cursor: default;
    padding-left: 20px;
    color: #fff
}

.index-hot .hot-topics .topic-list .book-item.topic-picker .topic-picker-list li.active:hover {
    opacity: 1
}

.index-hot .hot-topics .topic-list .book-item.topic-picker .topic-picker-list .topic-picker-all {
    height: 40px;
    line-height: 40px
}

.index-hot .hot-topics .topic-list .book-item.topic-picker .topic-picker-list .topic-picker-all i {
    margin-top: -3px
}

.index-hot .hot-topics .topic-list .book-item.topic-picker .topic-picker-list .topic-picker-all a {
    height: 40px;
    line-height: 40px;
    font-size: 16px;
    font-weight: 700;
    display: block;
    color: #00a786
}

.featured-book {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    background: #fff;
    margin-right: 10px;
    box-shadow: 0 2px 3px #e7e7e7;
    height: 140px;
    margin-top: 25px;
    position: relative
}

.featured-book a:active,.featured-book a:focus,.featured-book a:hover {
    text-decoration: none
}

.featured-book li,.featured-book ul {
    padding: 0;
    margin: 0;
    list-style: none;
    display: block
}

.featured-book .featured-book-list:after,.featured-book .featured-book-list:before {
    content: " ";
    display: table
}

.featured-book .featured-book-list:after {
    clear: both
}

.featured-book .featured-book-list li {
    width: 100%;
    transition: opacity 1s;
    opacity: 0;
    visibility: hidden;
    height: 140px;
    position: absolute;
    display: block;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0
}

.featured-book .featured-book-list li a {
    display: block;
    top: 0;
    left: 0;
    right: 0;
    bottom: 25px;
    padding: 10px 10px 0;
    position: absolute
}

.featured-book .featured-book-list li.active {
    visibility: visible;
    opacity: 1
}

.featured-book .featured-book-list li .book-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    display: block;
    color: #333;
    width: 120px;
    font-size: 13px;
    font-weight: 700
}

.featured-book .featured-book-list li .book-about {
    color: #333;
    width: 120px;
    max-height: 70px;
    overflow: hidden;
    display: block;
    margin-top: 10px;
    font-size: 12px
}

.featured-book .featured-book-list li .book-cover {
    display: block;
    position: absolute;
    width: 60px;
    height: 90px;
    top: 25px;
    right: -10px
}

.featured-book .featured-book-tabs {
    position: absolute;
    bottom: 10px;
    left: 10px
}

.featured-book .featured-book-tabs:after,.featured-book .featured-book-tabs:before {
    content: " ";
    display: table
}

.featured-book .featured-book-tabs:after {
    clear: both
}

.featured-book .featured-book-tabs li {
    float: left;
    width: 10px;
    height: 10px;
    border-radius: 100%;
    background: #eee;
    position: relative;
    cursor: pointer
}

.featured-book .featured-book-tabs li+li {
    margin-left: 8px
}

.featured-book .featured-book-tabs li i {
    border-radius: 100%;
    display: block;
    position: absolute;
    top: 1px;
    left: 1px;
    right: 1px;
    bottom: 1px
}

.featured-book .featured-book-tabs li.active {
    cursor: default
}

.featured-book .featured-book-tabs li.active i {
    background: #fff
}

.news-list {
    margin-top: 25px;
    height: 190px
}

@media (min-width: 1400px) {
    .news-list {
        height:210px
    }
}

.news-list a {
    color: #333;
    font-size: 13px;
    display: block;
    line-height: 20px;
    position: relative;
    padding-left: 35px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.news-list a:active,.news-list a:focus,.news-list a:hover {
    text-decoration: none
}

.news-list a .label {
    padding-left: 5px;
    padding-right: 5px;
    top: 2px;
    left: 0;
    position: absolute
}

.news-list,.news-list li,.news-list ul {
    padding: 0;
    list-style: none;
    display: block
}

.news-list li+li {
    margin-top: 8px
}

@media (min-width: 1400px) {
    .news-list li+li {
        margin-top:11px
    }
}

.news-list .first a {
    padding-left: 0
}

.news-list .first .title {
    font-size: 15px;
    line-height: 20px;
    color: #00a786
}

.news-list .first .about,.news-list .first .title {
    display: block;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.news-list .first .about {
    font-size: 11px;
    color: #aaa
}

.news-list-btn {
    display: block;
    text-align: center;
    background: #fafafa;
    border: 1px solid #dadada;
    margin-top: 5px;
    font-size: 12px;
    height: 26px;
    border-radius: 4px;
    line-height: 24px;
    color: #666;
    transition: all .5s
}

.news-list-btn:hover {
    background: #fff;
    text-decoration: none;
    color: #666;
    box-shadow: none
}

.rank-list-wrp,.rank-switch-list-wrp {
    position: relative
}

.rank-list-wrp.loading .loader,.rank-switch-list-wrp.loading .loader {
    visibility: visible;
    opacity: 1
}

.rank-list-wrp .loader,.rank-switch-list-wrp .loader {
    transition: opacity 1s;
    background: hsla(0,0%,90%,.7) url(/static/img/loading.gif) no-repeat 50%;
    border-radius: 4px;
    position: absolute;
    opacity: 0;
    visibility: hidden;
    z-index: 999;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0
}

.rank-list-wrp a:active,.rank-list-wrp a:focus,.rank-list-wrp a:hover,.rank-switch-list-wrp a:active,.rank-switch-list-wrp a:focus,.rank-switch-list-wrp a:hover {
    text-decoration: none
}

.rank-list-wrp .rank-list,.rank-list-wrp .rank-list li,.rank-list-wrp .rank-list ul,.rank-list-wrp .rank-switch-list,.rank-list-wrp .rank-switch-list li,.rank-list-wrp .rank-switch-list ul,.rank-switch-list-wrp .rank-list,.rank-switch-list-wrp .rank-list li,.rank-switch-list-wrp .rank-list ul,.rank-switch-list-wrp .rank-switch-list,.rank-switch-list-wrp .rank-switch-list li,.rank-switch-list-wrp .rank-switch-list ul {
    padding: 0;
    list-style: none;
    display: block
}

.rank-list-wrp .rank-list .rank-link,.rank-list-wrp .rank-switch-list .rank-link,.rank-switch-list-wrp .rank-list .rank-link,.rank-switch-list-wrp .rank-switch-list .rank-link {
    display: block;
    height: 20px
}

.rank-list-wrp .rank-list .rank-switch,.rank-list-wrp .rank-switch-list .rank-switch,.rank-switch-list-wrp .rank-list .rank-switch,.rank-switch-list-wrp .rank-switch-list .rank-switch {
    box-shadow: 0 2px 3px #eee;
    height: 20px;
    line-height: 20px;
    margin: 15px 0;
    background: #fff
}

.rank-list-wrp .rank-list .rank-switch:after,.rank-list-wrp .rank-list .rank-switch:before,.rank-list-wrp .rank-switch-list .rank-switch:after,.rank-list-wrp .rank-switch-list .rank-switch:before,.rank-switch-list-wrp .rank-list .rank-switch:after,.rank-switch-list-wrp .rank-list .rank-switch:before,.rank-switch-list-wrp .rank-switch-list .rank-switch:after,.rank-switch-list-wrp .rank-switch-list .rank-switch:before {
    content: " ";
    display: table
}

.rank-list-wrp .rank-list .rank-switch:after,.rank-list-wrp .rank-switch-list .rank-switch:after,.rank-switch-list-wrp .rank-list .rank-switch:after,.rank-switch-list-wrp .rank-switch-list .rank-switch:after {
    clear: both
}

.rank-list-wrp .rank-list .rank-switch .rank-switch-item,.rank-list-wrp .rank-switch-list .rank-switch .rank-switch-item,.rank-switch-list-wrp .rank-list .rank-switch .rank-switch-item,.rank-switch-list-wrp .rank-switch-list .rank-switch .rank-switch-item {
    text-align: center;
    font-size: 11px;
    color: #666;
    width: 33%;
    float: left;
    display: block
}

.rank-list-wrp .rank-list .rank-switch .rank-switch-item.active,.rank-list-wrp .rank-switch-list .rank-switch .rank-switch-item.active,.rank-switch-list-wrp .rank-list .rank-switch .rank-switch-item.active,.rank-switch-list-wrp .rank-switch-list .rank-switch .rank-switch-item.active {
    background: #00a786;
    color: #fff
}

.rank-list-wrp .rank-list .rank-item,.rank-list-wrp .rank-switch-list .rank-item,.rank-switch-list-wrp .rank-list .rank-item,.rank-switch-list-wrp .rank-switch-list .rank-item {
    margin: 0;
    list-style: none;
    display: block;
    position: relative;
    height: 20px
}

.rank-list-wrp .rank-list .rank-item+.rank-item,.rank-list-wrp .rank-switch-list .rank-item+.rank-item,.rank-switch-list-wrp .rank-list .rank-item+.rank-item,.rank-switch-list-wrp .rank-switch-list .rank-item+.rank-item {
    margin-top: 15px
}

.rank-list-wrp .rank-list .rank-item .rank-no,.rank-list-wrp .rank-switch-list .rank-item .rank-no,.rank-switch-list-wrp .rank-list .rank-item .rank-no,.rank-switch-list-wrp .rank-switch-list .rank-item .rank-no {
    left: 0;
    top: 0;
    font-size: 12px;
    width: 20px;
    height: 20px;
    line-height: 20px;
    position: absolute;
    display: block;
    text-align: center;
    background: #ebebeb;
    color: #000
}

.rank-list-wrp .rank-list .rank-item .rank-name,.rank-list-wrp .rank-switch-list .rank-item .rank-name,.rank-switch-list-wrp .rank-list .rank-item .rank-name,.rank-switch-list-wrp .rank-switch-list .rank-item .rank-name {
    color: #222;
    font-size: 12px;
    line-height: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    position: absolute;
    left: 30px;
    right: 100px
}

.rank-list-wrp .rank-list .rank-item .rank-score,.rank-list-wrp .rank-switch-list .rank-item .rank-score,.rank-switch-list-wrp .rank-list .rank-item .rank-score,.rank-switch-list-wrp .rank-switch-list .rank-item .rank-score {
    font-size: 11px;
    position: absolute;
    line-height: 20px;
    color: #666;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100px;
    top: 0;
    right: 0
}

.rank-list-wrp .rank-list .rank-item .bar,.rank-list-wrp .rank-switch-list .rank-item .bar,.rank-switch-list-wrp .rank-list .rank-item .bar,.rank-switch-list-wrp .rank-switch-list .rank-item .bar {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 3px;
    height: 90px;
    background: #00a786;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px
}

.rank-list-wrp .rank-list .rank-item .rank-link.empty .rank-about,.rank-list-wrp .rank-list .rank-item .rank-link.empty .rank-name,.rank-list-wrp .rank-list .rank-item .rank-link.empty .rank-score,.rank-list-wrp .rank-switch-list .rank-item .rank-link.empty .rank-about,.rank-list-wrp .rank-switch-list .rank-item .rank-link.empty .rank-name,.rank-list-wrp .rank-switch-list .rank-item .rank-link.empty .rank-score,.rank-switch-list-wrp .rank-list .rank-item .rank-link.empty .rank-about,.rank-switch-list-wrp .rank-list .rank-item .rank-link.empty .rank-name,.rank-switch-list-wrp .rank-list .rank-item .rank-link.empty .rank-score,.rank-switch-list-wrp .rank-switch-list .rank-item .rank-link.empty .rank-about,.rank-switch-list-wrp .rank-switch-list .rank-item .rank-link.empty .rank-name,.rank-switch-list-wrp .rank-switch-list .rank-item .rank-link.empty .rank-score {
    width: 100px;
    min-height: 20px;
    border-radius: 2px;
    background: #e5e5e5
}

.rank-list-wrp .rank-list .rank-item.no-1,.rank-list-wrp .rank-switch-list .rank-item.no-1,.rank-switch-list-wrp .rank-list .rank-item.no-1,.rank-switch-list-wrp .rank-switch-list .rank-item.no-1 {
    height: 90px
}

.rank-list-wrp .rank-list .rank-item.no-1 .rank-cover,.rank-list-wrp .rank-switch-list .rank-item.no-1 .rank-cover,.rank-switch-list-wrp .rank-list .rank-item.no-1 .rank-cover,.rank-switch-list-wrp .rank-switch-list .rank-item.no-1 .rank-cover {
    box-shadow: 0 2px 3px #bbb;
    display: block;
    position: absolute;
    width: 60px;
    height: 90px;
    top: 0;
    right: 0
}

.rank-list-wrp .rank-list .rank-item.no-1 .rank-score,.rank-list-wrp .rank-switch-list .rank-item.no-1 .rank-score,.rank-switch-list-wrp .rank-list .rank-item.no-1 .rank-score,.rank-switch-list-wrp .rank-switch-list .rank-item.no-1 .rank-score {
    top: 56px;
    max-width: 80px;
    color: #ff5d55;
    display: block;
    left: 10px
}

.rank-list-wrp .rank-list .rank-item.no-1 .rank-about,.rank-list-wrp .rank-switch-list .rank-item.no-1 .rank-about,.rank-switch-list-wrp .rank-list .rank-item.no-1 .rank-about,.rank-switch-list-wrp .rank-switch-list .rank-item.no-1 .rank-about {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    position: absolute;
    font-size: 11px;
    right: 80px;
    top: 77px;
    left: 10px;
    color: #999
}

.rank-list-wrp .rank-list .rank-item.no-1 .rank-name,.rank-list-wrp .rank-switch-list .rank-item.no-1 .rank-name,.rank-switch-list-wrp .rank-list .rank-item.no-1 .rank-name,.rank-switch-list-wrp .rank-switch-list .rank-item.no-1 .rank-name {
    color: #000;
    top: 35px;
    right: 90px;
    font-size: 14px;
    font-weight: 700;
    left: 10px
}

.rank-list-wrp .rank-list .rank-item.no-1 .rank-no,.rank-list-wrp .rank-switch-list .rank-item.no-1 .rank-no,.rank-switch-list-wrp .rank-list .rank-item.no-1 .rank-no,.rank-switch-list-wrp .rank-switch-list .rank-item.no-1 .rank-no {
    font-weight: 700;
    width: auto;
    height: 25px;
    font-size: 15px;
    line-height: 25px;
    padding-right: 6px;
    padding-left: 3px;
    left: 3px;
    background: #00a786;
    color: #fff
}

.rank-list-wrp .rank-list .rank-item.no-1 .rank-link,.rank-list-wrp .rank-switch-list .rank-item.no-1 .rank-link,.rank-switch-list-wrp .rank-list .rank-item.no-1 .rank-link,.rank-switch-list-wrp .rank-switch-list .rank-item.no-1 .rank-link {
    height: 90px
}

.rank-list-wrp .rank-list .rank-item.no-1 .rank-link.empty .rank-about,.rank-list-wrp .rank-list .rank-item.no-1 .rank-link.empty .rank-name,.rank-list-wrp .rank-list .rank-item.no-1 .rank-link.empty .rank-score,.rank-list-wrp .rank-switch-list .rank-item.no-1 .rank-link.empty .rank-about,.rank-list-wrp .rank-switch-list .rank-item.no-1 .rank-link.empty .rank-name,.rank-list-wrp .rank-switch-list .rank-item.no-1 .rank-link.empty .rank-score,.rank-switch-list-wrp .rank-list .rank-item.no-1 .rank-link.empty .rank-about,.rank-switch-list-wrp .rank-list .rank-item.no-1 .rank-link.empty .rank-name,.rank-switch-list-wrp .rank-list .rank-item.no-1 .rank-link.empty .rank-score,.rank-switch-list-wrp .rank-switch-list .rank-item.no-1 .rank-link.empty .rank-about,.rank-switch-list-wrp .rank-switch-list .rank-item.no-1 .rank-link.empty .rank-name,.rank-switch-list-wrp .rank-switch-list .rank-item.no-1 .rank-link.empty .rank-score {
    min-width: 50px;
    min-height: 10px;
    border-radius: 2px
}

.rank-list-wrp .rank-list .rank-item.no-1 .rank-link.empty .rank-about,.rank-list-wrp .rank-list .rank-item.no-1 .rank-link.empty .rank-cover,.rank-list-wrp .rank-list .rank-item.no-1 .rank-link.empty .rank-name,.rank-list-wrp .rank-list .rank-item.no-1 .rank-link.empty .rank-score,.rank-list-wrp .rank-switch-list .rank-item.no-1 .rank-link.empty .rank-about,.rank-list-wrp .rank-switch-list .rank-item.no-1 .rank-link.empty .rank-cover,.rank-list-wrp .rank-switch-list .rank-item.no-1 .rank-link.empty .rank-name,.rank-list-wrp .rank-switch-list .rank-item.no-1 .rank-link.empty .rank-score,.rank-switch-list-wrp .rank-list .rank-item.no-1 .rank-link.empty .rank-about,.rank-switch-list-wrp .rank-list .rank-item.no-1 .rank-link.empty .rank-cover,.rank-switch-list-wrp .rank-list .rank-item.no-1 .rank-link.empty .rank-name,.rank-switch-list-wrp .rank-list .rank-item.no-1 .rank-link.empty .rank-score,.rank-switch-list-wrp .rank-switch-list .rank-item.no-1 .rank-link.empty .rank-about,.rank-switch-list-wrp .rank-switch-list .rank-item.no-1 .rank-link.empty .rank-cover,.rank-switch-list-wrp .rank-switch-list .rank-item.no-1 .rank-link.empty .rank-name,.rank-switch-list-wrp .rank-switch-list .rank-item.no-1 .rank-link.empty .rank-score {
    background: #e5e5e5
}

.rank-list-wrp .rank-list .rank-item.no-2 .rank-no,.rank-list-wrp .rank-switch-list .rank-item.no-2 .rank-no,.rank-switch-list-wrp .rank-list .rank-item.no-2 .rank-no,.rank-switch-list-wrp .rank-switch-list .rank-item.no-2 .rank-no {
    background: #48bfa8;
    color: #fff
}

.rank-list-wrp .rank-list .rank-item.no-3 .rank-no,.rank-list-wrp .rank-switch-list .rank-item.no-3 .rank-no,.rank-switch-list-wrp .rank-list .rank-item.no-3 .rank-no,.rank-switch-list-wrp .rank-switch-list .rank-item.no-3 .rank-no {
    background: #69cbb8;
    color: #fff
}

.rank-list-wrp .rank-list.no-score .rank-score,.rank-list-wrp .rank-switch-list.no-score .rank-score,.rank-switch-list-wrp .rank-list.no-score .rank-score,.rank-switch-list-wrp .rank-switch-list.no-score .rank-score {
    display: none!important
}

.rank-list-wrp .rank-list.no-score .rank-name,.rank-list-wrp .rank-switch-list.no-score .rank-name,.rank-switch-list-wrp .rank-list.no-score .rank-name,.rank-switch-list-wrp .rank-switch-list.no-score .rank-name {
    right: 0
}

.rank-list-wrp .rank-list.no-score .no-1 .rank-name,.rank-list-wrp .rank-switch-list.no-score .no-1 .rank-name,.rank-switch-list-wrp .rank-list.no-score .no-1 .rank-name,.rank-switch-list-wrp .rank-switch-list.no-score .no-1 .rank-name {
    white-space: normal;
    top: 30px;
    height: 40px;
    line-height: 20px
}

lesshat-selector {
    -lh-property: 0
}

@keyframes reload-cycle {
    0% {
        -webkit--webkit-transform: rotate(0deg);
        -webkit--moz-transform: rotate(0deg);
        -webkit--ms-transform: rotate(0deg);
        -webkit-transform: rotate(0deg)
    }

    to {
        -webkit--webkit-transform: rotate(1turn);
        -webkit--moz-transform: rotate(1turn);
        -webkit--ms-transform: rotate(1turn);
        -webkit-transform: rotate(1turn)
    }
}

body,html {
    min-width: 768px!important
}

@media (max-width: 768px) {
    .container {
        width:990px
    }
}

.landing {
    background: #f6f7f8;
    overflow: hidden;
    position: relative
}

.landing .mods {
    margin-bottom: 30px
}

.landing .mods:after,.landing .mods:before {
    content: " ";
    display: table
}

.landing .mods:after {
    clear: both
}

.landing .mods .r-side {
    float: right;
    width: 200px
}

.landing .mods .l-side {
    float: left;
    width: 494px
}

@media (min-width: 1400px) {
    .landing .mods .l-side {
        width:710px
    }
}

@media (min-width: 1600px) {
    .landing .mods .l-side {
        width:915px
    }
}

.landing .mods .l-side,.landing .mods .r-side {
    position: relative
}

.landing .mods .l-side>h4.title,.landing .mods .r-side>h4.title {
    margin-top: 0;
    line-height: 34px;
    font-size: 16.1px;
    font-weight: 700;
    margin-bottom: 10px
}

.landing .mods .l-side>h4.title [class*=" icon-"],.landing .mods .l-side>h4.title [class^=icon-],.landing .mods .r-side>h4.title [class*=" icon-"],.landing .mods .r-side>h4.title [class^=icon-] {
    margin-right: 2px
}

.landing .mods .l-side>h4.title a,.landing .mods .r-side>h4.title a {
    text-decoration: none
}

.landing .mods .l-side>h4.title a small,.landing .mods .r-side>h4.title a small {
    color: #00a786;
    font-size: 85%
}

.landing .mods .l-side>h4.title a:focus,.landing .mods .l-side>h4.title a:hover,.landing .mods .r-side>h4.title a:focus,.landing .mods .r-side>h4.title a:hover {
    text-decoration: none
}

.landing .mods .l-side>h4.title .title-text,.landing .mods .r-side>h4.title .title-text {
    display: inline-block
}

.landing .mods .l-side>h4.title .title-tabs,.landing .mods .r-side>h4.title .title-tabs {
    margin-left: 20px;
    display: inline-block;
    font-size: 85%
}

.landing .mods .l-side>h4.title .title-tabs a,.landing .mods .r-side>h4.title .title-tabs a {
    display: inline-block;
    font-weight: 400;
    line-height: 20px;
    color: #333;
    border-bottom: 2px solid transparent
}

.landing .mods .l-side>h4.title .title-tabs a+a,.landing .mods .r-side>h4.title .title-tabs a+a {
    margin-left: 5px
}

.landing .mods .l-side>h4.title .title-tabs a.active,.landing .mods .r-side>h4.title .title-tabs a.active {
    color: #00a786;
    border-bottom-color: #00a786
}

.landing .rank-switch-list-wrp+.suggest-item {
    margin-top: 20px
}

.landing .featured-book+.rank-switch-list-wrp {
    margin-top: 25px
}

.landing .suggest-item {
    display: block;
    height: 160px;
    position: relative;
    background: #eee 50% no-repeat;
    border-radius: 4px
}

.landing .suggest-item .marker {
    font-size: 12px;
    display: block;
    position: absolute;
    left: 5px;
    bottom: 5px;
    border-radius: 2px;
    padding: 2px 4px;
    font-weight: 700;
    background: rgba(50,50,50,.3);
    color: #fff
}

.landing .suggest-item.small {
    height: 100px
}

.landing .suggest-item.rewards-right {
    height: 300px
}

.landing .reward-books .index-book-list {
    max-height: 280px;
    overflow: hidden
}

.landing .reward-books .reward-title {
    height: 40px;
    line-height: 40px;
    margin-bottom: 20px;
    padding-left: 16px;
    position: relative;
    background: #fff;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px
}

.landing .reward-books .reward-title .reward-title-side-bar {
    width: 6px;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    background: #00a786;
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0
}

.landing .reward-books .reward-title b {
    font-size: 16px;
    color: #00a786
}

.landing .all-ranks {
    background: #fff
}

.landing .all-ranks a:active,.landing .all-ranks a:focus,.landing .all-ranks a:hover {
    text-decoration: none
}

.landing .all-ranks .rank-bar {
    margin: 30px 0 35px;
    height: 35px;
    line-height: 35px;
    position: relative
}

.landing .all-ranks .rank-bar .title {
    position: absolute;
    font-size: 18px;
    color: #00a786;
    left: 0;
    top: 0;
    font-weight: 700
}

.landing .all-ranks .rank-bar .last-update {
    position: absolute;
    right: 0;
    color: #666;
    top: 0;
    font-size: 14px
}

.landing .all-ranks .rank-wrp {
    position: relative;
    margin-bottom: 30px
}

.landing .all-ranks .rank-wrp.loading .loader {
    visibility: visible;
    opacity: 1
}

.landing .all-ranks .rank-wrp .loader {
    transition: opacity 1s;
    background: hsla(0,0%,90%,.7) url(/static/img/loading.5d941cc.gif) no-repeat 50%;
    border-radius: 4px;
    position: absolute;
    z-index: 999;
    opacity: 0;
    visibility: hidden;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0
}

.landing .all-ranks .rank-wrp:after,.landing .all-ranks .rank-wrp:before {
    content: " ";
    display: table
}

.landing .all-ranks .rank-wrp:after {
    clear: both
}

.landing .all-ranks .rank-wrp .loader {
    z-index: 9999
}

.landing .all-ranks .rank-switch {
    position: absolute;
    width: 150px;
    left: 50%;
    margin-left: -75px
}

.landing .all-ranks .rank-switch:after,.landing .all-ranks .rank-switch:before {
    content: " ";
    display: table
}

.landing .all-ranks .rank-switch:after {
    clear: both
}

.landing .all-ranks .rank-switch .rank-switch-item {
    position: relative;
    cursor: pointer;
    text-align: center;
    font-size: 14px;
    color: #666;
    width: 50%;
    float: left;
    display: block
}

.landing .all-ranks .rank-switch .rank-switch-item.active {
    color: #00a786
}

.landing .all-ranks .rank-switch .rank-switch-item.active:after {
    background: #00a786;
    width: 4px;
    height: 4px;
    position: absolute;
    border-radius: 100px;
    top: 35px;
    left: 50%;
    margin-left: -2px;
    content: " "
}

.landing .all-ranks .rank-list-wrp {
    float: left;
    width: 250px
}

@media (min-width: 1400px) {
    .landing .all-ranks .rank-list-wrp {
        width:300px
    }
}

.landing .all-ranks .rank-list-wrp+.rank-list-wrp {
    margin-left: 220px
}

@media (min-width: 1400px) {
    .landing .all-ranks .rank-list-wrp,.landing .all-ranks .rank-list-wrp+.rank-list-wrp {
        margin-left:113.33333333px
    }
}

@media (min-width: 1600px) {
    .landing .all-ranks .rank-list-wrp,.landing .all-ranks .rank-list-wrp+.rank-list-wrp {
        margin-left:180px
    }
}

.none-padding {
    padding: 0!important
}

.none-margin {
    margin: 0!important
}

.autocomplete-suggestions {
    border: 1px solid #00a786;
    background: #fff;
    overflow: auto;
    margin-top: -1px
}

.autocomplete-suggestions strong {
    font-weight: 700;
    color: #00a786;
    margin: 0 2px
}

.autocomplete-suggestions .autocomplete-selected {
    background: #f0f0f0
}

.autocomplete-suggestions .autocomplete-group {
    padding: 2px 5px
}

.autocomplete-suggestions .autocomplete-group strong {
    display: block;
    border-bottom: 1px solid #000
}

.autocomplete-suggestions .autocomplete-suggestion {
    padding: 5px 8px;
    white-space: nowrap;
    overflow: hidden
}

.autocomplete-suggestions .autocomplete-suggestion+.autocomplete-suggestion {
    border-top: 1px solid #eee
}

.works-grid,.works-grid .grid {
    position: relative
}

.works-grid .grid .desc {
    display: none
}

.works-grid .grid a {
    color: #333
}

.works-grid .grid a:active,.works-grid .grid a:focus,.works-grid .grid a:hover {
    text-decoration: none;
    border-color: transparent
}

.works-grid .grid .thumbnail {
    display: block;
    color: #333;
    margin-bottom: 10px
}

@media (max-width: 767px) {
    .works-grid .grid .thumbnail {
        width:100%;
        margin: 0 auto 10px
    }
}

@media (max-width: 768px) {
    .works-grid .grid .thumbnail {
        padding:8px
    }
}

.works-grid .grid .thumbnail .cover {
    display: block
}

@media (min-width: 1600px) {
    .works-grid .grid .thumbnail .cover {
        width:110px;
        height: 165px
    }
}

@media (max-width: 1599px) {
    .works-grid .grid .thumbnail .cover {
        width:120px;
        height: 180px
    }
}

@media (max-width: 1399px) {
    .works-grid .grid .thumbnail .cover {
        width:121px;
        height: 182px
    }
}

@media (max-width: 767px) {
    .works-grid .grid .thumbnail .cover {
        width:100%;
        height: auto
    }
}

.works-grid .grid .thumbnail .download {
    text-align: center
}

.works-grid .grid .thumbnail .download .btn {
    color: #00a786
}

.works-grid .grid .thumbnail .caption {
    padding: 6px 2px 0;
    text-align: center
}

.works-grid .grid .thumbnail .caption .title {
    height: 40px;
    margin: 0;
    overflow: hidden
}

.works-grid .grid.list-item {
    margin: 0 15px
}

.works-grid .grid.list-item+.list-item {
    padding-top: 15px;
    border-top: 1px solid #ddd
}

.works-grid .grid.list-item .thumbnail {
    position: relative;
    margin: 0;
    background: transparent;
    overflow: hidden
}

@media (min-width: 1600px) {
    .works-grid .grid.list-item .thumbnail {
        padding-left:125px;
        height: 180px
    }
}

@media (max-width: 1599px) {
    .works-grid .grid.list-item .thumbnail {
        padding-left:135px;
        height: 195px
    }
}

@media (max-width: 1399px) {
    .works-grid .grid.list-item .thumbnail {
        padding-left:136px;
        height: 197px
    }
}

@media (max-width: 767px) {
    .works-grid .grid.list-item .thumbnail {
        padding-left:115px;
        height: 180px
    }
}

.works-grid .grid.list-item .thumbnail .cover {
    display: block;
    position: absolute;
    left: 0
}

@media (min-width: 1600px) {
    .works-grid .grid.list-item .thumbnail .cover {
        width:110px;
        height: 165px
    }
}

@media (max-width: 1599px) {
    .works-grid .grid.list-item .thumbnail .cover {
        width:120px;
        height: 180px
    }
}

@media (max-width: 1399px) {
    .works-grid .grid.list-item .thumbnail .cover {
        width:121px;
        height: 182px
    }
}

@media (max-width: 767px) {
    .works-grid .grid.list-item .thumbnail .cover {
        width:100px;
        height: 150px
    }
}

.works-grid .grid.list-item .thumbnail .caption {
    text-align: left;
    position: relative
}

.works-grid .grid.list-item .thumbnail .caption .title {
    height: 30px;
    font-size: 1.35em
}

.works-grid .grid.list-item .thumbnail .caption strong.green {
    padding: 2px 4px
}

.works-grid .grid.list-item .thumbnail .caption .desc {
    display: block;
    color: gray
}

.works-grid .grid.list-item .thumbnail .caption .desc p+p {
    margin-top: 15px
}

.works-grid .grid.list-item .thumbnail .caption .desc .author {
    color: #00a786
}

.works-grid .grid.list-item .thumbnail .caption .desc .intro {
    position: relative;
    overflow: hidden;
    padding-left: 52px;
    max-height: 40px
}

.works-grid .grid.list-item .thumbnail .caption .desc .intro .descs {
    position: absolute;
    left: 0
}

.works-grid .grid .info {
    margin-bottom: 30px;
    height: 30px;
    line-height: 30px
}

@media (max-width: 767px) {
    .works-grid .grid .info {
        width:136px;
        margin: 0 auto 30px
    }
}

.works-grid .grid .info .avatar {
    width: 24px;
    height: 24px;
    display: inline-block;
    vertical-align: middle;
    margin-top: -4px;
    margin-right: .2em;
    border-radius: 360px
}

.wrapper {
    position: relative
}

.wrapper .search-bar {
    padding-top: 150px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 99
}

.wrapper .search-box input {
    border-radius: 0
}

.wrapper .search-box input[type=text] {
    padding-left: 30px;
    border-color: #00a786;
    border-right: 0
}

.wrapper .search-box .icon-search {
    position: absolute;
    top: 10px;
    left: 6px
}

.wrapper .search-box .none-padding {
    padding: 0
}

.wrapper .search-box .none-padding-right {
    padding-right: 0
}

@media (max-width: 768px) {
    .wrapper .search-box .padding-sm {
        padding:15px 15px 0;
        background: #f5f5f5
    }
}

@media (min-width: 768px) {
    .wrapper {
        background:url(/static/img/head-banner.ab5683f.jpg) top no-repeat;
        margin: 0 auto;
        padding-top: 200px
    }

    .wrapper.non-bg {
        background: #f5f5f5;
        padding-top: 0
    }
}

@media (max-width: 768px) {
    .wrapper .search-bar {
        padding:0;
        position: relative
    }
}

.wrapper>.content {
    position: relative;
    background: #fff;
    overflow: hidden
}

@media (min-width: 768px) {
    .wrapper>.content {
        min-height:600px
    }
}

@media (max-width: 767px) {
    .wrapper>.content {
        background:#f5f5f5
    }
}

.wrapper>.content h4.title {
    margin-top: 0;
    line-height: 34px;
    font-size: 16.1px;
    font-weight: 700;
    margin-bottom: 20px
}

.wrapper>.content h4.title [class*=" icon-"],.wrapper>.content h4.title [class^=icon-] {
    margin-right: 2px
}

.wrapper>.content .l-side {
    padding: 15px 35px
}

@media (max-width: 767px) {
    .wrapper>.content .l-side {
        padding:15px
    }
}

.wrapper>.content .articles-content {
    padding: 15px 35px
}

.wrapper>.content .r-side {
    font-size: 13.3px;
    background: url(/static/img/gradient-background.6a5fc56.png) 0 repeat-y;
    margin-bottom: -99999px;
    padding: 15px 25px 99999px
}

@media (max-width: 1399px) {
    .wrapper>.content .r-side {
        padding:15px 15px 99999px
    }
}

@media (max-width: 767px) {
    .wrapper>.content .r-side {
        background:none;
        padding: 0 15px 99999px
    }
}

.wrapper>.content .r-side .block+.block {
    margin-top: 10px
}

.wrapper>.content .r-side .covered-works {
    color: #333
}

.wrapper>.content .r-side .covered-works .title {
    margin-top: 0;
    font-weight: 400;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    color: #333
}

.wrapper>.content .r-side .covered-works .right {
    padding-left: 0
}

@media (max-width: 1399px) and (min-width:767px) {
    .wrapper>.content .r-side .covered-works .right {
        text-align:center;
        padding: 0
    }
}

.wrapper>.content .r-side .covered-works .hint {
    color: #a9a9a9
}

.wrapper>.content .r-side .covered-works .work-cover {
    width: 100%;
    display: block
}

.wrapper>.content .r-side .title {
    margin-bottom: 5px
}

.wrapper>.content .r-side .qr .title {
    margin-bottom: 20px
}

@media (max-width: 1400px) {
    .wrapper>.content .r-side .qr {
        display:none
    }
}

textarea {
    resize: none;
    overflow-y: auto!important
}

.chapter-info {
    text-align: center
}

.chapter-info .book-cover {
    display: block;
    margin: 30px auto 0;
    height: auto;
    max-width: 100px;
    max-height: 200px
}

.chapter-tab form.publishChapterForm,.chapter-tab form.removeChapterForm {
    display: inline
}

.chapter-tab .chapter-tab-title {
    color: #333
}

.chapter-tab .chapter-tab-title:hover {
    text-decoration: none
}

.chapter-tab .status {
    color: #a9a9a9;
    font-size: .85em;
    margin-top: 5px
}

.chapter-tab .status .primary {
    color: #00a786
}

.chapter-tab .status .danger {
    color: #d9534f
}

.nav.nav-pills.nav-stacked {
    background: #fff;
    border: 1px solid #eaeaea
}

@media (max-width: 768px) {
    .nav.nav-pills.nav-stacked {
        margin-bottom:20px
    }
}

.nav.nav-pills.nav-stacked li {
    height: 50px;
    line-height: 30px
}

.nav.nav-pills.nav-stacked li a {
    color: #666
}

.nav.nav-pills.nav-stacked li.active>a {
    color: #fff
}

.r-side .nav .glyphicon {
    display: inline-block;
    width: 20px;
    padding-left: 5px;
    height: 20px;
    vertical-align: middle;
    color: #00a786;
    font-size: 14px;
    font-weight: lighter;
    text-align: center
}

.r-side .nav li.active .icon-normal {
    display: none
}

.r-side .nav li.active .icon-active {
    display: inline-block
}

.r-side .nav li.active .glyphicon {
    color: #fff
}

.r-side .nav a {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

.r-side .nav .icon-active {
    display: none
}

.images-grid .grid .thumbnail {
    margin-bottom: 10px
}

@media (max-width: 767px) {
    .images-grid .grid .thumbnail {
        width:100%;
        margin: 0 auto
    }
}

@media (max-width: 768px) {
    .images-grid .grid .thumbnail {
        padding:8px
    }
}

.images-grid .grid .caption .title {
    line-height: 40px;
    margin: 0;
    overflow: hidden
}

.images-grid .grid .caption .title>* {
    padding: 0
}

.images-grid .grid .info {
    margin-bottom: 30px;
    height: 30px;
    line-height: 30px
}

@media (max-width: 767px) {
    .images-grid .grid .info {
        width:136px;
        margin: 0 auto 30px
    }
}

@media (max-width: 767px) {
    .btn-lg-screen-sm {
        font-size:14px!important;
        font-weight: 700!important;
        padding: 11px 22px!important;
        padding: 10px 16px;
        font-size: 18px;
        line-height: 1.3333333;
        border-radius: 2px
    }
}

.book-index .sub-title {
    text-transform: uppercase
}

.book-index .row+.row {
    margin-top: 10px!important
}

.book-index .name-grid a {
    height: 30px;
    line-height: 30px;
    color: #333
}

@media (max-width: 768px) {
    .book-index .name-grid a {
        display:inline-block;
        margin-top: 10px
    }
}

.nav-cat {
    border-top: 1px solid #ddd;
    background: #ebf4f2;
    padding: 3px 15px 15px 3px;
    position: relative;
    margin-top: -8px;
    margin-bottom: 20px
}

@media (max-width: 768px) {
    .nav-cat {
        padding:0;
        background: transparent;
        border: 0;
        margin-left: -12px;
        margin-top: -20px
    }
}

.nav-cat li {
    margin-left: 12px!important;
    margin-top: 12px
}

.nav-cat li.active a {
    background: #15a785;
    border: 1px solid #15a785;
    color: #fff
}

.nav-cat li a {
    background: #fff;
    border: 1px solid #ddd;
    border-radius: 28px;
    padding: 0 15px;
    color: #333;
    line-height: 30px
}

.message-list,.notify-list {
    list-style: none;
    display: block;
    padding: 0;
    margin: 0
}

.message-list li,.notify-list li {
    list-style: none;
    display: block;
    padding: 5px 15px;
    margin: 0;
    border: 1px solid #eee
}

.message-list li h4,.notify-list li h4 {
    font-weight: 700;
    font-size: 17.5px
}

.message-list li h4 a,.notify-list li h4 a {
    color: #333
}

.message-list li h4 a:active,.message-list li h4 a:hover,.notify-list li h4 a:active,.notify-list li h4 a:hover {
    text-decoration: none
}

.message-list li h4 span,.notify-list li h4 span {
    font-weight: 400;
    font-size: 14px;
    color: #aaa
}

.message-list li+li,.notify-list li+li {
    margin-top: 10px
}

.oauth {
    background: #eee
}

.oauth .navbar-brand {
    background-position: 0;
    padding-left: 140px;
    width: 300px;
    font-size: 1.2em;
    font-weight: 600;
    text-indent: 0
}

.oauth .main-container .main-grid {
    background: #fff;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px
}

.oauth .main-container .main-grid .login-view {
    padding: 20px 0
}

@media (min-width: 1399px) {
    .oauth .main-container .main-grid .login-view .permission {
        padding-left:0
    }
}

.oauth .main-container .main-grid .login-view .permission-list {
    list-style: none;
    display: block;
    margin: 0;
    padding: 10px 0 0
}

.oauth .main-container .main-grid .login-view .permission-list li {
    border-top: 1px dashed #ddd;
    font-size: .9em;
    color: #333;
    list-style: none;
    display: block;
    margin: 0;
    padding: 5px 0
}

article {
    font-size: 14.7px;
    line-height: 27px
}

article p {
    letter-spacing: .5px;
    text-indent: 35px;
    margin: 14px auto
}

.author-book-list {
    position: relative
}

.author-book-list .l-side {
    padding-bottom: 100px!important
}

.author-book-list .works-list {
    position: relative
}

.author-book-list .works-list .work-item {
    padding: 15px 0;
    position: relative;
    transition: border-color .5s
}

.author-book-list .works-list .work-item .control-group {
    position: absolute;
    bottom: 0;
    right: 20px;
    left: 150px
}

.author-book-list .works-list .work-item .control-group>* {
    padding: 0 2px
}

.author-book-list .works-list .work-item .control-group>* .btn {
    padding: 6px 0
}

.author-book-list .works-list .work-item+.work-item {
    border-top: 1px solid #ddd
}

.author-book-list .works-list .work-item .row {
    margin: 0
}

.author-book-list .works-list .work-item .row .work-info {
    padding-left: 150px;
    min-height: 195px
}

.author-book-list .works-list .work-item .title {
    display: inline-block;
    color: #333
}

.author-book-list .works-list .work-item .title h4 {
    font-size: 1.1em;
    font-weight: 400
}

.author-book-list .works-list .work-item .hint {
    color: #999
}

.author-book-list .works-list .work-item .work-record .hint {
    margin: 10px 0;
    text-align: center
}

.author-book-list .works-list .work-item .work-record .hint a {
    color: #999
}

.author-book-list .works-list .work-item .work-record .pie-chart-wrp {
    text-align: center
}

.author-book-list .works-list .work-item .work-record .pie-chart-wrp .sub-title {
    font-weight: 700;
    margin: 20px 0
}

.author-book-list .works-list .work-item .work-record .pie-chart {
    position: relative;
    text-align: center;
    line-height: 100px;
    z-index: 2;
    display: inline-block;
    width: 100px;
    height: 100px
}

.author-book-list .works-list .work-item .work-record .pie-chart canvas {
    position: absolute;
    top: 0;
    left: 0
}

.author-book-list .works-list .work-item .work-cover {
    width: 130px;
    height: 195px;
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    padding: 1%;
    border: 1px solid #ddd
}

.author-book-list .works-list .work-item .work-cover img {
    display: block;
    width: 100%;
    height: 100%
}

.pagination {
    margin: 0 auto
}

.pagination a,.pagination span {
    padding: 4px 8px;
    margin: 6px;
    border-radius: 4px
}

.pagination .active>span {
    color: #00a786;
    background: #fff;
    border-color: #00a786
}

.pagination .disabled span {
    background: #f5f5f5;
    text-shadow: -1px -1px #fff
}

.pagination a {
    color: #666
}

.user-info .title a.pull-right {
    line-height: 34px;
    font-weight: 400;
    font-size: 12.6px
}

.user-info .tabs {
    list-style: none;
    display: block;
    padding: 0;
    margin: 0 0 15px
}

.user-info .tabs:after,.user-info .tabs:before {
    content: " ";
    display: table
}

.user-info .tabs:after {
    clear: both
}

.user-info .tabs li {
    list-style: none;
    display: block;
    margin: 0;
    padding: 0;
    float: left;
    font-size: 1.1em;
    border-bottom: 4px solid #ddd
}

.user-info .tabs li a {
    padding: 10px 40px;
    height: 40px;
    line-height: 20px;
    color: #333;
    display: block
}

.user-info .tabs li a:hover {
    text-decoration: none
}

.user-info .tabs li.active {
    border-bottom-color: #00a786
}

.user-info .user-list a {
    color: #333;
    display: block
}

.user-info .user-list a:active,.user-info .user-list a:hover {
    text-decoration: none
}

.user-info .user-list,.user-info .user-list li {
    list-style: none;
    display: block;
    margin: 0;
    padding: 0
}

.user-info .user-list li {
    position: relative;
    height: 110px;
    padding: 10px;
    padding-left: 100px;
    line-height: 45px
}

.user-info .user-list li+li {
    border-top: 1px solid #ddd
}

.user-info .user-list li .sign {
    color: #999;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden
}

.user-info .user-list li .sign strong {
    font-weight: 400;
    color: #333
}

.user-info .user-list li .img-circle {
    position: absolute;
    left: 0;
    top: 10px;
    width: 90px;
    height: 90px
}

.user-info .block.user {
    padding-top: 180px
}

@media (max-width: 767px) {
    .user-info .block.user {
        padding-top:195px
    }
}

.user-info .block.user .profile-cover {
    background: url(/static/img/profile_cover.22b302b.jpg) 50% no-repeat;
    background-size: cover;
    position: absolute;
    right: 0;
    left: 0;
    top: 0;
    height: 150px
}

.user-info .block.user .profile-cover .img-circle {
    border: 1px solid #ddd;
    width: 90px;
    height: 90px;
    position: absolute;
    bottom: -45px;
    left: 50%;
    margin-left: -45px
}

.user-info .block.user .name {
    text-align: center;
    font-size: 1.2em;
    margin: 5px 0;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

.user-info .block.user .labels {
    text-align: center
}

.user-info .block.user .labels .label {
    margin-top: -2px;
    display: inline-block;
    vertical-align: middle
}

.user-info .block.user .labels .label-author {
    background-color: #f4a029
}

.user-info .block.user .labels .label-illust {
    background-color: #6bd872
}

.user-info .block.user .labels .label-editor {
    background-color: #6dc7d4
}

.user-info .block.user .controls {
    text-align: center;
    margin: 15px 0
}

.user-info .block.user .controls .btn {
    border-radius: 24px;
    padding: 6px 18px
}

.user-info .block.profile .list,.user-info .block.profile li {
    display: block;
    list-style: none;
    margin: 0;
    padding: 0
}

.user-info .block.profile .list {
    background: #fff;
    border: 1px solid #eee
}

.user-info .block.profile .list li {
    padding: 10px;
    color: #999
}

.user-info .block.profile .list li+li {
    border-top: 1px solid #eee;
    line-height: 25px
}

.user-info .block.profile .list li strong {
    font-weight: 400;
    color: #333
}

.user-info .block.followee .user,.user-info .block.follower .user {
    text-align: center;
    line-height: 30px
}

.user-info .block.followee .user a,.user-info .block.follower .user a {
    color: #333
}

.user-info .block.followee .user .img-circle,.user-info .block.follower .user .img-circle {
    display: block;
    width: 100%
}

.user-info .block.followee .user .name,.user-info .block.follower .user .name {
    display: block;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

@media (max-width: 1399px) and (min-width:767px) {
    .user-info .block.followee .user .name,.user-info .block.follower .user .name {
        display:none
    }
}

.author-wallet .wallet-info {
    padding: 20px;
    border: 1px solid #ddd
}

.author-wallet .wallet-balance {
    color: #00a786;
    font-size: 16px
}

@media (min-width: 767px) {
    .author-wallet .withdraw-btn {
        margin-top:10px;
        float: right
    }
}

#rewardRankPopup .reward-rank-header {
    height: 80px;
    background-color: #b4e5ff;
    position: relative;
    transition: all .2s
}

#rewardRankPopup .reward-rank-header .reward-rank-logo {
    width: 60px;
    height: 60px;
    border-radius: 100px;
    position: absolute;
    top: 10px;
    display: block;
    background: url(/static/img/light-coin.27d7744.png);
    background-size: 100%;
    margin-left: -30px;
    left: 50%
}

#rewardRankPopup .reward-rank {
    height: 350px;
    overflow-y: auto;
    padding: 5px 20px 0
}

#rewardRankPopup .reward-rank a:active,#rewardRankPopup .reward-rank a:focus,#rewardRankPopup .reward-rank a:hover {
    opacity: .8;
    text-decoration: none
}

#rewardRankPopup .reward-rank .hint-wrp {
    text-align: center;
    line-height: 30px;
    color: #999
}

#rewardRankPopup .reward-rank .hint-wrp b {
    color: #4bbdff
}

#rewardRankPopup .reward-rank .reward-rank-list {
    list-style: none;
    display: block;
    padding: 0;
    margin: 5px 0
}

#rewardRankPopup .reward-rank .reward-rank-list .reward-rank-link {
    display: block;
    height: 20px
}

#rewardRankPopup .reward-rank .reward-rank-list .reward-rank-item {
    margin: 0;
    list-style: none;
    display: block;
    position: relative;
    height: 20px
}

#rewardRankPopup .reward-rank .reward-rank-list .reward-rank-item+.reward-rank-item {
    margin-top: 15px
}

#rewardRankPopup .reward-rank .reward-rank-list .reward-rank-item .rank-no {
    left: 0;
    top: 0;
    font-size: 12px;
    width: 20px;
    height: 20px;
    line-height: 20px;
    position: absolute;
    display: block;
    text-align: center;
    background: #ebebeb;
    color: #000
}

#rewardRankPopup .reward-rank .reward-rank-list .reward-rank-item .rank-nick {
    color: #000;
    font-size: 13px;
    line-height: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    position: absolute;
    left: 30px;
    right: 80px
}

#rewardRankPopup .reward-rank .reward-rank-list .reward-rank-item .rank-score {
    font-size: 11px;
    position: absolute;
    line-height: 20px;
    color: #666;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100px;
    top: 0;
    right: 0
}

#rewardRankPopup .reward-rank .reward-rank-list .reward-rank-item.no-1 .rank-no {
    background: #4bbdff;
    color: #fff
}

#rewardRankPopup .reward-rank .reward-rank-list .reward-rank-item.no-2 .rank-no {
    background: #77c9ff;
    color: #fff
}

#rewardRankPopup .reward-rank .reward-rank-list .reward-rank-item.no-3 .rank-no {
    background: #a5d7ff;
    color: #fff
}

#rewardRankPopup .modal-loading {
    background: url(/static/img/loading.5d941cc.gif) 50% no-repeat;
    position: absolute;
    opacity: 0;
    visibility: hidden;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0
}

#rewardRankPopup .modal-body {
    opacity: 1;
    position: relative;
    padding: 0 15px;
    transition: opacity .2s
}

#rewardRankPopup .modal-dialog {
    width: 250px;
    margin: 7% auto;
    position: relative
}

#rewardRankPopup .modal-content {
    overflow: hidden;
    border: none;
    border-radius: 12px
}

#rewardRankPopup .modal-content .hint {
    font-size: 12px;
    text-align: center;
    line-height: 20px;
    margin-bottom: 20px;
    color: #999
}

#rewardRankPopup .modal-controls {
    padding: 15px;
    text-align: center;
    opacity: 1;
    transition: opacity .2s
}

#rewardRankPopup .modal-controls .btn-primary {
    border: none;
    border-radius: 6px;
    background: #4bbdff;
    margin-left: 10px;
    transition: background .2s
}

#rewardRankPopup.loading .modal-loading {
    opacity: 1;
    visibility: visible
}

#rewardRankPopup.loading .modal-body,#rewardRankPopup.loading .modal-controls,#rewardRankPopup.loading .reward-rank-header {
    opacity: 0
}

#monthTicketPopup .modal-dialog {
    width: 250px;
    margin: 7% auto 0;
    position: relative
}

#monthTicketPopup .modal-loading {
    background: url(/static/img/loading.5d941cc.gif) 50% no-repeat;
    position: absolute;
    opacity: 0;
    visibility: hidden;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0
}

#monthTicketPopup hr {
    margin-top: 5px;
    margin-bottom: 5px
}

#monthTicketPopup .reward-header {
    height: 80px;
    background-color: #d4e9b1;
    position: relative;
    transition: all .2s
}

#monthTicketPopup .reward-header .reward-ticket-logo {
    width: 60px;
    height: 60px;
    border-radius: 100px;
    position: absolute;
    top: 10px;
    display: block;
    background: url(/static/img/ticket.2f246d5.png) #72bb53 50% no-repeat;
    background-size: 70%;
    margin-left: -30px;
    left: 50%
}

#monthTicketPopup .modal-body {
    opacity: 1;
    position: relative;
    padding: 0 15px;
    transition: opacity .2s;
    line-height: 30px;
    text-align: center;
    color: #999
}

#monthTicketPopup .modal-body a {
    color: #72bb53
}

#monthTicketPopup .modal-body p {
    margin: 0
}

#monthTicketPopup .modal-body b {
    color: #72bb53
}

#monthTicketPopup .modal-body b.vip {
    background: #72bb53;
    display: inline-block;
    width: 19px;
    height: 19px;
    line-height: 19px;
    border-radius: 2px;
    color: #fff
}

#monthTicketPopup .tip-wrp {
    text-align: center
}

#monthTicketPopup #selfTicketTip {
    font-size: 12px;
    margin: 10px auto 5px;
    line-height: 20px;
    padding: 0 5px;
    color: #999;
    border-radius: 4px;
    display: inline-block
}

#monthTicketPopup #selfTicketTip.danger {
    background: #fff1f0
}

#monthTicketPopup #selfTicketTip b {
    transition: color .2s;
    color: #72bb53
}

#monthTicketPopup .modal-content {
    overflow: hidden;
    border: none;
    border-radius: 12px
}

#monthTicketPopup .modal-content .hint {
    font-size: 12px;
    text-align: center;
    line-height: 20px;
    margin-bottom: 20px;
    color: #999
}

#monthTicketPopup .modal-controls {
    padding: 15px;
    text-align: center;
    opacity: 1;
    transition: opacity .2s
}

#monthTicketPopup .btn-primary {
    border: none;
    border-radius: 6px;
    background: #72bb53;
    margin-left: 10px;
    transition: background .2s
}

#rewardSuccessPopup .reward-success-header {
    height: 80px;
    background-color: #d4e9b1;
    position: relative;
    transition: all .2s
}

#rewardSuccessPopup .reward-success-header .reward-success-logo {
    width: 60px;
    height: 60px;
    border-radius: 100px;
    position: absolute;
    top: 10px;
    display: block;
    background: url(/static/img/success.ddd4d3f.png) #fff;
    background-size: 100%;
    margin-left: -30px;
    left: 50%
}

#rewardSuccessPopup .modal-body {
    opacity: 1;
    position: relative;
    padding: 15px;
    transition: opacity .2s;
    line-height: 30px;
    text-align: center;
    color: #999
}

#rewardSuccessPopup .modal-body p {
    margin: 0
}

#rewardSuccessPopup .modal-body b {
    color: #72bb53
}

#rewardSuccessPopup .modal-body b.vip {
    background: #72bb53;
    display: inline-block;
    width: 19px;
    height: 19px;
    line-height: 19px;
    border-radius: 2px;
    color: #fff
}

#rewardSuccessPopup .modal-dialog {
    width: 250px;
    margin: 7% auto 0;
    position: relative
}

#rewardSuccessPopup .modal-content {
    overflow: hidden;
    border: none;
    border-radius: 12px
}

#rewardSuccessPopup .modal-content .hint {
    font-size: 12px;
    text-align: center;
    line-height: 20px;
    margin-bottom: 20px;
    color: #999
}

#rewardSuccessPopup .modal-controls {
    padding: 0 15px 15px;
    text-align: center;
    opacity: 1;
    transition: opacity .2s
}

#rewardSuccessPopup .btn-primary {
    border: none;
    border-radius: 6px;
    background: #72bb53;
    margin-left: 10px;
    transition: background .2s
}

#rewardPopup .modal-dialog {
    width: 250px;
    margin: 7% auto 0;
    position: relative
}

#rewardPopup .modal-loading {
    background: url(/static/img/loading.5d941cc.gif) 50% no-repeat;
    position: absolute;
    opacity: 0;
    visibility: hidden;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0
}

#rewardPopup .reward-choose {
    height: 80px;
    background-color: #b4e5ff;
    position: relative;
    transition: all .2s
}

#rewardPopup .reward-choose .reward-item {
    width: 60px;
    height: 60px;
    position: absolute;
    top: 10px;
    display: block
}

#rewardPopup .reward-choose .reward-item.item-a {
    background: url(/static/img/light-coin.27d7744.png);
    background-size: 100%;
    margin-left: -75px;
    left: 50%
}

#rewardPopup .reward-choose .reward-item.item-b {
    background: url(/static/img/ink-points.2bb3978.png);
    background-size: 100%;
    margin-left: 15px;
    left: 50%
}

#rewardPopup .reward-choose:after {
    bottom: 0;
    left: 50%;
    content: " ";
    height: 0;
    width: 0;
    transition: all .2s;
    position: absolute;
    pointer-events: none;
    border: 11px solid hsla(0,0%,100%,0);
    border-bottom-color: #fff;
    margin-left: -55px
}

#rewardPopup .tip-wrp {
    text-align: center
}

#rewardPopup #selfCreditTip {
    font-size: 12px;
    margin: 10px auto 5px;
    line-height: 20px;
    padding: 0 5px;
    color: #999;
    border-radius: 4px;
    display: inline-block
}

#rewardPopup #selfCreditTip.danger {
    background: #fff1f0
}

#rewardPopup #selfCreditTip a {
    color: #4bbdff
}

#rewardPopup #selfCreditTip b {
    transition: color .2s;
    color: #4bbdff
}

#rewardPopup .modal-body {
    opacity: 1;
    position: relative;
    padding: 0 15px;
    transition: opacity .2s
}

#rewardPopup .choose-numbers {
    position: relative;
    text-align: center;
    margin-bottom: 15px
}

#rewardPopup .choose-numbers:after,#rewardPopup .choose-numbers:before {
    content: " ";
    display: table
}

#rewardPopup .choose-numbers:after {
    clear: both
}

#rewardPopup .choose-numbers .reward-radio.checked+.reward-radio-label {
    color: #4bbdff
}

#rewardPopup .choose-numbers .reward-radio.checked+.reward-radio-label .radio-icon {
    border: 2px solid #4bbdff
}

#rewardPopup .choose-numbers .reward-radio.checked+.reward-radio-label .radio-icon-dot {
    background: #4bbdff
}

#rewardPopup .choose-numbers .reward-radio-label {
    position: relative;
    text-align: center;
    display: block;
    float: left;
    line-height: 20px;
    font-size: 12px;
    font-weight: 400;
    padding-left: 10%;
    width: 33%;
    color: #999;
    margin: 10px 0
}

#rewardPopup .choose-numbers .reward-radio-label .radio-icon {
    position: absolute;
    top: 2px;
    left: 5px;
    display: inline-block;
    border: 2px solid #ddd;
    width: 16px;
    height: 16px;
    border-radius: 100%
}

#rewardPopup .choose-numbers .reward-radio-label .radio-icon .radio-icon-dot {
    display: block;
    position: absolute;
    left: 2px;
    top: 2px;
    background: #ddd;
    width: 8px;
    height: 8px;
    border-radius: 100%
}

#rewardPopup .modal-content {
    overflow: hidden;
    border: none;
    border-radius: 12px
}

#rewardPopup .modal-content .hint {
    font-size: 12px;
    text-align: center;
    line-height: 20px;
    margin-bottom: 20px;
    color: #999
}

#rewardPopup .modal-controls {
    padding: 0 15px 15px;
    text-align: center;
    opacity: 1;
    transition: opacity .2s
}

#rewardPopup .btn-primary {
    border: none;
    border-radius: 6px;
    background: #4bbdff;
    margin-left: 10px;
    transition: background .2s
}

#rewardPopup.side-b .reward-choose {
    background: #d4e9b1
}

#rewardPopup.side-b .reward-choose:after {
    margin-left: 35px
}

#rewardPopup.side-b #selfCreditTip a,#rewardPopup.side-b #selfCreditTip b {
    color: #72bb53
}

#rewardPopup.side-b .btn-primary {
    background: #72bb53
}

#rewardPopup.loading .reward-choose {
    opacity: 0
}

#rewardPopup.loading .modal-loading {
    opacity: 1;
    visibility: visible
}

#rewardPopup.loading .modal-body,#rewardPopup.loading .modal-controls {
    opacity: 0
}

@media (max-width: 768px) {
    .book-info-wrapper .padding-sm {
        background:#00a786!important
    }
}

.book-info .brand-bg {
    position: absolute;
    z-index: 0;
    left: 0;
    right: 0;
    height: 130px
}

.book-info .works-title {
    margin-top: 0;
    font-size: 24px
}

.book-info .controls {
    position: absolute;
    bottom: 0
}

.book-info .last-update {
    color: grey;
    font-size: 13px
}

@media (min-width: 480px) {
    .book-info .last-update {
        margin-left:10px
    }
}

.book-info .r-side .sign-marker {
    display: block;
    left: 25px;
    height: 25px;
    line-height: 25px;
    color: #fff;
    padding: 0 5px;
    background: #ff666b
}

@media (min-width: 480px) {
    .book-info .r-side .sign-marker {
        position:absolute;
        top: 0;
        display: inline-block;
        border-bottom-left-radius: 2px;
        border-bottom-right-radius: 2px
    }
}

.book-info .r-side .sign-marker.site-sign {
    background-color: #f0ad4e
}

.book-info .r-side .sign-marker.authorize {
    background-color: #7dc5fc
}

.book-info .r-side .sign-marker.wiki {
    background-color: #5cb85c
}

@media (max-width: 1399px) {
    .book-info .r-side .work-cover {
        width:80%!important;
        display: block;
        margin: 0 auto
    }
}

@media (max-width: 1399px) and (max-width:767px) {
    .book-info .r-side .work-cover {
        margin:inherit
    }
}

.book-info .info {
    position: relative
}

.book-info .info .cover {
    padding: 3px;
    border: 1px solid #eee
}

.book-info .info .cover img {
    display: block;
    width: 100%;
    height: 100%
}

@media (min-width: 1600px) {
    .book-info .info .cover {
        width:179px;
        height: 269px
    }
}

@media (max-width: 1599px) {
    .book-info .info .cover {
        width:199px;
        height: 299px
    }
}

@media (max-width: 1399px) {
    .book-info .info .cover {
        width:141px;
        height: 212px
    }
}

@media (max-width: 767px) {
    .book-info .info .cover {
        width:auto;
        height: auto;
        padding: 0;
        margin-right: -15px;
        border: 1px solid transparent
    }

    .book-info .info .cover img {
        height: auto
    }
}

.book-info .info .about {
    position: relative;
    overflow: hidden;
    margin-bottom: 50px
}

@media (min-width: 1600px) {
    .book-info .info .about .text-content-wrapper {
        max-height:100px
    }
}

@media (max-width: 1599px) {
    .book-info .info .about .text-content-wrapper {
        max-height:140px
    }
}

@media (max-width: 1399px) {
    .book-info .info .about .text-content-wrapper {
        max-height:20px
    }
}

@media (max-width: 767px) {
    .book-info .info .about .text-content-wrapper {
        max-height:40px
    }
}

@media (min-width: 767px) {
    .book-info .info .about {
        padding-left:41px
    }
}

.book-info .info label {
    font-weight: 400;
    margin-right: 5px
}

.book-info .info label.desc-label {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0
}

@media (max-width: 767px) {
    .book-info .info label.desc-label {
        display:none
    }
}

.book-info .info p {
    margin: 10px auto
}

@media (min-width: 767px) {
    .book-info .info p {
        margin:0 auto 5px
    }
}

.book-info .info .desc,.book-info .info .status {
    color: grey
}

.book-info .info .status p {
    margin: 0
}

.book-info .panel-index {
    margin-top: 35px
}

.book-info .panel-heading {
    position: relative
}

.book-info .panel-heading.primary {
    color: #00a786
}

.book-info .panel-heading-tab {
    position: absolute;
    left: -1px;
    top: 0;
    bottom: 0;
    background: #fff
}

.book-info .panel-heading-tab:after,.book-info .panel-heading-tab:before {
    content: " ";
    display: table
}

.book-info .panel-heading-tab:after {
    clear: both
}

.book-info .panel-heading-tab .panel-heading-tab-item {
    float: left;
    background: #fff;
    line-height: 40px;
    height: 40px;
    padding: 0 15px;
    font-size: .9em;
    color: grey
}

.book-info .panel-heading-tab .panel-heading-tab-item+.panel-heading-tab-item {
    margin-left: 10px
}

.book-info .panel-heading-tab .panel-heading-tab-item:hover {
    text-decoration: none
}

.book-info .panel-heading-tab .panel-heading-tab-item.active {
    line-height: 40px;
    height: 49px;
    font-weight: 700;
    font-size: 1.1em;
    color: #00a786;
    border-left: 1px solid #eee;
    border-right: 1px solid #eee;
    margin-top: -8px;
    border-top: 3px solid #00a786
}

.book-info .volume-info {
    display: none;
    color: grey
}

.book-info .volume-info.active {
    display: block
}

@media (max-width: 1399px) {
    .book-info .volume-info .volume-desc,.book-info .volume-info .volume-label {
        margin:10px auto
    }
}

.book-info .volume-info>.row+.row {
    margin-top: 10px
}

.book-info .volume-info .chapter-grid {
    margin-top: -10px
}

@media (max-width: 1400px) {
    .book-info .volume-info .chapter-grid {
        margin-left:5px;
        margin-right: 5px
    }
}

.book-info .volume-info .volume-index-link {
    border-bottom: 1px dashed #eee;
    padding: 10px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

.book-info .volume-info .volume-index-link a {
    color: #666
}

.book-info .author-info .avatar {
    position: absolute;
    width: 52px;
    height: 52px;
    border-radius: 64px;
    overflow: hidden;
    left: 5px;
    top: 0
}

.book-info .author-info .avatar img {
    display: block;
    width: 100%;
    height: 100%
}

.book-info .author-info .author-box {
    color: #898989;
    padding: 5px 5px 5px 67px;
    min-height: 57px;
    position: relative
}

.book-info .author-info .author-name {
    height: 20px;
    line-height: 20px;
    margin-bottom: 5px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

@media (max-width: 1399px) {
    .book-info .author-info .author-name {
        height:auto
    }

    .book-info .author-info .author-name>span {
        display: block
    }
}

.book-info .author-info .author-follow .btn {
    padding: 2px 8px;
    font-size: .9em
}

.book-info .author-info .author-sign {
    padding: 5px 10px
}

.book-info .reward-rank a:active,.book-info .reward-rank a:focus,.book-info .reward-rank a:hover {
    opacity: .8;
    text-decoration: none
}

.book-info .reward-rank .hint-wrp {
    text-align: center
}

.book-info .reward-rank .hint {
    color: #aaa
}

.book-info .reward-rank .hint b {
    color: #00a786
}

.book-info .reward-rank .reward-rank-list {
    list-style: none;
    display: block;
    padding: 0
}

.book-info .reward-rank .reward-rank-list .reward-rank-link {
    display: block;
    height: 20px
}

.book-info .reward-rank .reward-rank-list .reward-rank-item {
    margin: 0;
    list-style: none;
    display: block;
    position: relative;
    height: 20px
}

.book-info .reward-rank .reward-rank-list .reward-rank-item+.reward-rank-item {
    margin-top: 15px
}

.book-info .reward-rank .reward-rank-list .reward-rank-item .rank-no {
    left: 0;
    top: 0;
    font-size: 12px;
    width: 20px;
    height: 20px;
    line-height: 20px;
    position: absolute;
    display: block;
    text-align: center;
    background: #ebebeb;
    color: #000
}

.book-info .reward-rank .reward-rank-list .reward-rank-item .rank-nick {
    color: #000;
    font-size: 13px;
    line-height: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    position: absolute;
    left: 30px;
    right: 80px
}

.book-info .reward-rank .reward-rank-list .reward-rank-item .rank-score {
    font-size: 11px;
    position: absolute;
    line-height: 20px;
    color: #666;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100px;
    top: 0;
    right: 0
}

.book-info .reward-rank .reward-rank-list .reward-rank-item .bar {
    display: block;
    position: absolute;
    left: 0;
    top: 0;
    width: 3px;
    height: 65px;
    background: #00a786;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px
}

.book-info .reward-rank .reward-rank-list .reward-rank-item.no-1,.book-info .reward-rank .reward-rank-list .reward-rank-item.no-1 .reward-rank-link {
    height: 65px
}

.book-info .reward-rank .reward-rank-list .reward-rank-item.no-1 .img-circle {
    position: absolute;
    width: 50px;
    height: 50px;
    top: 50%;
    margin-top: -25px;
    right: 0
}

.book-info .reward-rank .reward-rank-list .reward-rank-item.no-1 .rank-score {
    top: 48px;
    display: block;
    left: 10px
}

.book-info .reward-rank .reward-rank-list .reward-rank-item.no-1 .rank-nick {
    top: 28px;
    left: 10px
}

.book-info .reward-rank .reward-rank-list .reward-rank-item.no-1 .rank-no {
    font-weight: 700;
    width: auto;
    height: 25px;
    font-size: 15px;
    line-height: 25px;
    padding-right: 6px;
    padding-left: 3px;
    left: 3px;
    background: #00a786;
    color: #fff
}

.book-info .reward-rank .reward-rank-list .reward-rank-item.no-2 .rank-no {
    background: #48bfa8;
    color: #fff
}

.book-info .reward-rank .reward-rank-list .reward-rank-item.no-3 .rank-no {
    background: #69cbb8;
    color: #fff
}

@media (min-width: 1600px) {
    .book-info .controls {
        left:220px
    }

    .book-info .controls .btn {
        min-width: 85px
    }
}

@media (max-width: 1599px) {
    .book-info .controls {
        left:250px
    }

    .book-info .controls .btn {
        min-width: 85px
    }
}

@media (max-width: 1399px) {
    .book-info .controls {
        left:190px
    }

    .book-info .controls .btn {
        min-width: 60px
    }
}

@media (max-width: 767px) {
    .book-info .breadcrumb,.book-info .breadcrumb>li+li:before,.book-info .breadcrumb a,.book-info .breadcrumb a:hover {
        color:#fff
    }

    .book-info .brand-bg {
        background: #00a786
    }

    .book-info .last-update {
        display: block;
        margin-top: 15px;
        margin-left: 0;
        font-size: 13px
    }

    .book-info .works-title {
        margin-top: 25px;
        color: #fff;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden
    }

    .book-info .info {
        font-size: .9em;
        padding-bottom: 60px
    }

    .book-info .desc {
        margin-top: 10px;
        padding-bottom: 60px
    }

    .book-info .desc .about {
        color: #333;
        font-size: 1.2em
    }

    .book-info .controls {
        bottom: 0;
        left: 15px;
        right: 15px;
        margin: 0 auto;
        text-align: center
    }

    .book-info .controls:after,.book-info .controls:before {
        content: " ";
        display: table
    }

    .book-info .controls:after {
        clear: both
    }

    .book-info .controls .btn {
        display: block;
        float: left;
        margin: 0 1%;
        padding: 6px 0
    }

    .book-info .controls.four .btn {
        width: 23%
    }
}

.book-info .mobile-about {
    overflow: hidden;
    margin-top: 20px
}

.book-info .mobile-about.expand {
    padding-bottom: 30px
}

.book-info .mobile-about .text-content-wrapper {
    max-height: 70px
}

.book-info .mobile-about .more {
    text-align: center;
    left: 0;
    padding-top: 10px;
    background: #f5f5f5
}

.book-editor .tabs {
    list-style: none;
    display: block;
    padding: 0;
    margin: 0 0 10px
}

.book-editor .tabs:after,.book-editor .tabs:before {
    content: " ";
    display: table
}

.book-editor .tabs:after {
    clear: both
}

.book-editor .tabs li {
    list-style: none;
    display: block;
    margin: 0;
    padding: 0 10px;
    text-align: center
}

@media (max-width: 768px) {
    .book-editor .tabs li {
        padding:0
    }
}

.book-editor .tabs li a {
    padding: 0 10px;
    height: 30px;
    line-height: 20px;
    color: #333;
    display: inline-block;
    border-bottom: 4px solid transparent
}

.book-editor .tabs li a:hover {
    text-decoration: none
}

@media (max-width: 768px) {
    .book-editor .tabs li a {
        padding:0
    }
}

.book-editor .tabs li a .badge {
    padding: 0;
    border-radius: 4px;
    line-height: 18px;
    height: 19px;
    width: 19px;
    font-size: 10px;
    background: #f05959;
    color: #fff;
    right: 0;
    top: 0;
    position: absolute;
    display: inline-block;
    text-align: center;
    vertical-align: middle
}

.book-editor .tabs li.active a {
    border-bottom-color: #00a786
}

.book-editor .panel.chapter-tab .list-group {
    margin: 0;
    padding: 0
}

.book-editor .panel.chapter-tab .list-group small {
    vertical-align: middle
}

@media (min-width: 480px) {
    .book-editor .panel.chapter-tab .list-group.vol {
        border-right:1px solid #eee;
        min-height: 250px
    }
}

.book-editor .panel.chapter-tab .list-group.tab-page {
    display: none
}

@media (min-width: 480px) {
    .book-editor .panel.chapter-tab .list-group.tab-page .list-group-item {
        margin-left:-1px;
        border-left: 1px solid #eee
    }
}

@media (max-width: 767px) {
    .book-editor .panel.chapter-tab .list-group.tab-page {
        border-top:2px solid #eee
    }

    .book-editor .panel.chapter-tab .list-group.tab-page .list-group-item {
        border-left: none
    }
}

.book-editor .panel.chapter-tab .list-group.active.tab-page {
    display: block
}

.book-editor .panel.chapter-tab .list-group .list-group-item {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    border: 0;
    border-radius: 0
}

.book-editor .panel.chapter-tab .list-group .list-group-item.active a {
    color: #fff
}

.book-editor .panel.chapter-tab .list-group .list-group-item+.list-group-item {
    border-top: 1px solid #eee
}

.reader h1.title {
    margin: 20px 0;
    font-size: 30px
}

.reader article {
    margin-top: 5px
}

.reader article .illust {
    margin: 0 3%;
    display: block;
    padding: 2px
}

.reader article .illust img {
    max-width: 90%;
    display: block;
    margin: 0 auto
}

.reader article p {
    font-size: 16px;
    line-height: 220%;
    min-height: 36px;
    margin: 18px 0 0;
    position: relative
}

.reader article#readerArticle.font-size-0 p {
    font-size: 12px
}

.reader article#readerArticle.font-size-1 p {
    font-size: 14px
}

.reader article#readerArticle.font-size-3 p {
    font-size: 18px
}

.reader article#readerArticle.font-size-4 p {
    font-size: 26px
}

.reader article#readerArticle.line-height-0 p {
    line-height: 150%
}

.reader article#readerArticle.line-height-2 p {
    line-height: 290%
}

.reader article#readerArticle.line-height-3 p {
    line-height: 360%
}

.reader article#readerArticle.line-height-4 p {
    line-height: 430%
}

.reader .info {
    margin-bottom: 30px
}

.reader .info .meta {
    color: #a9a9a9
}

.reader .float-toolbar {
    z-index: 99;
    position: fixed;
    line-height: 48px;
    text-align: center;
    transition: bottom .2s ease-in-out;
    left: 50%;
    width: 990px;
    margin-left: -495px;
    top: auto;
    margin-top: auto;
    bottom: 0;
    right: auto
}

@media (max-width: 1400px) {
    .reader .float-toolbar.nav-up {
        bottom:-48px
    }
}

.reader .float-toolbar .toolbar-btn {
    border: 1px solid #eee;
    background: #fff;
    color: #999;
    display: block;
    height: 48px;
    float: left;
    width: 25%
}

.reader .float-toolbar .toolbar-btn+.toolbar-btn {
    border-left-color: transparent
}

.reader .float-toolbar .toolbar-btn:active,.reader .float-toolbar .toolbar-btn:focus,.reader .float-toolbar .toolbar-btn:hover {
    text-decoration: none
}

.reader .float-toolbar .toolbar-btn:hover {
    color: #00a786;
    border: 1px solid #00a786
}

.reader .float-toolbar .toolbar-btn.disabled {
    background-color: #eee
}

.reader .float-toolbar .toolbar-btn.disabled:hover {
    border-color: #eee
}

.reader .float-toolbar .hide-tsukkomi {
    line-height: 24px
}

.reader .float-toolbar .hide-tsukkomi.show {
    line-height: 48px
}

.reader .float-toolbar .hide-tsukkomi,.reader .float-toolbar .settings {
    line-height: 24px;
    display: none!important
}

@media (max-width: 1400px) and (max-width:768px) {
    .reader .float-toolbar {
        width:100%;
        left: 0;
        margin-left: 0
    }
}

.reader .color-picker {
    margin: 0 -1px
}

.reader .color-picker:after,.reader .color-picker:before {
    content: " ";
    display: table
}

.reader .color-picker:after {
    clear: both
}

.reader .color-picker>* {
    padding: 1px
}

.reader .color-picker>* .btn {
    font-weight: 700
}

.reader .color-picker>* .btn.color-0 {
    background-color: #fff!important;
    border-color: #ddd
}

.reader .color-picker>* .btn.color-0:active,.reader .color-picker>* .btn.color-0:hover {
    background: #fff
}

.reader .color-picker>* .btn.color-1 {
    background-color: #e6f0e6!important;
    border-color: #c6ddc6
}

.reader .color-picker>* .btn.color-2 {
    background-color: #e3f5fa!important;
    border-color: #b8e6f2
}

.reader .color-picker>* .btn.color-3 {
    background-color: #f6f4ec!important;
    border-color: #e6e0c9
}

.reader .color-picker>* .btn.color-4 {
    background-color: #f5e9ef!important;
    border-color: #e5c6d6
}

.reader .color-picker>* .btn.color-10 {
    background-color: #222!important;
    border-color: #080808
}

.reader .color-picker>* .btn.selected {
    border-color: #00a786;
    color: #00a786
}

.reader .input-group-btn:first-child>.btn,.reader .input-group-btn:first-child>.btn-group {
    margin-right: 0
}

.reader .next-chapter,.reader .prev-chapter {
    margin-top: 10px;
    width: 140px;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}

@media (max-width: 768px) {
    .reader .next-chapter,.reader .prev-chapter {
        width:140px
    }
}

.reader .next-chapter {
    margin-left: 20px
}

@media (max-width: 768px) {
    .reader .next-chapter {
        margin-left:10px
    }
}

.upload-preview {
    position: relative;
    display: inline-block;
    vertical-align: middle;
    padding: 0;
    border: 1px solid #ddd;
    margin: 0 0 20px;
    background: #fff;
    width: 150px;
    height: 225px;
    overflow: hidden
}

@media (min-width: 1600px) {
    .upload-preview {
        width:110px;
        height: 165px
    }
}

@media (max-width: 1599px) {
    .upload-preview {
        width:131px;
        height: 197px
    }
}

@media (max-width: 1399px) {
    .upload-preview {
        width:95px;
        height: 143px
    }
}

@media (max-width: 767px) {
    .upload-preview {
        width:150px;
        height: 225px;
        display: block;
        margin: 0 auto
    }
}

.upload-preview input[name=file] {
    float: none;
    vertical-align: text-bottom;
    display: none
}

.upload-preview img {
    margin: 0 auto;
    display: block;
    width: 100%;
    height: 100%
}

.upload-preview .overlay {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(0,0,0,.5);
    text-align: center;
    color: #fff
}

.upload-preview .overlay .label {
    font-size: 12px;
    height: 20px;
    line-height: 20px;
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    text-align: center;
    margin-top: -10px
}

.upload-file-control input[name=file] {
    float: none;
    vertical-align: text-bottom;
    display: none
}

.categories {
    overflow: hidden;
    margin-top: -10px;
    margin-left: -10px
}

.categories .categories-item {
    background: #fff;
    float: left;
    height: 30px;
    line-height: 30px;
    margin-left: 10px;
    margin-top: 10px;
    display: block;
    border: 1px solid #ddd;
    padding: 0 10px;
    color: #333
}

.categories .categories-item.checked {
    border-color: #15a785;
    color: #15a785
}

#imageUploader .template,#imageUploader input[type=file] {
    display: none
}

#imageUploader .row>.item {
    position: relative
}

#imageUploader .row>.item.uploaded .insert {
    display: inline!important
}

#imageUploader .row>.item.uploaded .cover {
    display: none!important
}

#imageUploader .row>.item.uploaded .remove {
    display: block!important
}

#imageUploader .row>.item.uploading .cover {
    display: none!important
}

#imageUploader .row>.item .preview {
    position: relative;
    width: 100%;
    margin: 0 auto;
    padding: 2px;
    border: 1px solid #ddd
}

#imageUploader .row>.item .preview:after {
    content: "";
    display: block;
    padding-bottom: 100%
}

#imageUploader .row>.item .preview img {
    top: 50%;
    left: 50%;
    margin-left: -48%;
    margin-top: -48%;
    width: 96%;
    height: 96%;
    position: absolute;
    display: block;
    background: #eee
}

#imageUploader .row>.item .preview .cover {
    display: none;
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(99,99,99,.5)
}

#imageUploader .row>.item .preview .cover .add {
    position: absolute;
    top: 50%;
    width: 100%;
    height: 30px;
    line-height: 30px;
    margin-top: -30px;
    display: block;
    font-size: 3em;
    font-weight: lighter
}

#imageUploader .row>.item .preview .cover .text {
    position: absolute;
    top: 50%;
    width: 100%;
    height: 20px;
    line-height: 20px;
    margin-top: 5px;
    font-size: .9em
}

#imageUploader .row>.item .preview .cover {
    display: block;
    text-align: center;
    color: #fff;
    transition: background .3s,backdrop-filter;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px)
}

#imageUploader .row>.item .control {
    margin: 5px auto;
    display: block;
    font-size: .9em
}

#imageUploader .row>.item .control .btn {
    border-radius: 0!important
}

#imageUploader .row>.item .control .insert,#imageUploader .row>.item .control .remove {
    display: none
}

.modal-backdrop {
    z-index: 99998
}

.modal-fullscreen-xs {
    z-index: 99999
}

@media (max-width: 767px) {
    .modal-fullscreen-xs .modal-content,.modal-fullscreen-xs .modal-dialog {
        margin:0;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        border: 0;
        border-radius: 0;
        box-shadow: 0
    }

    .modal-fullscreen-xs .modal-footer {
        bottom: 0;
        height: 65px;
        position: absolute;
        left: 0;
        right: 0
    }

    .modal-fullscreen-xs .modal-body {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 65px
    }
}

@media (max-width: 767px) {
    .modal-fullscreen-xs.with-header .modal-body {
        top:51px
    }
}

.avatar-uploader {
    width: 100px;
    margin: 0 auto
}

.avatar-uploader .avatar {
    position: relative;
    z-index: 99;
    width: 100px;
    height: 100px;
    border-radius: 100px;
    overflow: hidden;
    border: 1px solid #eee;
    margin-bottom: 10px
}

.avatar-uploader .avatar img {
    display: block;
    width: 100%;
    height: 100%
}

.avatar-uploader input[type=file] {
    display: none
}

.avatar-uploader .cropper-wrp {
    position: relative;
    width: 100%
}

@media (max-width: 767px) {
    .avatar-uploader .cropper-wrp {
        width:100%;
        height: 100%
    }
}

.avatar-uploader .cropper-wrp .cropper {
    background: #fafafa;
    width: 280px
}

@media (min-width: 576px) {
    .avatar-uploader .cropper-wrp .cropper {
        margin:0 auto;
        margin-top: 180px
    }
}

@media (max-width: 576px) {
    .avatar-uploader .cropper-wrp .cropper {
        position:absolute;
        left: 50%;
        top: 50%;
        transform: translateY(-50%);
        margin-left: -140px
    }
}

.avatar-uploader .cropper-wrp .cropper img {
    image-rendering: pixelated
}

.avatar-uploader .preview {
    position: absolute;
    left: 50%;
    top: 120px;
    width: 40%;
    transform: translateX(-50%)
}

.avatar-uploader .preview .preview-hint {
    position: absolute;
    right: 0;
    left: 0;
    top: 50%;
    margin-top: -100px
}

.avatar-uploader .preview .avatar-preview {
    border: 1px solid #ddd;
    border-radius: 100px;
    width: 100px;
    height: 100px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -50px;
    margin-top: -50px;
    overflow: hidden
}

.avatar-uploader .preview .avatar-preview img {
    width: 100%;
    height: 100%
}

.jcrop-keymgr {
    visibility: hidden
}

.jcrop-holder {
    left: 50%;
    position: absolute;
    transform: translateX(-50%)
}

.modal-footer {
    background-color: #fff
}

.jcrop-holder {
    direction: ltr;
    text-align: left
}

.jcrop-hline,.jcrop-vline {
    background: #fff url(/static/img/Jcrop.7a4b4c6.gif);
    font-size: 0;
    position: absolute
}

.jcrop-vline {
    height: 100%;
    width: 1px!important
}

.jcrop-vline.right {
    right: 0
}

.jcrop-hline {
    height: 1px!important;
    width: 100%
}

.jcrop-hline.bottom {
    bottom: 0
}

.jcrop-tracker {
    height: 100%;
    width: 100%;
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    -webkit-user-select: none
}

.jcrop-handle {
    background-color: #333;
    border: 1px solid #eee;
    width: 7px;
    height: 7px;
    font-size: 1px
}

.jcrop-handle.ord-n {
    left: 50%;
    margin-left: -4px;
    margin-top: -4px;
    top: 0
}

.jcrop-handle.ord-s {
    bottom: 0;
    left: 50%;
    margin-bottom: -4px;
    margin-left: -4px
}

.jcrop-handle.ord-e {
    margin-right: -4px;
    margin-top: -4px;
    right: 0;
    top: 50%
}

.jcrop-handle.ord-w {
    left: 0;
    margin-left: -4px;
    margin-top: -4px;
    top: 50%
}

.jcrop-handle.ord-nw {
    left: 0;
    margin-left: -4px;
    margin-top: -4px;
    top: 0
}

.jcrop-handle.ord-ne {
    margin-right: -4px;
    margin-top: -4px;
    right: 0;
    top: 0
}

.jcrop-handle.ord-se {
    bottom: 0;
    margin-bottom: -4px;
    margin-right: -4px;
    right: 0
}

.jcrop-handle.ord-sw {
    bottom: 0;
    left: 0;
    margin-bottom: -4px;
    margin-left: -4px
}

.jcrop-dragbar.ord-n,.jcrop-dragbar.ord-s {
    height: 7px;
    width: 100%
}

.jcrop-dragbar.ord-e,.jcrop-dragbar.ord-w {
    height: 100%;
    width: 7px
}

.jcrop-dragbar.ord-n {
    margin-top: -4px
}

.jcrop-dragbar.ord-s {
    bottom: 0;
    margin-bottom: -4px
}

.jcrop-dragbar.ord-e {
    margin-right: -4px;
    right: 0
}

.jcrop-dragbar.ord-w {
    margin-left: -4px
}

.jcrop-light .jcrop-hline,.jcrop-light .jcrop-vline {
    background: #fff;
    filter: alpha(opacity=70)!important;
    opacity: .7!important
}

.jcrop-light .jcrop-handle {
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    background-color: #000;
    border-color: #fff;
    border-radius: 3px
}

.jcrop-dark .jcrop-hline,.jcrop-dark .jcrop-vline {
    background: #000;
    filter: alpha(opacity=70)!important;
    opacity: .7!important
}

.jcrop-dark .jcrop-handle {
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    background-color: #fff;
    border-color: #000;
    border-radius: 3px
}

.solid-line .jcrop-hline,.solid-line .jcrop-vline {
    background: #fff
}

.jcrop-holder img,img.jcrop-preview {
    max-width: none
}

body:after {
    content: url(/static/img/close.d9d2d0b.png) url(/static/img/loading.2299ad0.gif) url(/static/img/prev.84b76de.png) url(/static/img/next.31f1587.png);
    display: none
}

body.lb-disable-scrolling {
    overflow: hidden
}

.lightboxOverlay {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 9999;
    background-color: #000;
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
    opacity: .8;
    display: none
}

.lightbox {
    position: absolute;
    left: 0;
    width: 100%;
    z-index: 10000;
    text-align: center;
    line-height: 0;
    font-weight: 400
}

.lightbox .lb-image {
    display: block;
    height: auto;
    max-width: inherit;
    border-radius: 3px
}

.lightbox a img {
    border: none
}

.lb-outerContainer {
    position: relative;
    background-color: #fff;
    *zoom:1;width: 250px;
    height: 250px;
    margin: 0 auto;
    border-radius: 4px
}

.lb-outerContainer:after {
    content: "";
    display: table;
    clear: both
}

.lb-container {
    padding: 4px
}

.lb-loader {
    position: absolute;
    top: 43%;
    left: 0;
    height: 25%;
    width: 100%;
    text-align: center;
    line-height: 0
}

.lb-cancel {
    display: block;
    width: 32px;
    height: 32px;
    margin: 0 auto;
    background: url(/static/img/loading.2299ad0.gif) no-repeat
}

.lb-nav {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    z-index: 10
}

.lb-container>.nav {
    left: 0
}

.lb-nav a {
    outline: none;
    background-image: url("data:image/gif;base64,R0lGODlhAQABAPAAAP///wAAACH5BAEAAAAALAAAAAABAAEAAAICRAEAOw==")
}

.lb-next,.lb-prev {
    height: 100%;
    cursor: pointer;
    display: block
}

.lb-nav a.lb-prev {
    width: 34%;
    left: 0;
    float: left;
    background: url(/static/img/prev.84b76de.png) left 48% no-repeat;
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
    opacity: 0;
    transition: opacity .6s
}

.lb-nav a.lb-prev:hover {
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
    opacity: 1
}

.lb-nav a.lb-next {
    width: 64%;
    right: 0;
    float: right;
    background: url(/static/img/next.31f1587.png) right 48% no-repeat;
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
    opacity: 0;
    transition: opacity .6s
}

.lb-nav a.lb-next:hover {
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
    opacity: 1
}

.lb-dataContainer {
    margin: 0 auto;
    padding-top: 5px;
    *zoom:1;width: 100%;
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px
}

.lb-dataContainer:after {
    content: "";
    display: table;
    clear: both
}

.lb-data {
    padding: 0 4px;
    color: #ccc
}

.lb-data .lb-details {
    width: 85%;
    float: left;
    text-align: left;
    line-height: 1.1em
}

.lb-data .lb-caption {
    font-size: 13px;
    font-weight: 700;
    line-height: 1em
}

.lb-data .lb-number {
    display: block;
    clear: left;
    padding-bottom: 1em;
    font-size: 12px;
    color: #999
}

.lb-data .lb-close {
    display: block;
    float: right;
    width: 30px;
    height: 30px;
    background: url(/static/img/close.d9d2d0b.png) 100% 0 no-repeat;
    text-align: right;
    outline: none;
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=70);
    opacity: .7;
    transition: opacity .2s
}

.lb-data .lb-close:hover {
    cursor: pointer;
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
    opacity: 1
}

.search hr {
    margin: 10px 0!important
}

.search .title {
    margin-bottom: 0!important;
    margin-top: 5px;
    font-size: 1.35em
}

@media (max-width: 767px) {
    .search .title {
        margin-top:10px
    }
}

.search .title .desc {
    font-weight: 400;
    font-size: .9em;
    margin-left: 5px
}

.search .title a {
    color: #333;
    text-decoration: none
}

.search .list {
    padding: 0
}

.search .list,.search .list li {
    display: block;
    list-style: none;
    position: relative;
    margin: 0
}

.search .list li {
    min-height: 194px;
    padding: 15px 10px 0 140px
}

@media (max-width: 767px) {
    .search .list li {
        min-height:120px;
        padding: 5px 0 15px 100px
    }
}

.search .list li .info .desc {
    margin-top: 20px;
    color: gray;
    line-height: 18px;
    max-height: 190px
}

.search .list li .info .desc p+p {
    margin-top: 15px
}

.search .list li .info .desc a {
    color: #15a785
}

.search .list li .info .intro {
    position: relative;
    overflow: hidden;
    padding-left: 56px;
    max-height: 90px
}

.search .list li .info .descs {
    position: absolute;
    left: 0
}

.search .list li .info strong.green {
    background: #15a785;
    border-radius: 4px;
    padding: 2px 4px;
    color: #fff
}

.search .list li .title {
    font-weight: 400
}

.search .list li+li {
    border-top: 1px solid #ddd
}

.search .list li .cover {
    border: 1px solid #ddd;
    position: absolute;
    display: block;
    top: 15px;
    left: 0
}

.search .list li .cover img {
    display: block;
    width: 116px;
    height: 174px
}

@media (max-width: 767px) {
    .search .list li .cover img {
        width:80px;
        height: 120px
    }
}

.search .highlight {
    color: #00a786
}

.issue-detail .chat-list .cl-reply-wrp:after,.issue-detail .chat-list .cl-reply-wrp:before {
    content: " ";
    display: table
}

.issue-detail .chat-list .cl-reply-wrp:after {
    clear: both
}

.issue-detail .chat-list .cl-reply-wrp .cl-info {
    font-size: 12px;
    color: #666;
    margin: 5px -5px;
    margin-right: 0;
    margin-bottom: 0;
    text-align: right
}

.issue-detail .chat-list .cl-reply-wrp .cl-reply {
    max-width: 470px;
    float: right;
    padding: 12px 15px;
    border-radius: 10px 0 10px 10px;
    background: #d5f2fe;
    font-size: 14px;
    line-height: 150%;
    margin: 10px 20px 8px 0;
    position: relative;
    text-shadow: 0 1px 1px rgba(0,0,0,.2)
}

@media (max-width: 1400px) {
    .issue-detail .chat-list .cl-reply-wrp .cl-reply {
        margin:10px 10px 8px 0
    }
}

.issue-detail .chat-list .cl-reply-wrp .cl-reply small {
    color: #00a786
}

.issue-detail .chat-list .cl-reply-wrp .cl-reply br {
    display: block;
    padding: 5px 0;
    content: ""
}

.issue-detail .chat-list .cl-reply-wrp .cl-reply:after {
    content: "";
    position: absolute;
    top: 0;
    border-left: 6px solid #d5f2fe;
    right: -6px;
    border-bottom: 7px solid transparent
}

.issue-detail .chat-list .cl-reply-wrp.left {
    margin: 10px 0 8px 20px
}

.issue-detail .chat-list .cl-reply-wrp.left .cl-info {
    text-align: left
}

.issue-detail .chat-list .cl-reply-wrp.left .cl-reply {
    background: #eee;
    border-radius: 0 10px 10px 10px;
    float: left
}

.issue-detail .chat-list .cl-reply-wrp.left .cl-reply:after {
    content: "";
    position: absolute;
    top: 0;
    border-right: 6px solid #eee;
    left: -6px;
    border-bottom: 7px solid transparent;
    right: auto;
    border-left: 0
}

.issue-detail .issue-comment .comm-form {
    margin-left: 10px;
    margin-right: 10px
}

.issue-detail .issue-comment .comm-form .comm-form-msg {
    text-align: center;
    color: dimgray
}

.issue-detail .issue-comment .comm-form .comm-hint {
    margin-top: 10px
}

.issue-detail .issue-comment .comm-form .comm-hint:after,.issue-detail .issue-comment .comm-form .comm-hint:before {
    content: " ";
    display: table
}

.issue-detail .issue-comment .comm-form .comm-hint:after {
    clear: both
}

.issue-detail .issue-comment .comm-form .comm-name {
    font-size: 1.1em;
    margin: 10px 0;
    text-align: center;
    color: #a9a9a9
}

@media (max-width: 767px) {
    .issue-detail .issue-comment .comm-form .comm-info {
        display:none
    }
}

@media (min-width: 1600px) {
    .issue-detail .issue-comment .comm-form .comm-info .comm-avatar {
        width:80px;
        height: 80px
    }
}

@media (max-width: 1599px) {
    .issue-detail .issue-comment .comm-form .comm-info .comm-avatar {
        width:65px;
        height: 65px
    }
}

@media (max-width: 1399px) {
    .issue-detail .issue-comment .comm-form .comm-info .comm-avatar {
        width:52px;
        height: 52px
    }
}

.issue-detail .issue-comment .comm-form .comm-avatar {
    display: block;
    border-radius: 100px;
    overflow: hidden;
    margin: 0 auto;
    width: 52px;
    height: 52px;
    border: 1px solid #ddd
}

.issue-detail .issue-comment .comm-form .comm-avatar img {
    width: 100%;
    height: 100%
}

.article-comments .bottom {
    margin-bottom: 340px
}

.activity-wrapper {
    min-height: 400px;
    background: top no-repeat
}

.activity-wrapper .bordered {
    border: 2px solid #ddd;
    border-radius: 8px;
    background: #fff
}

.activity-wrapper .activity-comment #commentComponent {
    margin-top: 0
}

.activity-wrapper .activity-header {
    position: relative
}

.activity-wrapper .activity-header>.row,.activity-wrapper .activity-header>.row>div {
    height: 100%
}

.activity-wrapper .activity-enter {
    display: block;
    margin: 0;
    height: 550px
}

.activity-wrapper .activity-enter img {
    display: block;
    width: 100%
}

.activity-wrapper .activity-container {
    padding-bottom: 20px;
    position: relative
}

.activity-wrapper .activity-container>.row,.activity-wrapper .activity-container>.row>* {
    position: relative
}

.activity-wrapper .activity-topic {
    padding: 30px 15px 15px;
    position: relative
}

.activity-wrapper .activity-topic+.activity-topic {
    margin-top: 30px
}

.activity-wrapper .activity-topic .topic-title {
    height: 36px;
    line-height: 30px;
    top: -18px;
    padding: 0 10px;
    left: 20px;
    position: absolute;
    background: #fff;
    font-size: 26px
}

.activity-wrapper .activity-topic .topic-image {
    display: block;
    width: 100%;
    border-radius: 4px;
    margin: 5px 0
}

.activity-wrapper .activity-topic .topic-container {
    position: relative;
    font-size: 16px;
    line-height: 26px;
    letter-spacing: 1px
}

#commentComponent {
    border-radius: 6px;
    background: #fff;
    font-size: 13px;
    position: relative;
    margin-top: 20px
}

#commentComponent .comm-form,#commentComponent .comm-form .media-body {
    overflow: visible!important
}

#commentComponent .comm-title {
    width: 100%;
    font-size: 15px;
    top: 0;
    height: 18px;
    display: flex;
    justify-content: space-between;
    padding: 0 10px
}

#commentComponent .comm-title .book-discuss {
    line-height: 18px;
    cursor: pointer;
    font-size: 13px
}

#commentComponent .comm-title .book-discuss input {
    vertical-align: middle;
    margin: 0
}

#commentComponent .label.label-author {
    background: transparent;
    padding: 0;
    font-size: 85%;
    font-weight: 400;
    color: #21a3fb
}

#commentComponent .label.label-artist {
    background: transparent;
    padding: 0;
    font-size: 85%;
    font-weight: 400;
    color: #ff8030
}

#commentComponent .close {
    float: right;
    font-size: 21px;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    filter: alpha(opacity=20);
    opacity: .2;
    -webkit-appearance: none;
    padding: 0;
    cursor: pointer;
    background: 0 0;
    border: 0
}

#commentComponent .comm-avatar {
    display: block;
    border-radius: 100px;
    overflow: hidden;
    margin: 0 auto;
    width: 52px;
    height: 52px
}

#commentComponent .comm-avatar img {
    display: block;
    width: 100%;
    height: 100%
}

#commentComponent .comm-reply-to {
    max-height: 20px;
    color: #a9a9a9;
    overflow: hidden;
    white-space: nowrap;
    width: 150px;
    margin-bottom: 10px;
    text-overflow: ellipsis;
    display: none
}

#commentComponent .comm-reply-to.show {
    display: block
}

#commentComponent .comm-reply-to .comm-reply-close {
    font-weight: 700;
    color: #a9a9a9
}

#commentComponent .comm-item {
    padding: 5px;
    position: relative
}

#commentComponent .comm-item+.comm-item {
    margin-top: 10px
}

#commentComponent .comm-item+.comm-item .comm-item-body {
    padding-top: 20px
}

#commentComponent .comm-item+.comm-item .comm-split-line {
    position: absolute;
    border-top: 1px solid #e5e9ef;
    left: 69px;
    right: 0;
    top: 0
}

#commentComponent .comm-item+.comm-item .comm-item-left {
    padding-top: 30px
}

#commentComponent .comm-item .comm-avatar {
    margin: auto;
    position: absolute;
    top: 5px;
    left: -68px
}

#commentComponent .comm-item .comm-controls {
    position: relative;
    width: 100%;
    font-size: 12px
}

#commentComponent .comm-item .comm-controls:after,#commentComponent .comm-item .comm-controls:before {
    content: " ";
    display: table
}

#commentComponent .comm-item .comm-controls:after {
    clear: both
}

#commentComponent .comm-item .comm-controls a {
    color: #999;
    display: inline-block;
    float: left;
    font-weight: 700
}

#commentComponent .comm-item .comm-controls a:hover {
    text-decoration: none;
    opacity: .6
}

#commentComponent .comm-item .comm-controls a+a {
    margin-left: 8px
}

#commentComponent .comm-item .comm-controls .comm-date {
    margin-right: 10px
}

#commentComponent .comm-item .comm-controls .comm-ctrl-like {
    background: url(/static/img/like.d51c130.png) no-repeat 0;
    background-size: 14px;
    padding-left: 16px;
    display: inline-block;
    vertical-align: bottom;
    height: 16px
}

#commentComponent .comm-item .comm-controls .comm-ctrl-like.liked {
    background: url(/static/img/liked.c50c646.png) no-repeat 0;
    background-size: 14px
}

#commentComponent .comm-item .comm-hint a,#commentComponent .comm-item .comm-name a {
    font-size: 13px;
    font-weight: 700;
    color: #888
}

#commentComponent .comm-item .comm-status {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    color: #999
}

#commentComponent .comm-item .comm-item-body {
    padding-left: 60px;
    position: relative
}

#commentComponent .comm-item .comm-item-body .comm-content {
    word-wrap: break-word;
    line-height: 28px;
    white-space: normal;
    color: #111;
    font-size: 15px;
    margin: 8px 0
}

#commentComponent .comm-item .comm-item-body .comm-content .emoticon {
    width: 60px;
    height: 60px;
    vertical-align: text-bottom
}

#commentComponent .comm-item .comm-item-body .comm-actual-content {
    white-space: pre-wrap
}

#commentComponent .comm-form-msg,#commentComponent .comm-msg,#commentComponent .comm-progress {
    visibility: hidden;
    transition: opacity .3s;
    opacity: 0;
    padding: 20px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: hsla(0,0%,100%,.7);
    z-index: 9
}

#commentComponent .comm-form-msg.show,#commentComponent .comm-msg.show,#commentComponent .comm-progress.show {
    visibility: visible;
    opacity: 1
}

#commentComponent .comm-list {
    position: relative
}

#commentComponent .comm-list.replies {
    margin-top: 15px
}

@media (max-width: 576px) {
    #commentComponent .comm-list.replies {
        margin-left:-40px
    }
}

#commentComponent .comm-list.replies .comm-split-line {
    display: none
}

#commentComponent .comm-list.replies .comm-item {
    padding: 0
}

#commentComponent .comm-list.replies .comm-item .comm-item-body {
    padding-left: 36px;
    border: none;
    padding-top: 0
}

#commentComponent .comm-list.replies .comm-item .comm-item-body .comm-content {
    font-size: 14px;
    margin: 0
}

#commentComponent .comm-list.replies .comm-item .comm-avatar {
    top: 5px;
    left: -36px;
    width: 24px;
    height: 24px
}

#commentComponent .comm-list.replies .comm-item .comm-hint {
    font-size: 13px
}

#commentComponent .comm-list.replies .comm-item .comm-status .comm-controls a {
    color: #999
}

@media (max-width: 1399px) {
    #commentComponent .comm-list.replies .comm-item .comm-item-left {
        display:none
    }

    #commentComponent .comm-list.replies .comm-item .comm-item-body {
        margin-left: 0
    }
}

#commentComponent .comm-list.replies .comm-list-pagination {
    position: relative!important
}

#commentComponent .comm-list .comm-expand {
    border-radius: 4px;
    background: #fafafa;
    border: 1px solid #eee;
    height: 40px;
    margin-top: 20px;
    line-height: 40px;
    text-align: center;
    display: block;
    color: #999;
    text-decoration: none
}

#commentComponent .comm-list .comm-expand:focus,#commentComponent .comm-list .comm-expand:hover {
    text-decoration: none
}

#commentComponent .comm-list .comm-hide {
    display: none
}

#commentComponent .comm-list .comm-list-pagination {
    text-align: center
}

#commentComponent .comm-list .comm-list-pagination .pagination {
    margin: 0 auto
}

#commentComponent .comm-list .comm-list-pagination .pagination a,#commentComponent .comm-list .comm-list-pagination .pagination span {
    padding: 4px 8px;
    margin: 3px;
    border-radius: 4px
}

#commentComponent .comm-list .comm-list-pagination .pagination .active>span {
    color: #00a786;
    background: #fff;
    border-color: #00a786
}

#commentComponent .comm-list .comm-list-pagination .pagination .disabled span {
    background: #f5f5f5;
    text-shadow: -1px -1px #fff
}

#commentComponent .comm-list .comm-list-pagination .pagination a {
    color: #666
}

#commentComponent .comm-list.comm-main-list {
    margin-top: 60px
}

#commentComponent .comm-list.comm-main-list.has-pagination {
    padding-bottom: 74px
}

#commentComponent .comm-list.comm-main-list .comm-list-pagination {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0
}

#commentComponent.bottom .comm-form {
    top: auto;
    bottom: 0
}

#commentComponent .comm-body {
    position: relative
}

#commentComponent .comm-body .comm-ctrl-report {
    position: absolute;
    right: 0
}

#commentComponent .comm-body .comm-form {
    position: relative
}

#commentComponent .comm-body .comm-form .media-body {
    padding-bottom: 20px
}

@media (min-width: 1399px) {
    #commentComponent .comm-body .comm-controls .comm-ctrl-remove,#commentComponent .comm-body .comm-controls .comm-ctrl-report {
        display:none;
        text-decoration: none
    }

    #commentComponent .comm-body:hover .comm-controls .comm-ctrl-remove,#commentComponent .comm-body:hover .comm-controls .comm-ctrl-report {
        display: inline
    }
}

#commentComponent .comm-author {
    color: #006b56
}

#commentComponent .text-content-wrapper {
    max-height: 145px;
    padding-bottom: 30px;
    margin-bottom: 5px
}

#commentComponent .text-content-wrapper .more {
    text-align: center;
    left: 0;
    border: 1px solid #eaeaea;
    border-radius: 4px;
    color: #999
}

#commentComponent .text-expander.text-expander-disabled .text-content-wrapper {
    padding-bottom: 0
}

#commentComponent .comm-hint {
    position: relative;
    color: #a9a9a9;
    margin: 10px 0
}

#commentComponent .comm-form {
    position: relative;
    top: 0;
    left: 0;
    right: 10px
}

#commentComponent .comm-form .comm-form-msg {
    text-align: center;
    color: dimgray
}

#commentComponent .comm-form .comm-hint {
    line-height: 34px;
    position: relative;
    padding-right: 90px
}

@media (max-width: 1399px) {
    #commentComponent .comm-form .comm-hint {
        min-height:46px;
        padding-right: 125px;
        font-size: .8em;
        line-height: 24px
    }
}

#commentComponent .comm-form .comm-hint .btn-primary {
    right: 0;
    top: 50%;
    margin-top: -17px;
    position: absolute;
    border: none;
    border-radius: 2px
}

@media (max-width: 1399px) {
    #commentComponent .comm-form .comm-hint .btn-primary {
        margin-top:-23px
    }
}

#commentComponent .comm-form .comm-name {
    font-size: 1.1em;
    margin: 10px 0;
    text-align: center;
    color: #a9a9a9
}

@media (max-width: 767px) {
    #commentComponent .comm-form .comm-info {
        display:none
    }
}

#commentComponent .comm-form .comm-info .comm-avatar {
    margin: 16px 6px
}

@media (min-width: 1600px) {
    #commentComponent .comm-form .comm-info .comm-avatar {
        width:52px;
        height: 52px
    }
}

#commentComponent .comm-form .form-control.comm-content {
    border: 0 solid transparent;
    background: transparent;
    resize: none;
    box-shadow: none
}

#commentComponent .comm-form .form-control.comm-content:focus {
    box-shadow: none
}

#commentComponent .comm-form .comm-content-wrp {
    transition: all .3s;
    border: 1px solid #e5e9ef;
    background: #fff;
    border-radius: 6px;
    padding-bottom: 41px;
    position: relative;
    overflow: hidden
}

#commentComponent .comm-form .comm-content-wrp.focus {
    border: 1px solid #00a786;
    box-shadow: none
}

#commentComponent .comm-form .comm-content-wrp .comm-input-ctrl {
    background: #f6f7f8;
    height: 40px;
    bottom: 0;
    left: 0;
    right: 0;
    position: absolute
}

#commentComponent .comm-form .comm-content-wrp .comm-input-ctrl .comm-emotion {
    background: url(/static/img/emotion.2d80196.png) 0 no-repeat;
    background-size: 26px;
    width: 32px;
    display: block;
    position: absolute;
    left: 10px;
    top: 4px;
    height: 32px;
    transition: background .3s
}

#commentComponent .comm-form .comm-content-wrp .comm-input-ctrl .comm-emotion:hover {
    background: url(/static/img/emotions.5bab111.png) 0 no-repeat;
    background-size: 26px
}

#commentComponent .comm-form .comm-content-wrp .comm-input-ctrl .comm-enter {
    right: 0
}

#commentComponent .comm-form .comm-content-wrp .comm-input-ctrl .comm-enter,#commentComponent .comm-form .comm-content-wrp .comm-input-ctrl .comm-publish {
    position: absolute;
    bottom: 0;
    height: 40px;
    line-height: 40px;
    width: 80px;
    padding: 0!important;
    text-align: center;
    margin: 0!important;
    border: none;
    border-radius: 0;
    transition: all .3s
}

#commentComponent .comm-form .comm-content-wrp .comm-input-ctrl .comm-publish {
    right: 100px
}

#commentComponent .comm-form .comm-input-emoticons {
    border: 1px solid #e5e9ef;
    display: block;
    visibility: hidden;
    opacity: 0;
    transition: opacity .3s;
    position: absolute;
    background: #fff;
    z-index: 200;
    width: 310px;
    height: 310px;
    overflow-y: scroll;
    padding: 5px
}

@media (max-width: 576px) {
    #commentComponent .comm-form .comm-input-emoticons {
        width:222px
    }
}

#commentComponent .comm-form .comm-input-emoticons:after,#commentComponent .comm-form .comm-input-emoticons:before {
    content: " ";
    display: table
}

#commentComponent .comm-form .comm-input-emoticons:after {
    clear: both
}

#commentComponent .comm-form .comm-input-emoticons .comm-input-emoticons-item {
    width: 60px;
    height: 60px;
    margin: 5px;
    display: block;
    float: left
}

#commentComponent .comm-form .comm-input-emoticons .comm-input-emoticons-item img {
    width: 100%;
    height: 100%
}

#commentComponent .comm-form .comm-input-emoticons.show {
    opacity: 1;
    visibility: visible
}

@keyframes comment-activities-xmas2017-inner {
    0% {
        transform: scale(0);
        opacity: 0
    }

    to {
        transform: scale(1);
        opacity: 1
    }
}

#commentComponent .comment-activities .comment-activities-xmas2017>.comment-xmas2017-modal {
    transition: opacity .5s;
    position: fixed;
    background: rgba(0,0,0,.2);
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 99999
}

#commentComponent .comment-activities .comment-activities-xmas2017>.comment-xmas2017-modal .comment-xmas2017-touchable {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0
}

#commentComponent .comment-activities .comment-activities-xmas2017>.comment-xmas2017-modal .comment-xmas2017-inner {
    display: block;
    cursor: pointer;
    animation: comment-activities-xmas2017-inner .5s linear;
    background: url(/static/img/result.ff44c8e.png) 50%/cover no-repeat;
    width: 983px;
    height: 595px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -491px;
    margin-top: -297px
}

@media (max-width: 1399px) {
    #commentComponent .comment-activities .comment-activities-xmas2017>.comment-xmas2017-modal .comment-xmas2017-inner {
        background:url(/static/img/result_mobile.c05024d.png) 50%/cover no-repeat;
        width: 375px;
        height: 259px;
        top: 50%;
        left: 50%;
        margin-left: -188px;
        margin-top: -130px
    }
}

#commentComponent .comment-activities .comment-activities-xmas2017>.comment-xmas2017-modal .comment-xmas2017-inner:hover {
    opacity: 1
}

#commentComponent .comment-activities .comment-activities-xmas2017>.comment-xmas2017-modal .comment-xmas2017-close {
    animation: comment-activities-xmas2017-inner .5s linear;
    display: block;
    cursor: pointer;
    position: absolute;
    background: url(/static/img/icon_close.15c11cc.png) 50%/cover no-repeat;
    width: 34px;
    height: 34px;
    top: 50%;
    left: 50%;
    margin-left: 423px;
    margin-top: -263px
}

@media (max-width: 1399px) {
    #commentComponent .comment-activities .comment-activities-xmas2017>.comment-xmas2017-modal .comment-xmas2017-close {
        top:50%;
        left: 50%;
        margin-left: -17px;
        margin-top: 140px
    }
}

#commentComponent .comment-activities .comment-activities-xmas2017.fade-out .comment-xmas2017-modal {
    transition: visibility 0s .5s,opacity .5s;
    visibility: hidden;
    opacity: 0
}

#commentComponent .comment-activities .comment-activities-xmas2017.fade-out .comment-xmas2017-close,#commentComponent .comment-activities .comment-activities-xmas2017.fade-out .comment-xmas2017-inner {
    animation: none
}

.comm-tit {
    background: transparent;
    padding: 0;
    font-weight: 400;
    color: #21a3fb;
    border: 1px solid #21a3fb;
    padding: 2px;
    border-radius: 2px
}

.comm-tit,.review {
    font-size: 11px;
    width: 36px
}

.review {
    border: 1px solid #00a786;
    display: inline-block;
    text-align: center;
    color: #00a786;
    border-radius: 2px;
    line-height: 17px;
    margin-top: 5px;
    margin-right: 5px
}

#tsukkomi {
    display: none;
    margin: 0 -25px
}

#tsukkomi .icon {
    width: 18px;
    height: 18px;
    display: inline-block;
    color: #fff;
    line-height: 16px;
    font-size: .9em;
    text-align: center;
    border-radius: 3px
}

#tsukkomi .link-to {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    cursor: pointer
}

#tsukkomi.collapsed .comment {
    display: none
}

#tsukkomi.fixed {
    position: fixed;
    top: 0;
    z-index: 10
}

#tsukkomi .title {
    padding: 0 20px
}

#tsukkomi .title .hide-btn {
    color: #15a785;
    line-height: 34px;
    font-weight: 400;
    font-size: 12px;
    float: right
}

#tsukkomi .title .hide-btn:focus,#tsukkomi .title .hide-btn:hover {
    text-decoration: none
}

#tsukkomi .comment {
    border: 1px solid #ddd;
    background: #fff
}

#tsukkomi .comment .tree {
    height: 300px;
    overflow-x: hidden;
    overflow-y: scroll
}

#tsukkomi .comment .tree .list-wrapper {
    position: relative;
    padding: 28px 4px 4px;
    display: none
}

#tsukkomi .comment .tree .list-wrapper.has-tsukkomi {
    display: block
}

#tsukkomi .comment .tree .list-wrapper .list .item {
    line-height: 18px;
    font-size: .8em;
    padding: 0 2px
}

#tsukkomi .comment .tree .list-wrapper .list .item+.item {
    border-top: 1px solid #f5f5f5
}

#tsukkomi .comment .tree .list-wrapper .icon {
    background: url(/static/img/icon.61ad871.png) no-repeat center -410px;
    top: 4px;
    left: 4px;
    position: absolute
}

#tsukkomi .comment .tree .list-wrapper.active .icon {
    background: url(/static/img/icon.61ad871.png) no-repeat center -450px
}

#tsukkomi .new-comment {
    border-top: 1px solid #ddd;
    height: 155px;
    padding: 10px
}

#tsukkomi .new-comment .tsukkomi-to {
    color: #15a785;
    font-size: .9em;
    height: 25px;
    line-height: 25px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis
}

#tsukkomi .new-comment textarea {
    margin-top: 5px;
    display: block;
    outline: none;
    border: 1px solid #ddd;
    background: #f5f5f5;
    padding: 5px;
    height: 55px;
    resize: none;
    font-size: 1em
}

#tsukkomi .new-comment textarea:focus {
    border: 1px solid #15a785
}

#tsukkomi .new-comment .submit {
    margin-top: 10px
}

.read-book article p.l {
    position: relative
}

.tsukkomi-btn {
    position: absolute;
    bottom: 50%;
    right: -16px;
    margin-bottom: -11px;
    width: 22px;
    height: 22px;
    display: none
}

@media (max-width: 1399px) {
    .tsukkomi-btn {
        display:none
    }
}

.tsukkomi-btn .icon {
    width: 18px;
    height: 18px;
    display: inline-block;
    color: #fff;
    line-height: 16px;
    font-size: .9em;
    text-align: center;
    border-radius: 3px
}

.tsukkomi-btn .icon.marker {
    position: absolute;
    display: block;
    width: 4px;
    height: 4px;
    border-radius: 0;
    background: #ccc;
    left: 9px;
    top: 9px
}

.tsukkomi-btn .icon.edit {
    background: url(/static/img/icon.61ad871.png) no-repeat center -370px;
    position: absolute;
    display: none;
    width: 22px;
    height: 22px;
    right: -16px;
    top: -16px
}

.tsukkomi-btn.edit .icon.edit {
    display: block
}

.tsukkomi-btn.has-tsukkomi .icon.marker {
    background: url(/static/img/icon.61ad871.png) no-repeat center -289px;
    top: 0;
    left: 0;
    width: 22px;
    height: 22px
}

.enable-tsukkomi .tsukkomi-btn {
    display: block
}

.enable-tsukkomi .reader article p.l.active {
    background: #f5f5f5;
    border-radius: 2px
}

.enable-tsukkomi .reader article p.l.active .tsukkomi-btn .icon.marker {
    background: url(/static/img/icon.61ad871.png) no-repeat center -330px
}

.discuss-box {
    position: relative
}

.discuss-box .discuss-close {
    cursor: pointer;
    position: absolute;
    z-index: 10;
    top: 10px;
    right: 20px;
    width: 24px;
    height: 24px;
    background-image: url(/static/img/comment_closed.b6bdad3.png)
}

#commentComponent-beta {
    position: relative;
    margin-top: 40px;
    font-size: 14px
}

#commentComponent-beta .comm-container {
    padding-bottom: 20px
}

#commentComponent-beta .find-result {
    position: relative;
    background-color: #f6f7f8;
    padding: 40px 0
}

#commentComponent-beta .find-result:before {
    content: " ";
    position: absolute;
    left: -40px;
    top: 0;
    width: 40px;
    height: 100%;
    background-color: #f6f7f8
}

#commentComponent-beta .find-result:after {
    content: " ";
    position: absolute;
    right: -40px;
    top: 0;
    width: 40px;
    height: 100%;
    background-color: #f6f7f8
}

#commentComponent-beta .comm-title {
    width: 100%;
    font-size: 15px;
    top: 0;
    height: 18px;
    display: flex;
    justify-content: space-between;
    padding: 0 10px;
    margin-bottom: 10px
}

#commentComponent-beta .comm-title .book-discuss {
    line-height: 18px;
    cursor: pointer;
    font-size: 13px
}

#commentComponent-beta .comm-title .book-discuss input {
    vertical-align: middle;
    margin: 0
}

#commentComponent-beta .label.label-author {
    background: transparent;
    padding: 0;
    font-size: 85%;
    font-weight: 400;
    color: #21a3fb
}

#commentComponent-beta .label.label-artist {
    background: transparent;
    padding: 0;
    font-size: 85%;
    font-weight: 400;
    color: #ff8030
}

#commentComponent-beta .close {
    float: right;
    font-size: 21px;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    filter: alpha(opacity=20);
    opacity: .2;
    -webkit-appearance: none;
    padding: 0;
    cursor: pointer;
    background: 0 0;
    border: 0
}

#commentComponent-beta .comm-form-msg,#commentComponent-beta .comm-msg,#commentComponent-beta .comm-progress {
    visibility: hidden;
    transition: opacity .3s;
    opacity: 0;
    padding: 20px;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: hsla(0,0%,100%,.7);
    z-index: 9
}

#commentComponent-beta .comm-form-msg.show,#commentComponent-beta .comm-msg.show,#commentComponent-beta .comm-progress.show {
    visibility: visible;
    opacity: 1
}

#commentComponent-beta .comm-avatar {
    display: block;
    border-radius: 100px;
    overflow: hidden;
    margin: 0 auto;
    width: 50px;
    height: 50px
}

#commentComponent-beta .comm-avatar>img {
    width: 100%;
    height: 100%;
    border-radius: 50%
}

#commentComponent-beta .comm-reply-to {
    max-height: 20px;
    color: #a9a9a9;
    overflow: hidden;
    white-space: nowrap;
    width: 150px;
    margin-bottom: 10px;
    text-overflow: ellipsis;
    display: none
}

#commentComponent-beta .comm-reply-to.show {
    display: block
}

#commentComponent-beta .comm-reply-to .comm-reply-close {
    font-weight: 700;
    color: #a9a9a9
}

#commentComponent-beta .comm-form {
    position: relative;
    padding: 5px;
    overflow: inherit
}

#commentComponent-beta .comm-form .comm-content {
    border-radius: 4px;
    word-wrap: break-word;
    resize: horizontal;
    min-height: 100px;
    padding-bottom: 10px;
    max-height: 226px;
    resize: none;
    overflow-y: auto
}

#commentComponent-beta .comm-form .comm-content>p {
    margin: 0
}

#commentComponent-beta .comm-form .comm-content::-webkit-scrollbar {
    width: 8px;
    height: 8px;
    background-color: #ccc
}

#commentComponent-beta .comm-form .comm-content::-webkit-scrollbar-track {
    background-color: #fafafa
}

#commentComponent-beta .comm-form .comm-content::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #ccc
}

#commentComponent-beta .comm-form .comm-show:focus {
    border-color: #ec9b2f;
    outline: 0;
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075),0 0 8px rgba(236,155,47,.6)
}

#commentComponent-beta .comm-form .comm-form-msg {
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: hsla(0,0%,100%,.7)
}

#commentComponent-beta .comm-form .comm-form-msg>p {
    text-align: center;
    margin: 0;
    position: absolute;
    top: 40%;
    left: 50%;
    transform: translate(-40%,-50%);
    font-size: 16px
}

#commentComponent-beta .comm-form .comm-input-ctrl {
    position: relative;
    height: 30px;
    margin-top: 10px
}

#commentComponent-beta .comm-form .comm-input-ctrl .comm-emotion {
    display: block;
    position: absolute;
    width: 72px;
    height: 30px;
    border-radius: 4px;
    line-height: 30px;
    font-size: 14px;
    border: 1px solid #e5e5e5;
    background: url(/static/img/emotion.2d80196.png) 12px no-repeat;
    background-size: 16px;
    padding-left: 30px;
    transition: background .3s;
    color: #999;
    text-decoration: none
}

#commentComponent-beta .comm-form .comm-input-ctrl .comm-emotion:hover {
    background: url(/static/img/emotions.5bab111.png) 12px no-repeat;
    background-size: 16px;
    color: #00a786
}

#commentComponent-beta .comm-form .comm-input-ctrl .comm-enter {
    right: 0;
    background-image: url(/static/img/fly.885bcb2.png);
    background-size: 15px 14px
}

#commentComponent-beta .comm-form .comm-input-ctrl .comm-enter,#commentComponent-beta .comm-form .comm-input-ctrl .comm-publish {
    position: absolute;
    top: 0;
    height: 30px;
    line-height: 30px;
    width: 100px;
    padding: inherit;
    padding-left: 20px;
    margin: 0!important;
    border: none;
    transition: all .3s;
    border-radius: 15px;
    background-repeat: no-repeat;
    background-position: 15px
}

#commentComponent-beta .comm-form .comm-input-ctrl .comm-publish {
    left: 0;
    background-color: #ec9b2f;
    background-image: url(/static/img/webShape.8c3dc67.png);
    background-size: 14px 9px;
    animation-duration: .4s;
    animation-name: show;
    overflow: hidden
}

#commentComponent-beta .comm-form .comm-input-ctrl .comm-publish:hover {
    background-color: #ec8014
}

@keyframes show {
    0% {
        width: 0
    }

    to {
        width: 100px
    }
}

@keyframes cancel {
    0% {
        padding-left: 20px;
        left: 0
    }

    to {
        padding-left: 0;
        left: -100px
    }
}

#commentComponent-beta .comm-input-emoticons {
    position: absolute;
    top: 30px;
    left: 0;
    display: none;
    visibility: hidden;
    width: 305px;
    height: 227px;
    opacity: 0
}

#commentComponent-beta .comm-input-emoticons:after,#commentComponent-beta .comm-input-emoticons:before {
    content: " ";
    display: table
}

#commentComponent-beta .comm-input-emoticons:after {
    clear: both
}

#commentComponent-beta .comm-input-emoticons .emotions-box {
    border-radius: 4px;
    border: 1px solid #e5e9ef;
    transition: opacity .3s;
    position: absolute;
    margin-top: 10px;
    background: #fff;
    z-index: 200;
    width: 305px;
    height: 215px;
    overflow-y: scroll;
    padding: 5px;
    box-shadow: 0 3px 20px 0 rgba(0,0,0,.1)
}

@media (max-width: 576px) {
    #commentComponent-beta .comm-input-emoticons .emotions-box {
        width:230px
    }
}

#commentComponent-beta .comm-input-emoticons .emotions-box .comm-input-emoticons-item {
    width: 60px;
    height: 60px;
    margin: 5px;
    display: block;
    float: left
}

#commentComponent-beta .comm-input-emoticons .emotions-box .comm-input-emoticons-item img {
    width: 100%;
    height: 100%
}

#commentComponent-beta .comm-input-emoticons .emotions-box::-webkit-scrollbar {
    width: 8px;
    height: 8px;
    background-color: #ccc
}

#commentComponent-beta .comm-input-emoticons .emotions-box::-webkit-scrollbar-track {
    background-color: #fafafa
}

#commentComponent-beta .comm-input-emoticons .emotions-box::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background-color: #ccc
}

#commentComponent-beta .comm-input-emoticons.show {
    opacity: 1;
    visibility: visible;
    display: block
}

#commentComponent-beta .comm-input-emoticons:before {
    position: absolute;
    z-index: 201;
    top: 5px;
    left: 30px;
    transform: rotate(45deg);
    background: #fff;
    width: 10px;
    height: 10px;
    border-left: 1px solid #e5e9ef;
    border-top: 1px solid #e5e9ef
}

#commentComponent-beta .comm-item {
    padding: 5px;
    position: relative
}

#commentComponent-beta .comm-item+.comm-item {
    margin-top: 10px
}

#commentComponent-beta .comm-item+.comm-item .comm-item-body {
    padding-top: 20px
}

#commentComponent-beta .comm-item+.comm-item .comm-split-line {
    position: absolute;
    border-top: 1px solid #e5e9ef;
    left: 69px;
    right: 0;
    top: 0
}

#commentComponent-beta .comm-item+.comm-item .comm-item-left {
    padding-top: 30px
}

#commentComponent-beta .comm-item .comm-item-body {
    padding-left: 70px;
    position: relative
}

#commentComponent-beta .comm-item .comm-item-body .comm-content {
    word-wrap: break-word;
    line-height: 28px;
    white-space: normal;
    color: #111;
    margin: 8px 0
}

#commentComponent-beta .comm-item .comm-item-body .comm-content .emoticon {
    width: 60px;
    height: 60px;
    vertical-align: text-bottom
}

#commentComponent-beta .comm-item .comm-item-body .comm-actual-content {
    white-space: pre-wrap
}

#commentComponent-beta .comm-item .comm-hint a,#commentComponent-beta .comm-item .comm-name a {
    font-size: 13px;
    font-weight: 700;
    color: #888;
    text-decoration: none
}

#commentComponent-beta .comm-item .level {
    display: inline-block;
    width: 17px;
    height: 7px;
    margin: 0 10px;
    background-position: top;
    background-size: contain;
    background-repeat: no-repeat
}

#commentComponent-beta .comm-item .level0 {
    background-image: url(/static/img/icon_little_lv0@2x.fcf1072.png)
}

#commentComponent-beta .comm-item .level1 {
    background-image: url(/static/img/icon_little_lv1@2x.27ded23.png)
}

#commentComponent-beta .comm-item .level2 {
    background-image: url(/static/img/icon_little_lv2@2x.4426218.png)
}

#commentComponent-beta .comm-item .level3 {
    background-image: url(/static/img/icon_little_lv3@2x.872a34b.png)
}

#commentComponent-beta .comm-item .level4 {
    background-image: url(/static/img/icon_little_lv4@2x.bcfe13c.png)
}

#commentComponent-beta .comm-item .level5 {
    background-image: url(/static/img/icon_little_lv5@2x.fc72cfa.png)
}

#commentComponent-beta .comm-item .level6 {
    background-image: url(/static/img/icon_little_lv6@2x.40496b2.png)
}

#commentComponent-beta .comm-item .comm-avatar {
    margin: auto;
    position: absolute;
    top: 5px;
    left: -68px
}

#commentComponent-beta .comm-item .comm-controls {
    position: relative;
    width: 100%;
    font-size: 12px
}

#commentComponent-beta .comm-item .comm-controls:after,#commentComponent-beta .comm-item .comm-controls:before {
    content: " ";
    display: table
}

#commentComponent-beta .comm-item .comm-controls:after {
    clear: both
}

#commentComponent-beta .comm-item .comm-controls a {
    color: #999;
    display: inline-block;
    font-weight: 700;
    text-decoration: none
}

#commentComponent-beta .comm-item .comm-controls a:hover {
    text-decoration: none;
    opacity: .6
}

#commentComponent-beta .comm-item .comm-controls a+a {
    margin-left: 8px
}

#commentComponent-beta .comm-item .comm-controls .comm-date {
    margin-right: 10px
}

#commentComponent-beta .comm-item .comm-controls .comm-ctrl-like {
    background: url(/static/img/like.d51c130.png) no-repeat 0;
    background-size: 14px;
    padding-left: 16px;
    display: inline-block;
    vertical-align: bottom;
    height: 16px
}

#commentComponent-beta .comm-item .comm-controls .comm-ctrl-like.liked {
    background: url(/static/img/liked.c50c646.png) no-repeat 0;
    background-size: 14px
}

#commentComponent-beta .comm-item .comm-controls .comm-ctrl-report {
    position: absolute;
    top: 0;
    right: 0;
    visibility: hidden;
    transition: visibility .3s
}

#commentComponent-beta .comm-item .comm-status {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    color: #999
}

#commentComponent-beta .comm-body {
    position: relative
}

#commentComponent-beta .comm-body:hover .comm-ctrl-report {
    visibility: visible
}

#commentComponent-beta .comm-body .comm-input-emoticons:before {
    top: 5px;
    left: 30px
}

#commentComponent-beta .comm-body .comm-input-emoticons .emotions-box {
    position: absolute;
    top: 0;
    left: 0
}

#commentComponent-beta .comm-list {
    position: relative
}

#commentComponent-beta .comm-list.replies {
    margin-top: 15px
}

@media (max-width: 576px) {
    #commentComponent-beta .comm-list.replies {
        margin-left:-40px
    }
}

#commentComponent-beta .comm-list.replies .comm-split-line {
    display: none
}

#commentComponent-beta .comm-list.replies .comm-item {
    padding: 0
}

#commentComponent-beta .comm-list.replies .comm-item .comm-item-body {
    padding-left: 36px;
    border: none;
    padding-top: 0
}

#commentComponent-beta .comm-list.replies .comm-item .comm-item-body .comm-content {
    font-size: 14px;
    margin: 0
}

#commentComponent-beta .comm-list.replies .comm-item .comm-avatar {
    top: 5px;
    left: -36px;
    width: 24px;
    height: 24px
}

#commentComponent-beta .comm-list.replies .comm-item .comm-hint {
    font-size: 13px
}

#commentComponent-beta .comm-list.replies .comm-item .comm-status .comm-controls a {
    color: #999
}

@media (max-width: 1399px) {
    #commentComponent-beta .comm-list.replies .comm-item .comm-item-left {
        display:none
    }

    #commentComponent-beta .comm-list.replies .comm-item .comm-item-body {
        margin-left: 0
    }
}

#commentComponent-beta .comm-list.replies .comm-list-pagination {
    position: relative!important
}

#commentComponent-beta .comm-list .comm-expand {
    border-radius: 4px;
    background: #fafafa;
    border: 1px solid #eee;
    height: 40px;
    margin-top: 20px;
    line-height: 40px;
    text-align: center;
    display: block;
    color: #999;
    text-decoration: none
}

#commentComponent-beta .comm-list .comm-expand:focus,#commentComponent-beta .comm-list .comm-expand:hover {
    text-decoration: none
}

#commentComponent-beta .comm-list .comm-hide {
    display: none
}

#commentComponent-beta .comm-list .comm-list-pagination {
    text-align: center
}

#commentComponent-beta .comm-list .comm-list-pagination .pagination {
    margin: 0 auto
}

#commentComponent-beta .comm-list .comm-list-pagination .pagination a,#commentComponent-beta .comm-list .comm-list-pagination .pagination span {
    padding: 4px 8px;
    margin: 3px;
    border-radius: 4px
}

#commentComponent-beta .comm-list .comm-list-pagination .pagination .active>span {
    color: #00a786;
    background: #fff;
    border-color: #00a786
}

#commentComponent-beta .comm-list .comm-list-pagination .pagination .disabled span {
    background: #f5f5f5;
    text-shadow: -1px -1px #fff
}

#commentComponent-beta .comm-list .comm-list-pagination .pagination a {
    color: #666
}

#commentComponent-beta .comm-list.comm-main-list {
    margin-top: 20px
}

#commentComponent-beta .comm-list.comm-main-list.has-pagination {
    padding-bottom: 74px
}

#commentComponent-beta .comm-list.comm-main-list .comm-list-pagination {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0
}

#commentComponent-beta .comm-author {
    color: #006b56
}

#commentComponent-beta .text-expander.text-expander-disabled .text-content-wrapper {
    padding-bottom: 0
}

#commentComponent-beta .comm-hint {
    position: relative;
    color: #a9a9a9;
    margin: 10px 0
}

#commentComponent-beta .comm-list.comm-main-list.has-pagination {
    padding-bottom: 75px
}

#commentComponent-beta.comm-box {
    max-width: 720px;
    height: 195px
}

#commentComponent-beta.comm-box .comm-form {
    padding-top: 40px
}

.content-limit {
    overflow: hidden;
    height: 195px
}

.see-more {
    cursor: pointer;
    display: inline-block;
    font-weight: 700
}

.circle-block {
    position: absolute;
    right: 115px;
    bottom: 0
}

.circle-block:hover .comm-tip {
    opacity: .6
}

.circle {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    border: 3px solid #eee
}

.comm-tip {
    position: absolute;
    top: -35px;
    right: -50px;
    width: 132px;
    height: 23px;
    line-height: 23px;
    background: #000;
    opacity: 0;
    border-radius: 4px;
    font-size: 12px;
    color: #fff;
    text-align: center;
    transition: opacity .4s;
    animation: move-tip 2s
}

.comm-tip:after {
    position: absolute;
    right: 55px;
    bottom: -18px;
    content: "";
    border: 9px solid;
    border-color: #000 transparent transparent;
    height: 0;
    width: 0
}

@keyframes move-tip {
    0% {
        opacity: 0
    }

    to {
        opacity: .6
    }
}

.comm-tips {
    position: absolute;
    top: -35px;
    right: 40px;
    width: 180px;
    height: 23px;
    line-height: 23px;
    background: #000;
    border-radius: 4px;
    font-size: 12px;
    color: #fff;
    text-align: center;
    opacity: 0;
    padding: 0 5px;
    transition: opacity .5s
}

.comm-tips:after {
    position: absolute;
    right: 80px;
    bottom: -18px;
    content: "";
    border: 9px solid;
    border-color: #000 transparent transparent;
    height: 0;
    width: 0
}

.comm-tips.show {
    opacity: .6
}

#comm-change {
    position: absolute;
    right: 115px;
    bottom: 0
}

.circle-animate {
    position: relative;
    cursor: pointer;
    border: 0;
    background-color: #ec9b2f;
    background-image: url(/static/img/webShape.8c3dc67.png);
    background-size: 14px 9px;
    background-repeat: no-repeat;
    background-position: 50%;
    animation-duration: .6s;
    animation-name: warn
}

@keyframes warn {
    0% {
        background-color: #fff;
        transform: scale(.4);
        opacity: 0
    }

    to {
        background-color: #ec9b2f;
        transform: scale(1);
        opacity: 1
    }
}

#circle-change {
    right: 0
}

#circle-change,.fly {
    position: absolute;
    width: 30px;
    height: 30px;
    z-index: 2;
    bottom: 0
}

.fly {
    cursor: pointer;
    left: 0;
    border-radius: 50%;
    background-color: #00a786;
    background-image: url(/static/img/fly.885bcb2.png);
    background-size: 15px 14px;
    background-repeat: no-repeat;
    background-position: 50%;
    animation-name: none;
    animation-duration: .2s
}

@keyframes fly {
    0% {
        width: 30px;
        opacity: 1
    }

    to {
        width: 0;
        opacity: 0
    }
}

.btn-box {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 100px;
    height: 30px;
    border-radius: 15px;
    overflow: hidden
}

.media-body {
    overflow: inherit
}

.profile-body {
    padding: 40px 60px 5px
}

.profile-title {
    font-size: 22px;
    font-weight: 700;
    color: #333;
    margin-bottom: 20px
}

.profile-subTitle {
    color: #999;
    font-size: 14px;
    margin-bottom: 10px
}

.profile-select {
    width: 35%;
    height: 38px;
    appearance: none;
    -moz-appearance: none;
    -webkit-appearance: none;
    background: url(/static/img/icon_open.b19c903.png) no-repeat 80px;
    padding: 0 15px
}

.profile-new {
    border: 1px solid #333
}

.profile-new,.profile-new-phone {
    display: flex;
    justify-content: space-between
}

.profile-new-phone {
    align-items: center;
    width: 100%
}

.profile-split {
    width: 1px;
    height: 13px;
    background-color: #000;
    display: block;
    margin-left: 20px;
    margin-right: 10px
}

.profile-reset {
    border: none;
    box-shadow: none;
    height: 40px
}

.profile-input {
    height: 40px;
    line-height: 40px
}

.btn-profile {
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 0;
    background-color: #333;
    border: 1px solid #333!important;
    border-radius: inherit;
    color: #fff
}

.btn-profile:hover {
    border-color: inherit;
    background-color: #000
}

.btn-profile.disable {
    pointer-events: none;
    background-color: #ccc;
    color: #000
}

.profile-error {
    color: #cb4c4c;
    font-size: 14px;
    height: 40px;
    line-height: 40px;
    text-align: left;
    float: left;
    padding-left: 25px;
    background: url(/static/img/icon_error.91cd75c.png) no-repeat 0
}

.profile-footer {
    padding: 20px 60px 30px
}

.select-country {
    position: relative
}

.select-country .country-code {
    cursor: pointer;
    display: block;
    width: 100px;
    height: 40px;
    color: #666;
    font-size: 15px;
    text-align: left;
    padding-left: 15px;
    line-height: 40px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.select-country .country-code:after {
    position: absolute;
    top: 35%;
    right: -10px;
    content: " ";
    display: block;
    background-image: url(/static/img/icon_open.b19c903.png);
    background-repeat: no-repeat;
    width: 8px;
    height: 13px
}

.select-country .country-select {
    position: absolute;
    z-index: 1;
    top: -1px;
    left: -1px;
    width: 210px;
    height: 310px;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 2px 2px 16px 0 rgba(0,0,0,.4);
    visibility: hidden
}

.select-country .country-select:after {
    position: absolute;
    z-index: 2;
    top: 0;
    right: 15px;
    content: " ";
    width: 1px;
    height: 100%;
    background-color: #eee
}

.select-country .country-select .country-options {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 1;
    width: 200px;
    height: 300px;
    border-radius: 10px;
    overflow-y: auto;
    background-color: #fff
}

.select-country .country-select .country-options ul {
    list-style: none;
    padding: 0;
    margin: 0
}

.select-country .country-select .country-options ul li {
    cursor: pointer;
    width: 190px;
    height: 40px;
    line-height: 40px;
    font-size: 15px;
    color: #666;
    padding-left: 15px;
    overflow: hidden
}

.select-country .country-select .country-options ul li:hover {
    background-color: #eee
}

.select-country .country-select .country-options::-webkit-scrollbar {
    width: 3px;
    height: 3px;
    background-color: #ebebeb
}

.select-country .country-select .country-options::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    border-radius: 10px;
    background-color: #ebebeb
}

.select-country .country-select .country-options::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 10px rgba(0,0,0,.3);
    background-color: #c5c5c5
}

.profile-modal {
    margin: 35px 0
}

.profile-bg {
    margin: 0 auto;
    width: 141px;
    height: 145px;
    background-image: url(/static/img/icon_finish.0bdbecc.png)
}

.success-text {
    color: #25c2a3;
    font-size: 24px;
    font-weight: 700;
    text-align: center;
    margin-top: 15px;
    margin-bottom: 30px
}

.profile-close {
    cursor: pointer;
    margin: 0 auto;
    width: 35px;
    height: 35px;
    background-image: url(/static/img/icon_ecs.9e7ab36.png)
}

.checking {
    color: #aaa;
    min-width: 110px
}

.checking,.checking-bubble {
    margin-top: 10px;
    font-size: 13px
}

.checking-bubble {
    width: 140px;
    height: 68px;
    background: #fffcdf;
    border: 2px solid #ffefd0;
    border-radius: 2px;
    text-align: left;
    padding: 15px;
    margin-left: -15px
}

.search-menu {
    position: relative;
    height: 85px;
    margin-top: -50px;
    padding-top: 30px;
    padding-left: 50px;
    border-top-left-radius: 26px;
    border-top-right-radius: 26px;
    background: linear-gradient(180deg,hsla(0,0%,100%,.5),#fff 50%);
    display: flex;
    align-items: center
}

.search-menu .search-header {
    display: flex;
    align-items: center;
    margin-bottom: 20px
}

.search-menu .search-header .search-logo {
    width: 48px;
    height: 32px;
    background-image: url(/static/img/title_search.e18d1a9.png)
}

.search-menu .search-header .search-line {
    width: 1px;
    height: 20px;
    background: #eee;
    border-radius: 1px;
    margin: 0 30px
}

.search-menu .search-header .search-keyword {
    width: 425px;
    height: 40px;
    background: #fff;
    border: 1px solid #ccc;
    border-right: 0;
    border-radius: 4px;
    outline: none;
    padding: 0 15px
}

.search-menu .search-header .search-keyword:focus {
    box-shadow: 0 0 10px 0 rgba(77,180,207,.35)
}

.search-menu .search-header .btn-search-kw {
    cursor: pointer;
    margin-left: -80px;
    width: 80px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    background: #4dcfb4;
    border: none;
    border-top-right-radius: 5px;
    border-bottom-right-radius: 5px;
    font-size: 14px;
    font-weight: 700;
    color: #fff;
    background-image: url(/static/img/tab_icon_search.6466a21.png);
    background-position: 15px;
    background-repeat: no-repeat;
    padding-left: 20px
}

.search-title {
    padding-left: 50px;
    display: flex;
    align-items: center
}

.search-title .icon-dot_search {
    width: 5px;
    height: 15px;
    background-color: #4dcfb4;
    margin-right: 10px
}

.search-list {
    margin: 50px 0
}

.rank-book-list {
    position: relative;
    margin-top: 30px;
    padding-bottom: 40px
}

.rank-book-list a {
    text-decoration: none;
    color: #333
}

.rank-book-list .search-book {
    text-decoration: none;
    position: relative;
    height: 195px;
    display: flex;
    margin-top: 40px;
    transition: all .3s;
    transform: translateY(0)
}

.rank-book-list .search-book:hover {
    transform: translateY(-5%)
}

.rank-book-list .search-book:first-of-type {
    margin-top: 0
}

.rank-book-list .search-book:last-of-type:after {
    display: none
}

.rank-book-list .search-book .book-draw {
    position: relative;
    z-index: 1;
    width: 100%;
    padding: 0 50px;
    display: flex
}

.rank-book-list .search-book .book-draw .book-cover {
    min-width: 130px;
    width: 130px;
    height: 195px;
    box-shadow: 0 3px 12px 0 hsla(0,0%,60%,.44)
}

.rank-book-list .search-book .book-draw .book-cover img {
    width: 100%;
    height: 100%
}

.rank-book-list .search-book .book-draw .book-box {
    position: relative;
    z-index: 1;
    width: 100%;
    padding: 15px 0;
    margin-left: 40px;
    display: flex;
    justify-content: space-between
}

.rank-book-list .search-book .book-draw .book-box .book-info {
    width: 100%
}

.rank-book-list .search-book .book-draw .book-box .book-info .book-name {
    font-size: 20px;
    color: #333;
    text-decoration: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.rank-book-list .search-book .book-draw .book-box .book-info .book-tags {
    margin-top: 5px;
    margin-bottom: 15px;
    display: flex
}

.rank-book-list .search-book .book-draw .book-box .book-info .book-tags .book-tag {
    cursor: pointer;
    position: relative;
    min-width: 60px;
    height: 24px;
    padding: 0 15px;
    line-height: 24px;
    font-size: 14px;
    border-radius: 12px;
    text-align: center;
    background-color: #25c2a3;
    color: #fff;
    margin-right: 10px;
    transition: all .3s
}

.rank-book-list .search-book .book-draw .book-box .book-info .book-tags .book-tag:hover a {
    opacity: .8
}

.rank-book-list .search-book .book-draw .book-box .book-info .book-tags .book-tag a {
    color: #fff;
    text-decoration: none;
    opacity: 1;
    transition: all .3s;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.rank-book-list .search-book .book-draw .book-box .book-info .book-tags .book-tag.special {
    height: 24px;
    line-height: 24px;
    background-color: #00b7ee
}

.rank-book-list .search-book .book-draw .book-box .book-info .book-tags .book-tag.special a {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.rank-book-list .search-book .book-draw .book-box .book-info .book-tags .book-tag::last-of-type {
    margin-right: 0
}

.rank-book-list .search-book .book-draw .book-box .book-info .book-intro {
    height: 72px;
    font-size: 14px;
    color: #333;
    line-height: 25px;
    overflow: hidden
}

.rank-book-list .search-book .book-draw .book-box .book-info .book-extra {
    margin-top: 10px;
    font-size: 12px;
    color: #999
}

.article-zone {
    margin-top: 25px
}

.article-zone .article-vol-title {
    position: relative;
    color: #333;
    font-size: 18px;
    margin-bottom: 20px;
    padding-left: 65px
}

.article-zone .article-vol-title:after {
    content: " ";
    position: absolute;
    top: 50%;
    left: 50px;
    transform: translateY(-50%);
    width: 5px;
    height: 15px;
    background-color: #4dcfb4
}

.article-zone .article-vol {
    display: flex;
    justify-content: space-between;
    transition: all .3s;
    margin-bottom: 30px;
    text-decoration: none;
    font-size: 14px;
    color: #333
}

.article-zone .article-vol:hover {
    transform: translateY(-5%)
}

.article-zone .article-vol .article-cover {
    margin-left: 50px;
    display: block;
    width: 240px
}

.article-zone .article-vol .article-info {
    padding-left: 40px;
    padding-right: 50px;
    width: 100%
}

.article-zone .article-vol .article-info .article-header {
    display: flex;
    justify-content: space-between;
    align-items: center
}

.article-zone .article-vol .article-info .article-header .article-title {
    color: #333;
    text-decoration: none;
    font-size: 20px;
    width: 650px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

@media screen and (max-width: 1399px) {
    .article-zone .article-vol .article-info .article-header .article-title {
        width:550px
    }
}

.article-zone .article-vol .article-info .article-header .btn-vol {
    width: 78px;
    height: 28px;
    line-height: 28px;
    text-align: center;
    color: #4dcfb4;
    border: 1px solid #ccc;
    border-radius: 8px;
    text-decoration: none;
    background-color: #f6f6f6
}

.article-zone .article-vol .article-info .article-author .article-update {
    color: #999
}

.article-zone .article-vol .article-info .article-detail {
    height: 56px;
    line-height: 28px;
    margin-top: 20px;
    overflow: hidden
}

.c1 {
    color: #ffaf88
}

.c2 {
    color: #51caac
}

.c3 {
    color: #639dff
}

.c4 {
    font-size: 13px;
    color: #666
}

.c5 {
    background-color: #eee
}

.c6 {
    background-color: #ddd
}

.c5-short {
    width: 130px
}

.c6-extra {
    width: 234px
}

p {
    margin: 0
}

table {
    margin-top: 30px;
    border-collapse: separate
}

table tr {
    height: 45px
}

table tr td {
    padding-left: 40px;
    border: 1px solid #fff
}

table tr td:first-child {
    width: 180px
}

table tr td:last-child {
    width: 144px
}

.sub-detail {
    margin-top: 20px
}

.main-sign {
    width: 730px;
    margin: 0 auto;
    padding-top: 25px
}

.main-sign .banner-sign {
    height: 160px;
    border-radius: 10px;
    background-image: url(/static/img/other1_1140_banner1.0f1fed6.jpg)
}

.main-sign .gray-box {
    margin-top: 20px;
    box-sizing: border-box;
    padding: 20px;
    background: #eee;
    text-align: center;
    line-height: 24px
}

.main-sign .gray-box p {
    margin: 0;
    font-size: 14px
}

.main-sign .section-title {
    font-size: 24px;
    font-weight: 700;
    color: #333;
    margin-top: 40px
}

.main-sign .sub-title {
    margin-top: 30px;
    text-align: center;
    font-size: 24px;
    font-weight: 700;
    color: #51caac
}

.main-sign .section-text {
    width: 350px;
    text-align: center;
    margin: 0 auto;
    margin-top: 10px;
    font-size: 14px
}

.main-sign .level-list {
    width: 445px;
    margin: 0 auto;
    margin-top: 40px;
    display: flex;
    justify-content: space-between
}

.main-sign .level-list .level .level-s {
    width: 75px;
    height: 75px;
    background-image: url(/static/img/s.db33ec8.png)
}

.main-sign .level-list .level .level-a {
    width: 75px;
    height: 75px;
    background-image: url(/static/img/a.67ea988.png)
}

.main-sign .level-list .level .level-b {
    width: 75px;
    height: 75px;
    background-image: url(/static/img/b.387930a.png)
}

.main-sign .level-list .level .level-money {
    margin-top: 20px;
    font-size: 16px;
    font-weight: 700
}

.main-sign .level-list .level .level-words {
    margin-top: 5px;
    text-align: center;
    font-size: 12px;
    color: #333
}

.main-sign .feature-list {
    margin-top: 60px;
    display: flex;
    height: 100%;
    justify-content: space-between;
    padding-bottom: 45px;
    border-bottom: 1px solid #ccc
}

.main-sign .feature-list .feature {
    height: 100%
}

.main-sign .feature-list .feature .feature-title {
    color: #333;
    font-size: 20px;
    font-weight: 700;
    margin-bottom: 15px
}

.main-sign .feature-list .feature p {
    margin: 0;
    line-height: 28px
}

.main-sign .feature-list .feature-line {
    align-self: center;
    width: 1px;
    height: 196px;
    background-color: #ccc
}

.main-sign .dash-bordered {
    margin-top: 30px;
    height: 265px;
    background-image: url(/static/img/other1_1140_mod1@bg1.2a8875e.png);
    background-repeat: no-repeat;
    background-position: top -10px right -160px;
    padding: 45px 40px;
    border: 1px dashed #ccc;
    border-radius: 10px
}

.main-sign .dash-bordered .dash-text {
    font-size: 18px;
    margin-bottom: 20px;
    display: flex
}

.main-sign .dash-bordered .dash-text p {
    margin: 0
}

.main-sign .dash-bordered .dash-text span {
    margin-left: 30px
}

.main-sign .dash-intro {
    margin: 0 auto;
    margin-top: 40px;
    width: 546px;
    line-height: 24px;
    text-align: center
}

.main-sign .dash-intro p {
    margin: 0
}

.main-sign .section-third {
    margin-top: 50px
}

.main-sign .section-grid {
    position: relative;
    display: grid;
    grid-template-columns: repeat(2,1fr);
    grid-column-gap: 40px;
    padding-bottom: 40px
}

.main-sign .section-grid .sub-title {
    text-align: left
}

.main-sign .section-grid .grid-intro {
    margin-top: 10px;
    text-align: left;
    line-height: 24px
}

.main-sign .section-grid .grid-intro p {
    margin: 0
}

.main-sign .section-grid .grid-tip {
    margin-top: 20px;
    color: #666;
    font-size: 12px
}

.main-sign .grid-line {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 1px;
    background-color: #ccc
}

.main-sign .section-flex {
    position: relative;
    display: flex;
    align-items: center;
    padding-bottom: 40px
}

.main-sign .section-flex .grid-award+.grid-award {
    margin-left: 55px
}

.main-sign .section-flex .sub-title {
    text-align: left
}

.main-sign .section-flex .flex-text {
    margin-top: 10px
}

.main-sign .section-flex .flex-text p {
    margin: 0
}

.main-sign .section-flex table {
    margin-top: 30px;
    border-collapse: separate
}

.main-sign .section-flex table tr {
    height: 45px
}

.main-sign .section-flex table tr td {
    padding-left: 40px;
    border: 1px solid #fff
}

.main-sign .section-flex table tr td:first-child {
    width: 130px
}

.main-sign .section-flex table tr td:last-child {
    padding-left: 25px;
    width: 234px
}

.main-sign .intro-block {
    margin-top: 30px;
    border-radius: 8px;
    padding: 30px 70px;
    border: 1px dashed #ccc;
    position: relative;
    background: url(/static/img/other1_1140_mod3@bg1.6d5c6e5.png) 100% 20% no-repeat
}

.main-sign .intro-block.cry {
    background: url(/static/img/other1_1140_mod3@bg2.1fd2cdf.png) 100% 20% no-repeat
}

.main-sign .intro-block .section-title {
    margin: 0
}

.main-sign .intro-block .intro-text {
    margin-top: 10px;
    width: 436px
}

.main-sign .intro-block .intro-text .a-outline {
    color: #2388ff;
    text-decoration: none
}

.main-sign .intro-block .left-bar {
    border-right: 1px dashed #ccc;
    width: 20px;
    top: 0;
    left: 0;
    bottom: 0;
    position: absolute;
    background: url(/static/img/green.884223e.png)
}

.main-sign .intro-block .left-bar.red {
    background: url(/static/img/red.305cd36.png)
}

* {
    padding: 0;
    margin: 0;
    box-sizing: border-box
}

.title-header {
    width: 100%;
    height: 230px;
    border-radius: 4px;
    background-image: url(/static/img/title_bg.6659fd1.jpg);
    background-size: cover;
    background-position: top;
    background-repeat: no-repeat;
    display: flex;
    align-items: center;
    padding: 0 60px
}

.title-header .title-center {
    position: relative;
    width: 720px;
    height: 150px;
    background: #fff;
    box-shadow: 0 0 20px 0 hsla(0,0%,80%,.2);
    border-radius: 4px
}

.title-header .title-center .title-avatar {
    position: absolute;
    top: 30px;
    left: 35px;
    width: 60px;
    height: 60px;
    border-radius: 50%
}

.title-header .title-center .title-content {
    position: absolute;
    top: 33px;
    left: 115px;
    width: 75%;
    height: 95px;
    overflow: hidden
}

.title-header .title-center .title-content .title-nick {
    font-size: 16px;
    font-weight: 700;
    color: #666;
    display: flex;
    align-items: center;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis
}

.title-header .title-center .title-content .title-long {
    margin-top: 20px;
    width: 100%;
    height: 15px;
    background-color: #e4e4e4
}

.title-header .title-center .title-content .title-bottom {
    margin-top: 15px;
    display: flex;
    justify-content: flex-start
}

.title-header .title-center .title-content .title-bottom .title-item {
    width: 65px;
    height: 15px;
    background-color: #e4e4e4;
    margin-right: 15px
}

.title-show {
    width: 74px;
    height: 26px;
    line-height: 26px;
    background: #f6f6f6;
    border: 1px solid #ccc;
    box-shadow: 0 2px 4px 0 hsla(0,0%,80%,.24);
    border-radius: 4px;
    font-size: 14px;
    font-weight: 400;
    color: #0ca281
}

.title-show.active {
    text-align: center;
    width: 74px;
    padding: 0 5px;
    border: 1px solid #009d7b;
    border-radius: 4px;
    background-color: #fff;
    overflow: hidden;
    word-break: keep-all;
    text-overflow: ellipsis
}

.title-image {
    margin-right: 15px
}

.title-menu {
    margin-top: 70px;
    padding: 0 20px
}

.title-menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex
}

.title-menu ul li {
    float: left;
    margin-right: 30px
}

.title-menu ul li a {
    display: block;
    width: 70px;
    text-align: center;
    font-size: 16px;
    color: #666;
    text-decoration: none
}

.title-menu ul li a.active {
    position: relative
}

.title-menu ul li a.active .choose {
    position: absolute;
    left: 50%;
    bottom: -5px;
    transform: translateX(-50%);
    width: 85%;
    height: 3px;
    background-color: #009d7b
}

.title-menu ul li a.active .choose:after {
    content: "";
    position: absolute;
    border: 4px solid;
    border-color: transparent transparent #009d7b;
    left: 50%;
    top: -7px;
    transform: translateX(-50%);
    height: 0;
    width: 0
}

.title-table {
    margin: 30px 0
}

.title-table .title-thead {
    padding: 0 20px;
    height: 40px;
    line-height: 40px;
    background-color: #e1faf5;
    display: flex
}

.title-table .title-thead .thead-item {
    font-size: 14px;
    color: #333;
    flex: 1
}

.title-table .title-body {
    padding: 0 20px
}

.title-table .title-body .body-list {
    display: flex;
    align-items: center;
    height: 90px;
    background-color: #fff;
    overflow: hidden
}

.title-table .title-body .body-list.active {
    background-color: rgba(224,247,242,.15)
}

.title-table .title-body .body-list .body-item {
    flex: 1;
    overflow-y: auto
}

.title-table .title-body .body-list .body-item .btn-putOn {
    width: 80px;
    height: 27px;
    border: none;
    outline: none;
    background: #009d7b;
    border-radius: 4px;
    color: #fff
}

.title-table .title-body .body-list .body-item .btn-putOff {
    width: 80px;
    height: 27px;
    border: none;
    outline: none;
    border: 1px solid #009d7b;
    border-radius: 4px;
    color: #009d7b;
    background-color: #fff
}

.title-table .title-body .body-list .body-item:nth-of-type(3) {
    flex: 3;
    font-size: 12px;
    color: #666
}

.cat-container {
    position: relative;
    margin: 0 auto
}

.cat-container .cat-header {
    margin: 35px 40px;
    margin-bottom: 15px;
    width: 52px;
    height: 32px;
    background-image: url(/static/img/variety.9a5d6e8.png)
}

.cat-container .tag-header {
    margin: 35px 40px;
    margin-bottom: 15px;
    line-height: 32px;
    height: 32px
}

.cat-container .rank-content {
    float: none;
    box-shadow: none;
    width: 100%;
    background-color: #fff
}

.cat-container .rank-content .rank-book-list .rank-book {
    max-width: 100%
}

.cat-container .rank-content .rank-book-list .rank-book .book-draw .book-box {
    width: calc(100% - 170px)
}

.cat-container .rank-content .rank-book-list .rank-book .book-draw .book-box .book-info {
    width: 100%
}

.cat-container .rank-content .rank-book-list .rank-book .book-draw .book-box .book-info .book-name {
    display: block;
    width: 100%
}

.cat-container .rank-content .rank-book-list .rank-book .book-draw .book-box .book-info .book-tags .book-tag {
    background-color: #25c2a3;
    color: #fff;
    opacity: .8
}

.cat-container .rank-content .rank-book-list .rank-book .rank-book-mask .book-mask-right ul.vol-chapter,.cat-container .rank-content .rank-book-list .rank-book .rank-book-mask .book-mask-right ul.vol-chapter li a p {
    width: 100%
}

.cat-container .rank-content .rank-book-list .rank-book-grid {
    width: 100%;
    justify-content: flex-start
}

.cat-container .rank-content .rank-book-list .rank-book-grid .book-box {
    margin-left: 30px;
    width: 65%
}

.cat-container .rank-content .rank-book-list .rank-book-grid .book-box .book-info {
    width: 100%
}

.cat-container .rank-content .rank-book-list .rank-book-grid .book-box .book-info .book-tags .book-tag {
    background-color: #25c2a3;
    color: #fff
}

.cat-container .rank-content .rank-book-list .rank-book-grid .book-box .book-name {
    width: 100%!important
}

.cat-container .rank-content .rank-book-list .rank-book-grid .book-mask ul.vol-chapter,.cat-container .rank-content .rank-book-list .rank-book-grid .book-mask ul.vol-chapter li a p {
    width: 100%
}

.cat-container ul.order-list {
    position: fixed;
    z-index: 2;
    top: 450px;
    left: 50%;
    transform: translateX(-50%);
    width: 40px;
    height: 102px;
    margin-left: 630px;
    background: #fff;
    box-shadow: 0 3px 12px 0 hsla(0,0%,79%,.44);
    border-radius: 20px;
    transition: all .3s
}

@media screen and (min-width: 768px) {
    .cat-container ul.order-list {
        margin-left:550px
    }
}

@media (min-width: 1400px) {
    .cat-container ul.order-list {
        margin-left:630px
    }
}

.level-container {
    position: relative
}

.level-container .level-header {
    color: #666;
    font-size: 16px;
    font-weight: 700;
    padding-left: 22px;
    background-repeat: no-repeat;
    background-position: 0
}

.level-container .level-header.personal {
    background-image: url(/static/img/personal.f80ba04.png)
}

.level-container .level-header.daily {
    background-image: url(/static/img/daily_mission.f6c24cc.png)
}

.level-container .level-header.fixation {
    background-image: url(/static/img/fixation_mission.c9e7441.png)
}

.level-container .level-header.earnings {
    background-image: url(/static/img/earnings_works.a88416b.png)
}

.level-container .level-header.privacy {
    background-image: url(/static/img/privacy_detail.feac654.png)
}

.level-container .personal {
    position: relative
}

.level-container .personal .personal-box {
    position: relative;
    width: 760px;
    height: 215px;
    background-image: url(/static/img/personal_box.3b70a76.png)
}

.level-container .personal .personal-box .avatar {
    position: absolute;
    top: 27px;
    left: 71px;
    width: 75px;
    height: 75px;
    border-radius: 50%;
    border: 1px solid #f5f5f5
}

.level-container .personal .personal-box .personal-info {
    position: absolute;
    top: 62px;
    left: 165px;
    color: #333;
    width: 60%
}

.level-container .personal .personal-box .personal-info .personal-name {
    font-size: 16px;
    line-height: 16px;
    font-weight: 700;
    display: flex;
    align-items: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.level-container .personal .personal-box .personal-info .personal-name .personal-tit {
    height: 17px;
    border: 1px solid #47ddc4;
    border-radius: 3px;
    font-size: 12px;
    padding: 0 2px;
    font-weight: 400;
    text-align: center;
    color: #47ddc4;
    margin-right: 10px
}

.level-container .personal .personal-box .personal-info .personal-name .personal-medal {
    width: 55px
}

.level-container .personal .personal-box .personal-info .personal-sign {
    margin-top: 15px;
    font-size: 13px;
    line-height: 13px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.level-container .personal .personal-box .personal-level {
    position: absolute;
    top: 123px;
    left: 83px;
    display: flex;
    align-items: center;
    height: 18px
}

.level-container .personal .personal-box .personal-level .level-left {
    width: 67px;
    height: 18px;
    background-color: #47ddc4;
    border-radius: 3px;
    color: #fff;
    font-size: 13px;
    font-weight: 700;
    text-align: center
}

.level-container .personal .personal-box .personal-level .level-link {
    width: 13px;
    height: 4px;
    background: #47ddc4;
    border-radius: 2px;
    margin-left: -4px
}

.level-container .personal .personal-box .personal-level .level-progress {
    margin-left: -4px;
    width: 422px;
    height: 18px;
    background: #f6f6f6;
    border-radius: 3px;
    overflow: hidden
}

.level-container .personal .personal-box .personal-level .level-progress .progress-mask {
    width: 0;
    height: 100%;
    background-color: #47ddc4;
    transition: all .3s
}

.level-container .personal .personal-box .personal-level .level-info {
    cursor: pointer;
    font-size: 12px;
    color: #999;
    margin-left: 15px;
    display: flex;
    align-items: center
}

.level-container .personal .personal-box .personal-level .level-info .personal-tip {
    margin-left: 10px;
    width: 13px;
    height: 13px;
    background-image: url(/static/img/cardA_Notes.81554c8.png)
}

.level-container .personal .personal-box .personal-level .level-info .personal-tip:hover+.privacy-alert {
    display: block
}

.level-container .personal .personal-box .personal-data {
    position: absolute;
    left: 83px;
    bottom: 35px;
    display: flex;
    align-items: center
}

.level-container .personal .personal-box .personal-data .span-data {
    font-size: 15px;
    font-weight: 700;
    color: #333
}

.level-container .personal .personal-box .personal-data .span-data .personal-span {
    margin-right: 10px;
    font-size: 13px;
    color: #949494
}

.level-container .personal .personal-box .personal-data .span-line {
    width: 1px;
    height: 11px;
    background: #ccc;
    border-radius: 1px;
    margin: 0 25px
}

.level-container .personal-zone {
    margin-bottom: 45px
}

.level-container .personal-zone .mission-box {
    display: flex;
    flex-wrap: wrap
}

.level-container .personal-zone .mission-box .mission-item {
    position: relative;
    margin-top: 30px;
    width: 375px;
    display: flex
}

@media screen and (max-width: 1399px) {
    .level-container .personal-zone .mission-box .mission-item {
        width:345px
    }
}

.level-container .personal-zone .mission-box .mission-item.special {
    width: auto
}

.level-container .personal-zone .mission-box .mission-item .mission-cover {
    min-width: 80px;
    height: 80px
}

.level-container .personal-zone .mission-box .mission-item .mission-cover.active {
    background-image: url(/static/img/compelete.d1b32c0.png)
}

.level-container .personal-zone .mission-box .mission-item .mission-cover.book {
    background-image: url(/static/img/book.ba6eb3c.png)
}

.level-container .personal-zone .mission-box .mission-item .mission-cover.compelte {
    background-image: url(/static/img/compelete.d1b32c0.png)
}

.level-container .personal-zone .mission-box .mission-item .mission-cover.exp5 {
    background-image: url(/static/img/exp5.119bde8.png)
}

.level-container .personal-zone .mission-box .mission-item .mission-cover.exp10 {
    background-image: url(/static/img/exp10.afb96b3.png)
}

.level-container .personal-zone .mission-box .mission-item .mission-cover.exp50 {
    background-image: url(/static/img/exp50.4b518ff.png)
}

.level-container .personal-zone .mission-box .mission-item .mission-cover.exp100 {
    background-image: url(/static/img/exp100.c9503cc.png)
}

.level-container .personal-zone .mission-box .mission-item .item-box {
    position: relative;
    margin-left: 10px;
    width: 285px
}

.level-container .personal-zone .mission-box .mission-item .item-box.special {
    width: auto
}

.level-container .personal-zone .mission-box .mission-item .item-box .mission-title {
    position: absolute;
    top: 17px;
    left: 0;
    font-size: 14px;
    line-height: 14px;
    font-weight: 700
}

.level-container .personal-zone .mission-box .mission-item .item-box .mission-title .mission-status {
    margin-left: 10px;
    color: #ccc
}

.level-container .personal-zone .mission-box .mission-item .item-box .mission-title .mission-status.active {
    color: #009d7b
}

.level-container .personal-zone .mission-box .mission-item .item-box .mission-detail {
    font-size: 13px;
    color: #999;
    width: 225px;
    margin-top: 43px;
    line-height: 22px
}

.level-container .personal-zone .mission-box .mission-item .item-box .mission-detail.special {
    width: 510px
}

.level-container .personal-zone .privacy-content {
    margin-top: 30px;
    max-width: 769px;
    height: 179px;
    background-image: url(/static/img/privacy_detail.66ff1a2.jpg);
    background-repeat: no-repeat;
    background-size: contain
}

.privacy-mask {
    position: fixed;
    z-index: 9999;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: rgba(51,51,51,.2)
}

.privacy-modal {
    position: fixed;
    z-index: 99999;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 800px;
    height: 640px;
    background-color: #fff;
    box-shadow: 0 0 30px 0 rgba(51,51,51,.2);
    border-radius: 4px
}

@media (max-width: 576px) {
    .privacy-modal {
        width:90%;
        height: 75%
    }
}

.privacy-modal .privacy-title {
    margin-top: 40px;
    color: #333;
    font-size: 24px;
    text-align: center
}

@media (max-width: 576px) {
    .privacy-modal .privacy-title {
        padding:0 5%;
        text-align: left
    }
}

.privacy-modal .privacy-content {
    margin-top: 40px;
    height: 405px;
    padding: 0 55px;
    overflow-y: auto;
    color: #333;
    font-size: 15px;
    line-height: 30px;
    text-indent: 2em
}

@media (max-width: 576px) {
    .privacy-modal .privacy-content {
        margin-top:5%;
        padding: 0 5%;
        height: 75%;
        font-size: 12px;
        line-height: 24px
    }
}

.privacy-modal .privacy-bottom {
    border-top: 1px solid #eee;
    height: 105px;
    display: flex;
    justify-content: space-around;
    align-items: center
}

@media (max-width: 576px) {
    .privacy-modal .privacy-bottom {
        position:absolute;
        left: 0;
        bottom: 0;
        width: 100%;
        border: none;
        height: 55px
    }
}

.privacy-modal .privacy-bottom .btn_disagree {
    width: 180px;
    height: 45px;
    text-align: center;
    background-color: #eee;
    border-radius: 6px;
    color: #999;
    outline: none
}

@media (max-width: 576px) {
    .privacy-modal .privacy-bottom .btn_disagree {
        padding:0;
        width: 95px;
        height: 27.5px;
        font-size: 13px;
        border-radius: 3px
    }
}

.privacy-modal .privacy-bottom .btn_agree {
    width: 180px;
    height: 45px;
    text-align: center;
    color: #fff;
    border-radius: 6px;
    background-color: #25c2a3;
    outline: none
}

@media (max-width: 576px) {
    .privacy-modal .privacy-bottom .btn_agree {
        padding:0;
        width: 95px;
        height: 27.5px;
        font-size: 13px;
        border-radius: 3px
    }
}

.nav-menu {
    z-index: 999;
    position: fixed;
    top: 0;
    width: 100%;
    background-color: #fff;
    height: 55px;
    box-shadow: 0 0 1px rgba(0,0,0,.1)
}

.nav-content {
    height: 55px;
    display: flex;
    justify-content: space-between
}

.function-logo {
    align-self: center;
    display: inline-block
}

.function-logo ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex
}

.function-logo ul li {
    float: left;
    align-self: center;
    margin-right: 20px
}

.function-logo ul li a {
    display: block;
    background-repeat: no-repeat;
    text-decoration: none
}

.function-logo ul li a.logo {
    width: 95px;
    height: 30px;
    background-image: url(/static/img/nav_logo.7f63882.png);
    border-right: 1px solid #eee
}

.function-logo ul li a.action-logo {
    margin-top: -2px;
    width: 111px;
    height: 55px;
    background-image: url(/static/img/nav_plus.c678ef3.jpg);
    background-size: 111px 55px
}

.function-logo ul li a.lab-logo {
    height: 20px;
    line-height: 20px;
    padding-left: 25px;
    background-image: url(/static/img/nav_icon1.e75621b.png);
    font-size: 13px;
    color: #666
}

.search-right {
    align-self: center;
    width: 230px
}

.nav-search-bar,.search-right {
    position: relative
}

.navbar-form {
    display: flex
}

.search-right .search-input {
    border: none;
    outline: none;
    width: 230px;
    height: 30px;
    border-radius: 15px;
    border: 1px solid #eee;
    padding-left: 15px;
    padding-right: 40px;
    background-color: #eee
}

.search-right .btn-search {
    position: absolute;
    top: 0;
    right: 0;
    outline: none!important;
    border: none!important;
    background: none;
    width: 40px;
    height: 30px;
    padding: 0;
    background-image: url(/static/img/nav_icon2.9252fd2.png);
    background-position: 50%;
    background-repeat: no-repeat;
    border-top-right-radius: 15px;
    border-bottom-right-radius: 15px
}

.login,.login>ul,.user-login {
    display: flex
}

.login>ul {
    align-self: center;
    list-style-type: none;
    padding: 0;
    margin: 0
}

.login>ul>li {
    align-self: center;
    margin-right: 20px;
    position: relative
}

.login>ul>li>a {
    display: block
}

.login>ul>li>a.user-avatar {
    position: absolute;
    z-index: 2;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    display: flex;
    width: 40px;
    height: 40px
}

.login>ul>li>a.user-avatar .user-avatar-wrp {
    align-self: center;
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 2;
    width: 40px;
    height: 40px;
    transition: all .4s
}

.login>ul>li>a.user-avatar .user-avatar-wrp img {
    width: 100%;
    height: 100%
}

.login>ul>li #notify-panel {
    position: absolute;
    top: 55px;
    right: -150px;
    width: 300px;
    height: 0;
    background-color: #fff;
    border-radius: 15px;
    transition: all .3s;
    overflow: hidden
}

.login>ul>li #notify-panel .notify-menu {
    width: 200px;
    height: 25px;
    margin: 20px auto 0
}

.login>ul>li #notify-panel .notify-menu ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: space-between
}

.login>ul>li #notify-panel .notify-menu ul li {
    margin: 0;
    position: relative;
    float: left;
    width: 52px
}

.login>ul>li #notify-panel .notify-menu ul li span.comment-notify,.login>ul>li #notify-panel .notify-menu ul li span.sys-notify,.login>ul>li #notify-panel .notify-menu ul li span.user-notify {
    position: absolute;
    top: -10px;
    right: -10px;
    background-color: #f05959;
    height: 15px;
    width: 15px;
    text-align: center;
    line-height: 15px;
    border-radius: 50%;
    font-size: 12px;
    color: #fff;
    display: none
}

.login>ul>li #notify-panel .notify-menu ul li span.notify-text {
    text-align: center;
    cursor: pointer;
    color: #333;
    text-decoration: none;
    position: absolute;
    font-size: 12px;
    height: 25px;
    background: none
}

.login>ul>li #notify-panel .notify-menu ul li span.notify-text.on,.login>ul>li #notify-panel .notify-menu ul li span.notify-text:hover {
    color: #25c2a3;
    border-bottom: 3px solid #25c2a3
}

.login>ul>li #notify-panel .notify-menu ul li span.notify-text .notify-line {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 3px;
    background-color: #25c2a3
}

.login>ul>li #notify-panel .notify-content {
    position: relative;
    margin: 25px;
    height: 200px;
    overflow-y: auto;
    overflow-x: hidden
}

.login>ul>li #notify-panel .notify-content .notify-item {
    display: flex;
    text-decoration: none;
    font-size: 12px;
    color: #333;
    transition: color .2s
}

.login>ul>li #notify-panel .notify-content .notify-item+.notify-item {
    margin-top: 20px
}

.login>ul>li #notify-panel .notify-content .notify-item:hover {
    color: #25c2a3
}

.login>ul>li #notify-panel .notify-content .notify-item .notify-date {
    font-size: 14px
}

.login>ul>li #notify-panel .notify-content .notify-item .notify-text {
    margin-left: 15px;
    margin-right: 10px;
    height: 35px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2
}

.login>ul>li #notify-panel .notify-content::-webkit-scrollbar {
    width: 2px;
    height: 2px;
    background-color: #f5f5f5
}

.login>ul>li #notify-panel .notify-content::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
    border-radius: 10px;
    background-color: #eee
}

.login>ul>li #notify-panel .notify-content::-webkit-scrollbar-thumb {
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 10px rgba(0,0,0,.3);
    background-color: #ccc
}

.login>ul>li #notify-panel .notify-author {
    position: relative;
    cursor: pointer;
    border-top: 1px solid #eee;
    margin: 0 20px;
    height: 45px;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    color: #333;
    font-size: 14px
}

.login>ul>li #notify-panel .notify-author .author-notify-num {
    position: absolute;
    top: 0;
    right: 55px;
    background-color: #f05959;
    height: 20px;
    width: 20px;
    text-align: center;
    line-height: 20px;
    border-radius: 50%;
    font-size: 12px;
    color: #fff;
    display: none
}

.login>ul>li #notify-panel .notify-author .notify-icon {
    margin-right: 10px;
    align-self: center;
    display: inline-block;
    width: 22px;
    height: 24px;
    background-image: url(/static/img/notify-author.a2e6335.png)
}

.login>ul>li #notify-panel .notify-author:hover {
    color: #00a786
}

.login>ul>li #notify-panel .see-all {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 40px;
    font-size: 14px;
    font-weight: 700;
    line-height: 40px;
    color: #fff;
    background-color: #25c2a3;
    text-decoration: none;
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px;
    display: flex;
    justify-content: center
}

.login>ul>li #notify-panel .see-all .more {
    align-self: center;
    display: inline-block;
    margin-left: 10px;
    width: 16px;
    height: 16px;
    background-image: url(/static/img/cardB_button@More.20c9a26.png)
}

.login>ul>li:first-of-type>a {
    width: 20px;
    height: 55px;
    background: url(/static/img/nav_icon3.5452350.png) no-repeat 50%
}

.login>ul>li:first-of-type>a .notify-tip {
    vertical-align: middle;
    width: 18px;
    height: 18px;
    line-height: 18px;
    font-weight: 700;
    text-align: center;
    font-size: 10px;
    background: #f05959;
    color: #fff;
    min-width: 15px;
    position: absolute;
    right: -10px;
    top: 2px;
    display: none;
    border-radius: 50%
}

.login>ul>li:first-of-type>a .show {
    display: block
}

.login>ul>li:nth-of-type(2)>a {
    width: 20px;
    height: 25px;
    background: url(/static/img/nav_icon4.ebcd9bb.png) no-repeat 50%
}

.notify-item:hover #notify-panel {
    box-shadow: 0 0 10px 2px rgba(51,51,51,.1);
    height: 380px
}

.user-login .login-menu {
    align-self: center
}

.user-login .login-menu ul {
    list-style: none;
    padding: 0;
    margin: 0
}

.user-login .login-menu ul li {
    float: left
}

.user-login .login-menu ul li a {
    color: #333;
    text-decoration: none
}

.user-login .login-menu ul li a:hover {
    color: #00a786
}

.user-login .login-menu ul li:first-of-type>a {
    display: block;
    width: 55px;
    height: 20px;
    background: url(/static/img/nav_icon6.1be8bc0.png) no-repeat;
    padding-left: 25px
}

.user-login .login-menu ul li:last-of-type>a {
    margin-left: 2px
}

.user-right {
    display: flex;
    justify-content: space-between;
    align-self: center;
    font-size: 13px
}

.user-right .download {
    width: 90px
}

.user-right .download a {
    height: 20px;
    line-height: 20px;
    color: #333;
    display: inline-block;
    width: 100%;
    background: url(/static/img/nav_icon5.763fc90.png) no-repeat;
    text-decoration: none;
    padding-left: 25px
}

.user-right .download a:hover {
    color: #00a786
}

.user-right .split-line {
    align-self: center;
    width: 1px;
    height: 8px;
    background-color: #ccc
}

.user-right .language-change {
    margin-left: 15px;
    display: inline-block;
    width: 20px;
    height: 20px;
    background-image: url(/static/img/nav_button11.a75329a.png)
}

.user-right .language-change a {
    display: block;
    width: 100%;
    height: 100%
}

.user-right .language-simplified {
    margin-left: 15px;
    display: inline-block;
    width: 20px;
    height: 20px;
    background-image: url(/static/img/nav_button1@b.2683f41.png)
}

.user-right .language-simplified a {
    display: block;
    width: 100%;
    height: 100%
}

.user-item {
    width: 40px;
    height: 55px
}

.user-item:hover .user-avatar .user-avatar-wrp {
    top: 80px;
    left: -10px;
    z-index: 2;
    width: 62px;
    height: 62px
}

.user-item:hover .user-panel {
    height: auto;
    opacity: 1
}

.user-item:hover .user-panel .panel-header {
    height: auto;
    overflow: visible;
    padding-bottom: 20px
}

.user-item:hover .user-panel .panel-middle {
    height: auto;
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee
}

.user-item:hover .user-panel .panel-bottom,.user-item:hover .user-panel .panel-middle {
    height: 85px;
    overflow: inherit
}

.user-panel {
    position: absolute;
    top: 55px;
    margin-left: -95px;
    width: 230px;
    height: 0;
    display: block;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0 0 10px 2px rgba(51,51,51,.1);
    opacity: 0;
    transition: all .3s
}

.user-panel .panel-header {
    height: 0;
    overflow: hidden;
    transition: all .3s
}

.user-panel .panel-header .panel-graph {
    margin: 20px auto 0;
    width: 190px;
    height: 95px;
    display: flex;
    justify-content: space-between;
    padding: 0 10px;
    background: url(/static/img/cardA_head@bg.dfbf3e0.png) no-repeat
}

.user-panel .panel-header .panel-graph a {
    text-decoration: none
}

.user-panel .panel-header .panel-graph .nav-sign,.user-panel .panel-header .panel-graph a {
    align-self: center;
    display: block;
    border-radius: 50%;
    width: 42px;
    height: 47px;
    text-align: center;
    font-size: 14px;
    font-weight: 700
}

.user-panel .panel-header .panel-graph .nav-sign {
    transition: all .2s;
    background-image: url(/static/img/cardA_button@a.83041d0.png)
}

.user-panel .panel-header .panel-graph .nav-sign.on,.user-panel .panel-header .panel-graph .nav-sign:hover {
    background-image: url(/static/img/cardA_button@ac.0b56247.png)
}

.user-panel .panel-header .panel-graph .nav-ticket {
    transition: all .2s;
    background-image: url(/static/img/cardA_button@b.abedf83.png)
}

.user-panel .panel-header .panel-graph .nav-ticket.on,.user-panel .panel-header .panel-graph .nav-ticket:hover {
    background-image: url(/static/img/cardA_button@bc.a8fb479.png)
}

.user-panel .panel-header .user-info {
    text-align: center;
    margin-top: 10px
}

.user-panel .panel-header .user-info .user-name {
    font-size: 14px;
    font-weight: 700
}

.user-panel .panel-header .user-info .user-level {
    position: relative;
    margin-top: 8px;
    display: flex;
    justify-content: center;
    font-size: 18px;
    color: #25c2a3
}

.user-panel .panel-header .user-info .user-level .level-class {
    display: block;
    width: 53px;
    height: 12px
}

.user-panel .panel-header .user-info .user-level .level-class.level0 {
    background-image: url(/static/img/icon_lv0.7707980.png)
}

.user-panel .panel-header .user-info .user-level .level-class.level1 {
    background-image: url(/static/img/icon_lv1.ab57ea6.png)
}

.user-panel .panel-header .user-info .user-level .level-class.level2 {
    background-image: url(/static/img/icon_lv2.9b40e67.png)
}

.user-panel .panel-header .user-info .user-level .level-class.level3 {
    background-image: url(/static/img/icon_lv3.8da72d3.png)
}

.user-panel .panel-header .user-info .user-level .level-class.level4 {
    background-image: url(/static/img/icon_lv4.64542e6.png)
}

.user-panel .panel-header .user-info .user-level .level-class.level5 {
    background-image: url(/static/img/icon_lv5.f0af28d.png)
}

.user-panel .panel-header .user-info .user-level .level-class.level6 {
    background-image: url(/static/img/icon_lv6.447f4da.png)
}

.user-panel .panel-header .user-info .user-level .level-question {
    cursor: pointer;
    margin-left: 8px;
    display: block;
    width: 13px;
    height: 13px;
    background-image: url(/static/img/cardA_Notes.81554c8.png)
}

.user-panel .panel-header .user-info .user-level .level-question:hover+.privacy-alert {
    display: block
}

.user-panel .panel-middle {
    position: relative;
    height: 0;
    overflow: hidden
}

.user-panel .panel-middle .panel-left {
    margin: 15px 10px
}

.user-panel .panel-middle .panel-left .coin {
    display: flex
}

.user-panel .panel-middle .panel-left .coin .coin-icon {
    margin-right: 10px;
    align-self: center;
    display: inline-block;
    width: 20px;
    height: 17px;
    background-image: url(/static/img/cardA_icon1.85c30ff.png)
}

.user-panel .panel-middle .panel-left .integral {
    margin-top: 15px;
    display: flex
}

.user-panel .panel-middle .panel-left .integral .integral-icon {
    margin-right: 10px;
    align-self: center;
    display: inline-block;
    width: 20px;
    height: 18px;
    background-image: url(/static/img/cardA_icon2.06d1dc3.png)
}

.user-panel .panel-middle .panel-right {
    position: absolute;
    top: 10px;
    right: -16px;
    width: 117px;
    height: 76px;
    background-image: url(/static/img/cardA_button@Recharge.97a1415.png);
    cursor: pointer
}

.user-panel .panel-middle .panel-right a {
    display: block;
    width: 100%;
    height: 100%
}

.user-panel .panel-bottom {
    display: flex;
    justify-content: center;
    height: 0;
    overflow: hidden
}

.user-panel .panel-bottom .user-list {
    width: 180px;
    align-self: center
}

.user-panel .panel-bottom .user-list ul {
    display: block;
    align-self: center;
    list-style: none;
    padding: 0;
    margin: 0
}

.user-panel .panel-bottom .user-list ul li {
    float: left;
    margin-right: 15px
}

.user-panel .panel-bottom .user-list ul li a {
    display: block;
    text-decoration: none;
    width: 80px;
    color: #666;
    padding-left: 21px;
    font-size: 12px;
    height: 25px;
    line-height: 25px;
    background-position: 0;
    background-repeat: no-repeat
}

.user-panel .panel-bottom .user-list ul li a:hover {
    color: #25c2a3
}

.user-panel .panel-bottom .user-list ul li:first-of-type>a {
    background-image: url(/static/img/cardA_icon3.381a258.png)
}

.user-panel .panel-bottom .user-list ul li:nth-of-type(2) {
    margin-right: 0
}

.user-panel .panel-bottom .user-list ul li:nth-of-type(2)>a {
    background-image: url(/static/img/cardA_icon4.d5f25ba.png)
}

.user-panel .panel-bottom .user-list ul li:nth-of-type(3) {
    margin-top: 5px
}

.user-panel .panel-bottom .user-list ul li:nth-of-type(3)>a {
    background-image: url(/static/img/cardA_icon5.aa4d9a1.png)
}

.user-panel .panel-bottom .user-list ul li:nth-of-type(4) {
    margin-right: 0;
    margin-top: 5px
}

.user-panel .panel-bottom .user-list ul li:nth-of-type(4)>a {
    background-image: url(/static/img/cardA_icon6.0b5da74.png)
}

#temporary-notify {
    position: absolute;
    right: -30px;
    height: 0;
    width: 90px;
    overflow: hidden;
    opacity: 0;
    transition: all .3s;
    background-color: #fff;
    box-shadow: 0 3px 3px 0 rgba(99,99,99,.4);
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px
}

#temporary-notify>ul {
    list-style: none;
    padding: 0;
    margin: 0
}

#temporary-notify>ul>li>a {
    position: relative;
    display: block;
    color: #333;
    height: 40px;
    line-height: 40px;
    text-decoration: none;
    text-align: center
}

#temporary-notify>ul>li>a span {
    display: block
}

#temporary-notify>ul>li>a:hover {
    color: #00a786
}

#temporary-notify>ul>li>a .counter {
    padding: 0;
    border-radius: 4px;
    vertical-align: middle;
    margin-top: -3px;
    padding: 0 2px;
    height: 16px;
    line-height: 16px;
    margin-left: 3px;
    text-align: center;
    font-size: 10px;
    background: #f05959;
    color: #fff;
    min-width: 15px;
    display: none;
    position: absolute;
    right: 2px;
    top: 5px
}

#temporary-notify>ul>li>a .counter.active {
    display: inline-block
}

.temporary-item:hover #temporary-notify {
    height: 80px;
    opacity: 1
}

.loading-linovel {
    width: 130px;
    height: 170px;
    background-image: url(/static/img/loading.6c7c9ff.gif)
}

.loading-linovel,.loading-null {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    background-repeat: no-repeat
}

.loading-null {
    width: 170px;
    height: 183px;
    background-image: url(/static/img/joviality.b2ad594.png)
}

@media only screen and (-webkit-min-device-pixel-ratio: 2),only screen and (min-device-pixel-ratio:2) {
    .function-logo ul li a.action-logo {
        background-image:url(/static/img/nav_plus@2x.b02b4b8.jpg)
    }

    .search-right .btn-search {
        background-image: url(/static/img/nav_icon2@2x.f867c49.png);
        background-size: 14px 14px
    }

    .user-login .login-menu ul li:first-of-type>a {
        background-image: url(/static/img/nav_icon6@2x.36cbbd8.png);
        background-size: 20px 20px
    }

    .login>ul>li:first-of-type>a {
        background-image: url(/static/img/nav_icon3@2x.6e55f86.png);
        background-size: 20px 20px
    }

    .login>ul>li:nth-of-type(2)>a {
        background-image: url(/static/img/nav_icon4@2x.b161a1c.png);
        background-size: 20px 20px
    }

    .user-right .download a {
        background-image: url(/static/img/nav_icon5@2x.1193458.png);
        background-size: 20px 20px
    }

    .function-logo ul li a.logo {
        background-image: url(/static/img/nav_logo@2x.4a88b74.png);
        background-size: 80px 30px
    }

    .user-panel .panel-middle .panel-left .coin .coin-icon {
        background-image: url(/static/img/cardA_icon1@2x.f735188.png);
        background-size: 20px 17px
    }

    .user-panel .panel-middle .panel-left .integral .integral-icon {
        background-image: url(/static/img/cardA_icon2@2x.a84e6d7.png);
        background-size: 17px 18px;
        background-repeat: no-repeat;
        background-position: 50%
    }
}

body {
    min-width: 990px!important;
    font-family: SF Pro SC,HanHei SC,SF Pro Text,PingFangSC-Regular,HelveticaNeue-Light,PingFang SC,Helvetica Neue Light,Helvetica Neue,Helvetica,Microsoft YaHei,Arial,sans-serif;
    font-size: 14px;
    line-height: 1.42857143;
    color: #333
}

.slide-fixed,body {
    background-color: #fff
}

.slide-fixed {
    position: fixed;
    top: 200px;
    z-index: 9;
    left: 50%;
    margin-left: 620px
}

.slide-fixed .linovel-girl-icon {
    position: absolute;
    z-index: -1;
    top: -86px;
    left: -15px;
    display: block;
    width: 140px;
    height: 151px;
    background-image: url(/static/img/float_bg.543a08e.png)
}

.slide-fixed ul {
    list-style: none;
    padding: 0;
    margin: 0;
    box-shadow: 0 0 12px rgba(0,0,0,.2);
    border-radius: 10px
}

.slide-fixed ul li a {
    text-decoration: none;
    display: block;
    width: 104px;
    height: 50px;
    line-height: 50px;
    text-align: center;
    font-size: 14px;
    color: #999;
    border-bottom: 1px dashed #ddd
}

.slide-fixed ul li a.on,.slide-fixed ul li a:hover {
    color: #00a786
}

.slide-fixed ul li:last-of-type>a {
    height: 65px;
    border: none
}

.slide-fixed .roll-top {
    display: block;
    position: absolute;
    left: 50%;
    bottom: -35px;
    transform: translateX(-50%);
    width: 49px;
    height: 49px;
    border-radius: 50%;
    background-color: #25c2a3;
    box-shadow: 0 0 12px rgba(14,223,182,.4);
    background-image: url(/static/img/float_button.2f1c563.png);
    background-position: 50%;
    background-repeat: no-repeat
}

.slide-fixed .roll-top a {
    width: 100%;
    height: 100%;
    display: block
}

.slide-fixed .qr-code {
    position: absolute;
    left: -11px;
    bottom: -215px;
    display: block;
    width: 128px;
    height: 172px;
    background-image: url(/static/img/float_QR.dbb88b8.png)
}

.slide-fixed .qr-code a {
    width: 100%;
    height: 100%;
    display: block
}

@media (max-width: 1400px) {
    .slide-fixed {
        margin-left:520px
    }

    .slide-fixed ul {
        border: 1px solid #eee;
        box-shadow: none
    }

    .slide-fixed ul li a {
        width: 75px
    }

    .slide-fixed .linovel-girl-icon,.slide-fixed .qr-code {
        display: none
    }
}

.index-banner {
    position: relative;
    margin-top: 125px;
    height: 360px
}

.index-banner .banner-nav {
    position: absolute;
    width: 100%;
    top: -70px
}

.index-banner .banner-nav a {
    display: block;
    height: 70px;
    background-image: url(/static/img/banner_top.7080991.png);
    background-repeat: no-repeat;
    background-size: contain
}

@media (max-width: 1399px) {
    .index-banner {
        height:285px;
        margin-top: 105px
    }

    .index-banner .banner-nav {
        top: -50px
    }

    .index-banner .banner-nav a {
        height: 50px
    }
}

.slide-recommend {
    float: left;
    max-width: 100%;
    border-radius: 5px
}

.carousel-control.left,.carousel-control.right {
    background: none;
    z-index: 14
}

.left-banner {
    background-image: url(/static/img/button@left_a.773aa1b.png)
}

.left-banner,.right-banner {
    width: 25px!important;
    height: 38px!important;
    background-repeat: no-repeat
}

.right-banner {
    background-image: url(/static/img/button@right_a.f99cc1b.png)
}

.carousel-control .glyphicon-chevron-left,.carousel-control .glyphicon-chevron-right,.carousel-control .icon-next,.carousel-control .icon-prev {
    display: none
}

.carousel-control.left:hover .glyphicon-chevron-left,.carousel-control.right:hover .glyphicon-chevron-right {
    display: block
}

.carousel-control.left:hover .glyphicon-chevron-left:before,.carousel-control.right:hover .glyphicon-chevron-right:before {
    content: ""
}

.carousel-inner {
    position: relative
}

.carousel-inner>.item {
    transition: none
}

.carousel-mask {
    position: absolute;
    z-index: 20;
    width: 100%;
    height: 100%;
    background: #e5e5e5;
    border-radius: 10px
}

#carousel-banner,#carousel-banner .carousel-inner>.item>img {
    width: 100%;
    height: 360px;
    border-radius: 10px
}

@media (max-width: 1399px) {
    #carousel-banner,#carousel-banner .carousel-inner>.item>img {
        height:285px
    }
}

.left-action {
    background-image: url(/static/img/button@left_b.005993d.png)
}

.left-action,.right-action {
    width: 16px!important;
    height: 24px!important;
    background-repeat: no-repeat
}

.right-action {
    background-image: url(/static/img/button@right_b.a8d198f.png)
}

.action-slide .carousel-inner>.item,.action-slide .carousel-inner>.item img {
    width: 270px;
    height: 240px;
    border-radius: 10px
}

.carousel-inner>.item.active.right {
    transform: translate3d(-100%,0,0)
}

.carousel-indicators {
    left: 0;
    margin-left: 20px;
    bottom: 5px
}

.carousel-indicators li {
    float: left;
    width: 6px;
    height: 6px;
    background-color: #666;
    margin: 0;
    margin-right: 6px;
    transition: width .5s;
    border: none
}

.carousel-indicators .active,.carousel-indicators li:hover {
    width: 30px;
    background: #00a786;
    border-radius: 3px;
    border: none
}

.carousel-indicators .active {
    height: 6px;
    margin-right: 6px
}

.carousel-caption {
    top: 0;
    left: 0;
    padding: 0;
    border-radius: 10px;
    width: 100%;
    height: 100%;
    overflow: hidden
}

.carousel-caption>img {
    position: absolute;
    opacity: 0;
    border-radius: 10px
}

#carousel-banner>.carousel-caption>img {
    width: 870px
}

@media (max-width: 1399px) {
    #carousel-banner,#carousel-banner>.carousel-inner>.item>.carousel-caption>img {
        width:690px
    }
}

.user-center {
    float: right;
    width: 270px;
    height: 100%
}

.user-center .be-come-create {
    position: relative;
    height: 80px;
    border-radius: 10px
}

.user-center .be-come-create .linovel-girl {
    position: absolute;
    z-index: 2;
    top: -60px;
    right: 0;
    display: block;
    width: 106px;
    height: 64px;
    background-image: url(/static/img/right_img1.01ae098.png)
}

.user-center .be-come-create a {
    position: relative;
    z-index: 1;
    display: block;
    height: 100%;
    background-image: url(/static/img/right_button1.57a7790.png);
    transition: opacity .2s
}

.user-center .be-come-create a:hover {
    opacity: .7
}

.user-center .rules-notice {
    margin-top: 40px;
    border: 1px solid #eee;
    border-radius: 10px;
    height: 240px
}

@media (max-width: 1399px) {
    .user-center .rules-notice {
        height:165px
    }
}

.user-center .rules-notice .rules-list {
    position: relative;
    height: 70px
}

.user-center .rules-notice .rules-list ul {
    position: absolute;
    width: 220px;
    top: -27px;
    left: 50%;
    height: 95px;
    transform: translateX(-50%);
    border-bottom: 1px solid #eee;
    list-style-type: none;
    margin: 0;
    padding: 0
}

.user-center .rules-notice .rules-list ul li {
    float: left;
    margin-right: 20px
}

.user-center .rules-notice .rules-list ul li a {
    text-decoration: none;
    color: #666;
    font-size: 12px;
    text-align: center
}

.user-center .rules-notice .rules-list ul li a i {
    display: block;
    width: 60px;
    height: 54px
}

.user-center .rules-notice .rules-list ul li a i.signing-welfare {
    background-image: url(/static/img/tight_button2.c7d3ff3.png)
}

.user-center .rules-notice .rules-list ul li a i.consult-editor {
    background-image: url(/static/img/right_button3.aad1249.png)
}

.user-center .rules-notice .rules-list ul li a i.outline-course {
    background-image: url(/static/img/right_button4.2d5945f.png)
}

.user-center .rules-notice .rules-list ul li a p {
    margin-top: 10px
}

.user-center .rules-notice .rules-list ul li:last-of-type {
    margin: 0
}

.user-center .rules-notice .notice-content {
    margin: 15px 25px;
    margin-bottom: 5px
}

.user-center .rules-notice .notice-content .notice-title {
    display: flex;
    justify-content: space-between
}

.user-center .rules-notice .notice-content .notice-title .notice-icon {
    display: block;
    width: 54px;
    height: 17px;
    background-image: url(/static/img/right_title1.a6121b2.png)
}

.user-center .rules-notice .notice-content .notice-title a {
    align-self: center;
    text-decoration: none;
    font-size: 12px;
    font-weight: 700;
    color: #00a786
}

.user-center .rules-notice .notice-content .new-notice {
    padding: 15px 0;
    border-bottom: 1px dashed #eee
}

.user-center .rules-notice .notice-content .new-notice a {
    display: flex;
    text-decoration: none
}

.user-center .rules-notice .notice-content .new-notice a .new-icon {
    align-self: center;
    display: block;
    width: 33px;
    height: 30px;
    margin-right: 10px;
    background-image: url(/static/img/right_icon@new.9e1e75f.png);
    background-position: 50%
}

.user-center .rules-notice .notice-content .new-notice a .new-info {
    align-self: center;
    display: block;
    width: 230px
}

.user-center .rules-notice .notice-content .new-notice a .new-info .new-title {
    color: #020202;
    font-size: 13px;
    line-height: 18px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.user-center .rules-notice .notice-content .new-notice a .new-info .new-detail {
    font-size: 12px;
    color: #999;
    line-height: 17px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.user-center .rules-notice .notice-content .new-notice:last-of-type {
    border: none
}

@media (max-width: 1399px) {
    .user-center .rules-notice .notice-content .new-notice {
        border:none
    }

    .user-center .rules-notice .notice-content .new-notice:last-of-type {
        display: none
    }
}

@media (max-width: 1399px) {
    .user-center .rules-notice .notice-content {
        margin:10px 30px 0
    }
}

.menu {
    margin-top: 20px
}

.menu-fixed {
    position: fixed;
    z-index: 998;
    top: -55px;
    width: 100%;
    height: 0;
    background-color: #fff;
    opacity: .95;
    box-shadow: 0 0 10px rgba(0,0,0,.3);
    transition: all .3s;
    visibility: hidden
}

.menu-fixed-hover,.menu-fixed.show {
    top: 55px;
    height: 55px;
    visibility: visible
}

@media (max-width: 1400px) {
    .menu {
        margin-top:30px
    }
}

.inner-menu {
    width: 100%;
    height: 48px;
    border-radius: 24px;
    box-shadow: 6px 0 24px #e7e7e7;
    background-color: #fff;
    display: flex;
    justify-content: space-between
}

.inner-menu-fixed {
    height: 55px;
    box-shadow: none;
    border-radius: inherit;
    background-color: inherit
}

.inner-menu .left-menu {
    margin-left: 20px;
    display: flex
}

.inner-menu .left-menu ul {
    align-self: center;
    list-style: none;
    padding: 0;
    margin: 0
}

.inner-menu .left-menu ul li {
    float: left
}

.inner-menu .left-menu ul li a {
    position: relative;
    line-height: 16px;
    display: block;
    min-width: 90px;
    max-width: 120px;
    height: 16px;
    text-decoration: none;
    font-size: 14px;
    color: #333;
    padding-left: 30px;
    margin-left: 20px
}

.inner-menu .left-menu ul li a:hover {
    color: #00a87e
}

.inner-menu .left-menu ul li:first-of-type a {
    width: 125px;
    margin-left: 0
}

.inner-menu .left-menu ul li:first-of-type a>.icon {
    position: absolute;
    top: -3px;
    left: 0;
    width: 24px;
    height: 24px;
    background: url(/static/img/css_sprites-menu.329e328.png) -98px -10px no-repeat
}

.inner-menu .left-menu ul li:first-of-type a>.line {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 8px;
    margin-left: 20px;
    background-color: #ccc
}

.inner-menu .left-menu ul li:nth-of-type(2) a>.icon {
    position: absolute;
    top: -4px;
    left: 0;
    width: 24px;
    height: 24px;
    background: url(/static/img/css_sprites-menu.329e328.png) -98px -54px;
    background-repeat: no-repeat
}

.inner-menu .left-menu ul li:nth-of-type(2) a>.line {
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 8px;
    margin-left: 20px;
    background-color: #ccc
}

.inner-menu .left-menu ul li:nth-of-type(3) a>.icon {
    position: absolute;
    top: -4px;
    left: 0;
    width: 24px;
    height: 24px;
    background: url(/static/img/css_sprites-menu.329e328.png) -10px -10px;
    background-repeat: no-repeat
}

.inner-menu .left-menu ul li:nth-of-type(3) a>.line {
    position: absolute;
    right: -20px;
    top: 50%;
    transform: translateY(-50%);
    width: 1px;
    height: 8px;
    background-color: #ccc
}

.inner-menu .left-menu ul li:nth-of-type(4) a {
    margin-left: 40px
}

.inner-menu .left-menu ul li:nth-of-type(4) a>.icon {
    position: absolute;
    top: -3px;
    left: 0;
    display: inline-block;
    width: 24px;
    height: 24px;
    background: url(/static/img/css_sprites-menu.329e328.png) -10px -98px;
    background-repeat: no-repeat
}

.inner-menu .right-menu {
    display: flex
}

.inner-menu .right-menu ul {
    align-self: center;
    list-style-type: none;
    padding: 0;
    margin: 0
}

.inner-menu .right-menu ul li {
    float: left;
    width: 85px
}

.inner-menu .right-menu ul li a {
    position: relative;
    line-height: 55px;
    text-decoration: none;
    font-size: 14px;
    color: #333;
    text-align: center;
    padding-left: 30px
}

.inner-menu .right-menu ul li a:hover {
    color: #00a87e
}

.inner-menu-fixed>.left-menu,.inner-menu-fixed>.right-menu {
    padding: 0;
    margin: 0
}

.inner-menu-fixed>.left-menu ul li a,.inner-menu-fixed>.right-menu ul li a {
    font-weight: 700
}

.inner-menu-fixed>.right-menu ul li a {
    float: right;
    position: relative
}

.inner-menu-fixed>.right-menu ul li a>.icon {
    top: 80%;
    transform: translateY(80%)
}

.inner-menu .right-menu ul li:first-of-type a>.icon {
    position: absolute;
    top: -4px;
    left: 0;
    display: inline-block;
    width: 24px;
    height: 24px;
    background: url(/static/img/css_sprites-menu.329e328.png) -54px -10px;
    background-repeat: no-repeat
}

.inner-menu .right-menu ul li:nth-of-type(2) a>.icon {
    position: absolute;
    top: -4px;
    left: 0;
    display: inline-block;
    width: 24px;
    height: 24px;
    background: url(/static/img/css_sprites-menu.329e328.png) -10px -54px;
    background-repeat: no-repeat
}

.inner-menu .right-menu ul li:nth-of-type(3) a>.icon {
    position: absolute;
    top: -4px;
    left: 0;
    display: inline-block;
    width: 24px;
    height: 24px;
    background: url(/static/img/css_sprites-menu.329e328.png) -54px -54px;
    background-repeat: no-repeat
}

.strength-recommend {
    margin-top: 35px;
    height: 310px;
    overflow: hidden
}

.strength-recommend .work-list ul li:nth-of-type(6) {
    margin-right: 0
}

@media (max-width: 1400px) {
    .strength-recommend .work-list {
        height:270px
    }
}

.strength-recommend .headline {
    display: flex
}

.strength-recommend .headline .headline-icon {
    align-self: center;
    display: block;
    width: 180px;
    height: 32px;
    background-image: url(/static/img/css_sprites-left.a8d0cc9.png);
    background-position: -10px -10px;
    background-repeat: no-repeat
}

@media (max-width: 1399px) {
    .strength-recommend .work-list ul li:nth-of-type(5) {
        margin-right:0
    }
}

.strength-recommend .action-headline {
    display: flex;
    height: 35px
}

.strength-recommend .action-headline .action-headline-icon {
    align-self: center;
    display: block;
    width: 66px;
    height: 21px;
    background: url(/static/img/css_sprites-right.4f6a2ad.png) -146px -10px;
    background-repeat: no-repeat
}

.strength-recommend .action-headline .action-headline-text {
    align-self: center;
    margin-left: 10px;
    font-size: 14px;
    width: 184px;
    height: 20px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #999
}

.strength-recommend .action-slide {
    height: 240px;
    margin-top: 10px;
    box-shadow: 6px 0 24px #e7e7e7
}

.strength-recommend .action-slide .carousel-indicators li {
    border: none;
    background-color: #ccc
}

.strength-recommend .action-slide .carousel-indicators li.active {
    background: #00a786
}

.boutique-books {
    overflow: hidden;
    height: 860px;
    margin-bottom: 30px
}

.books-content {
    position: relative
}

.boutique-books .books-content {
    height: 810px
}

.boutique-books .headline {
    display: flex;
    justify-content: space-between
}

.boutique-books .headline .headline-left {
    display: flex
}

.boutique-books .headline .headline-left .headline-icon {
    align-self: center;
    display: block;
    width: 179px;
    height: 32px;
    background-image: url(/static/img/css_sprites-left.a8d0cc9.png);
    background-position: -10px -62px;
    background-repeat: no-repeat
}

.boutique-books .headline .headline-left .headline-menu {
    align-self: center;
    margin-left: -40px
}

.boutique-books .headline .headline-left .headline-menu ul {
    list-style-type: none;
    padding: 0;
    margin: 0
}

.boutique-books .headline .headline-left .headline-menu ul li {
    float: left;
    margin-right: 35px;
    position: relative
}

.boutique-books .headline .headline-left .headline-menu ul li a {
    position: relative;
    font-size: 12px;
    color: #666;
    text-decoration: none;
    display: block
}

.boutique-books .headline .headline-left .headline-menu ul li a .menu-border {
    position: absolute;
    display: block;
    width: 100%;
    height: 3px;
    background: linear-gradient(90deg,#beffed,#7be8fe);
    opacity: 0
}

.boutique-books .headline .headline-left .headline-menu ul li a:hover .menu-border {
    opacity: 1
}

@media (max-width: 1400px) {
    .boutique-books .headline .headline-left .headline-menu ul li {
        margin-right:25px
    }
}

.boutique-books .headline .btn-vol {
    align-self: center;
    outline: none;
    border: none;
    width: 85px;
    height: 26px;
    background: none;
    background-image: url(/static/img/mod2_icon@rush.201575c.png)
}

.boutique-books .update-list {
    padding-top: 13px
}

.boutique-books .update-list .type-mask {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: hsla(0,0%,93%,.8);
    display: flex;
    justify-content: flex-start;
    align-items: center;
    opacity: 0;
    transition: opacity .4s
}

.boutique-books .update-list .type-mask:after {
    position: absolute;
    content: " ";
    top: 0;
    right: 0;
    width: 3px;
    height: 100%;
    background-color: #25c2a3
}

.boutique-books .update-list .type-mask .type {
    background-color: #25c2a3;
    border-radius: 10px;
    padding: 3px 12px;
    font-size: 12px;
    font-weight: 500;
    color: #fff;
    margin-left: 10px
}

.boutique-books .update-list a.book-card {
    display: block;
    text-decoration: none;
    position: relative;
    margin-bottom: 11px;
    padding-left: 15px;
    color: #333
}

.boutique-books .update-list a.book-card .book-name {
    font-size: 14px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    transition: all .2s
}

.boutique-books .update-list a.book-card .book-detail {
    display: flex;
    margin-top: 10px;
    font-size: 12px;
    color: #999
}

.boutique-books .update-list a.book-card .book-detail .split {
    align-self: center;
    margin: 0 15px
}

.boutique-books .update-list a.book-card:hover .book-name {
    color: #00a786
}

.boutique-books .update-list a.book-card:hover .type-mask {
    opacity: 1
}

.boutique-books .update-headline {
    display: flex;
    height: 32px
}

.boutique-books .update-headline .update-headline-icon {
    align-self: center;
    display: block;
    width: 116px;
    height: 21px;
    background: url(/static/img/css_sprites-right.4f6a2ad.png) -10px -10px;
    background-repeat: no-repeat
}

.boutique-books .update-headline .update-headline-text {
    align-self: center;
    margin-left: 10px;
    font-size: 14px;
    color: #999
}

.linove-articles {
    margin-bottom: 30px;
    height: 580px
}

.linove-articles .headline {
    display: flex;
    justify-content: space-between
}

.linove-articles .headline .headline-left {
    display: flex
}

.linove-articles .headline .headline-left .headline-icon {
    align-self: center;
    display: inline-block;
    width: 179px;
    height: 32px;
    background: url(/static/img/css_sprites-left.a8d0cc9.png) -10px -114px;
    background-repeat: no-repeat
}

.linove-articles .headline .btn-vol {
    align-self: center;
    outline: none;
    border: none;
    width: 85px;
    height: 26px;
    background: none;
    background-image: url(/static/img/mod3_button1.0ba27fb.png)
}

.linove-articles .articles-section {
    overflow: hidden
}

.linove-articles .articles-section .articles-card {
    width: 420px;
    height: 160px;
    float: left;
    margin-top: 20px;
    margin-right: 25px;
    transition: all .2s;
    cursor: pointer;
    text-decoration: none
}

.linove-articles .articles-section .articles-card .articles-detail {
    display: flex;
    align-self: center;
    overflow: hidden;
    position: relative;
    background-color: #fff
}

.linove-articles .articles-section .articles-card .articles-detail .img-articles {
    position: absolute;
    display: block;
    width: 166px;
    height: 83px
}

.linove-articles .articles-section .articles-card .articles-detail .img-articles img {
    width: 100%;
    height: 100%
}

.linove-articles .articles-section .articles-card .articles-detail .articles-info {
    margin-left: 186px;
    width: 235px;
    display: block
}

@media (max-width: 1300px) {
    .linove-articles .articles-section .articles-card .articles-detail .articles-info {
        margin-left:176px
    }
}

.linove-articles .articles-section .articles-card .articles-detail .articles-info .articles-title {
    font-size: 15px;
    height: 40px;
    color: #333;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    overflow: hidden;
    word-break: break-all
}

.linove-articles .articles-section .articles-card .articles-detail .articles-info .articles-publish {
    margin-top: 15px;
    color: #333;
    font-size: 12px
}

.linove-articles .articles-section .articles-card .articles-detail .articles-info .articles-publish .articles-name {
    display: inline-block;
    max-width: 100px;
    height: 14px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.linove-articles .articles-section .articles-card .articles-detail .articles-info .articles-publish .articles-time {
    display: inline-block;
    max-width: 110px;
    height: 14px;
    color: #999;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

@media (max-width: 1400px) {
    .linove-articles .articles-section .articles-card .articles-detail .articles-info .articles-name {
        margin-top:0
    }
}

.linove-articles .articles-section .articles-card .articles-text {
    margin-top: 15px;
    font-size: 12px;
    color: #666;
    height: 60px;
    line-height: 22px;
    overflow: hidden;
    word-break: break-all
}

.linove-articles .articles-section .articles-card:hover {
    opacity: .7;
    transform: translateY(-4px)
}

@media (max-width: 1399px) {
    .linove-articles .articles-section .articles-card {
        width:335px;
        margin-right: 15px
    }
}

.linove-articles .articles-section .articles-card:nth-of-type(2),.linove-articles .articles-section .articles-card:nth-of-type(4),.linove-articles .articles-section .articles-card:nth-of-type(6) {
    margin-right: 0
}

.linove-articles .hot-headline {
    display: flex;
    height: 32px
}

.linove-articles .hot-headline .hot-headline-icon {
    align-self: center;
    display: block;
    width: 66px;
    height: 21px;
    background: url(/static/img/css_sprites-right.4f6a2ad.png) -146px -51px
}

.linove-articles .discuss-list ul {
    list-style-type: none;
    padding: 0;
    margin: 0
}

.linove-articles .discuss-list ul li+li {
    margin-top: 10px
}

.linove-articles .discuss-list ul li {
    margin-top: 20px
}

.linove-articles .discuss-list ul li a {
    position: relative;
    text-decoration: none;
    display: block
}

.linove-articles .discuss-list ul li a .hot-discuss {
    position: relative;
    width: 100%;
    height: 50px;
    display: flex;
    justify-content: flex-start
}

.linove-articles .discuss-list ul li a .hot-discuss .discuss-tag {
    align-self: center;
    display: block;
    width: 4px;
    height: 33px;
    background-color: #ccc
}

.linove-articles .discuss-list ul li a .hot-discuss .discuss-title {
    align-self: center;
    margin-left: 7px;
    width: 192px;
    height: 33px;
    font-size: 12px;
    color: #666;
    overflow: hidden;
    word-break: break-all
}

.linove-articles .discuss-list ul li a .hot-discuss .comment-extra {
    margin-left: 12px;
    font-size: 12px;
    align-self: center;
    color: #999;
    border-left: 1px solid #eee;
    width: 55px
}

.linove-articles .discuss-list ul li a .hot-discuss .comment-extra .comment-num {
    background-image: url(/static/img/comment.64b4099.png);
    background-repeat: no-repeat;
    background-position: 12px;
    padding-left: 32px;
    overflow: hidden;
    text-overflow: ellipsis;
    whitewhite-space: nowrap
}

.linove-articles .discuss-list ul li a .hot-discuss .comment-extra .comment-good {
    background-image: url(/static/img/good.c59b171.png);
    background-repeat: no-repeat;
    background-position: 12px;
    padding-left: 32px;
    overflow: hidden;
    text-overflow: ellipsis;
    whitewhite-space: nowrap
}

.linove-articles .discuss-list ul li a .discuss-mask {
    position: absolute;
    width: 100%;
    height: 50px;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    opacity: 0;
    transition: opacity .2s
}

.linove-articles .discuss-list ul li a .discuss-mask .discuss-img {
    position: absolute;
    display: inline-block;
    width: 100px;
    height: 50px
}

.linove-articles .discuss-list ul li a .discuss-mask .discuss-img img {
    width: 100%;
    height: 100%
}

.linove-articles .discuss-list ul li a .discuss-mask .discuss-tit {
    margin-left: 100px;
    display: inline-block;
    width: 170px;
    height: 50px;
    font-size: 12px;
    color: #333;
    background-color: #eee
}

.linove-articles .discuss-list ul li a .discuss-mask .discuss-tit .discuss-p {
    display: inline-block;
    width: 145px;
    height: 33px;
    margin: 8px 10px 9px 15px;
    overflow: hidden;
    word-break: break-all
}

.linove-articles .discuss-list ul li a:hover .discuss-mask {
    opacity: 1
}

.finish-books {
    overflow: hidden;
    height: 590px
}

@media (max-width: 1400px) {
    .finish-books .books-content {
        height:525px
    }
}

.finish-books .headline {
    display: flex;
    justify-content: space-between
}

.finish-books .headline .headline-left {
    display: flex
}

.finish-books .headline .headline-left .headline-icon {
    align-self: center;
    display: inline-block;
    width: 179px;
    height: 32px;
    background: url(/static/img/css_sprites-left.a8d0cc9.png) -209px -10px;
    background-repeat: no-repeat
}

.finish-books .headline .headline-left .headline-face {
    margin-left: -65px;
    align-self: center;
    font-size: 14px;
    color: #999
}

.finish-books .headline .btn-vol {
    align-self: center;
    outline: none;
    border: none;
    width: 85px;
    height: 26px;
    background: none;
    background-image: url(/static/img/mod2_icon@rush.201575c.png)
}

.finish-books .blog-headline {
    display: flex;
    height: 32px;
    justify-content: space-between
}

.finish-books .blog-headline .blog-headline-icon {
    align-self: center;
    display: block;
    width: 95px;
    height: 21px;
    background: url(/static/img/css_sprites-right.4f6a2ad.png) -10px -92px;
    background-repeat: no-repeat
}

.finish-books .blog-headline .blog-headline-btn {
    align-self: center;
    outline: none;
    border: none;
    width: 85px;
    height: 26px;
    background: none;
    background-image: url(/static/img/mod4_button2.2e1e094.png)
}

.finish-books .books-content {
    height: 555px;
    position: relative
}

.finish-books .blog-list {
    height: 525px;
    overflow: hidden;
    margin-top: 5px
}

.finish-books .blog-list ul {
    list-style-type: none;
    padding: 0;
    margin: 0
}

.finish-books .blog-list ul li {
    margin-top: 10px
}

.finish-books .blog-list ul li+li {
    margin-top: 12px
}

.finish-books .blog-list ul li a {
    position: relative;
    margin-top: 12px;
    display: block;
    width: 270px;
    height: 120px
}

.finish-books .blog-list ul li a img {
    display: block;
    width: 100%;
    height: 100%;
    transition: opacity .2s
}

.finish-books .blog-list ul li a:hover img {
    opacity: .7
}

.hark-working {
    height: 590px;
    overflow: hidden
}

.hark-working .books-content {
    height: 540px;
    position: relative
}

.hark-working .headline {
    display: flex;
    justify-content: space-between
}

.hark-working .headline .headline-left {
    display: flex
}

.hark-working .headline .headline-left .headline-icon {
    align-self: center;
    display: inline-block;
    width: 179px;
    height: 32px;
    background: url(/static/img/css_sprites-left.a8d0cc9.png) -209px -62px;
    background-repeat: no-repeat
}

.hark-working .headline .btn-vol {
    align-self: center;
    outline: none;
    border: none;
    width: 85px;
    height: 26px;
    background: none;
    background-image: url(/static/img/mod2_icon@rush.201575c.png)
}

.hark-working .hot-headline {
    display: flex;
    height: 35px
}

.hark-working .hot-headline .hot-headline-icon {
    align-self: center;
    display: block;
    width: 66px;
    height: 21px;
    background: url(/static/img/css_sprites-right.4f6a2ad.png) -146px -92px;
    background-repeat: no-repeat
}

.hark-working .hot-list {
    margin-top: 15px;
    height: 520px;
    overflow: hidden
}

.hark-working .hot-list a.discuss-card {
    position: relative;
    display: block;
    font-size: 12px;
    margin-bottom: 9px;
    padding-left: 15px;
    text-decoration: none;
    color: #333;
    transition: all .2s
}

.hark-working .hot-list a.discuss-card .discuss-tag {
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    width: 4px;
    height: 100%;
    background-color: #00a786;
    opacity: 0;
    transition: all .2s
}

.hark-working .hot-list a.discuss-card .discuss-text {
    line-height: 14px;
    color: #666;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    word-break: break-all;
    transition: all .2s
}

.hark-working .hot-list a.discuss-card .discuss-detail {
    display: flex;
    justify-content: space-between;
    margin-top: 8px;
    color: #999;
    padding-bottom: 10px;
    border-bottom: 1px dashed #ccc
}

.hark-working .hot-list a.discuss-card:last-of-type .discuss-detail {
    display: flex;
    justify-content: space-between;
    margin-top: 8px;
    color: #999;
    padding-bottom: 10px;
    border-bottom: none
}

.hark-working .hot-list a.discuss-card .discuss-detail .discuss-book {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    line-height: 17px;
    max-width: 145px
}

.hark-working .hot-list a.discuss-card .discuss-detail .discuss-name {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 100px;
    line-height: 17px
}

.hark-working .hot-list a.discuss-card:hover .discuss-text {
    color: #00a786
}

.hark-working .hot-list a.discuss-card:hover .discuss-tag {
    opacity: 1
}

.hark-working .hot-list .discuss-card:last-of-type {
    border: none;
    margin: 0
}

.ranking-zoom {
    margin-bottom: 30px
}

.ranking-zoom .rank-content-index {
    display: flex;
    justify-content: flex-start;
    height: 655px;
    overflow: hidden
}

.ranking-zoom .ranking-list {
    width: 195px;
    height: 645px;
    margin-right: 30px;
    overflow: hidden
}

@media (max-width: 1399px) {
    .ranking-zoom .ranking-list {
        margin-right:20px
    }
}

.ranking-zoom .ranking-list .headline {
    display: flex
}

.ranking-zoom .ranking-list .headline .headline-icon {
    align-self: center;
    display: inline-block;
    width: 179px;
    height: 32px;
    background: url(/static/img/css_sprites-left.a8d0cc9.png) -209px -114px;
    background-repeat: no-repeat
}

.ranking-zoom .ranking-list ul {
    list-style: none;
    margin: 20px 0 0;
    padding: 0
}

.ranking-zoom .ranking-list ul li {
    margin-top: 12px;
    height: 32px;
    overflow: hidden
}

.ranking-zoom .ranking-list ul li:first-child,.ranking-zoom .ranking-list ul li:nth-child(2),.ranking-zoom .ranking-list ul li:nth-child(3) {
    height: 75px
}

.ranking-zoom .ranking-list ul li:nth-child(2),.ranking-zoom .ranking-list ul li:nth-child(3),.ranking-zoom .ranking-list ul li:nth-child(4) {
    margin-top: 20px
}

.ranking-zoom .ranking-list ul li .rank {
    position: relative;
    width: 100%
}

.ranking-zoom .ranking-list ul li .rank .rank-num {
    width: 117px
}

.ranking-zoom .ranking-list ul li .rank .rank-num .num-icon {
    width: 22px;
    height: 16px;
    background-color: #e5e5e5
}

.ranking-zoom .ranking-list ul li .rank .rank-num .num {
    width: 91px;
    height: 16px;
    background-color: #e5e5e5
}

.ranking-zoom .ranking-list ul li .rank .rank-book {
    max-width: 117px;
    height: 55px;
    background-color: #e5e5e5
}

.ranking-zoom .ranking-list ul li .rank .img-empty {
    position: absolute;
    right: 0;
    top: 0;
    width: 50px;
    height: 75px;
    background-color: #e5e5e5
}

.ranking-zoom .ranking-list ul li .rank .rank-other {
    width: 100%
}

.ranking-zoom .ranking-list ul li .rank .rank-other .num-icon {
    width: 22px;
    height: 16px;
    background-color: #e5e5e5
}

.ranking-zoom .ranking-list ul li .rank .rank-other .rank-name {
    width: 160px;
    height: 16px;
    background-color: #e5e5e5
}

@media (max-width: 1399px) {
    .ranking-zoom .ranking-list ul li .rank .rank-num {
        width:85px
    }

    .ranking-zoom .ranking-list ul li .rank .rank-num .num {
        width: 59px
    }

    .ranking-zoom .ranking-list ul li .rank .rank-other .rank-name {
        display: inline-block;
        width: 115px;
        height: 16px;
        background-color: #e5e5e5
    }
}

.ranking-zoom .ranking-list ul li a {
    position: relative;
    display: block;
    width: 195px;
    text-decoration: none;
    transition: opacity .2s;
    background-color: #fff
}

.ranking-zoom .ranking-list ul li a .rank-num {
    float: left;
    font-weight: 700;
    display: inline-block
}

.ranking-zoom .ranking-list ul li a .rank-num .num-icon {
    color: #fff;
    display: inline-block;
    margin-right: 10px;
    margin-left: 5px;
    width: 22px;
    height: 16px;
    line-height: 16px;
    text-align: center;
    background-color: #999;
    border-radius: 8px
}

.ranking-zoom .ranking-list ul li a .rank-book {
    float: left;
    width: 155px;
    color: #666;
    font-size: 12px;
    line-height: 18px;
    height: 32px;
    overflow: hidden;
    word-break: break-all
}

.ranking-zoom .ranking-list ul li a .rank-cover {
    position: absolute;
    top: 0;
    right: 8px;
    width: 50px;
    height: 75px
}

.ranking-zoom .ranking-list ul li a .rank-cover img {
    width: 100%;
    height: 100%
}

@media (max-width: 1399px) {
    .ranking-zoom .ranking-list ul li a .rank-cover {
        right:3px
    }
}

.ranking-zoom .ranking-list ul li a:hover {
    opacity: .7
}

@media (max-width: 1399px) {
    .ranking-zoom .ranking-list ul li a {
        font-size:12px;
        width: 155px
    }

    .ranking-zoom .ranking-list ul li a .rank-num .num-icon {
        margin-right: 5px
    }

    .ranking-zoom .ranking-list ul li a .rank-book {
        width: 120px
    }
}

.ranking-zoom .ranking-list ul li:first-of-type a {
    height: 75px
}

.ranking-zoom .ranking-list ul li:first-of-type a .rank-num {
    color: #72b4ff
}

.ranking-zoom .ranking-list ul li:first-of-type a .rank-num .num-icon {
    display: inline-block;
    margin-right: 10px;
    margin-left: 0;
    width: 30px;
    height: 24px;
    line-height: 24px;
    text-align: center;
    background: url(/static/img/mod6_list1@1.f7c6db5.png)
}

.ranking-zoom .ranking-list ul li:first-of-type a .rank-book {
    width: 120px;
    height: 36px;
    line-height: 18px;
    margin-top: 10px;
    margin-left: 5px;
    color: #666;
    font-size: 12px;
    overflow: hidden
}

.ranking-zoom .ranking-list ul li:first-of-type a .rank-cover {
    border-right: 3px solid #72b4ff
}

.ranking-zoom .ranking-list ul li:nth-of-type(2) a {
    height: 75px
}

.ranking-zoom .ranking-list ul li:nth-of-type(2) a .rank-num {
    color: #8ccbff
}

.ranking-zoom .ranking-list ul li:nth-of-type(2) a .rank-num .num-icon {
    display: inline-block;
    margin-right: 10px;
    margin-left: 5px;
    width: 22px;
    height: 16px;
    line-height: 16px;
    background-color: #8ccbff;
    text-align: center
}

.ranking-zoom .ranking-list ul li:nth-of-type(2) a .rank-book {
    width: 120px;
    height: 36px;
    line-height: 18px;
    display: inline-block;
    margin-top: 10px;
    margin-left: 5px;
    color: #666;
    font-size: 12px;
    overflow: hidden
}

.ranking-zoom .ranking-list ul li:nth-of-type(2) a .rank-cover {
    border-right: 3px solid #8ccbff
}

.ranking-zoom .ranking-list ul li:nth-of-type(3) a {
    height: 75px
}

.ranking-zoom .ranking-list ul li:nth-of-type(3) a .rank-num {
    color: #83e6fc
}

.ranking-zoom .ranking-list ul li:nth-of-type(3) a .rank-num .num-icon {
    margin-right: 10px;
    margin-left: 5px;
    width: 22px;
    height: 16px;
    line-height: 16px;
    background-color: #83e6fc;
    text-align: center
}

.ranking-zoom .ranking-list ul li:nth-of-type(3) a .rank-book {
    width: 120px;
    overflow: hidden;
    display: block;
    margin-top: 10px;
    margin-left: 5px;
    color: #666;
    font-size: 12px;
    height: 36px;
    line-height: 18px
}

.ranking-zoom .ranking-list ul li:nth-of-type(3) a .rank-cover {
    border-right: 3px solid #83e6fc
}

@media (max-width: 1399px) {
    .ranking-zoom .ranking-list ul li:first-of-type a .rank-num .num-icon {
        margin-right:4px
    }

    .ranking-zoom .ranking-list ul li:first-of-type a .rank-book {
        width: 90px
    }

    .ranking-zoom .ranking-list ul li:nth-of-type(2) a .rank-num .num-icon {
        margin-right: 4px
    }

    .ranking-zoom .ranking-list ul li:nth-of-type(2) a .rank-book {
        width: 90px
    }

    .ranking-zoom .ranking-list ul li:nth-of-type(3) a .rank-num .num-icon {
        margin-right: 4px
    }

    .ranking-zoom .ranking-list ul li:nth-of-type(3) a .rank-book {
        width: 90px
    }
}

.ranking-zoom .ranking-list:nth-of-type(2) .headline .headline-icon {
    background: url(/static/img/css_sprites-left.a8d0cc9.png) -10px -166px
}

.ranking-zoom .ranking-list:nth-of-type(2) ul li:first-of-type a .rank-num {
    color: #fa7298
}

.ranking-zoom .ranking-list:nth-of-type(2) ul li:first-of-type a .rank-num .num-icon {
    background: url(/static/img/mod6_list2@1.f42f848.png)
}

.ranking-zoom .ranking-list:nth-of-type(2) ul li:first-of-type a .rank-cover {
    border-right: 3px solid #fa7298
}

.ranking-zoom .ranking-list:nth-of-type(2) ul li:nth-of-type(2) a {
    height: 75px
}

.ranking-zoom .ranking-list:nth-of-type(2) ul li:nth-of-type(2) a .rank-num {
    color: #fc9f70
}

.ranking-zoom .ranking-list:nth-of-type(2) ul li:nth-of-type(2) a .rank-num .num-icon {
    background-color: #fc9f70
}

.ranking-zoom .ranking-list:nth-of-type(2) ul li:nth-of-type(2) a .rank-cover {
    border-right: 3px solid #fc9f70
}

.ranking-zoom .ranking-list:nth-of-type(2) ul li:nth-of-type(3) a {
    height: 75px
}

.ranking-zoom .ranking-list:nth-of-type(2) ul li:nth-of-type(3) a .rank-num {
    color: #fcca64
}

.ranking-zoom .ranking-list:nth-of-type(2) ul li:nth-of-type(3) a .rank-num .num-icon {
    background-color: #fcca64
}

.ranking-zoom .ranking-list:nth-of-type(2) ul li:nth-of-type(3) a .rank-cover {
    border-right: 3px solid #fcca64
}

.ranking-zoom .ranking-list:nth-of-type(3) .headline .headline-icon {
    background: url(/static/img/css_sprites-left.a8d0cc9.png) -209px -166px
}

.ranking-zoom .ranking-list:nth-of-type(3) ul li:first-of-type a .rank-num {
    color: #f97c9b
}

.ranking-zoom .ranking-list:nth-of-type(3) ul li:first-of-type a .rank-num .num-icon {
    background: url(/static/img/mod6_list3@1.f61b817.png)
}

.ranking-zoom .ranking-list:nth-of-type(3) ul li:first-of-type a .rank-cover {
    border-right: 3px solid #f97c9b
}

.ranking-zoom .ranking-list:nth-of-type(3) ul li:nth-of-type(2) a {
    height: 75px
}

.ranking-zoom .ranking-list:nth-of-type(3) ul li:nth-of-type(2) a .rank-num {
    color: #ffa3ca
}

.ranking-zoom .ranking-list:nth-of-type(3) ul li:nth-of-type(2) a .rank-num .num-icon {
    background-color: #ffa3ca
}

.ranking-zoom .ranking-list:nth-of-type(3) ul li:nth-of-type(2) a .rank-cover {
    border-right: 3px solid #ffa3ca
}

.ranking-zoom .ranking-list:nth-of-type(3) ul li:nth-of-type(3) a {
    height: 75px
}

.ranking-zoom .ranking-list:nth-of-type(3) ul li:nth-of-type(3) a .rank-num {
    color: #f9c0cd
}

.ranking-zoom .ranking-list:nth-of-type(3) ul li:nth-of-type(3) a .rank-num .num-icon {
    background-color: #f9c0cd
}

.ranking-zoom .ranking-list:nth-of-type(3) ul li:nth-of-type(3) a .rank-cover {
    border-right: 3px solid #f9c0cd
}

.ranking-zoom .ranking-list:nth-of-type(4) .headline .headline-icon {
    background: url(/static/img/css_sprites-left.a8d0cc9.png) -10px -218px
}

.ranking-zoom .ranking-list:nth-of-type(4) ul li:first-of-type a .rank-num {
    color: #87da78
}

.ranking-zoom .ranking-list:nth-of-type(4) ul li:first-of-type a .rank-num .num-icon {
    background: url(/static/img/mod6_list4@1.4cda64d.png)
}

.ranking-zoom .ranking-list:nth-of-type(4) ul li:first-of-type a .rank-cover {
    border-right: 3px solid #87da78
}

.ranking-zoom .ranking-list:nth-of-type(4) ul li:nth-of-type(2) a {
    height: 75px
}

.ranking-zoom .ranking-list:nth-of-type(4) ul li:nth-of-type(2) a .rank-num {
    color: #8aebc0
}

.ranking-zoom .ranking-list:nth-of-type(4) ul li:nth-of-type(2) a .rank-num .num-icon {
    background-color: #8aebc0
}

.ranking-zoom .ranking-list:nth-of-type(4) ul li:nth-of-type(2) a .rank-cover {
    border-right: 3px solid #8aebc0
}

.ranking-zoom .ranking-list:nth-of-type(4) ul li:nth-of-type(3) a {
    height: 75px
}

.ranking-zoom .ranking-list:nth-of-type(4) ul li:nth-of-type(3) a .rank-num {
    color: #b7e7af
}

.ranking-zoom .ranking-list:nth-of-type(4) ul li:nth-of-type(3) a .rank-num .num-icon {
    background-color: #b7e7af
}

.ranking-zoom .ranking-list:nth-of-type(4) ul li:nth-of-type(3) a .rank-cover {
    border-right: 3px solid #b7e7af
}

.ranking-zoom .btn-ranking {
    display: block;
    width: 100%;
    height: 40px;
    border-radius: 20px;
    background-color: #eee;
    font-size: 14px;
    color: #666;
    transition: all .2s;
    text-align: center;
    line-height: 40px;
    text-decoration: none
}

.ranking-zoom .btn-ranking .arrow {
    display: inline-block;
    margin-right: 10px;
    border-left: 2px solid #666;
    border-bottom: 2px solid #666;
    width: 9px;
    height: 9px;
    transform: rotate(220deg);
    transition: all .2
}

.ranking-zoom .btn-ranking:hover {
    background-color: #00a786;
    color: #fff
}

.ranking-zoom .btn-ranking:hover .arrow {
    border-color: #fff
}

.ranking-zoom .update-headline {
    display: flex;
    height: 32px
}

.ranking-zoom .update-headline .update-headline-icon {
    align-self: center;
    display: block;
    width: 116px;
    height: 21px;
    background: url(/static/img/css_sprites-right.4f6a2ad.png) -10px -51px;
    background-repeat: no-repeat
}

.ranking-zoom .update-headline .update-headline-text {
    align-self: center;
    margin-left: 10px;
    font-size: 14px;
    color: #999
}

.ranking-zoom .update-list {
    padding-top: 27px
}

.ranking-zoom .update-list a.bookup-card {
    display: block;
    position: relative;
    margin-bottom: 19.5px;
    text-decoration: none;
    color: #000;
    transition: opacity .2s
}

.ranking-zoom .update-list a.bookup-card .book-name {
    line-height: 14px;
    font-size: 13px;
    font-weight: 700;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.ranking-zoom .update-list a.bookup-card .book-detail {
    line-height: 12px;
    margin-top: 9px;
    font-size: 12px;
    color: #999;
    display: flex
}

.book-author {
    max-width: 100px
}

.book-author,.update-time {
    display: inline-block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.update-time {
    width: 100px
}

.ranking-zoom .update-list a.bookup-card .book-detail .split {
    align-self: center;
    margin: 0 15px
}

.ranking-zoom .update-list a.bookup-card:hover {
    opacity: .7
}

.recent-reward {
    margin-top: 30px;
    overflow: hidden;
    height: 420px
}

.recent-reward .headline {
    display: flex;
    justify-content: space-between
}

.recent-reward .headline .headline-left {
    display: flex
}

.recent-reward .headline .headline-left .headline-icon {
    align-self: center;
    display: block;
    width: 179px;
    height: 32px;
    background: url(/static/img/css_sprites-left.a8d0cc9.png) -209px -218px;
    background-repeat: no-repeat
}

.recent-reward .headline .headline-left .headline-face {
    margin-left: -65px;
    align-self: center;
    font-size: 14px;
    color: #999
}

.recent-reward .reward-list {
    margin-top: 15px
}

.recent-reward .reward-list ul {
    list-style-type: none;
    padding: 0;
    margin: 0
}

.recent-reward .reward-list ul li {
    float: left;
    margin-right: 40px;
    margin-bottom: 15px
}

.recent-reward .reward-list ul li a {
    display: inline-block;
    width: 185px;
    text-decoration: none
}

.recent-reward .reward-list ul li a .reward-book {
    position: relative;
    display: flex;
    justify-content: space-between;
    background-color: #fff
}

.recent-reward .reward-list ul li a .reward-book .reward-cover {
    position: absolute;
    width: 52px;
    height: 78px
}

.recent-reward .reward-list ul li a .reward-book .reward-cover img {
    width: 100%;
    height: 100%
}

.recent-reward .reward-list ul li a .reward-book .book-info {
    width: 120px;
    font-weight: 700;
    margin-top: 4px;
    margin-left: 60px
}

.recent-reward .reward-list ul li a .reward-book .book-info .book-name {
    color: #333;
    font-size: 13px;
    line-height: 18px;
    height: 36px;
    overflow: hidden;
    word-break: break-all
}

.recent-reward .reward-list ul li a .reward-book .book-info .reward-detail {
    font-size: 12px;
    line-height: 20px;
    color: #999;
    font-weight: 400
}

.recent-reward .reward-list ul li a .reward-book .book-info .reward-detail p {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    word-break: break-all;
    margin: 0
}

.recent-reward .reward-list ul li:nth-of-type(4),.recent-reward .reward-list ul li:nth-of-type(8),.recent-reward .reward-list ul li:nth-of-type(12),.recent-reward .reward-list ul li:nth-of-type(16) {
    margin-right: 0
}

@media (max-width: 1400px) {
    .recent-reward .reward-list ul li {
        margin-right:55px
    }

    .recent-reward .reward-list ul li:nth-of-type(3) {
        margin-right: 0
    }

    .recent-reward .reward-list ul li:nth-of-type(4) {
        margin-right: 55px
    }

    .recent-reward .reward-list ul li:nth-of-type(6) {
        margin-right: 0
    }

    .recent-reward .reward-list ul li:nth-of-type(8) {
        margin-right: 55px
    }

    .recent-reward .reward-list ul li:nth-of-type(9) {
        margin-right: 0
    }

    .recent-reward .reward-list ul li:nth-of-type(12) {
        margin-right: 55px;
        margin-right: 0
    }

    .recent-reward .reward-list ul li:nth-of-type(15) {
        margin-right: 0
    }

    .recent-reward .reward-list ul li:nth-of-type(16) {
        margin-right: 55px
    }
}

.recent-reward .money-headline {
    display: flex;
    height: 32px
}

.recent-reward .money-headline .money-headline-text {
    align-self: center;
    margin-left: 10px;
    font-size: 14px;
    color: #999
}

.recent-reward .money-list ul {
    list-style-type: none;
    margin: 0;
    padding: 0
}

.recent-reward .money-list ul li {
    margin-top: 20px;
    transition: opacity .2s
}

.recent-reward .money-list ul li .money-person {
    display: flex;
    justify-content: space-between;
    font-size: 12px
}

.recent-reward .money-list ul li .money-person .left {
    display: flex;
    justify-content: space-between;
    align-self: center
}

.recent-reward .money-list ul li .money-person .left .money-num {
    color: #f1ba33;
    font-weight: 700
}

.recent-reward .money-list ul li .money-person .left .money-name {
    width: 90px;
    color: #999;
    margin-left: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: left;
    white-space: nowrap;
    align-self: center
}

.recent-reward .money-list ul li .money-person .right {
    display: flex;
    justify-content: space-between;
    align-self: center
}

.recent-reward .money-list ul li .money-person .right .money-count {
    position: relative;
    max-width: 78px;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: right;
    white-space: nowrap;
    align-self: center;
    color: #999;
    margin-right: 12px
}

.recent-reward .money-list ul li .money-person .right .money-rank {
    position: relative
}

.recent-reward .money-list ul li .money-person .right .triangle-down {
    margin-right: 5px;
    align-self: center;
    position: absolute;
    top: 5px;
    border: 5px solid;
    border-color: #df6e6e transparent transparent;
    height: 0;
    width: 0
}

.recent-reward .money-list ul li .money-person .right .triangle-down figcaption:after {
    content: "";
    position: absolute;
    border: 5px solid;
    border-color: transparent red transparent transparent;
    right: 100%;
    top: 30px;
    height: 0;
    width: 0
}

.recent-reward .money-list ul li .money-person .right .down {
    margin-left: 15px;
    color: #df6e6e;
    font-weight: 700
}

.recent-reward .money-list ul li .money-person .right .triangle-up {
    margin-right: 5px;
    align-self: center;
    position: absolute;
    border: 5px solid;
    border-color: transparent transparent #3bb996;
    height: 0;
    width: 0
}

.recent-reward .money-list ul li .money-person .right .triangle-up figcaption:after {
    content: "";
    position: absolute;
    border: 5px solid;
    border-color: transparent #3bb996 transparent transparent;
    right: 100%;
    top: 30px;
    height: 0;
    width: 0
}

.recent-reward .money-list ul li .money-person .right .up {
    margin-left: 15px;
    color: #3bb996;
    font-weight: 700
}

.recent-reward .money-list ul li:hover {
    opacity: .7
}

.recent-reward .money-list ul li:first-of-type .money-person .left .money-num {
    width: 25px;
    height: 25px;
    background-image: url(/static/img/mod7_list@1.0fee9d2.png)
}

.recent-reward .money-list ul li:nth-of-type(2) .money-person .left .money-num {
    width: 25px;
    height: 25px;
    background-image: url(/static/img/mod7_list@2.7ccc391.png)
}

.recent-reward .money-list ul li:nth-of-type(3) .money-person .left .money-num {
    width: 25px;
    height: 25px;
    background-image: url(/static/img/mod7_list@3.f3931fe.png)
}

.new-l-side {
    position: relative;
    float: left;
    width: 870px
}

@media (max-width: 1399px) {
    .new-l-side {
        width:690px
    }
}

.new-r-side {
    position: relative;
    float: right;
    width: 270px
}

.work-list {
    margin-top: 15px
}

.work-list ul {
    list-style: none;
    padding: 0;
    margin: 0
}

.work-list ul li {
    float: left;
    margin-right: 18px
}

.work-list ul li a.book-item-inner {
    color: #333;
    display: inline-block;
    width: 130px;
    height: 275px;
    text-decoration: none
}

.work-list ul li a.book-item-inner>.book-item-name {
    position: relative;
    text-align: center;
    font-size: 13px;
    width: 110px;
    margin: 15px auto;
    display: block;
    height: 34px;
    overflow: hidden;
    word-break: break-all
}

.work-list ul li a.book-item-inner .cover {
    position: relative;
    width: 130px;
    height: 195px;
    background-color: #999
}

.work-list ul li a.book-item-inner .cover img {
    display: block;
    width: 100%;
    height: 100%
}

.work-list ul li a.book-item-inner .cover .mask {
    opacity: 0;
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    transition: all .2s;
    background-color: #fff;
    box-shadow: 0 0 10px #e7e7e7
}

.work-list ul li a.book-item-inner .cover .mask .mask-avatar {
    position: relative;
    display: block;
    width: 48px;
    height: 48px;
    border: 2px solid #666;
    margin: 12px auto;
    border-radius: 50%
}

.work-list ul li a.book-item-inner .cover .mask .mask-avatar img {
    width: 100%;
    height: 100%;
    border-radius: 50%
}

.work-list ul li a.book-item-inner .cover .mask .mask-author {
    width: 100px;
    margin: 0 auto;
    font-size: 14px;
    color: #333;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.work-list ul li a.book-item-inner .cover .mask .mask-detail>p {
    width: 100px;
    line-height: 13px;
    font-size: 12px;
    color: #666;
    margin: 5px auto;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.work-list ul li a.book-item-inner:hover .mask {
    opacity: .9;
    transform: scale(1.1)
}

.work-list ul li:last-of-type {
    margin-right: 0
}

@media (max-width: 1399px) {
    .work-list ul li {
        margin-right:10px
    }
}

.books-content .work-list ul li:nth-of-type(6),.books-content .work-list ul li:nth-of-type(12),.books-content .work-list ul li:nth-of-type(18) {
    margin: 0
}

@media (max-width: 1399px) {
    .books-content .work-list ul li:nth-of-type(5) {
        margin:0
    }

    .books-content .work-list ul li:nth-of-type(6) {
        margin-right: 10px
    }

    .books-content .work-list ul li:nth-of-type(10) {
        margin: 0
    }

    .books-content .work-list ul li:nth-of-type(12) {
        margin-right: 10px
    }

    .books-content .work-list ul li:nth-of-type(15) {
        margin: 0
    }

    .books-content .work-list ul li:nth-of-type(18) {
        margin-right: 10px
    }
}

.ad {
    height: 150px;
    margin-bottom: 30px
}

@media (max-width: 1399px) {
    .ad {
        height:128px
    }
}

.ad a {
    display: block;
    position: relative;
    width: 100%;
    height: 150px;
    color: #666
}

@media (max-width: 1399px) {
    .ad a {
        height:128px
    }
}

.ad img {
    display: block;
    width: 100%;
    height: 150px
}

@media (max-width: 1399px) {
    .ad img {
        height:128px
    }
}

.ad .ad-tip {
    display: block;
    position: absolute;
    right: 10px;
    top: 10px;
    padding: 2px;
    border: 1px solid #666;
    font-size: 12px
}

@media only screen and (-webkit-min-device-pixel-ratio: 2),only screen and (min-device-pixel-ratio:2) {
    .user-center .be-come-create .linovel-girl {
        background-image:url(/static/img/right_img1@2x.92a80ed.png);
        background-size: 106px 64px;
        background-repeat: no-repeat
    }

    .user-center .rules-notice .rules-list ul li a i.signing-welfare {
        background-image: url(/static/img/tight_button2@2x.2b9f706.png);
        background-size: 60px 54px
    }

    .user-center .rules-notice .rules-list ul li a i.consult-editor {
        background-image: url(/static/img/right_button3@2x.6d7e695.png);
        background-size: 60px 54px
    }

    .user-center .rules-notice .rules-list ul li a i.outline-course {
        background-image: url(/static/img/right_button4@2x.aca2e98.png);
        background-size: 60px 54px
    }

    .strength-recommend .action-headline .action-headline-icon {
        background-image: url(/static/img/action_canter@2x.956f923.png);
        background-size: 67px 21px;
        background-position: inherit
    }

    .strength-recommend .headline .headline-icon {
        background-image: url(/static/img/css_sprites-left@2x.a97d31b.png);
        background-position: -10px -3px;
        background-size: 380px 210px
    }

    .boutique-books .headline .headline-left .headline-icon {
        background-image: url(/static/img/css_sprites-left@2x.a97d31b.png);
        background-position: -9px -47px;
        background-size: 380px 210px
    }

    .linove-articles .headline .headline-left .headline-icon {
        background-image: url(/static/img/css_sprites-left@2x.a97d31b.png);
        background-position: -9px -89px;
        background-size: 380px 210px
    }

    .finish-books .headline .headline-left .headline-icon {
        background-image: url(/static/img/css_sprites-left@2x.a97d31b.png);
        background-position: -9px -131px;
        background-size: 380px 210px
    }

    .hark-working .headline .headline-left .headline-icon {
        background-image: url(/static/img/css_sprites-left@2x.a97d31b.png);
        background-position: -199px -5px;
        background-size: 380px 210px
    }

    .ranking-zoom .ranking-list .headline .headline-icon {
        background-image: url(/static/img/css_sprites-left@2x.a97d31b.png);
        background-position: -199px -47px;
        background-size: 380px 210px
    }

    .ranking-zoom .ranking-list:nth-of-type(2) .headline .headline-icon {
        background-image: url(/static/img/css_sprites-left@2x.a97d31b.png);
        background-position: -199px -89px;
        background-size: 380px 210px
    }

    .ranking-zoom .ranking-list:nth-of-type(3) .headline .headline-icon {
        background-image: url(/static/img/css_sprites-left@2x.a97d31b.png);
        background-position: -199px -131px;
        background-size: 380px 210px
    }

    .ranking-zoom .ranking-list:nth-of-type(4) .headline .headline-icon {
        background-image: url(/static/img/css_sprites-left@2x.a97d31b.png);
        background-position: -9px -173px;
        background-size: 380px 210px
    }

    .recent-reward .headline .headline-left .headline-icon {
        background-image: url(/static/img/css_sprites-left@2x.a97d31b.png);
        background-position: -199px -173px;
        background-size: 380px 210px
    }

    .ranking-zoom .ranking-list ul li:first-of-type a .rank-num .num-icon {
        background-image: url(/static/img/mod6_list1@1@2x.69efe3b.png);
        background-size: 30px 24px
    }

    .ranking-zoom .ranking-list:nth-of-type(2) ul li:first-of-type a .rank-num .num-icon {
        background-image: url(/static/img/mod6_list2@1@2x.8dcd8b3.png);
        background-size: 30px 24px
    }

    .ranking-zoom .ranking-list:nth-of-type(3) ul li:first-of-type a .rank-num .num-icon {
        background-image: url(/static/img/mod6_list3@1@2x.c813d28.png);
        background-size: 30px 24px
    }

    .ranking-zoom .ranking-list:nth-of-type(4) ul li:first-of-type a .rank-num .num-icon {
        background-image: url(/static/img/mod6_list4@1@2x.9c06fb8.png);
        background-size: 30px 24px
    }

    .boutique-books .headline .btn-vol {
        background-image: url(/static/img/mod2_icon@rush@2x.3701284.png);
        background-size: 85px 26px
    }

    .linove-articles .headline .btn-vol {
        background-image: url(/static/img/mod3_button1@2x.7c1b767.png);
        background-size: 85px 26px
    }

    .hark-working .headline .btn-vol {
        background-image: url(/static/img/mod2_icon@rush@2x.3701284.png);
        background-size: 85px 26px
    }

    .finish-books .blog-headline .blog-headline-btn {
        background-image: url(/static/img/mod4_button2@2x.96dc75b.png);
        background-size: 85px 26px
    }

    .user-center .rules-notice .notice-content .notice-title .notice-icon {
        background-image: url(/static/img/right_title1@2x.dd3bef2.png);
        background-size: 54px 17px
    }

    .boutique-books .update-headline .update-headline-icon {
        background-image: url(/static/img/mod2_title2@2x.84b6627.png);
        background-size: 116px 21px;
        background-position: inherit
    }

    .linove-articles .hot-headline .hot-headline-icon {
        background-image: url(/static/img/mod3_title2@2x.987bf94.png);
        background-size: 66px 21px;
        background-position: inherit
    }

    .finish-books .blog-headline .blog-headline-icon {
        background-image: url(/static/img/mod4_title2@2x.ff8e1c3.png);
        background-size: 95px 21px;
        background-position: inherit
    }

    .hark-working .hot-headline .hot-headline-icon {
        background-image: url(/static/img/mod5_title2@2x.d6516da.png);
        background-size: 66px 21px;
        background-position: inherit
    }

    .ranking-zoom .update-headline .update-headline-icon {
        background-image: url(/static/img/mod6_title5@2x.5403d07.png);
        background-size: 116px 21px;
        background-position: inherit
    }
}

.wrapper {
    margin-top: 55px!important
}

.img-loading {
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    background-color: #999;
    transition: z-index .4s
}

.img-loading_hover {
    z-index: -1
}

.footer {
    padding: 0
}

.footer .container {
    position: unset
}

.footer-about {
    border-top: 6px solid #00a786;
    height: 190px;
    background-color: #666
}

.footer-about .link-group {
    display: flex;
    height: 154px
}

.footer-about .link-grid {
    align-self: center;
    width: 160px;
    height: 87px
}

.footer-about .link-grid:nth-of-type(2) {
    width: 170px
}

.footer-about .link-grid:nth-of-type(3) {
    width: 220px
}

.footer-about .link-grid:nth-of-type(3) a {
    min-width: 74px
}

.footer-about .link-grid .link-title {
    display: block;
    color: #ccc;
    font-size: 12px
}

.footer-about .link-grid ul {
    padding: 0;
    margin: 0;
    list-style-type: none
}

.footer-about .link-grid ul li {
    float: left;
    margin-right: 20px;
    margin-top: 15px
}

.footer-about .link-grid ul li a {
    display: inline-block;
    color: #fff;
    text-decoration: none;
    font-size: 12px
}

.footer-about .split-link-line {
    display: inline-block;
    align-self: center;
    width: 1px;
    height: 37px;
    background-color: #999;
    margin-right: 30px
}

.footer-about .about-logo {
    height: 190px;
    display: flex;
    justify-content: center
}

.footer-about .about-logo a {
    align-self: center;
    display: block;
    width: 151px;
    height: 55px;
    background-image: url(/static/img/footer_logo.9f44a70.png)
}

.friendship-link {
    height: 112px;
    background-color: #eee;
    position: relative
}

.friendship-link .links-zoom {
    position: absolute;
    top: 50%;
    transform: translateY(-50%)
}

.friendship-link .links-zoom .links {
    height: 15px;
    display: flex
}

.friendship-link .links-zoom .links .links-title {
    display: inline-block;
    color: #ccc;
    font-size: 13px;
    font-weight: 700
}

.friendship-link .links-zoom .links ul {
    align-self: center;
    display: inline-block;
    padding: 0;
    margin: 0;
    list-style: none
}

.friendship-link .links-zoom .links ul li {
    float: left;
    margin-left: 30px
}

.friendship-link .links-zoom .links ul li a {
    text-decoration: none;
    display: block;
    font-size: 13px;
    color: #333
}

.friendship-link .links-zoom .links:last-of-type {
    margin-top: 25px
}

.footer-bottom {
    height: 50px;
    line-height: 50px
}

.footer-bottom p {
    text-align: right
}

@media only screen and (-webkit-min-device-pixel-ratio: 2),only screen and (min-device-pixel-ratio:2) {
    .footer-about .about-logo a {
        background-image:url(/static/img/footer_logo@2x.b02dc2b.png);
        background-size: 151px 55px
    }
}

.rank-page {
    position: relative;
    z-index: 2;
    margin-top: -50px;
    width: 100%
}

.rank-page .rank-menu {
    position: relative;
    height: 85px;
    border-top-left-radius: 26px;
    border-top-right-radius: 26px;
    background: linear-gradient(180deg,hsla(0,0%,100%,.5),#fff 50%);
    display: flex;
    align-items: center
}

.rank-page .rank-menu ul.rank-inner {
    list-style: none;
    padding: 0;
    margin: 0;
    margin-left: 200px;
    width: 245px;
    display: none;
    justify-content: space-between;
    align-items: center
}

.rank-page .rank-menu ul.rank-inner.show_menu {
    display: flex
}

.rank-page .rank-menu ul.rank-inner li a {
    display: flex;
    align-items: center;
    padding-top: 10px;
    height: 85px;
    color: #333;
    font-size: 16px;
    text-decoration: none;
    border-bottom: 3px solid #fff
}

.rank-page .rank-menu ul.rank-inner li a:hover {
    color: #51caac;
    border-bottom: 3px solid #51caac
}

.rank-page .rank-menu ul.rank-inner li a.show_choose {
    z-index: 2;
    color: #51caac;
    border-bottom: 3px solid #51caac
}

.rank-page .rank-menu .order-way {
    position: absolute;
    top: 50%;
    right: 40px;
    transform: translateY(-50%);
    width: 50px;
    display: none;
    justify-content: space-between
}

.rank-page .rank-menu .order-way.show_menu {
    display: flex
}

.rank-page .rank-menu .order-way .order {
    cursor: pointer;
    width: 18px;
    height: 18px
}

.rank-page .rank-menu .order-way .order-first {
    transition: all .4s;
    background-image: url(/static/img/button_menu.4532ce4.png)
}

.rank-page .rank-menu .order-way .order-first.show_choose,.rank-page .rank-menu .order-way .order-first:hover {
    background-image: url(/static/img/button_menu_a.7fd97a8.png)
}

.rank-page .rank-menu .order-way .order-second {
    transition: all .4s;
    background-image: url(/static/img/button_card.6d32765.png)
}

.rank-page .rank-menu .order-way .order-second.show_choose,.rank-page .rank-menu .order-way .order-second:hover {
    background-image: url(/static/img/button_card_a.c735e4a.png)
}

.rank-page .rank-container {
    position: relative;
    background-color: #fff
}

.rank-page .rank-container .rank-slide-menu {
    position: absolute;
    top: -85px;
    width: 160px
}

.rank-page .rank-container .rank-slide-menu.fixed-slide-menu {
    position: fixed;
    z-index: 2;
    top: 110px
}

.rank-page .rank-container .rank-slide-menu ul {
    list-style: none;
    margin: 0;
    padding: 0
}

.rank-page .rank-container .rank-slide-menu ul .tab-line {
    width: 88px;
    height: 1px;
    background-color: #eee;
    margin: 5px auto
}

.rank-page .rank-container .rank-slide-menu ul li {
    padding: 7px;
    background-color: #fff
}

.rank-page .rank-container .rank-slide-menu ul li:nth-of-type(2) {
    padding-top: 12px
}

.rank-page .rank-container .rank-slide-menu ul li.inner-title {
    width: 100%;
    height: 86px;
    border-bottom: 1px solid #eee;
    background-color: inherit;
    background-image: url(/static/img/img_rank.1a39b94.png);
    background-position: 50%;
    background-repeat: no-repeat
}

.rank-page .rank-container .rank-slide-menu ul li a {
    position: relative;
    width: 130px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    text-decoration: none;
    color: #333;
    font-weight: 700;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 20px;
    background-color: #fff;
    transition: all .4s
}

.rank-page .rank-container .rank-slide-menu ul li a p {
    margin: 0
}

.rank-page .rank-container .rank-slide-menu ul li a:hover {
    background-color: #eee;
    box-shadow: 0 3px 12px 0 hsla(0,0%,79%,.44)
}

.rank-page .rank-container .rank-slide-menu ul li a.show_choose {
    color: #fff;
    background-color: #51caac;
    box-shadow: 0 3px 12px 0 rgba(81,202,172,.44)
}

.rank-page .rank-container .rank-slide-menu ul li a.show_choose:after {
    content: "";
    position: absolute;
    border-width: 6px 0 6px 8px;
    border-style: solid;
    border-color: transparent transparent transparent #fff;
    right: 15px;
    top: 50%;
    transform: translateY(-50%);
    height: 0;
    width: 0
}

.rank-page .rank-container .rank-slide-menu ul li a i {
    position: absolute;
    left: 4px;
    top: 50%;
    transform: translateY(-50%);
    display: block;
    width: 34px;
    height: 34px
}

.rank-page .rank-container .rank-slide-menu ul li a i.tab-all {
    background-image: url(/static/img/tab2_icon1.9442eb2.png)
}

.rank-page .rank-container .rank-slide-menu ul li a i.tab-star {
    background-image: url(/static/img/tab2_icon2.b903eed.png)
}

.rank-page .rank-container .rank-slide-menu ul li a i.tab-crow {
    background-image: url(/static/img/tab2_icon3.efc13c7.png)
}

.rank-page .rank-container .rank-slide-menu ul li a i.tab-ticket {
    background-image: url(/static/img/tab2_icon4.44695d8.png)
}

.rank-page .rank-container .rank-slide-menu ul li a i.tab-coin {
    background-image: url(/static/img/tab2_icon5.65f13dd.png)
}

.rank-page .rank-container .rank-slide-menu ul li a i.tab-ink {
    background-image: url(/static/img/tab2_icon6.cbd776c.png)
}

.rank-page .rank-container .rank-slide-menu ul li a i.tab-support {
    background-image: url(/static/img/tab2_icon7.285f853.png)
}

.rank-page .slide-right-menu {
    position: fixed;
    z-index: 2;
    top: 45%;
    left: 50%;
    margin-left: 625px;
    transform: translate(-45%,-50%);
    visibility: hidden;
    opacity: 0;
    transition: all .3s
}

.rank-page .slide-right-menu.show_menu {
    visibility: visible;
    opacity: 1
}

@media (max-width: 1399px) {
    .rank-page .slide-right-menu {
        margin-left:535px
    }
}

.rank-page .slide-right-menu ul.queue-time {
    padding: 0;
    margin: 0;
    list-style: none
}

.rank-page .slide-right-menu ul.queue-time li {
    margin-bottom: 13px
}

.rank-page .slide-right-menu ul.queue-time li a {
    display: block;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #eee;
    box-shadow: 0 3px 12px 0 hsla(0,0%,79%,.44);
    background-repeat: no-repeat;
    background-position: 50%;
    transition: all .4s
}

.rank-page .slide-right-menu ul.queue-time li a.queue-week {
    background-image: url(/static/img/button_week.8869f91.png)
}

.rank-page .slide-right-menu ul.queue-time li a.queue-week.show_choose,.rank-page .slide-right-menu ul.queue-time li a.queue-week:hover {
    background-image: url(/static/img/button_week_a.7a1b632.png);
    background-color: #51caac;
    box-shadow: 0 3px 12px 0 rgba(81,202,172,.44)
}

.rank-page .slide-right-menu ul.queue-time li a.queue-month {
    background-image: url(/static/img/button_month.6f22323.png)
}

.rank-page .slide-right-menu ul.queue-time li a.queue-month.show_choose,.rank-page .slide-right-menu ul.queue-time li a.queue-month:hover {
    background-image: url(/static/img/button_month_a.cf2fc7b.png);
    background-color: #51caac;
    box-shadow: 0 3px 12px 0 rgba(81,202,172,.44)
}

.rank-page .slide-right-menu ul.queue-time li a.queue-new {
    background-image: url(/static/img/button_new.6d7983c.png)
}

.rank-page .slide-right-menu ul.queue-time li a.queue-new.show_choose,.rank-page .slide-right-menu ul.queue-time li a.queue-new:hover {
    background-image: url(/static/img/button_new_a.ca4fe75.png);
    background-color: #51caac;
    box-shadow: 0 3px 12px 0 rgba(81,202,172,.44)
}

.rank-page .slide-right-menu .slide-top {
    cursor: pointer;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-color: #eee;
    box-shadow: 0 3px 12px 0 hsla(0,0%,79%,.44);
    background-image: url(/static/img/button_top.a12f2a8.png);
    background-repeat: no-repeat;
    background-position: 50%;
    opacity: 1;
    transition: all .3
}

.rank-page .slide-right-menu .slide-top:hover {
    opacity: .8
}

.rank-after,.rank-before,.rank-last {
    color: #999;
    font-size: 16px;
    text-align: center;
    padding-left: 25px;
    cursor: pointer;
    width: 100px;
    margin: 0 auto
}

.rank-after.before,.rank-before.before,.rank-last.before {
    background-image: url(/static/img/icon_more_up.569f3e2.png);
    background-repeat: no-repeat;
    background-position: 5px
}

.rank-after.after,.rank-before.after,.rank-last.after {
    background-image: url(/static/img/icon_more_down.3e961a4.png);
    background-repeat: no-repeat;
    background-position: 5px
}

.rank-after.last,.rank-before.last,.rank-last.last {
    padding-left: 30px;
    width: 180px;
    background-image: url(/static/img/icon_nothing.c04140d.png);
    background-repeat: no-repeat;
    background-position: 5px
}

.rank-after.nomore,.rank-before.nomore,.rank-last.nomore {
    width: 140px
}

.rank-loading {
    position: relative;
    width: 100%;
    height: 195px;
    background-color: #ddd
}

.rank-loading+.rank-loading {
    margin-top: 40px
}

.rank-loading:first-of-type {
    margin-top: 0
}

.rank-loading:last-of-type:after {
    display: none
}

.rank-loading:after {
    content: " ";
    position: absolute;
    left: 0;
    bottom: -20px;
    width: 100%;
    height: 1px;
    background-color: #dbdbdb
}

.ill-page {
    position: relative;
    z-index: 2;
    margin-top: -50px;
    width: 100%
}

.ill-page.switch {
    background-color: #f6f7f8
}

.ill-page .ill-menu {
    position: relative;
    height: 85px;
    border-top-left-radius: 26px;
    border-top-right-radius: 26px;
    background: linear-gradient(180deg,hsla(0,0%,100%,.5),#fff 50%);
    display: flex;
    align-items: center
}

.ill-page .ill-menu .ill-logo {
    width: 88px;
    height: 32px;
    margin: 0 50px;
    background-image: url(/static/img/img_title.7382d97.png);
    background-position: 50%;
    background-repeat: no-repeat
}

.ill-page .ill-menu ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex
}

.ill-page .ill-menu ul li {
    margin-right: 40px
}

.ill-page .ill-menu ul li a {
    margin-top: -10px;
    position: relative;
    display: block;
    height: 80px;
    line-height: 75px;
    color: #333;
    font-size: 16px;
    text-decoration: none
}

.ill-page .ill-menu ul li a.choose,.ill-page .ill-menu ul li a:hover {
    font-weight: 700;
    color: #51caac
}

.ill-page .ill-menu ul.ill-menu-left {
    position: absolute;
    top: 8px;
    left: 200px
}

.ill-page .ill-menu ul.ill-menu-left li a.choose,.ill-page .ill-menu ul.ill-menu-left li a:hover {
    border-bottom: 3px solid #51caac
}

.ill-page .ill-menu ul.ill-menu-right {
    position: absolute;
    top: 8px;
    right: 0
}

.ill-page .ill-menu ul.ill-menu-right li {
    display: flex
}

.ill-page .ill-menu ul.ill-menu-right li span {
    position: relative;
    display: block;
    margin-top: 20px;
    margin-right: 8px;
    width: 16px;
    height: 16px
}

.ill-page .ill-menu ul.ill-menu-right li span.ill-icon-book {
    background-image: url(/static/img/icon_cover.424899a.png)
}

.ill-page .ill-menu ul.ill-menu-right li span.ill-icon-book:after {
    position: absolute;
    top: 2px;
    left: -30px;
    content: " ";
    width: 1px;
    height: 11px;
    background-color: #eee
}

.ill-page .ill-menu ul.ill-menu-right li span.ill-icon-emotion {
    background-image: url(/static/img/icon_emoticon.4d30d05.png)
}

.ill-page .ill-container {
    position: relative;
    min-height: 370px;
    padding-bottom: 60px
}

.ill-page .ill-container .emotion-group {
    margin-top: 30px
}

.ill-page .ill-container .emotion-group .emotion-title {
    font-size: 20px;
    font-weight: 700
}

.ill-page .ill-container .emotion-group .emotion-image {
    margin-top: 10px;
    display: block;
    height: 290px;
    background-position: top;
    background-repeat: no-repeat
}

.ill-page .ill-container .ill-range {
    margin-top: 45px
}

.ill-page .ill-container .ill-range:first-of-type {
    margin-top: 20px
}

.ill-page .ill-container .ill-range .ill-grid-title {
    font-size: 20px;
    font-weight: 700
}

.ill-page .ill-container .ill-range .ill-grid {
    margin-top: -20px;
    margin-left: -22px;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap
}

.ill-page .ill-container .ill-range .ill-grid .ill-box {
    position: relative;
    overflow: hidden;
    width: 276px;
    height: 290px;
    margin-top: 40px;
    margin-left: 22px;
    box-shadow: 0 3px 12px 0 hsla(0,0%,60%,.1)
}

@media (max-width: 1399px) {
    .ill-page .ill-container .ill-range .ill-grid .ill-box {
        width:314px
    }
}

.ill-page .ill-container .ill-range .ill-grid .ill-box.cover-special {
    height: 505px
}

.ill-page .ill-container .ill-range .ill-grid .ill-box .ill-cover {
    cursor: pointer;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    height: 200px;
    overflow: hidden
}

.ill-page .ill-container .ill-range .ill-grid .ill-box .ill-cover.cover-special {
    height: 414px
}

.ill-page .ill-container .ill-range .ill-grid .ill-box .ill-cover.mask {
    background-color: #999
}

.ill-page .ill-container .ill-range .ill-grid .ill-box .ill-cover img {
    width: 100%
}

.ill-page .ill-container .ill-range .ill-grid .ill-box .ill-detail {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 90px;
    padding: 20px
}

.ill-page .ill-container .ill-range .ill-grid .ill-box .ill-detail.mask {
    background-color: #ccc
}

.ill-page .ill-container .ill-range .ill-grid .ill-box .ill-detail .ill-title {
    font-size: 17px;
    font-weight: 700;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.ill-page .ill-container .ill-range .ill-grid .ill-box .ill-detail .ill-painter {
    margin-top: 10px;
    color: #999;
    font-size: 14px;
    width: 80%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.ill-page .ill-container .ill-range .ill-grid .ill-box .ill-detail .ill-download {
    display: block;
    position: absolute;
    width: 30px;
    height: 30px;
    right: 20px;
    bottom: 15px;
    background-image: url(/static/img/icon_download.03232a1.png);
    transition: all .3s
}

.ill-page .ill-container .ill-range .ill-grid .ill-box .ill-detail .ill-download:hover {
    opacity: .8
}

.ill-page .ill-container .ill-empty,.ill-page .ill-container .ill-more {
    color: #999;
    font-size: 16px;
    text-align: center;
    padding-left: 25px;
    cursor: pointer;
    width: 100px;
    margin: 0 auto;
    margin-top: 60px;
    background-image: url(/static/img/icon_more_down.3e961a4.png);
    background-repeat: no-repeat;
    background-position: 5px
}

.ill-page .ill-date-menu {
    position: absolute;
    width: 40px;
    left: 50%;
    top: 110px;
    transform: translateX(-50%);
    margin-left: 625px
}

.ill-page .ill-date-menu.date-menu-fixed {
    position: fixed;
    top: 125px
}

@media (max-width: 1399px) {
    .ill-page .ill-date-menu {
        margin-left:535px
    }
}

.ill-page .ill-date-menu ul.menu-month {
    padding: 0;
    margin: 0;
    list-style: none
}

.ill-page .ill-date-menu ul.menu-month li {
    float: left
}

.ill-page .ill-date-menu ul.menu-month li:only-child a {
    padding: 0
}

.ill-page .ill-date-menu ul.menu-month li a {
    margin-bottom: 5px;
    font-size: 12px;
    text-decoration: none;
    width: 40px;
    height: 20px;
    line-height: 20px;
    display: block;
    color: #999;
    text-align: center
}

.ill-page .ill-date-menu ul.menu-month li a.list-year {
    font-weight: 700
}

.ill-page .ill-date-menu ul.menu-month li a.active {
    background-color: #51caac;
    border-radius: 10px;
    color: #fff
}

.ill-mask-box {
    z-index: 999;
    background-color: rgba(0,0,0,.6);
    justify-content: center;
    align-items: center;
    user-select: none
}

.ill-mask-box,.ill-modal {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    display: flex
}

.ill-modal {
    z-index: 9999;
    justify-content: space-between;
    overflow-y: auto
}

.ill-modal.switch {
    position: relative;
    display: block;
    padding-bottom: 40px
}

.ill-modal .ill-cover-next,.ill-modal .ill-cover-prev {
    width: 80px;
    height: 80px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer
}

.ill-modal .ill-cover-next span,.ill-modal .ill-cover-prev span {
    display: block
}

.ill-modal .ill-cover-prev {
    margin-left: -420px
}

.ill-modal .ill-cover-next,.ill-modal .ill-cover-prev {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%)
}

.ill-modal .ill-cover-next {
    margin-left: 420px
}

.ill-modal .ill-cover-box {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 760px
}

.ill-modal .ill-cover-box.switch {
    position: relative;
    margin: 0 auto;
    margin-top: 110px;
    top: unset;
    left: unset;
    transform: unset
}

.ill-modal .ill-cover-box a.bigger-cover {
    display: block
}

.ill-modal .ill-cover-box a.bigger-cover .no-cursor {
    pointer-events: none
}

.ill-modal .ill-cover-box a.bigger-cover img {
    width: 100%
}

.ill-modal .ill-cover-box .ill-cover-detail {
    height: 215px;
    padding: 30px 30px 30px 40px;
    background-color: #fff;
    display: flex;
    justify-content: space-between
}

.ill-modal .ill-cover-box .ill-cover-detail .ill-cover-block {
    position: relative;
    width: 50%
}

.ill-modal .ill-cover-box .ill-cover-detail .ill-cover-block .book-sub-name {
    font-size: 26px;
    font-weight: 700;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.ill-modal .ill-cover-box .ill-cover-detail .ill-cover-block .ill-sub-title {
    color: #aaa;
    text-decoration: none;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-top: 5px;
    font-size: 16px
}

.ill-modal .ill-cover-box .ill-cover-detail .ill-cover-block .ill-sub-title.extra {
    margin: 0
}

.ill-modal .ill-cover-box .ill-cover-detail .ill-cover-block .ill-sub-detail {
    margin-top: 5px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    color: #aaa;
    font-size: 14px
}

.ill-modal .ill-cover-box .ill-cover-detail .ill-cover-block .ill-sub-detail .ill-sub-line {
    margin: 0 20px
}

.ill-modal .ill-cover-box .ill-cover-detail .ill-cover-block .ill-sub-detail .ill-sub-author {
    max-width: 45%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.ill-modal .ill-cover-box .ill-cover-detail .ill-cover-block .btn-share {
    position: relative;
    z-index: 1;
    margin-top: 25px;
    width: 100px;
    height: 40px;
    line-height: 30px;
    font-size: 14px;
    font-weight: 700;
    color: #333;
    background: #fff;
    box-shadow: 0 3px 12px 0 hsla(0,0%,79%,.4);
    border-radius: 20px;
    text-align: left;
    padding-left: 25px
}

.ill-modal .ill-cover-box .ill-cover-detail .ill-cover-block .btn-share:after {
    position: absolute;
    top: 55%;
    right: 30%;
    transform: translateY(-55%);
    content: " ";
    width: 11px;
    height: 13px;
    background-image: url(/static/img/icon@share.44c4496.png)
}

.ill-modal .ill-cover-box .ill-cover-detail .ill-cover-block .btn-share:hover {
    box-shadow: 0 3px 12px 0 hsla(0,0%,79%,.8)
}

.ill-modal .ill-cover-box .ill-cover-detail .ill-cover-block .cover-relative-list {
    margin-top: 10px;
    width: 250px;
    height: 120px;
    display: flex;
    justify-content: flex-start
}

.ill-modal .ill-cover-box .ill-cover-detail .ill-cover-block .cover-relative-list .min-cover,.ill-modal .ill-cover-box .ill-cover-detail .ill-cover-block .cover-relative-list .min-cover-other {
    display: block;
    position: relative;
    cursor: pointer;
    width: 120px;
    height: 120px;
    overflow: hidden;
    margin-right: 15px
}

.ill-modal .ill-cover-box .ill-cover-detail .ill-cover-block .cover-relative-list .min-cover-other img,.ill-modal .ill-cover-box .ill-cover-detail .ill-cover-block .cover-relative-list .min-cover img {
    height: 100%;
    position: absolute;
    left: 50%;
    transform: translateX(-50%)
}

.ill-modal .ill-height-mode {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    width: 760px
}

.ill-modal .ill-height-mode.over-height {
    top: unset;
    transform: translateX(-50%)
}

.ill-modal .ill-height-mode.switch {
    position: relative;
    margin: 0 auto;
    margin-top: 110px;
    top: unset;
    left: unset;
    transform: unset;
    background-color: #fff
}

.ill-modal .ill-height-mode.switch:after {
    content: ".";
    display: block;
    height: 0;
    visibility: hidden;
    clear: both
}

.ill-modal .ill-height-mode .ill-cover-detail {
    position: absolute;
    width: 230px;
    height: 100%;
    background-color: #fff;
    padding: 50px 40px
}

.ill-modal .ill-height-mode .ill-cover-detail.switch {
    position: relative;
    float: left
}

.ill-modal .ill-height-mode .ill-cover-detail .cover-detail-box {
    position: absolute;
    top: 50px;
    width: 170px
}

.ill-modal .ill-height-mode .ill-cover-detail .cover-detail-box .ill-cover-block {
    position: relative
}

.ill-modal .ill-height-mode .ill-cover-detail .cover-detail-box .ill-cover-block:last-of-type {
    margin-top: 50px
}

.ill-modal .ill-height-mode .ill-cover-detail .cover-detail-box .ill-cover-block .book-sub-name {
    font-size: 26px;
    font-weight: 700;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.ill-modal .ill-height-mode .ill-cover-detail .cover-detail-box .ill-cover-block .ill-sub-title {
    color: #aaa;
    text-decoration: none;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    margin-top: 5px;
    font-size: 16px
}

.ill-modal .ill-height-mode .ill-cover-detail .cover-detail-box .ill-cover-block .ill-sub-title.extra {
    margin: 0
}

.ill-modal .ill-height-mode .ill-cover-detail .cover-detail-box .ill-cover-block .ill-sub-detail {
    margin-top: 5px;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    color: #aaa;
    font-size: 14px
}

.ill-modal .ill-height-mode .ill-cover-detail .cover-detail-box .ill-cover-block .ill-sub-detail .ill-sub-line {
    margin: 0 20px
}

.ill-modal .ill-height-mode .ill-cover-detail .cover-detail-box .ill-cover-block .ill-sub-detail .ill-sub-author {
    max-width: 45%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.ill-modal .ill-height-mode .ill-cover-detail .cover-detail-box .ill-cover-block .btn-share {
    position: relative;
    z-index: 2;
    margin-top: 25px;
    width: 100px;
    height: 40px;
    line-height: 30px;
    font-size: 14px;
    font-weight: 700;
    color: #333;
    background: #fff;
    box-shadow: 0 3px 12px 0 hsla(0,0%,79%,.4);
    border-radius: 20px;
    text-align: left;
    padding-left: 25px
}

.ill-modal .ill-height-mode .ill-cover-detail .cover-detail-box .ill-cover-block .btn-share:after {
    position: absolute;
    top: 60%;
    right: 30%;
    transform: translateY(-60%);
    content: " ";
    width: 11px;
    height: 13px;
    background-image: url(/static/img/icon@share.44c4496.png)
}

.ill-modal .ill-height-mode .ill-cover-detail .cover-detail-box .ill-cover-block .btn-share:hover {
    box-shadow: 0 3px 12px 0 hsla(0,0%,79%,.8)
}

.ill-modal .ill-height-mode .ill-cover-detail .cover-detail-box .ill-cover-block .cover-relative-list {
    margin-top: 15px
}

.ill-modal .ill-height-mode .ill-cover-detail .cover-detail-box .ill-cover-block .cover-relative-list .min-cover,.ill-modal .ill-height-mode .ill-cover-detail .cover-detail-box .ill-cover-block .cover-relative-list .min-cover-other {
    display: block;
    margin-top: 15px;
    cursor: pointer;
    width: 120px;
    height: 120px;
    overflow: hidden;
    position: relative
}

.ill-modal .ill-height-mode .ill-cover-detail .cover-detail-box .ill-cover-block .cover-relative-list .min-cover-other img,.ill-modal .ill-height-mode .ill-cover-detail .cover-detail-box .ill-cover-block .cover-relative-list .min-cover img {
    height: 100%;
    position: absolute;
    left: 50%;
    transform: translateX(-50%)
}

.ill-modal .ill-height-mode a.bigger-cover {
    display: block;
    float: right;
    width: 530px
}

.ill-modal .ill-height-mode a.bigger-cover .no-cursor {
    pointer-events: none
}

.ill-modal .ill-height-mode a.bigger-cover img {
    width: 100%
}

.ill-modal .success-tip {
    position: fixed;
    z-index: 1;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-30%);
    width: 140px;
    height: 40px;
    border-radius: 5px;
    line-height: 40px;
    text-align: center;
    color: #fff;
    font-size: 16px;
    background-color: rgba(0,0,0,.6);
    opacity: 0;
    transition: all .3s
}

.ill-modal .success-tip.show {
    transform: translate(-50%,-50%);
    opacity: 1
}

.no-picture {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    font-weight: 700;
    font-size: 32px
}

.omake-book {
    position: relative;
    width: 760px;
    height: 195px;
    display: flex;
    margin: 0 auto;
    background-color: #fff;
    margin-top: 40px
}

.omake-book.loading {
    background-color: #999
}

.omake-book:first-of-type {
    margin-top: 0
}

.omake-book:last-of-type:after {
    display: none
}

.omake-book:after {
    content: " ";
    position: absolute;
    left: 0;
    bottom: -20px;
    width: 100%;
    height: 1px;
    background-color: #dbdbdb
}

.omake-book .book-draw {
    position: relative;
    z-index: 1;
    width: 100%;
    display: flex
}

.omake-book .book-draw .book-cover {
    min-width: 130px;
    width: 130px;
    height: 195px;
    box-shadow: 0 3px 12px 0 hsla(0,0%,60%,.44)
}

.omake-book .book-draw .book-cover img {
    width: 100%;
    height: 100%
}

.omake-book .book-draw .book-box {
    position: relative;
    z-index: 1;
    width: 760px;
    padding: 15px 0;
    margin-left: 40px;
    display: flex;
    justify-content: space-between
}

.omake-book .book-draw .book-box .book-info {
    padding-right: 45px
}

.omake-book .book-draw .book-box .book-info .book-name {
    display: block;
    text-decoration: none;
    font-size: 20px;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.omake-book .book-draw .book-box .book-info .book-tags {
    margin-top: 5px;
    margin-bottom: 15px;
    display: flex
}

.omake-book .book-draw .book-box .book-info .book-tags a.book-tag {
    cursor: pointer;
    position: relative;
    min-width: 60px;
    height: 24px;
    padding: 0 15px;
    line-height: 24px;
    font-size: 14px;
    border-radius: 12px;
    text-align: center;
    margin-right: 10px;
    background-color: #25c2a3;
    color: #fff;
    text-decoration: none;
    opacity: 1;
    transition: all .3s;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.omake-book .book-draw .book-box .book-info .book-tags a.book-tag:hover {
    opacity: .8
}

.omake-book .book-draw .book-box .book-info .book-tags a.book-tag.special {
    height: 24px;
    line-height: 24px;
    background-color: #00b7ee;
    color: #fff;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.omake-book .book-draw .book-box .book-info .book-tags a.book-tag.special:hover {
    background-color: #25c2a3
}

.omake-book .book-draw .book-box .book-info .book-tags a.book-tag::last-of-type {
    margin-right: 0
}

.omake-book .book-draw .book-box .book-info .book-intro {
    height: 72px;
    font-size: 14px;
    color: #333;
    line-height: 25px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3
}

.omake-book .book-draw .book-box .book-info .book-extra {
    margin-top: 10px;
    font-size: 12px;
    color: #999
}

.omake-book .rank-book-mask {
    position: absolute;
    z-index: -1;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: #fbfbfb;
    opacity: 0;
    box-shadow: 0 3px 12px 0 hsla(0,0%,60%,.44);
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 35px;
    transition: all .2s
}

.omake-book .rank-book-mask.show_hover {
    z-index: 2;
    opacity: .9
}

.omake-book .rank-book-mask .book-mask-left {
    width: 395px;
    color: #333
}

@media (max-width: 1399px) {
    .omake-book .rank-book-mask .book-mask-left {
        width:330px
    }
}

.omake-book .rank-book-mask .book-mask-left .vol-name {
    font-size: 15px;
    font-weight: 700;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.omake-book .rank-book-mask .book-mask-left .vol-intro {
    max-height: 100px;
    margin-top: 10px;
    font-size: 14px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 5
}

.omake-book .rank-book-mask .book-mask-line {
    min-width: 1px;
    height: 82px;
    background-color: #eee
}

.omake-book .rank-book-mask .book-mask-right {
    width: 350px;
    display: flex;
    align-items: center;
    justify-content: space-between
}

@media (max-width: 1399px) {
    .omake-book .rank-book-mask .book-mask-right {
        width:275px
    }
}

.omake-book .rank-book-mask .book-mask-right ul.vol-chapter {
    width: 160px;
    list-style: none;
    padding: 0;
    margin: 0
}

.omake-book .rank-book-mask .book-mask-right ul.vol-chapter li+li {
    margin-top: 10px
}

.omake-book .rank-book-mask .book-mask-right ul.vol-chapter li a {
    display: flex;
    align-items: center;
    color: #333;
    text-decoration: none;
    opacity: 1;
    transition: all .3s
}

.omake-book .rank-book-mask .book-mask-right ul.vol-chapter li a:hover {
    opacity: .8
}

.omake-book .rank-book-mask .book-mask-right ul.vol-chapter li a .new-vol {
    min-width: 27px;
    height: 15px;
    margin-right: 5px;
    background-image: url(/static/img/icon_new.0ebaa24.png)
}

.omake-book .rank-book-mask .book-mask-right ul.vol-chapter li a p {
    margin: 0;
    width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.omake-book .rank-book-mask .book-mask-right .book-buttons {
    position: relative;
    width: 100px;
    height: 100px
}

.omake-book .rank-book-mask .book-mask-right .book-buttons button {
    outline: none;
    width: 100px;
    height: 40px;
    background: #fff;
    box-shadow: 0 3px 12px 0 hsla(0,0%,79%,.44);
    border-radius: 20px;
    font-weight: 700;
    color: #333;
    background-repeat: no-repeat;
    background-position: 20px;
    transition: all .4s
}

.omake-book .rank-book-mask .book-mask-right .book-buttons button:hover {
    background-color: #51caac;
    box-shadow: 0 3px 12px 0 rgba(81,202,172,.44)
}

.omake-book .rank-book-mask .book-mask-right .book-buttons .btn-detail {
    padding-left: 20px;
    position: absolute;
    width: 100px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    color: #333;
    text-decoration: none;
    box-shadow: 0 3px 12px 0 hsla(0,0%,79%,.44);
    border-radius: 20px;
    background-color: #fff;
    background-image: url(/static/img/icon_enter.ce772f1.png);
    background-position: 25px;
    background-repeat: no-repeat
}

.omake-book .rank-book-mask .book-mask-right .book-buttons .btn-detail:hover {
    background-color: #51caac;
    box-shadow: 0 3px 12px 0 rgba(81,202,172,.44);
    color: #fff;
    background-image: url(/static/img/icon_enter_a.90c7fe9.png)
}

.omake-book .rank-book-mask .book-mask-right .book-buttons .btn-fav {
    position: absolute;
    bottom: 0;
    padding: 0;
    padding-left: 30px;
    background-image: url(/static/img/icon_collection.bfd2ae0.png)
}

.omake-book .rank-book-mask .book-mask-right .book-buttons .btn-fav:hover {
    background-color: #eee;
    box-shadow: 0 3px 12px 0 hsla(0,0%,79%,.44)
}

.omake-book .rank-book-mask .book-mask-right .book-buttons .btn-fav.show_faved {
    background-image: url(/static/img/icon_collection_a.26c591e.png)
}

.book-box-mask {
    position: absolute;
    z-index: -1;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    background-color: #fff;
    transition: all .2s;
    display: block;
    opacity: 0
}

.book-box-mask.show_hover {
    z-index: 1;
    opacity: 1
}

.article-detail-container {
    position: relative
}

.article-detail-container .wrapper {
    background: #fff;
    padding-bottom: 60px;
    padding-top: 0
}

.article-detail-container .content {
    width: 870px
}

.article-detail-container .content .discuss-full-mask {
    position: fixed;
    z-index: -1;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: rgba(0,0,0,.3);
    opacity: 0;
    transition: opacity .3s
}

.article-detail-container .content .discuss-full-mask.show {
    z-index: 999;
    opacity: 1
}

.article-detail-container .content .discuss-list {
    position: fixed;
    z-index: 9999;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 720px;
    height: 73%;
    margin-top: 30px;
    overflow-y: auto
}

.article-detail-container .content .discuss-list::-webkit-scrollbar {
    display: none
}

.article-detail-container .content .discuss-list .discuss-item {
    position: relative;
    width: 100%;
    margin-bottom: 20px;
    display: flex
}

.article-detail-container .content .discuss-list .discuss-item .discuss-avatar {
    position: absolute;
    left: 20px;
    bottom: 0;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    overflow: hidden
}

.article-detail-container .content .discuss-list .discuss-item .discuss-avatar img {
    width: 100%;
    height: 100%
}

.article-detail-container .content .discuss-list .discuss-item .discuss-info {
    position: relative;
    width: 630px;
    background-color: #fff;
    margin-left: 90px;
    border-radius: 4px;
    padding: 15px 20px
}

.article-detail-container .content .discuss-list .discuss-item .discuss-info:after {
    content: "";
    position: absolute;
    border: 7px solid;
    border-color: transparent #fff transparent transparent;
    right: 100%;
    bottom: 15px;
    height: 0;
    width: 0
}

.article-detail-container .content .discuss-list .discuss-item .discuss-info .discuss-user {
    display: block;
    color: #999;
    font-size: 16px;
    text-decoration: none
}

.article-detail-container .content .discuss-list .discuss-item .discuss-info .discuss-particular {
    margin-top: 10px;
    color: #333;
    font-size: 16px;
    line-height: 28px;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    overflow: hidden
}

.article-detail-container .content .discuss-list .discuss-item .discuss-info .discuss-particular .emoticon {
    width: 60px;
    height: 60px;
    vertical-align: text-bottom
}

.article-detail-container .content .discuss-list .discuss-item .discuss-info .discuss-controls {
    position: relative;
    margin-top: 20px;
    color: #ccc;
    font-size: 12px;
    display: flex;
    align-items: center
}

.article-detail-container .content .discuss-list .discuss-item .discuss-info .discuss-controls .discuss-scene {
    position: absolute;
    bottom: 0;
    right: 0;
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 90px
}

.article-detail-container .content .discuss-list .discuss-item .discuss-info .discuss-controls .discuss-scene .btn-like {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 35px
}

.article-detail-container .content .discuss-list .discuss-item .discuss-info .discuss-controls .discuss-scene .btn-like .icon-good {
    display: block;
    width: 21px;
    height: 21px;
    background-image: url(/static/img/z.587ef6d.png);
    background-repeat: no-repeat;
    background-position: 50%
}

.article-detail-container .content .discuss-list .discuss-item .discuss-info .discuss-controls .discuss-scene .btn-comm {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 35px
}

.article-detail-container .content .discuss-list .discuss-item .discuss-info .discuss-controls .discuss-scene .btn-comm .icon-discuss {
    display: block;
    width: 19px;
    height: 18px;
    background-image: url(/static/img/p.35da11b.png);
    background-repeat: no-repeat;
    background-position: 50%
}

.article-detail-container .content .discuss-list .discuss-item .discuss-info .discuss-controls .discuss-scene .discuss-message {
    font-size: 15px
}

.article-detail-container .content .discuss-list .discuss-item .discuss-info .discuss-controls .discuss-scene .discuss-message.show {
    color: #00a786
}

.article-detail-container .content .discuss-list .discuss-detail {
    display: block;
    width: 100%;
    height: 40px;
    border-radius: 4px;
    line-height: 40px;
    background-color: #fff;
    text-decoration: none;
    color: #999;
    font-size: 14px;
    text-align: center
}

.article-detail-container .content .discuss {
    opacity: 0;
    position: fixed;
    z-index: -1;
    bottom: -195px;
    left: 50%;
    transform: translateX(-50%);
    width: 720px;
    height: 0;
    background-color: #fff;
    box-shadow: 0 2px 15px 0 rgba(0,0,0,.1);
    box-sizing: border-box;
    transition: all .4s
}

.article-detail-container .content .discuss .discuss-close {
    cursor: pointer;
    position: absolute;
    z-index: 10;
    top: 10px;
    right: 20px;
    width: 24px;
    height: 24px;
    background-image: url(/static/img/comment_closed.b6bdad3.png)
}

.article-detail-container .content .discuss .discuss-content {
    padding: 45px 20px 0;
    display: flex;
    justify-content: space-between
}

.article-detail-container .content .discuss .discuss-content .discuss-avatar {
    width: 50px;
    height: 50px;
    border-radius: 50%
}

.article-detail-container .content .discuss .discuss-content .discuss-avatar img {
    display: block;
    width: 100%;
    border-radius: 50%
}

.article-detail-container .content .discuss .discuss-content .discuss-input {
    width: 610px;
    height: 90px;
    max-height: 225px;
    border-radius: 4px;
    background-color: #f3f3f3;
    border: 1px solid #e5e5e5;
    resize: none;
    font-size: 14px;
    padding: 6px 12px
}

.article-detail-container .content .discuss .btns {
    display: flex;
    justify-content: space-between;
    padding: 20px 20px 20px 90px
}

.article-detail-container .content .discuss .btns .btn-face {
    position: relative;
    cursor: pointer;
    width: 72px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    color: #999;
    font-size: 14px;
    border: 1px solid #e5e5e5;
    border-radius: 4px;
    padding: 0;
    padding-left: 20px;
    box-sizing: border-box;
    background: url(/static/img/comment_expression.0226366.png) no-repeat 11px
}

.article-detail-container .content .discuss .btns .btn-publish {
    display: flex;
    justify-content: space-between
}

.article-detail-container .content .discuss .btns .btn-publish span {
    cursor: pointer;
    display: block;
    width: 80px;
    height: 30px;
    line-height: 30px;
    padding: 0;
    text-align: center;
    background-color: #00a786;
    border-radius: 4px;
    color: #fff;
    font-size: 14px
}

.article-detail-container .content .discuss .btns .btn-publish .btn-review {
    visibility: hidden;
    transition: visibility .4s
}

.article-detail-container .content .discuss .btns .btn-publish .btn-review.hide {
    visibility: visible
}

.article-detail-container .content .discuss .btns .btn-publish .btn-comment {
    margin-left: 10px
}

.article-detail-container .content .discuss .comm-input-emoticons {
    border: 1px solid #e5e9ef;
    display: block;
    visibility: hidden;
    opacity: 0;
    transition: opacity .3s;
    position: absolute;
    left: 0;
    bottom: 40px;
    background: #fff;
    z-index: 200;
    width: 310px;
    height: 310px;
    overflow-y: scroll;
    padding: 5px;
    box-shadow: 0 3px 15px 0 rgba(0,0,0,.1)
}

.article-detail-container .content .discuss .comm-input-emoticons .comm-input-emoticons-item {
    width: 60px;
    height: 60px;
    margin: 5px;
    display: block;
    float: left
}

.article-detail-container .content .discuss .comm-input-emoticons .comm-input-emoticons-item>img {
    width: 100%;
    height: 100%
}

.article-detail-container .content .discuss .show {
    opacity: 1;
    visibility: visible
}

.article-detail-container .content .discuss .discuss-success {
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateY(-50%);
    width: 110px;
    height: 40px;
    line-height: 40px;
    background-size: 36px 41px;
    background: url(/static/img/comment_on_success.3d24d1d.png) no-repeat;
    padding-left: 46px;
    opacity: 0;
    visibility: hidden;
    transition: all .4s
}

.article-detail-container .content .discuss .discuss-success p {
    font-size: 16px
}

.article-detail-container .content .discuss .discuss-success_show {
    bottom: 40%;
    transform: translateY(-40%);
    opacity: 1;
    visibility: visible
}

.article-detail-container .content .discuss.discuss_show {
    height: 195px;
    bottom: 0;
    opacity: 1;
    z-index: 9999
}

.article-detail-container .content .check-all {
    color: #999;
    font-size: 16px;
    font-weight: 700
}

.article-detail-container .content .check-all:hover {
    color: #999;
    text-decoration: none
}

.article-detail-container .content .comm-form-msg,.article-detail-container .content .comm-msg,.article-detail-container .content .comm-progress {
    visibility: hidden;
    transition: opacity .3s;
    opacity: 0;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: hsla(0,0%,100%,.7);
    z-index: 9;
    text-align: center;
    font-size: 14px;
    padding: 80px 20px 20px
}

.article-detail-container .content .comm-form-msg.show,.article-detail-container .content .comm-msg.show,.article-detail-container .content .comm-progress.show {
    visibility: visible;
    opacity: 1
}

@media screen and (max-width: 1399px) {
    .article-detail-container .content {
        width:690px
    }
}

.article-detail-container .content .discuss {
    width: 870px;
    margin-left: -150px
}

.article-detail-container .content .discuss>.discuss-content .discuss-input {
    width: 100%;
    margin-left: 20px
}

@media screen and (max-width: 1399px) {
    .article-detail-container .content .discuss {
        width:690px
    }
}

.article-detail-container .fixed-recommend {
    position: fixed;
    top: 110px;
    left: 50%;
    transform: translate(-50%);
    margin-left: 465px;
    width: 240px;
    transition: transform .3s
}

@media screen and (max-width: 1399px) {
    .article-detail-container .fixed-recommend {
        margin-left:375px
    }
}

.article-detail-container .fixed-recommend .user-top {
    position: relative;
    width: 100%;
    height: 76px;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
    transition: all .3s
}

.article-detail-container .fixed-recommend .user-top:hover {
    opacity: .8;
    text-decoration: none
}

.article-detail-container .fixed-recommend .user-top .user-avatar {
    min-width: 76px;
    height: 76px;
    border-radius: 50%;
    background-image: url(/static/img/avatar.1880c9e.jpg);
    background-repeat: no-repeat;
    background-size: cover
}

.article-detail-container .fixed-recommend .user-top .user-avatar.notice {
    background-image: url(/static/img/notice_avatar.e39abbd.jpg)
}

.article-detail-container .fixed-recommend .user-top .user-avatar.blog {
    background-image: url(/static/img/blog_avatar.9060a5d.jpg)
}

.article-detail-container .fixed-recommend .user-top .user-info {
    width: 145px
}

.article-detail-container .fixed-recommend .user-top .user-info .user-name {
    color: #333;
    font-size: 16px;
    line-height: 28px;
    font-weight: 700
}

.article-detail-container .fixed-recommend .user-top .user-info .user-talk {
    font-size: 13px;
    line-height: 22px;
    color: #999;
    overflow: hidden
}

.article-detail-container .fixed-recommend .recommend-list {
    position: relative
}

.article-detail-container .fixed-recommend .recommend-list .recommend-title {
    position: relative;
    font-size: 16px;
    font-weight: 700;
    color: #1da081;
    padding-left: 10px
}

.article-detail-container .fixed-recommend .recommend-list .recommend-title:before {
    content: " ";
    position: absolute;
    left: 0;
    width: 5px;
    height: 100%;
    border-radius: 3px;
    background-color: #1da081
}

.article-detail-container .fixed-recommend .recommend-list .recommend-title .subtitle {
    margin-left: 5px;
    font-size: 12px;
    font-weight: 400;
    color: #999
}

.article-detail-container .fixed-recommend .recommend-list a.recommend-item {
    margin-top: 20px;
    min-width: 240px;
    display: block;
    color: #333;
    text-decoration: none
}

.article-detail-container .fixed-recommend .recommend-list a.recommend-item .recommend-cover {
    height: 120px;
    background-repeat: no-repeat;
    background-size: cover
}

.article-detail-container .fixed-recommend .recommend-list a.recommend-item .recommend-text {
    margin-top: 10px;
    font-size: 12px;
    line-height: 20px;
    overflow: hidden
}

.article-detail-container .fixed-recommend .fixed-func {
    position: absolute;
    top: 95px;
    right: -70px
}

.article-detail-container .fixed-recommend .fixed-func .func-item {
    position: relative;
    z-index: 1;
    cursor: pointer;
    margin-bottom: 20px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background-position: 50%;
    background-repeat: no-repeat;
    background-color: #fff;
    box-shadow: 0 3px 12px 0 hsla(0,0%,79%,.44);
    transition: all .3s
}

.article-detail-container .fixed-recommend .fixed-func .func-item.collection {
    background-image: url(/static/img/collection.91c555f.png)
}

.article-detail-container .fixed-recommend .fixed-func .func-item.collection:hover {
    background-image: url(/static/img/collection_hover.413aaf6.png)
}

.article-detail-container .fixed-recommend .fixed-func .func-item.collection.active {
    background-image: url(/static/img/collection_active.0483f82.png)
}

.article-detail-container .fixed-recommend .fixed-func .func-item.li-discuss {
    background-image: url(/static/img/discuss.8ac34d8.png)
}

.article-detail-container .fixed-recommend .fixed-func .func-item.li-discuss.active,.article-detail-container .fixed-recommend .fixed-func .func-item.li-discuss:hover {
    background-image: url(/static/img/discuss_hover.882812c.png)
}

.article-detail-container .fixed-recommend .fixed-func .func-item.li-discuss.remove {
    z-index: -1;
    transform: translateY(-60px);
    opacity: 0
}

.article-detail-container .fixed-recommend .fixed-func .func-item.scroll-top {
    background-image: url(/static/img/top.f931289.png)
}

.article-detail-container .fixed-recommend .fixed-func .func-item.scroll-top.remove {
    transform: translateY(-60px)
}

.article-detail-container #article-content {
    padding: 25px 20px 30px;
    line-height: 1.8;
    font-family: Helvetica Neue,Helvetica,Arial,sans-serif;
    font-size: 16px
}

@media (max-width: 767px) {
    .article-detail-container #article-content {
        padding:25px 0 30px
    }
}

.article-detail-container #article-content p {
    min-height: 16px;
    text-indent: 0;
    position: relative
}

.article-detail-container #article-content img {
    max-width: 100%;
    height: auto!important
}

.article-detail-container .non-select {
    user-select: none;
    pointer-events: none;
    -webkit-user-select: none
}

.article-detail-container .title {
    font-size: 26px;
    font-weight: 700;
    padding-bottom: 15px;
    margin-top: 26px;
    margin-bottom: 15px
}

.article-detail-container .wrap-flex {
    display: flex;
    justify-content: space-between
}

.container {
    position: relative;
    padding: 0
}

.auth-login,.auth-register {
    max-width: 510px;
    margin: 0 auto
}

.wrapper-beta {
    position: relative;
    margin-top: 55px;
    height: 270px;
    background: url(/static/img/banner_xin3rd.6fce4af.jpg) top no-repeat;
    background-color: #fff
}

.wrapper-beta .menu {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    bottom: 70px
}

.wrapper-beta .content {
    background: #fff
}

.wrapper {
    padding-top: 200px;
    background: url(/static/img/head-banner.ab5683f.jpg) top no-repeat
}

.wrapper .content {
    background: #fff
}

.no-wrapper {
    padding-top: 55px
}

.r-side .nav li.active .icon-nav_title {
    background-image: url(/static/img/icon-title_hover.5fa0cba.png)
}

.r-side .nav li.active .icon-nav_level {
    background-image: url(/static/img/icon-privacy_hover.bfa39fc.png)
}

.icon-nav_title {
    width: 12px;
    height: 16px;
    background: none;
    background-image: url(/static/img/icon-title.f6067dd.png);
    background-position: 100%;
    background-repeat: no-repeat
}

.icon-nav_level {
    width: 12px;
    height: 16px;
    background: none;
    background-image: url(/static/img/icon-privacy.11f2169.png);
    background-position: 100%;
    background-repeat: no-repeat
}

.box-search {
    background-color: #fff;
    padding: 20px 30px;
    border-bottom: 1px solid #eee
}

.box-search.special {
    position: relative;
    z-index: 2;
    margin-top: -50px
}

.box-search .search-condition {
    width: 100%;
    display: flex;
    margin-bottom: 18px
}

.box-search .search-condition .condition-type {
    margin-left: 15px;
    text-align: center;
    font-size: 14px;
    min-width: 45px;
    height: 24px;
    line-height: 24px;
    color: #999
}

.box-search .search-condition ul {
    list-style: none;
    margin: 0;
    padding: 0;
    margin-left: 15px
}

.box-search .search-condition ul li {
    float: left;
    margin-right: 15px;
    text-align: center;
    font-size: 14px;
    height: 24px
}

.box-search .search-condition ul li.special {
    margin-bottom: 10px
}

.box-search .search-condition ul li:first-of-type {
    color: #999
}

.box-search .search-condition ul li a {
    display: block;
    padding: 0 10px;
    height: 24px;
    line-height: 24px;
    color: #333;
    border-radius: 10px;
    text-decoration: none
}

.box-search .search-condition ul li a.choose,.box-search .search-condition ul li a:hover {
    background-color: #4dcfb4;
    font-weight: 700;
    color: #fff
}

ul.order-list {
    width: 40px;
    height: 102px;
    background: #fff;
    box-shadow: 0 3px 12px 0 hsla(0,0%,79%,.44);
    border-radius: 20px;
    padding: 19px 11px;
    margin: 20px 0;
    list-style: none
}

ul.order-list li.order-line {
    width: 14px;
    height: 1px;
    background-color: #eee;
    margin: 15px auto
}

ul.order-list li a {
    display: block;
    width: 18px;
    height: 18px
}

ul.order-list li a.order-first {
    transition: all .4s;
    background-image: url(/static/img/button_menu.4532ce4.png)
}

ul.order-list li a.order-first.show_choose,ul.order-list li a.order-first:hover {
    background-image: url(/static/img/button_menu_a.7fd97a8.png)
}

ul.order-list li a.order-second {
    transition: all .4s;
    background-image: url(/static/img/button_card.6d32765.png)
}

ul.order-list li a.order-second.show_choose,ul.order-list li a.order-second:hover {
    background-image: url(/static/img/button_card_a.c735e4a.png)
}

.rank-content {
    float: right;
    width: 1010px;
    min-height: 1200px;
    height: 100%;
    background-color: #f6f6f6;
    box-shadow: inset 0 3px 12px 0 rgba(4,0,0,.05);
    padding: 30px 40px
}

@media (max-width: 1399px) {
    .rank-content {
        width:830px
    }
}

.rank-content .rank-title {
    width: 66px;
    height: 18px
}

.rank-content .rank-title.recommend {
    background-image: url(/static/img/img_title1.2071a85.png)
}

.rank-content .rank-title.good {
    margin-top: 30px;
    background-image: url(/static/img/img_title2.9d824b4.png)
}

.rank-content .rank-title.ticket {
    margin-top: 30px;
    background-image: url(/static/img/img_title3.18d5190.png)
}

.rank-content .rank-title.coin {
    margin-top: 30px;
    background-image: url(/static/img/img_title4.2ce15ee.png)
}

.rank-content .rank-title.ink {
    margin-top: 30px;
    background-image: url(/static/img/img_title5.42441b7.png)
}

.rank-content .rank-title.support {
    margin-top: 30px;
    background-image: url(/static/img/img_title6.ce12695.png)
}

.rank-content .ranking-list {
    padding-top: 15px;
    padding-bottom: 10px;
    margin-bottom: 15px;
    display: flex;
    justify-content: space-between;
    border-bottom: 1px solid #e0e0e0
}

.rank-content .ranking-list:last-of-type {
    border-bottom: none;
    margin-bottom: 0
}

.rank-content .ranking-list ul {
    list-style: none;
    padding: 0;
    margin: 0
}

.rank-content .ranking-list ul li {
    margin-bottom: 20px
}

.rank-content .ranking-list ul li:first-of-type a .book-detail .book-name {
    font-size: 13px;
    color: #666
}

.rank-content .ranking-list ul li a {
    position: relative;
    width: 230px;
    min-height: 30px;
    font-size: 12px;
    text-decoration: none;
    display: flex;
    transition: all .4s
}

.rank-content .ranking-list ul li a:hover {
    opacity: .7
}

.rank-content .ranking-list ul li .book-mask {
    margin-bottom: 20px
}

.rank-content .ranking-list ul li .book-mask .rank-header {
    height: 24px;
    background-color: #999
}

.rank-content .ranking-list ul li .book-mask .book-name {
    height: 30px;
    background-color: #999
}

.rank-content .ranking-list ul li .book-mask .book-cover {
    background-color: #999;
    border-color: #ccc!important
}

.rank-content .ranking-list ul li .book-list-mask {
    display: flex;
    justify-content: space-between;
    height: 30px
}

.rank-content .ranking-list ul li .book-list-mask .rank-num {
    height: 30px;
    border-radius: 0;
    background-color: #999
}

.rank-content .ranking-list ul li .book-list-mask .book-name {
    background-color: #999
}

.rank-content .ranking-list ul li .book-detail {
    position: relative;
    width: 195px;
    height: 75px
}

.rank-content .ranking-list ul li .book-detail .rank-header {
    width: 120px;
    position: relative;
    display: flex;
    align-items: center
}

.rank-content .ranking-list ul li .book-detail .rank-header .rank-name {
    margin-left: 10px;
    font-weight: 700;
    color: #72b4ff;
    font-style: italic
}

.rank-content .ranking-list ul li .book-detail .book-name {
    margin: 0;
    margin-top: 10px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    width: 120px
}

.rank-content .ranking-list ul li .book-detail .book-cover {
    position: absolute;
    top: 0;
    right: 0;
    width: 50px;
    height: 75px;
    border-right: 3px solid #72b4ff
}

.rank-content .ranking-list ul li .book-detail .book-cover img {
    width: 100%;
    height: 100%
}

.rank-content .ranking-list ul li .rank-num {
    width: 22px;
    height: 16px;
    line-height: 16px;
    border-radius: 8px;
    background-color: #999;
    text-align: center;
    font-weight: 700;
    color: #fff
}

.rank-content .ranking-list ul li .rank-num.num-first {
    width: 30px;
    height: 24px;
    line-height: 24px;
    background: none;
    background-image: url(/static/img/mod6_list1@1.f7c6db5.png)
}

.rank-content .ranking-list ul li .rank-num.num-second {
    background-color: #8ccbff
}

.rank-content .ranking-list ul li .rank-num.num-third {
    background-color: #83e6fc
}

.rank-content .ranking-list ul li .book-name {
    margin-left: 15px;
    line-height: 15px;
    color: #999;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    width: 190px
}

.rank-content .rank-book-list {
    position: relative;
    margin-top: 10px;
    padding-bottom: 40px
}

.rank-content .rank-book-list.stage {
    display: grid;
    grid-template-columns: repeat(2,1fr);
    grid-column-gap: 40px;
    grid-row-gap: 30px
}

@media (max-width: 1399px) {
    .rank-content .rank-book-list.stage {
        grid-column-gap:30px
    }
}

.rank-content .rank-book-list .rank-book {
    position: relative;
    max-width: 930px;
    height: 195px;
    display: flex;
    margin-top: 40px
}

.rank-content .rank-book-list .rank-book:first-of-type {
    margin-top: 0
}

.rank-content .rank-book-list .rank-book:last-of-type:after {
    display: none
}

.rank-content .rank-book-list .rank-book:after {
    content: " ";
    position: absolute;
    left: 0;
    bottom: -20px;
    width: 100%;
    height: 1px;
    background-color: #dbdbdb
}

.rank-content .rank-book-list .rank-book .book-draw {
    position: relative;
    z-index: 1;
    width: 100%;
    display: flex
}

.rank-content .rank-book-list .rank-book .book-draw .book-cover {
    min-width: 130px;
    width: 130px;
    height: 195px;
    box-shadow: 0 3px 12px 0 hsla(0,0%,60%,.44)
}

.rank-content .rank-book-list .rank-book .book-draw .book-cover img {
    width: 100%;
    height: 100%
}

.rank-content .rank-book-list .rank-book .book-draw .book-box {
    position: relative;
    z-index: 1;
    width: 760px;
    padding: 15px 0;
    margin-left: 40px;
    display: flex;
    justify-content: space-between
}

.rank-content .rank-book-list .rank-book .book-draw .book-box .book-info {
    width: 460px
}

@media (max-width: 1399px) {
    .rank-content .rank-book-list .rank-book .book-draw .book-box .book-info {
        width:350px
    }
}

.rank-content .rank-book-list .rank-book .book-draw .book-box .book-info .book-name {
    font-size: 20px;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.rank-content .rank-book-list .rank-book .book-draw .book-box .book-info .book-tags {
    margin-top: 5px;
    margin-bottom: 15px;
    display: flex
}

.rank-content .rank-book-list .rank-book .book-draw .book-box .book-info .book-tags a.book-tag {
    cursor: pointer;
    position: relative;
    min-width: 60px;
    height: 24px;
    padding: 0 15px;
    line-height: 24px;
    font-size: 14px;
    border-radius: 12px;
    text-align: center;
    background-color: #fff;
    margin-right: 10px;
    color: #333;
    text-decoration: none;
    opacity: 1;
    transition: all .3s;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.rank-content .rank-book-list .rank-book .book-draw .book-box .book-info .book-tags a.book-tag:hover {
    background-color: #25c2a3;
    color: #fff;
    opacity: .8
}

.rank-content .rank-book-list .rank-book .book-draw .book-box .book-info .book-tags a.book-tag.special {
    height: 24px;
    line-height: 24px;
    background-color: #00b7ee;
    color: #fff;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.rank-content .rank-book-list .rank-book .book-draw .book-box .book-info .book-tags a.book-tag.special:hover {
    background-color: #25c2a3
}

.rank-content .rank-book-list .rank-book .book-draw .book-box .book-info .book-tags a.book-tag::last-of-type {
    margin-right: 0
}

.rank-content .rank-book-list .rank-book .book-draw .book-box .book-info .book-intro {
    height: 72px;
    font-size: 14px;
    color: #333;
    line-height: 25px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 3
}

.rank-content .rank-book-list .rank-book .book-draw .book-box .book-info .book-extra {
    margin-top: 10px;
    font-size: 12px;
    color: #999
}

.rank-content .rank-book-list .rank-book .book-draw .book-box .book-fun {
    position: relative;
    width: 225px
}

.rank-content .rank-book-list .rank-book .book-draw .book-box .book-fun .book-num {
    position: absolute;
    top: -15px;
    right: 0;
    width: 47px;
    height: 44px;
    background-image: url(/static/img/icon_topn.2137cfc.png);
    color: #fff;
    text-align: right;
    font-weight: 700;
    overflow: hidden
}

.rank-content .rank-book-list .rank-book .book-draw .book-box .book-fun .book-num.first {
    background-image: url(/static/img/icon_top1.4312e69.png)
}

.rank-content .rank-book-list .rank-book .book-draw .book-box .book-fun .book-num.second {
    background-image: url(/static/img/icon_top2.8e206a8.png)
}

.rank-content .rank-book-list .rank-book .book-draw .book-box .book-fun .book-num.third {
    background-image: url(/static/img/icon_top3.8ef1525.png)
}

.rank-content .rank-book-list .rank-book .book-draw .book-box .book-fun .book-num .num {
    font-size: 15px;
    text-align: left;
    position: absolute;
    right: 2px
}

.rank-content .rank-book-list .rank-book .book-draw .book-box .book-fun .book-buttons {
    width: 225px;
    position: absolute;
    right: 0;
    bottom: 0;
    display: flex;
    justify-content: space-between
}

@media (max-width: 1399px) {
    .rank-content .rank-book-list .rank-book .book-draw .book-box .book-fun .book-buttons {
        top:50%;
        left: 50%;
        right: unset;
        bottom: unset;
        display: block;
        transform: translate(-50%,-50%)
    }
}

.rank-content .rank-book-list .rank-book .book-draw .book-box .book-fun .book-buttons button {
    position: relative;
    outline: none;
    width: 100px;
    height: 40px;
    background: #fff;
    box-shadow: 0 3px 12px 0 hsla(0,0%,79%,.44);
    border-radius: 20px;
    font-weight: 700;
    color: #333;
    background-repeat: no-repeat;
    background-position: 20px;
    transition: all .4s
}

@media (max-width: 1399px) {
    .rank-content .rank-book-list .rank-book .book-draw .book-box .book-fun .book-buttons button {
        display:block;
        margin: 25px auto
    }
}

.rank-content .rank-book-list .rank-book .book-draw .book-box .book-fun .book-buttons button:hover {
    background-color: #51caac;
    box-shadow: 0 3px 12px 0 rgba(81,202,172,.44)
}

.rank-content .rank-book-list .rank-book .book-draw .book-box .book-fun .book-buttons .btn-detail {
    padding-left: 30px;
    width: 100px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    text-decoration: none;
    background: #fff;
    box-shadow: 0 3px 12px 0 hsla(0,0%,79%,.44);
    border-radius: 20px;
    font-weight: 700;
    color: #333;
    background-image: url(/static/img/icon_enter.ce772f1.png);
    background-position: 25px;
    background-repeat: no-repeat
}

@media (max-width: 1399px) {
    .rank-content .rank-book-list .rank-book .book-draw .book-box .book-fun .book-buttons .btn-detail {
        display:block;
        margin: 25px auto
    }
}

.rank-content .rank-book-list .rank-book .book-draw .book-box .book-fun .book-buttons .btn-detail:hover {
    background-color: #51caac;
    box-shadow: 0 3px 12px 0 rgba(81,202,172,.44);
    color: #fff;
    background-image: url(/static/img/icon_enter_a.90c7fe9.png)
}

.rank-content .rank-book-list .rank-book .book-draw .book-box .book-fun .book-buttons .btn-fav {
    padding: 0;
    padding-left: 30px;
    background-image: url(/static/img/icon_collection.bfd2ae0.png)
}

.rank-content .rank-book-list .rank-book .book-draw .book-box .book-fun .book-buttons .btn-fav:hover {
    background-color: #eee;
    box-shadow: 0 3px 12px 0 hsla(0,0%,79%,.44)
}

.rank-content .rank-book-list .rank-book .book-draw .book-box .book-fun .book-buttons .btn-fav.show_faved {
    background-image: url(/static/img/icon_collection_a.26c591e.png)
}

.rank-content .rank-book-list .rank-book .rank-book-mask {
    position: absolute;
    z-index: -1;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background-color: #fbfbfb;
    opacity: 0;
    box-shadow: 0 3px 12px 0 hsla(0,0%,60%,.44);
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 35px;
    transition: all .2s
}

.rank-content .rank-book-list .rank-book .rank-book-mask.show_hover {
    z-index: 2;
    opacity: .9
}

.rank-content .rank-book-list .rank-book .rank-book-mask .book-num {
    position: absolute;
    top: 0;
    right: 0;
    width: 47px;
    height: 44px;
    background-image: url(/static/img/icon_topn.2137cfc.png);
    color: #fff;
    text-align: right;
    font-weight: 700;
    overflow: hidden
}

.rank-content .rank-book-list .rank-book .rank-book-mask .book-num.first {
    background-image: url(/static/img/icon_top1.4312e69.png)
}

.rank-content .rank-book-list .rank-book .rank-book-mask .book-num.second {
    background-image: url(/static/img/icon_top2.8e206a8.png)
}

.rank-content .rank-book-list .rank-book .rank-book-mask .book-num.third {
    background-image: url(/static/img/icon_top3.8ef1525.png)
}

.rank-content .rank-book-list .rank-book .rank-book-mask .book-num .num {
    font-size: 15px;
    text-align: left;
    position: absolute;
    right: 2px
}

.rank-content .rank-book-list .rank-book .rank-book-mask .book-mask-left {
    width: 395px;
    color: #333
}

@media (max-width: 1399px) {
    .rank-content .rank-book-list .rank-book .rank-book-mask .book-mask-left {
        width:330px
    }
}

.rank-content .rank-book-list .rank-book .rank-book-mask .book-mask-left .vol-name {
    font-size: 15px;
    font-weight: 700;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.rank-content .rank-book-list .rank-book .rank-book-mask .book-mask-left .vol-intro {
    max-height: 100px;
    margin-top: 10px;
    font-size: 14px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 5
}

.rank-content .rank-book-list .rank-book .rank-book-mask .book-mask-line {
    min-width: 1px;
    height: 82px;
    background-color: #eee
}

.rank-content .rank-book-list .rank-book .rank-book-mask .book-mask-right {
    width: 350px;
    display: flex;
    align-items: center;
    justify-content: space-between
}

@media (max-width: 1399px) {
    .rank-content .rank-book-list .rank-book .rank-book-mask .book-mask-right {
        width:275px
    }
}

.rank-content .rank-book-list .rank-book .rank-book-mask .book-mask-right ul.vol-chapter {
    width: 160px;
    list-style: none;
    padding: 0;
    margin: 0
}

.rank-content .rank-book-list .rank-book .rank-book-mask .book-mask-right ul.vol-chapter li+li {
    margin-top: 10px
}

.rank-content .rank-book-list .rank-book .rank-book-mask .book-mask-right ul.vol-chapter li a {
    display: flex;
    align-items: center;
    color: #333;
    text-decoration: none;
    opacity: 1;
    transition: all .3s
}

.rank-content .rank-book-list .rank-book .rank-book-mask .book-mask-right ul.vol-chapter li a:hover {
    opacity: .8
}

.rank-content .rank-book-list .rank-book .rank-book-mask .book-mask-right ul.vol-chapter li a .new-vol {
    min-width: 27px;
    height: 15px;
    margin-right: 5px;
    background-image: url(/static/img/icon_new.0ebaa24.png)
}

.rank-content .rank-book-list .rank-book .rank-book-mask .book-mask-right ul.vol-chapter li a p {
    margin: 0;
    width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.rank-content .rank-book-list .rank-book .rank-book-mask .book-mask-right .book-buttons {
    position: relative;
    width: 100px;
    height: 100px
}

.rank-content .rank-book-list .rank-book .rank-book-mask .book-mask-right .book-buttons button {
    outline: none;
    width: 100px;
    height: 40px;
    background: #fff;
    box-shadow: 0 3px 12px 0 hsla(0,0%,79%,.44);
    border-radius: 20px;
    font-weight: 700;
    color: #333;
    background-repeat: no-repeat;
    background-position: 20px;
    transition: all .4s
}

.rank-content .rank-book-list .rank-book .rank-book-mask .book-mask-right .book-buttons button:hover {
    background-color: #51caac;
    box-shadow: 0 3px 12px 0 rgba(81,202,172,.44)
}

.rank-content .rank-book-list .rank-book .rank-book-mask .book-mask-right .book-buttons .btn-detail {
    padding-left: 20px;
    position: absolute;
    width: 100px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    color: #333;
    text-decoration: none;
    box-shadow: 0 3px 12px 0 hsla(0,0%,79%,.44);
    border-radius: 20px;
    background-color: #fff;
    background-image: url(/static/img/icon_enter.ce772f1.png);
    background-position: 25px;
    background-repeat: no-repeat
}

.rank-content .rank-book-list .rank-book .rank-book-mask .book-mask-right .book-buttons .btn-detail:hover {
    background-color: #51caac;
    box-shadow: 0 3px 12px 0 rgba(81,202,172,.44);
    color: #fff;
    background-image: url(/static/img/icon_enter_a.90c7fe9.png)
}

.rank-content .rank-book-list .rank-book .rank-book-mask .book-mask-right .book-buttons .btn-fav {
    position: absolute;
    bottom: 0;
    padding: 0;
    padding-left: 30px;
    background-image: url(/static/img/icon_collection.bfd2ae0.png)
}

.rank-content .rank-book-list .rank-book .rank-book-mask .book-mask-right .book-buttons .btn-fav:hover {
    background-color: #eee;
    box-shadow: 0 3px 12px 0 hsla(0,0%,79%,.44)
}

.rank-content .rank-book-list .rank-book .rank-book-mask .book-mask-right .book-buttons .btn-fav.show_faved {
    background-image: url(/static/img/icon_collection_a.26c591e.png)
}

.rank-content .rank-book-list .book-box-mask {
    position: absolute;
    z-index: -1;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    background-color: #fff;
    transition: all .2s;
    display: block;
    opacity: 0
}

.rank-content .rank-book-list .book-box-mask.show_hover {
    z-index: 1;
    opacity: 1
}

.rank-content .rank-book-list .rank-book-grid {
    cursor: pointer;
    position: relative;
    width: 445px;
    height: 195px;
    background-color: #fff;
    display: flex;
    justify-content: space-between;
    transition: all .3s
}

.rank-content .rank-book-list .rank-book-grid:hover {
    box-shadow: 0 3px 12px 0 hsla(0,0%,60%,.44)
}

.rank-content .rank-book-list .rank-book-grid:hover .book-mask {
    opacity: 1
}

.rank-content .rank-book-list .rank-book-grid:hover .book-num {
    z-index: 4
}

@media (max-width: 1399px) {
    .rank-content .rank-book-list .rank-book-grid {
        width:360px
    }
}

.rank-content .rank-book-list .rank-book-grid .book-cover {
    min-width: 130px;
    width: 130px;
    height: 195px
}

.rank-content .rank-book-list .rank-book-grid .book-cover img {
    display: block;
    width: 100%;
    height: 100%
}

.rank-content .rank-book-list .rank-book-grid .book-box {
    position: relative
}

.rank-content .rank-book-list .rank-book-grid .book-box .book-info {
    position: relative;
    width: 280px;
    padding: 20px 0
}

@media (max-width: 1399px) {
    .rank-content .rank-book-list .rank-book-grid .book-box .book-info {
        width:200px
    }
}

.rank-content .rank-book-list .rank-book-grid .book-box .book-info .book-name {
    width: 162px;
    height: 50px;
    font-size: 18px;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2
}

.rank-content .rank-book-list .rank-book-grid .book-box .book-info .book-tags {
    margin-top: 10px;
    margin-bottom: 15px;
    display: flex
}

.rank-content .rank-book-list .rank-book-grid .book-box .book-info .book-tags .book-tag {
    position: relative;
    min-width: 60px;
    height: 24px;
    padding: 0 15px;
    line-height: 24px;
    font-size: 14px;
    border-radius: 12px;
    text-align: center;
    margin-right: 10px;
    background-color: #eee
}

.rank-content .rank-book-list .rank-book-grid .book-box .book-info .book-tags .book-tag:hover {
    background-color: #25c2a3
}

@media (max-width: 1399px) {
    .rank-content .rank-book-list .rank-book-grid .book-box .book-info .book-tags .book-tag {
        min-width:60px;
        margin-right: 5px
    }
}

.rank-content .rank-book-list .rank-book-grid .book-box .book-info .book-tags .book-tag a {
    color: #333;
    text-decoration: none;
    opacity: 1;
    transition: all .3s;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.rank-content .rank-book-list .rank-book-grid .book-box .book-info .book-tags .book-tag.special {
    width: 230px;
    height: 24px;
    line-height: 24px;
    background-color: #00b7ee
}

.rank-content .rank-book-list .rank-book-grid .book-box .book-info .book-tags .book-tag.special a {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.rank-content .rank-book-list .rank-book-grid .book-box .book-info .book-tags .book-tag::last-of-type {
    margin-right: 0
}

.rank-content .rank-book-list .rank-book-grid .book-box .book-info .book-extra {
    font-size: 12px;
    color: #999;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.rank-content .rank-book-list .rank-book-grid .book-box .book-info .book-extra .data-text {
    margin-right: 5px;
    font-size: 16px;
    color: #333
}

.rank-content .rank-book-list .rank-book-grid .book-box .book-num {
    position: absolute;
    top: 0;
    right: 0;
    width: 47px;
    height: 44px;
    background-image: url(/static/img/icon_topn.2137cfc.png);
    color: #fff;
    text-align: right;
    font-weight: 700;
    overflow: hidden;
    transition: all .2s
}

.rank-content .rank-book-list .rank-book-grid .book-box .book-num.first {
    background-image: url(/static/img/icon_top1.4312e69.png)
}

.rank-content .rank-book-list .rank-book-grid .book-box .book-num.second {
    background-image: url(/static/img/icon_top2.8e206a8.png)
}

.rank-content .rank-book-list .rank-book-grid .book-box .book-num.third {
    background-image: url(/static/img/icon_top3.8ef1525.png)
}

.rank-content .rank-book-list .rank-book-grid .book-box .book-num .num-title {
    font-size: 10px;
    padding-right: 5px
}

.rank-content .rank-book-list .rank-book-grid .book-box .book-num .num {
    width: 20px;
    margin-top: 4px;
    font-size: 15px;
    text-align: left;
    position: absolute;
    right: 2px
}

.rank-content .rank-book-list .rank-book-grid .book-box .book-sign {
    margin-top: 0;
    margin-bottom: 12px;
    height: 24px
}

.rank-content .rank-book-list .rank-book-grid .book-box .book-sign.sign-style {
    border-radius: 2px;
    display: inline-block;
    text-align: center;
    height: 25px;
    padding: 0 8px;
    padding-left: 25px;
    line-height: 24px;
    font-size: 12px;
    color: #fff;
    font-weight: 700;
    background: #ff666b url(/static/img/vip.7712298.png) no-repeat 8px 4px;
    background-size: 17%;
    box-sizing: border-box
}

.rank-content .rank-book-list .rank-book-grid .book-mask {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 20px 0;
    opacity: 0;
    z-index: 3;
    background-color: #fff;
    transition: all .2s
}

.rank-content .rank-book-list .rank-book-grid .book-mask .book-name {
    width: 162px;
    height: 50px;
    font-size: 18px;
    font-weight: 400;
    color: #333;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2
}

.rank-content .rank-book-list .rank-book-grid .book-mask .book-extra {
    min-width: 200px;
    margin: 15px 0;
    font-size: 12px;
    color: #999;
    display: flex;
    align-items: center
}

.rank-content .rank-book-list .rank-book-grid .book-mask .book-extra.up-time {
    margin: 0;
    margin-top: 5px
}

.rank-content .rank-book-list .rank-book-grid .book-mask .book-extra .book-data {
    display: flex;
    justify-content: start;
    align-items: center
}

.rank-content .rank-book-list .rank-book-grid .book-mask .book-extra .book-data .data-text {
    margin-right: 5px;
    font-size: 16px;
    color: #333
}

.rank-content .rank-book-list .rank-book-grid .book-mask .book-extra .data-line {
    margin: 0 10px
}

.rank-content .rank-book-list .rank-book-grid .book-mask ul.vol-chapter {
    width: 160px;
    list-style: none;
    padding: 0;
    margin: 0;
    margin-top: 30px
}

.rank-content .rank-book-list .rank-book-grid .book-mask ul.vol-chapter li+li {
    margin-top: 10px
}

.rank-content .rank-book-list .rank-book-grid .book-mask ul.vol-chapter li a {
    display: flex;
    align-items: center;
    color: #333;
    text-decoration: none;
    opacity: 1;
    font-size: 14px
}

.rank-content .rank-book-list .rank-book-grid .book-mask ul.vol-chapter li a:hover {
    opacity: .8
}

.rank-content .rank-book-list .rank-book-grid .book-mask ul.vol-chapter li a .new-vol {
    min-width: 27px;
    height: 15px;
    margin-right: 5px;
    background-image: url(/static/img/icon_new.0ebaa24.png)
}

.rank-content .rank-book-list .rank-book-grid .book-mask ul.vol-chapter li a p {
    margin: 0;
    width: 140px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap
}

.stage .rank-loading+.rank-loading {
    margin-top: 0
}

.empty-content .cry-emoticon {
    margin: 0 auto;
    width: 220px;
    height: 216px;
    background-image: url(/static/img/15.64db59a.png)
}

.empty-content .empty-tip {
    margin-top: 30px;
    text-align: center;
    font-size: 18px;
    color: #999
}

.privacy-alert {
    position: absolute;
    z-index: 9;
    top: 30px;
    right: -35%;
    width: 235px;
    height: 130px;
    padding: 20px;
    text-align: left;
    background: #fff;
    border: 1px solid #eee;
    box-shadow: 0 3px 4px 0 rgba(51,51,51,.05);
    border-radius: 2px;
    display: none
}

.privacy-alert_title {
    color: #333;
    font-size: 14px
}

.privacy-alert_box {
    margin-top: 20px
}

.privacy-alert_text {
    font-size: 12px;
    color: #333
}

.privacy-alert_text.speical {
    color: #999
}