a,abbr,acronym,address,applet,article,aside,audio,big,blockquote,body,canvas,caption,center,cite,code,dd,del,details,dfn,div,dl,dt,em,embed,fieldset,figcaption,figure,footer,form,h1,h2,h3,h4,h5,h6,header,hgroup,html,i,iframe,img,ins,kbd,label,legend,li,mark,menu,nav,object,ol,output,p,pre,q,ruby,s,samp,section,small,span,strike,sub,summary,sup,table,tbody,td,tfoot,th,thead,time,tr,tt,u,ul,var,video {
    margin: 0;
    padding: 0;
    border: 0;
    font-size: 100%;
    vertical-align: baseline;
    font-weight: 400
}

table {
    -webkit-border-horizontal-spacing: 0
}

body {
    margin: 0;
    padding: 0;
    border: 0;
    vertical-align: baseline;
    font-family: noto sans,sans-serif,Helvetica,Arial;
    font-size: 16px;
    border-top: 2px solid #ff5c19;
    background-color: #e9eaed;
    background: url(../images/body-bg-light.png);
    background-attachment: fixed
}

.body-site {
    width: 100%;
    overflow: hidden;
    vertical-align: baseline
}

ol,ul {
    list-style: none
}

a {
    font-weight: 400;
    font-size: 16px;
    text-decoration: none
}

input:focus,select:focus {
    outline: 0
}

#top {
    width: 40px;
    height: 40px;
    position: fixed;
    bottom: 10px;
    right: 10px;
    text-indent: -99999px;
    cursor: pointer;
    background: url(../images/btt-black.png) no-repeat 0 0;
    display: none
}

.container {
    max-width: 1260px;
    overflow: hidden;
    margin: 0 auto
}

.container-header,.container-silder,.container-main {
    margin: 20px auto 0
}

.container-header .logo {
    float: left;
    background-color: #fff;
    height: 110px;
    margin-right: 15px
}

.container-header .logo img {
    float: none;
    margin: 0 auto;
    display: block
}

.container-header .container-header-top {
    box-sizing: border-box;
    float: left;
    width: calc(100% - 230px);
    padding: 0 10px 10px;
    background: #fff
}

.container-header-top .box-search {
    float: left;
    margin-top: 10px
}

.container-header-top .box-search .search-story {
    box-sizing: border-box;
    float: left;
    width: 400px;
    height: 35px;
    margin-right: 10px;
    padding-left: 35px;
    font-size: 16px;
    border: none;
    border-bottom: 3px solid #fd5e1e;
    background: url(../images/search.png) no-repeat
}

.container-header-top .box-user-options {
    float: left;
    margin-top: 10px;
    width: calc(100% - 410px);
    min-width: 325px
}

.container-header-top .box-user-options .user-name {
    float: left;
    background: #27ae60;
    width: 135px;
    font-size: 14px
}

.container-header-top .box-user-options .user-name img {
    float: left;
    width: 35px;
    height: 35px
}

.container-header-top .box-user-options .user-name p {
    line-height: 35px;
    float: left;
    color: #fff;
    -webkit-margin-before: 0;
    -webkit-margin-after: 0;
    -webkit-margin-start: 0;
    -webkit-margin-end: 0;
    margin: 0 5px;
    width: 90px;
    text-align: center
}

.container-header-top .box-user-options .user-notification {
    float: left;
    position: relative;
    background: url(../images/user.png) 0 0 no-repeat;
    height: 35px;
    width: 35px;
    margin-left: 10px
}

.container-header-top .box-user-options .user-notification .user-notifications-num {
    position: absolute;
    bottom: 0;
    right: -5px;
    min-width: 20px;
    height: 20px;
    padding: 2px;
    border-radius: 100%;
    text-shadow: 0 -1px 0 rgba(0,0,0,.4);
    text-align: center;
    background: #d80f16;
    color: #fff;
    font-weight: 700;
    font-size: 12px;
    line-height: 20px
}

.container-header-top .box-user-options .user-history {
    float: left;
    background: url(../images/user.png) 0 -40px no-repeat;
    height: 35px;
    width: 35px;
    margin-left: 10px
}

.container-header-top .box-user-options .user-logout {
    float: left;
    background: url(../images/user.png) 0 -78px no-repeat;
    height: 35px;
    width: 35px;
    margin-left: 10px
}

.container-header-top .box-user-options .user-login,.container-header-top .box-user-options .user-register {
    -moz-transition: .6s;
    -webkit-transition: .6s;
    -o-transition: .6s;
    text-decoration: none;
    font-size: 14px;
    line-height: 35px;
    height: 35px;
    line-height: 35px;
    float: left;
    background: #373737 url(../images/login-icon.png) 52px 8px no-repeat;
    color: #fff;
    padding: 0 40px 0 10px;
    width: 35px
}

.container-header-top .box-user-options .user-register {
    background-position-x: 70px;
    padding-right: 40px;
    width: 55px
}

.container-header-top .box-user-options .user-login:hover,.container-header-top .box-user-options .user-register:hover {
    -moz-transition: .6s;
    -webkit-transition: .6s;
    -o-transition: .6s;
    background-color: #27ae60;
    background-position-x: 70px
}

.container-header-top .box-user-options .user-register:hover {
    background-position-x: 90px
}

.container-header-top .box-user-options .user-login {
    margin-right: 10px
}

.mode-changer {
    float: right;
    height: 35px;
    width: 35px;
    background: url(../images/sun-moon.png) 0 -6px no-repeat
}

.container-header .header-menu {
    padding: 0;
    margin: 0;
    float: left;
    width: calc(100% - 230px);
    background: #ff530d
}

.container-header .header-menu a {
    float: left;
    height: 55px;
    color: #fff;
    font-size: 16px;
    line-height: 55px;
    padding: 0 20px
}

.container-header .header-mobile-menu {
    float: left;
    width: 100%;
    text-align: center;
    height: 42px;
    background: #2e2d2d;
    color: #f0f3f3;
    font-size: 18px;
    line-height: 42px;
    display: none;
    cursor: pointer
}

.container-silder {
    width: 100%;
    position: relative
}

.container-silder .silder-title {
    padding: 4px 15px 7px 30px;
    font-size: 16px;
    color: #fff;
    position: absolute;
    top: 0;
    left: 0;
    background: url(../images/update-icon.png) 7px center no-repeat #ff530d
}

.container-main-left {
    width: calc(100% - 390px);
    float: left;
    padding: 0;
    margin-right: 10px;
    overflow: hidden
}

.container-main-right {
    width: 380px;
    float: left;
    padding: 0;
    overflow: hidden
}

.panel-topview {
    border-top: 3px solid #903;
    float: left;
    width: 100%;
    position: relative;
    margin-bottom: 10px
}

.panel-topview .panel-topview-title {
    background: #903;
    padding: 5px 15px;
    float: left;
    font-size: 16px;
    color: #fff
}

.panel-topview-item {
    float: left;
    width: 100%;
    height: auto
}

.panel-topview-item:nth-of-type(1) {
    background: #c0392b url(../images/circle-arrow.png) 2% center no-repeat
}

.panel-topview-item:nth-of-type(2) {
    background: #e84c3d url(../images/circle-arrow.png) 2% center no-repeat
}

.panel-topview-item:nth-of-type(3) {
    background: #e67e22 url(../images/circle-arrow.png) 2% center no-repeat
}

.panel-topview-item:nth-of-type(4) {
    background: #f1c40f url(../images/circle-arrow.png) 2% center no-repeat
}

.panel-topview-item:nth-of-type(5) {
    background: #2ecc71 url(../images/circle-arrow.png) 2% center no-repeat
}

.panel-topview-item:nth-of-type(6) {
    background: #27ae60 url(../images/circle-arrow.png) 2% center no-repeat
}

.panel-topview-item:nth-of-type(7) {
    background: #1abc9c url(../images/circle-arrow.png) 2% center no-repeat
}

.panel-topview-item:nth-of-type(8) {
    background: #16a085 url(../images/circle-arrow.png) 2% center no-repeat
}

.panel-topview-item:nth-of-type(9) {
    background: #3498db url(../images/circle-arrow.png) 2% center no-repeat
}

.panel-topview-item:nth-of-type(10) {
    background: #2980b9 url(../images/circle-arrow.png) 2% center no-repeat
}

.panel-topview-item a:hover {
    margin-left: 45px;
    text-shadow: 0 0 5px #ff6
}

.panel-topview-item a {
    color: #fff;
    width: 90%;
    font-size: 15px;
    line-height: 30px;
    float: left;
    margin-left: 35px;
    transition: all .3s;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -o-transition: all .3s
}

.panel-category {
    border-top: 3px solid #3498db;
    width: 100%;
    float: left
}

.panel-category .pn-category-story-title {
    float: left;
    font-size: 16px;
    color: #fff;
    background: #3498db;
    padding: 5px 15px
}

.panel-category .pn-category-row-border {
    border-bottom: 1px solid #dedede
}

.panel-category .pn-category-row {
    float: left;
    width: calc(100% - 20px);
    padding: 0 10px;
    background-color: #fff
}

.panel-category .pn-category-row a.ctg-select {
    color: #3498db;
    font-weight: 700
}

.panel-category .pn-category-row a {
    float: left;
    width: 32%;
    margin-right: 2%;
    font-size: 15px;
    line-height: 32px;
    color: #383838
}

.panel-category .pn-category-row a:last-child {
    margin-right: 0
}

.panel-category .pn-category-row a::before {
    content: "\2022\0020"
}

.panel-category .pn-category-row a.ctg-select::before {
    content: '\2713\0020'
}

.panel-newest {
    border-top: 3px solid #31a95b;
    width: 100%;
    margin-bottom: 10px;
    float: right
}

.panel-newest .panel-newest-title {
    background: #31a95b;
    padding: 5px 16px;
    float: left;
    font-size: 15px;
    color: #fff;
    position: relative
}

.panel-newest .panel-newest-content {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    justify-content: space-between
}

.panel-newest .panel-newest-content a {
    display: inline-flex;
    float: left;
    margin: 4px
}

.panel-newest .panel-newest-content img {
    width: 64px;
    height: 98px
}

.panel-newest .panel-newest-more {
    float: left;
    width: 100%;
    padding: 2px 0;
    font-size: 15px;
    color: #fff;
    text-align: center;
    background-color: #31a95b
}

.container-footer {
    margin: 20px auto 0;
    border-top: 3px solid #3498db
}

.container-footer-content {
    float: left;
    font-size: 15px;
    background: #fff;
    width: calc(100% - 20px);
    padding: 10px
}

.container-footer-content .pn-hot-link {
    float: left;
    width: 73%;
    margin-right: 2%;
    color: #fff!important
}

.container-footer-content .pn-hot-link a {
    float: left;
    width: 30%;
    margin-right: 2%;
    font-size: 15px;
    line-height: 18px
}

.container-footer-content .pn-contacts {
    float: left;
    width: 25%
}

.container-footer-content .pn-contacts h4 {
    font-size: 20px;
    line-height: 20px;
    margin-bottom: 5px;
    color: #1992ea
}

.panel-content-homepage .content-homepage-title {
    font-size: 18px;
    line-height: 18px;
    color: #1992ea;
    text-transform: uppercase;
    border-bottom: 1px solid #dedede;
    padding: 0 0 8px 10px;
    margin: 10px 0
}

.panel-content-homepage {
    float: left;
    width: 100%;
    background-color: #fff
}

.panel-content-homepage .content-homepage-item {
    float: left;
    width: calc(50% - 20px);
    padding: 10px;
    height: 145px;
    overflow: hidden
}

.panel-content-homepage .content-homepage-item .item-img {
    float: left;
    margin-right: 10px;
    width: 105px;
    height: 145px;
    position: relative
}

.panel-content-homepage .content-homepage-item img {
    width: 101px;
    height: 141px;
    padding: 1px;
    border: 1px solid #d7d7d9
}

.panel-content-homepage .content-homepage-item .content-homepage-item-right {
    float: left;
    width: calc(100% - 115px)
}

.panel-content-homepage .content-homepage-item .item-rate,.panel-content-genres .genres-item-img .genres-item-rate,.panel-search-story .search-story-item .item-rate {
    position: absolute;
    right: 2px;
    bottom: 6px;
    background: rgba(0,0,0,.69);
    padding: 2px 5px 2px 8px;
    color: #d7d7da;
    font-size: 12px;
    font-style: italic
}

.panel-content-homepage .content-homepage-item .item-rate:after,.panel-content-genres .genres-item-img .genres-item-rate:after,.panel-search-story .search-story-item .item-rate:after {
    content: "\2B50";
    font-style: normal;
    margin: 0;
    padding: 0;
    color: #f9d932
}

.panel-content-homepage .content-homepage-item .item-new,.panel-content-homepage .content-homepage-item .item-hot,.panel-content-homepage .content-homepage-item .item-ss,.panel-story-info .story-info-left .item-new,.panel-story-info .story-info-left .item-hot,.panel-story-info .story-info-left .item-ss,.panel-content-genres .genres-item-img .genres-item-hot,.panel-content-genres .genres-item-img .genres-item-new,.panel-content-genres .genres-item-img .genres-item-ss,.panel-search-story .search-story-item .item-hot,.panel-search-story .search-story-item .item-new,.panel-search-story .search-story-item .item-ss {
    position: absolute;
    top: -5px;
    right: -5px;
    background: #c0392b;
    border-radius: 15px;
    padding: 2px 5px;
    color: #fff;
    line-height: 25px;
    font-size: 10px;
    font-weight: 700
}

.panel-content-homepage .content-homepage-item .item-new,.panel-story-info .story-info-left .item-new,.panel-content-genres .genres-item-img .genres-item-new,.panel-search-story .search-story-item .item-new {
    background: #5bbb66
}

.panel-content-homepage .content-homepage-item .item-new:before,.panel-story-info .story-info-left .item-new:before,.panel-content-genres .genres-item-img .genres-item-new:before,.panel-search-story .search-story-item .item-new:before {
    content: "NEW"
}

.panel-content-homepage .content-homepage-item .item-hot,.panel-story-info .story-info-left .item-hot,.panel-content-genres .genres-item-img .genres-item-hot,.panel-search-story .search-story-item .item-hot {
    background: #c0392b
}

.panel-content-homepage .content-homepage-item .item-hot:before,.panel-story-info .story-info-left .item-hot:before,.panel-content-genres .genres-item-img .genres-item-hot:before,.panel-search-story .search-story-item .item-hot:before {
    content: "HOT"
}

.panel-content-homepage .content-homepage-item .item-ss,.panel-story-info .story-info-left .item-ss,.panel-content-genres .genres-item-img .genres-item-ss,.panel-search-story .search-story-item .item-ss {
    background: #000
}

.panel-content-homepage .content-homepage-item .item-ss:before,.panel-story-info .story-info-left .item-ss:before,.panel-content-genres .genres-item-img .genres-item-ss:before,.panel-search-story .search-story-item .item-ss:before {
    content: "SS"
}

.panel-content-homepage .content-homepage-item .item-title,.panel-content-homepage .content-homepage-item .item-author,.panel-content-homepage .content-homepage-item .item-chapter {
    float: left;
    width: 100%
}

.panel-content-homepage .content-homepage-item .item-title a {
    color: #383838;
    height: 30px;
    line-height: 25px;
    font-size: 16px;
    font-weight: 700
}

.panel-content-homepage .content-homepage-item .item-author {
    height: 25px;
    color: #7b7b7b;
    line-height: 20px;
    font-size: 15px;
    font-style: italic
}

.panel-content-homepage .content-homepage-item .item-chapter a {
    height: 25px;
    color: #383838;
    max-width: calc(100% - 80px);
    line-height: 18px;
    font-size: 16px
}

.panel-content-homepage .content-homepage-item .item-chapter i {
    float: right;
    color: #999;
    margin-left: 5px;
    font-size: 12px;
    font-style: italic
}

.panel-content-homepage .content-homepage-item .item-chapter a:visited,.panel-story-chapter-list .chapter-name:visited,.panel-search-story .search-story-item .item-chapter:visited {
    color: #42cc15!important
}

.panel-content-homepage .content-homepage-more {
    float: left;
    width: 100%;
    padding: 7px 0;
    font-size: 15px;
    color: #fff;
    text-align: center;
    background-color: #1992ea
}

.panel-breadcrumb {
    float: left;
    width: calc(100% - 20px);
    min-height: 35px;
    padding: 0 10px;
    border-bottom: 1px solid #dedede;
    background-color: #059e9a;
    color: #fff;
    line-height: 35px;
    font-size: 14px;
    border-bottom: none;
    margin-bottom: 5px
}

.panel-breadcrumb a {
    color: #fff;
    font-size: 14px
}

.panel-story-info {
    float: left;
    width: calc(100% - 20px);
    padding: 10px;
    overflow: hidden
}

.panel-story-info .story-info-left {
    float: left;
    width: 225px;
    margin-right: 20px
}

.panel-story-info .story-info-left .info-image {
    display: block;
    position: relative;
    width: 225px;
    margin: 0 auto
}

.panel-story-info .story-info-left img {
    width: 225px;
    height: auto;
    display: block;
    margin: 0 auto 5px
}

.panel-story-info .style-btn {
    float: left;
    width: 100%;
    padding: 10px 0;
    margin: 5px 0;
    position: relative;
    text-align: center;
    font-size: 16px;
    border-radius: 3px;
    background: #31a95b;
    color: #fff;
    cursor: pointer
}

.panel-story-info .story-info-right {
    float: left;
    width: calc(100% - 245px)
}

.panel-story-info .story-info-right h1 {
    font-size: 25px;
    font-weight: 700
}

.panel-story-info .story-info-right a {
    color: #1992ea
}

.variations-tableInfo {
    border-collapse: separate;
    border-spacing: 0 5px
}

.variations-tableInfo .table-label {
    width: 120px;
    line-height: 22px
}

.variations-tableInfo .table-label i,.story-info-right-extent i {
    float: left;
    margin-right: 5px;
    width: 22px;
    height: 22px;
    display: block;
    background-image: url(../images/flash-story.png);
    background-position-x: -196px;
    background-position-y: 0;
    background-repeat: no-repeat
}

.variations-tableInfo .table-label i.info-alternative {
    background-position-x: -168px
}

.variations-tableInfo .table-label i.info-author {
    background-position-x: 0
}

.variations-tableInfo .table-label i.info-genres {
    background-position-x: -112px
}

.variations-tableInfo .table-label i.info-status {
    background-position-x: -28px
}

.story-info-right-extent p {
    line-height: 22px;
    margin-bottom: 8px
}

.story-info-right-extent .stre-label {
    width: 120px;
    display: table-cell
}

.story-info-right-extent .stre-value {
    display: table-cell
}

.story-info-right-extent .info-time {
    background-position-x: -56px
}

.story-info-right-extent .info-view {
    background-position-x: -84px
}

.story-info-right-extent .story-bookmark,.story-info-right-extent .nonlogin-bookmark-add {
    height: 50px;
    cursor: pointer
}

.story-info-right-extent .noti-bookmark {
    color: #d65959;
    font-size: 13px;
    margin-left: 35px
}

.story-info-right-extent #rate_row_cmd {
    color: #000;
    font-size: 13px;
    margin-left: 35px
}

.panel-story-info-description {
    float: left;
    font-size: 15px;
    text-align: justify;
    border-top: 1px dashed #ff530d;
    margin-top: 10px;
    padding: 10px 0;
    overflow: hidden;
    width: 100%;
    max-height: none
}

.panel-story-info-description h3 {
    font-weight: 700;
    color: red
}

#panel-description-linear {
    clear: both;
    float: left;
    width: 100%;
    background: #fff;
    position: relative
}

#panel-description-linear::after {
    content: "";
    position: absolute;
    left: 25%;
    bottom: 0;
    height: 1px;
    width: 50%;
    border-bottom: 1px dashed #ff530d
}

#panel-description-linear i {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 40px
}

#panel-story-info-description-show-more,#panel-story-info-description-show-less {
    float: left;
    width: 100%;
    text-align: center;
    font-size: 15px;
    margin-bottom: 2px;
    color: #ff530d;
    cursor: pointer
}

.panel-story-chapter-list {
    float: left;
    margin-top: 10px;
    width: calc(100% - 20px);
    padding: 10px
}

.panel-story-chapter-list ul {
    max-height: 395px;
    overflow-y: scroll;
    margin-top: 5px;
    float: left;
    width: 100%
}

.panel-story-chapter-list li {
    width: 100%;
    float: left;
    display: flex;
    gap: 25px;
    justify-content: space-between;
}

.panel-story-chapter-list .chapter-name {
    float: left;
    background: url(../images/item-bg.png) 1px center no-repeat;
    padding-left: 15px;
    margin-right: 20px;
    width: calc(75% - 205px);
    line-height: 26px;
    color: #000;
}

.panel-story-chapter-list .chapter-view {
    float: left;
    width: 85px;
    font-style: italic;
    font-size: 14px;
    line-height: 26px
}

.panel-story-chapter-list .chapter-time {
    float: left;
    width: 124px;
    font-style: italic;
    font-size: 14px;
    line-height: 26px
}

.panel-story-chapter-list .row-title-chapter {
    padding-bottom: 5px;
    border-bottom: 1px solid #ff530d;
    float: left;
    width: calc(100% - 17px);
    color: #ff530d;
    font-size: 15px
}

.panel-story-chapter-list .row-title-chapter-name {
    font-weight: 700;
    float: left;
    width: calc(79% - 170px);
}

.panel-story-chapter-list .row-title-chapter-view {
    font-weight: 700;
    width: 118px;
    float: left
}

.panel-story-chapter-list .row-title-chapter-time {
    font-weight: 700;
    width: 76px;
    float: left;
}

.panel-story-comment {
    float: left;
    width: 100%;
    margin-top: 10px
}

.panel-list-comment {
    float: left;
    width: 100%;
    margin-top: 10px;
    background-color: #fff
}

.panel-search-story {
    float: left;
    width: 100%;
    background-color: #fff;
    overflow: hidden
}

.panel-search-story .search-story-item {
    float: left;
    width: calc(50% - 20px);
    padding: 10px;
    height: 145px;
    overflow: hidden
}

.panel-search-story .search-story-item .item-img {
    float: left;
    margin-right: 10px;
    width: 105px;
    height: 145px;
    position: relative
}

.panel-search-story .search-story-item .item-img img {
    width: 101px;
    height: 141px;
    padding: 1px;
    border: 1px solid #d7d7d9
}

.panel-search-story .search-story-item .item-right {
    float: left;
    width: calc(100% - 115px);
    height: 145px;
    overflow: hidden
}

.panel-search-story .search-story-item .item-title {
    display: block;
    color: #383838;
    height: 28px;
    line-height: 25px;
    font-size: 16px;
    font-weight: 700
}

.panel-search-story .search-story-item .item-chapter {
    display: block;
    height: 24px;
    font-size: 15px;
    color: #079eda;
    background: url(../images/item-bg.png) 2px 8px no-repeat;
    padding-left: 15px
}

.panel-search-story .search-story-item .item-author {
    display: block;
    height: 25px;
    color: #7b7b7b;
    line-height: 18px;
    font-size: 15px;
    font-style: italic
}

.panel-search-story .search-story-item .item-time {
    display: block;
    height: 25px;
    color: #7b7b7b;
    line-height: 18px;
    font-size: 15px
}

.panel-bookmark,.panel-history,.panel-nonlogin-full {
    float: left;
    width: 100%;
    overflow: hidden
}

.panel-bookmark .bookmark-item,.panel-history .history-item,.panel-nonlogin-full .nonlogin-full-item {
    float: left;
    color: #383838;
    width: calc(100% - 20px);
    padding: 10px;
    margin-bottom: 5px;
    border-left: 2px solid #31a95b
}

.panel-bookmark .bookmark-item img,.panel-history .history-item img,.panel-nonlogin-full .nonlogin-full-item img {
    float: left;
    width: 60px;
    height: 90px;
    margin-right: 10px
}

.panel-bookmark .bookmark-item .item-right,.panel-history .history-item .item-right,.panel-nonlogin-full .nonlogin-full-item .item-right {
    float: left;
    width: calc(100% - 70px)
}

.panel-bookmark .bookmark-item .item-right span,.panel-history .history-item .item-right span,.panel-nonlogin-full .nonlogin-full-item .item-right span {
    color: #000;
    font-size: 15px
}

.panel-bookmark .bookmark-item .item-right a,.panel-history .history-item .item-right a,.panel-nonlogin-full .nonlogin-full-item .item-right a,.panel-nonlogin-full .nonlogin-full-item .nonlogin-full-item-error .nonlogin-full-history-item-remove,.panel-nonlogin-full .nonlogin-full-item .nonlogin-full-item-error .nonlogin-full-bookmark-item-remove {
    color: #383838;
    font-weight: 700;
    font-size: 15px
}

.panel-history .history-item .item-right .item-title,.panel-bookmark .bookmark-item .item-right .item-title,.panel-nonlogin-full .nonlogin-full-item .item-right .item-title {
    width: 100%;
    height: 25px
}

.panel-bookmark .bookmark-item .item-right .item-row-one,.panel-nonlogin-full .nonlogin-full-item .item-right .item-row-one {
    width: 100%;
    height: 30px
}

.panel-bookmark .bookmark-item .item-right .item-row-one .bookmark_remove,.panel-nonlogin-full .nonlogin-full-item .item-right .item-row-one .nonlogin-full-history-item-remove,.panel-nonlogin-full .nonlogin-full-item .nonlogin-full-item-error .nonlogin-full-history-item-remove,.panel-nonlogin-full .nonlogin-full-item .item-right .item-row-one .nonlogin-full-bookmark-item-remove,.panel-nonlogin-full .nonlogin-full-item .nonlogin-full-item-error .nonlogin-full-bookmark-item-remove {
    float: right;
    width: 75px;
    font-size: 14px;
    line-height: 20px;
    text-align: right;
    color: #31a95b
}

.panel-bookmark .bookmark-item .item-right .item-row-one .bookmark_remove i,.panel-nonlogin-full .nonlogin-full-item .item-right .item-row-one .nonlogin-full-history-item-remove i,.panel-nonlogin-full .nonlogin-full-item .nonlogin-full-item-error .nonlogin-full-history-item-remove i,.panel-nonlogin-full .nonlogin-full-item .item-right .item-row-one .nonlogin-full-bookmark-item-remove i,.panel-nonlogin-full .nonlogin-full-item .nonlogin-full-item-error .nonlogin-full-bookmark-item-remove i {
    float: left;
    width: 16px;
    height: 16px;
    background-image: url(../images/delete.png);
    background-repeat: no-repeat;
    margin-top: 2px;
    cursor: pointer
}

.panel-bookmark .bookmark-item .item-right .item-row-one .item-story-name,.panel-nonlogin-full .nonlogin-full-item .item-right .item-row-one .item-story-name {
    max-width: calc(100% - 85px)
}

.panel-nonlogin-full .nonlogin-full-item-error {
    width: 100%
}

.panel-not-found {
    float: left;
    color: #000;
    background: #fff;
    padding: 50px 10px;
    width: calc(100% - 20px);
    min-height: 70px
}

.panel-nonlogin-history {
    border-top: 3px solid #2980b9;
    float: left;
    width: 100%;
    position: relative;
    margin-bottom: 10px;
    display: none
}

.panel-nonlogin-history .nonlogin-history-title-bar-title {
    display: block;
    width: 100%;
    height: 32px
}

.panel-nonlogin-history .nonlogin-history-title {
    float: left;
    cursor: pointer;
    background: #2980b9;
    color: #fff;
    padding: 8px 42px 8px 15px;
    font-size: 16px;
    line-height: 16px
}

.panel-nonlogin-history .nonlogin-history-title-show i {
    float: right;
    margin-left: 15px;
    width: 16px;
    height: 16px;
    background-image: url(../images/show-hide.png);
    background-position-x: 0;
    background-position-y: -31px;
    background-repeat: no-repeat
}

.panel-nonlogin-history .nonlogin-history-title-show i:after {
    content: "Hide";
    text-transform: capitalize;
    font-size: 13px;
    margin-left: 17px
}

.panel-nonlogin-history .nonlogin-history-title-hidden i {
    float: right;
    margin-left: 15px;
    width: 16px;
    height: 16px;
    background-image: url(../images/show-hide.png);
    background-position-x: 0;
    background-position-y: -3px;
    background-repeat: no-repeat
}

.panel-nonlogin-history .nonlogin-history-title-hidden i:after {
    content: "Show";
    text-transform: capitalize;
    font-size: 13px;
    margin-left: 17px
}

.panel-nonlogin-history .nonlogin-history-more {
    background: #2980b9;
    padding: 5px 15px;
    float: right;
    cursor: pointer;
    font-size: 14px;
    line-height: 22px;
    color: #fff
}

.panel-nonlogin-history .nonlogin-history-content {
    float: left;
    width: 100%
}

.panel-nonlogin-history .nonlogin-history-item {
    float: left;
    background: #fff;
    border-bottom: 1px solid #e5e5e5;
    overflow: hidden;
    padding: 5px 10px;
    width: calc(100% - 20px)
}

.panel-nonlogin-history .nonlogin-history-item .nonlogin-history-row-story,.panel-nonlogin-history .nonlogin-history-item .nonlogin-history-row-chapter {
    height: 22px;
    float: left;
    width: 100%
}

.panel-nonlogin-history .nonlogin-history-story {
    color: #383838;
    line-height: 22px;
    font-size: 15px;
    font-weight: 700;
    width: calc(100% - 25px)
}

.panel-nonlogin-history .nonlogin-history-chap {
    float: left;
    color: #383838;
    line-height: 22px;
    max-width: calc(100% - 85px);
    font-size: 15px
}

.panel-nonlogin-history .nonlogin-history-time {
    float: right;
    color: #999;
    margin-left: 5px;
    font-size: 12px;
    font-style: italic;
    line-height: 22px
}

.panel-nonlogin-history .nonlogin-history-remove {
    float: right;
    width: 16px;
    height: 16px;
    background-image: url(../images/delete.png);
    background-repeat: no-repeat;
    margin-top: 2px;
    cursor: pointer
}

.panel-nonlogin-bookmark {
    border-top: 3px solid #22af60;
    float: left;
    width: 100%;
    position: relative;
    margin-bottom: 10px;
    display: none
}

.panel-nonlogin-bookmark .nonlogin-bookmark-title-bar-title {
    display: block;
    width: 100%;
    height: 32px
}

.panel-nonlogin-bookmark .nonlogin-bookmark-title {
    float: left;
    cursor: pointer;
    background: #22af60;
    color: #fff;
    padding: 8px 42px 8px 15px;
    font-size: 16px;
    line-height: 16px
}

.panel-nonlogin-bookmark .nonlogin-bookmark-title-show i {
    float: right;
    margin-left: 15px;
    width: 16px;
    height: 16px;
    background-image: url(../images/show-hide.png);
    background-position-x: 0;
    background-position-y: -31px;
    background-repeat: no-repeat
}

.panel-nonlogin-bookmark .nonlogin-bookmark-title-show i:after {
    content: "Hide";
    text-transform: capitalize;
    font-size: 13px;
    margin-left: 17px
}

.panel-nonlogin-bookmark .nonlogin-bookmark-title-hidden i {
    float: right;
    margin-left: 15px;
    width: 16px;
    height: 16px;
    background-image: url(../images/show-hide.png);
    background-position-x: 0;
    background-position-y: -3px;
    background-repeat: no-repeat
}

.panel-nonlogin-bookmark .nonlogin-bookmark-title-hidden i:after {
    content: "Show";
    text-transform: capitalize;
    font-size: 13px;
    margin-left: 17px
}

.panel-nonlogin-bookmark .nonlogin-bookmark-more {
    background: #22af60;
    padding: 5px 15px;
    float: right;
    cursor: pointer;
    font-size: 14px;
    line-height: 22px;
    color: #fff
}

.panel-nonlogin-bookmark .nonlogin-bookmark-content {
    float: left;
    width: 100%
}

.panel-nonlogin-bookmark .nonlogin-bookmark-item {
    float: left;
    background: #fff;
    border-bottom: 1px solid #e5e5e5;
    overflow: hidden;
    padding: 5px 10px;
    width: calc(100% - 20px)
}

.panel-nonlogin-bookmark .nonlogin-bookmark-item h3 {
    height: 22px
}

.panel-nonlogin-bookmark .nonlogin-bookmark-story {
    color: #383838;
    line-height: 22px;
    font-size: 15px;
    font-weight: 700;
    width: calc(100% - 25px)
}

.panel-nonlogin-bookmark .nonlogin-bookmark-chap {
    color: #383838;
    line-height: 22px;
    font-size: 15px
}

.panel-nonlogin-bookmark .nonlogin-bookmark-remove {
    float: right;
    width: 16px;
    height: 16px;
    background-image: url(../images/delete.png);
    background-repeat: no-repeat;
    margin-top: 2px;
    cursor: pointer
}

.panel-fb-comment .fb-comment-title {
    float: left;
    width: calc(100% - 20px);
    font-size: 16px;
    line-height: 16px;
    color: #1992ea;
    text-transform: uppercase;
    padding: 10px;
    cursor: pointer
}

.panel-fb-comment .fb-comment-title span {
    float: left
}

.panel-fb-comment .fb-comment-title-hidden i {
    float: left;
    margin-left: 40px;
    width: 16px;
    height: 16px;
    background-image: url(../images/show-hide.png);
    background-position-x: 0;
    background-position-y: -3px;
    background-repeat: no-repeat
}

.panel-fb-comment .fb-comment-title-hidden i:after {
    content: "Show";
    text-transform: capitalize;
    font-size: 13px;
    margin-left: 17px
}

.panel-fb-comment .fb-comment-title-show i {
    float: left;
    margin-left: 40px;
    width: 16px;
    height: 16px;
    background-image: url(../images/show-hide.png);
    background-position-x: 0;
    background-position-y: -31px;
    background-repeat: no-repeat
}

.panel-fb-comment .fb-comment-title-show i:after {
    content: "Hide";
    text-transform: capitalize;
    font-size: 13px;
    margin-left: 17px
}

.panel-fb-comment .fb-comments-content {
    float: left;
    width: 100%
}

.panel-fb-comment .fb-comments {
    border-top: 1px solid #dedede;
    float: left;
    width: 100%
}

.panel-page-number {
    float: left;
    width: 100%;
    margin-top: 5px;
    text-align: right
}

.panel-page-number .group-page {
    float: right
}

.panel-page-number .group-page a,.panel-page-number .group-qty a {
    padding: 8px 12px;
    text-transform: uppercase;
    color: #666;
    font-weight: 700;
    font-size: 11px;
    background: #fff;
    display: inline-block;
    margin-right: 5px
}

.panel-page-number .group-qty,.panel-page-number .group-page a.page-last {
    margin-right: 0
}

.panel-page-number .group-page a:hover {
    -moz-box-shadow: inset 0 0 0 4px #dca2a2;
    -webkit-box-shadow: inset 0 0 0 4px #dca2a2;
    box-shadow: inset 0 0 0 4px #dca2a2
}

.panel-page-number .group-qty {
    float: left
}

.panel-page-number .page-blue,.panel-page-number .page-select {
    background: #059e9a!important;
    color: #fff!important
}

.panel-page-number .page-select:hover {
    -moz-box-shadow: none!important;
    -webkit-box-shadow: none!important;
    box-shadow: none!important
}

.panel-advanced-search-tool {
    float: left;
    width: 100%;
    margin-bottom: 20px;
    background-color: #fff
}

.panel-advanced-search-tool .advanced-search-tool-title {
    float: left;
    width: calc(100% - 20px);
    font-size: 16px;
    line-height: 16px;
    color: #1992ea;
    text-transform: uppercase;
    padding: 10px;
    cursor: pointer
}

.panel-advanced-search-tool .advanced-search-tool-title span {
    float: left;
    font-weight: 700
}

.panel-advanced-search-tool .advanced-search-tool-show i {
    float: left;
    margin-left: 40px;
    width: 16px;
    height: 16px;
    background-image: url(../images/show-hide.png);
    background-position-x: 0;
    background-position-y: -31px;
    background-repeat: no-repeat
}

.panel-advanced-search-tool .advanced-search-tool-show i:after {
    content: "Hide";
    text-transform: capitalize;
    font-size: 13px;
    margin-left: 17px
}

.panel-advanced-search-tool .advanced-search-tool-hidden i {
    float: left;
    margin-left: 40px;
    width: 16px;
    height: 16px;
    background-image: url(../images/show-hide.png);
    background-position-x: 0;
    background-position-y: -31px;
    background-repeat: no-repeat
}

.panel-advanced-search-tool .advanced-search-tool-hidden i:after {
    content: "Show";
    text-transform: capitalize;
    font-size: 13px;
    margin-left: 17px
}

.panel-advanced-search-tool .advanced-search-tool-content {
    float: left;
    font-size: 15px;
    border-top: 1px solid #dedede;
    width: calc(100% - 20px);
    padding: 10px
}

.panel-advanced-search-tool .advanced-search-tool-label {
    font-weight: 700
}

.panel-advanced-search-tool .advanced-search-tool-genres-help-title {
    cursor: pointer
}

.panel-advanced-search-tool .advanced-search-tool-genres-help {
    display: block;
    border: 1px solid #dedede;
    padding: 10px;
    margin-top: 10px;
    text-align: center
}

.panel-advanced-search-tool .advanced-search-tool-genres-help-content {
    margin: 5px 0;
    text-align: left
}

.panel-advanced-search-tool .advanced-search-tool-include-icon,.panel-advanced-search-tool .advanced-search-tool-genres-item-include i {
    float: left;
    display: block;
    height: 20px;
    width: 20px;
    margin-right: 5px;
    background: url(../images/advanced-choose.png) no-repeat;
    background-position-x: 0;
    background-position-y: 0
}

.panel-advanced-search-tool .advanced-search-tool-exclude-icon,.panel-advanced-search-tool .advanced-search-tool-genres-item-include {
    color: #00b000!important
}

.panel-advanced-search-tool .advanced-search-tool-exclude-icon,.panel-advanced-search-tool .advanced-search-tool-genres-item-exclude {
    text-decoration: line-through;
    color: #fe1818!important
}

.panel-advanced-search-tool .advanced-search-tool-exclude-icon,.panel-advanced-search-tool .advanced-search-tool-genres-item-exclude i {
    float: left;
    display: block;
    height: 20px;
    width: 20px;
    margin-right: 5px;
    background: url(../images/advanced-choose.png) no-repeat;
    background-position-x: -20px;
    background-position-y: -20px
}

.panel-advanced-search-tool .advanced-search-tool-genres-item-choose i {
    float: left;
    display: block;
    height: 20px;
    width: 20px;
    margin-right: 5px;
    background: url(../images/advanced-choose.png) no-repeat;
    background-position-x: -42px;
    background-position-y: -41px
}

.panel-advanced-search-tool .advanced-search-tool-include-span {
    display: inline-block
}

.panel-advanced-search-tool .advanced-search-tool-exclude-span,.panel-advanced-search-tool .advanced-search-tool-help-icon {
    display: inline-block;
    margin-left: 20px
}

.panel-advanced-search-tool .advanced-search-tool-help-icon i {
    float: left;
    display: block;
    height: 20px;
    width: 20px;
    background: url(../images/advanced-choose.png) no-repeat;
    background-position-x: -63px;
    background-position-y: -62px
}

.panel-advanced-search-tool .advanced-search-tool-genres-list {
    float: left;
    width: 100%;
    margin-top: 10px
}

.panel-advanced-search-tool .advanced-search-tool-genres-item {
    width: 150px;
    color: #000;
    font-size: 15px;
    cursor: pointer
}

.panel-advanced-search-tool .advanced-search-tool-orderby,.panel-advanced-search-tool .advanced-search-tool-keyword {
    float: left;
    width: 305px;
    margin-top: 10px
}

.panel-advanced-search-tool .advanced-search-tool-orderby-content,.panel-advanced-search-tool .advanced-search-tool-status-content,.panel-advanced-search-tool .advanced-search-tool-keyword-type {
    height: 27px;
    width: 220px;
    max-width: 100%;
    margin-top: 10px;
    margin-right: 5px;
    padding-left: 10px;
    border: 1px solid #dadada;
    border-radius: 3px;
    font-size: 16px;
    cursor: pointer
}

.panel-advanced-search-tool .advanced-search-tool-orderby-title,.panel-advanced-search-tool .advanced-search-tool-keyword-title {
    width: 75px;
    font-weight: 700;
    display: inline-flex
}

.panel-advanced-search-tool .advanced-search-tool-status {
    float: left;
    width: 305px;
    margin: 10px 0 0 20px
}

.panel-advanced-search-tool .advanced-search-tool-status-title {
    width: 55px;
    font-weight: 700;
    display: inline-flex
}

.panel-advanced-search-tool .advanced-search-tool-apply {
    display: inline-block;
    background: #1992ea;
    color: #fff;
    padding: 10px 48px;
    margin-top: 10px;
    margin-left: calc(50% - 75px);
    border: none;
    border: 3px double;
    font-size: 14px;
    font-weight: 700;
    cursor: pointer
}

.panel-advanced-search-tool .advanced-search-tool-apply:hover {
    background: #ebebeb;
    color: #000;
    border-color: #ddd
}

.panel-advanced-search-tool .advanced-search-tool-link-search {
    margin-top: 20px
}

.panel-advanced-search-tool .advanced-search-tool-link,.panel-advanced-search-tool .advanced-search-tool-keyword-content {
    background: #fff;
    color: #444;
    height: 30px;
    max-width: calc(100% - 20px);
    width: 100%;
    padding: 0 10px;
    margin-top: 10px;
    border: 1px solid #ddd;
    border-radius: 3px;
    font-size: 16px
}

.label-switch {
    display: inline-block;
    border-radius: 18px;
    cursor: pointer;
    height: 20px;
    padding: 3px;
    position: relative;
    vertical-align: top;
    width: 48px;
    margin-top: 2px
}

.label-switch .switch-front {
    position: relative;
    display: block;
    height: inherit;
    font-size: 10px;
    text-transform: uppercase;
    background: rgba(210,240,255,.26);
    border-radius: inherit;
    box-shadow: inset 0 1px 2px rgba(0,0,0,.12),inset 0 0 2px rgba(0,0,0,.15);
    -webkit-transition: .15s ease-out;
    -moz-transition: .15s ease-out;
    -o-transition: .15s ease-out;
    transition: .15s ease-out;
    -webkit-transition-property: opacity background;
    -moz-transition-property: opacity background;
    -o-transition-property: opacity background;
    transition-property: opacity background;
    background: #4fb845
}

.label-switch .switch-front:after {
    left: 8px;
    color: #fff;
    text-shadow: 0 1px rgba(0,0,0,.2);
    position: absolute;
    top: 50%;
    margin-top: -.5em;
    line-height: 1;
    -webkit-transition: inherit;
    -moz-transition: inherit;
    -o-transition: inherit;
    transition: inherit
}

.label-switch .switch-end {
    position: absolute;
    top: 4px;
    left: 32px;
    width: 18px;
    height: 18px;
    background: #fff;
    border-radius: 10px;
    box-shadow: 1px 1px 5px rgba(0,0,0,.2);
    background-image: -webkit-linear-gradient(top,white 40%,#f0f0f0);
    background-image: -moz-linear-gradient(top,white 40%,#f0f0f0);
    background-image: -o-linear-gradient(top,white 40%,#f0f0f0);
    background-image: linear-gradient(to bottom,white 40%,#f0f0f0);
    -webkit-transition: left .15s ease-out;
    -moz-transition: left .15s ease-out;
    -o-transition: left .15s ease-out;
    transition: left .15s ease-out
}

.label-switch-on .switch-front:after {
    content: 'ON'
}

.label-switch-off .switch-front:after {
    content: 'OFF';
    left: 22px
}

.label-switch-off .switch-end {
    left: 4px
}

.label-switch-off .switch-front {
    background: rgba(210,240,255,.26)
}

.user-panel-right {
    float: left;
    width: 100%;
    overflow: hidden
}

.user-panel-right .user-panel-setting {
    box-sizing: border-box;
    float: left;
    width: 100%;
    background: #fff;
    padding: 10px;
    border-top: 2px solid #31a95b
}

.user-panel-right .user-panel-setting li {
    padding: 3px 0
}

.user-panel-right .user-panel-setting li span {
    background: none repeat scroll 0 0 #31a95b;
    border-radius: 50%;
    color: #fff;
    display: inline-block;
    font-size: 11px;
    height: 10px;
    margin-right: 6px;
    padding: 5px;
    text-align: center;
    width: 10px;
    float: left
}

.user-panel-right .user-panel-setting li a {
    color: #383838;
    font-size: 12px;
    font-family: arial;
    line-height: 1.8;
    font-weight: 700;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inherit
}

.user-panel-left {
    float: left;
    width: 100%;
    background-color: #fff;
    margin-right: 10px;
    overflow: hidden;
    font: 400 14px Open Sans,Tahoma,Geneva,sans-serif;
    color: #3e3e3e;
    box-sizing: border-box;
    padding: 10px;
    min-height: 250px
}

.user-panel-left .user-panel-index,.user-panel-left .user-panel-index * {
    font-size: 22px
}

.user-panel-left .user-panel-index a {
    color: #b80202
}

.user-panel-left .user-auto-login-count,.register-panel .user-auto-login-count {
    background-color: #3498db;
    width: 100px;
    height: 100px;
    line-height: 100px;
    border-radius: 50%;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    text-align: center;
    color: #fff;
    font-size: 40px;
    font-weight: 700;
    margin: 15px auto 10px
}

.user-panel-left .user-auto-pn-btn {
    display: inline-block;
    margin: 0 calc(50% - 125px)
}

.register-panel .user-auto-pn-btn {
    display: inline-block;
    margin: 0 calc(50% - 126px)
}

.user-panel-left .user-auto-btn-gonow,.register-panel .user-auto-btn-gonow {
    font-size: 15px;
    color: #fff;
    background-color: #27ae60;
    display: inline-block;
    cursor: pointer;
    padding: 10px;
    line-height: 20px;
    border-radius: 5px;
    width: 100px;
    text-align: center
}

.user-panel-left .user-auto-btn-cancel,.register-panel .user-auto-btn-cancel {
    font-size: 15px;
    color: #fff;
    background-color: #95a5a6;
    display: inline-block;
    cursor: pointer;
    padding: 10px;
    line-height: 20px;
    border-radius: 5px;
    width: 100px;
    text-align: center;
    margin-left: 5px
}

.changes_info h1 {
    font-size: 20px;
    font-weight: 600;
    margin-bottom: 10px
}

.changes_info .dat {
    width: 400px;
    max-width: 100%;
    height: 40px;
    font-size: 20px;
    padding: 0 10px;
    margin-bottom: 10px;
    border: 1px solid #e9e9e9;
    box-sizing: border-box
}

.changes_info .dat_des {
    width: 400px;
    max-width: 100%;
    height: 80px;
    font-size: 20px;
    padding: 0 10px;
    margin: 0 0 10px;
    border: 1px solid #e9e9e9;
    box-sizing: border-box;
    resize: vertical
}

.changes_info .submit {
    line-height: 60px;
    margin-top: 10px;
    width: 400px;
    max-width: 100%;
    height: 62px;
    border: 1px solid #e9e9e9;
    -moz-border-radius: 4px;
    -khtml-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    background: #474d5d;
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    cursor: pointer;
    box-sizing: border-box
}

.changes_info .alert-error {
    color: red;
    margin-top: 15px;
    width: 405px;
    max-width: 100%;
    margin-bottom: 10px;
    font-size: 20px
}

.login-panel,.register-panel {
    color: #000;
    background: #fff;
    float: left;
    width: 96%;
    padding: 2%;
    font-size: 22px
}

.login-panel a,.register-panel a {
    font-size: 22px
}

.login-panel,.register-panel {
    color: #000;
    background: #fff;
    float: left;
    width: 96%;
    padding: 2%
}

.login-panel .loginlocal,.login-panel .login-fb {
    width: 50%;
    float: left
}

.login-panel .loginlocal h1,.login-panel .login-fb h2,.register-panel h1 {
    font-size: 18px;
    font-weight: 600;
    margin-bottom: 10px
}

.login-panel .loginlocal .user-name-panel,.login-panel .loginlocal .pass-panel,.login-panel .loginlocal .captchar,.register-panel .user-name-panel,.register-panel .pass-panel,.register-panel .display-name-panel,.register-panel .email-panel,.register-panel .captchar {
    display: flex;
    margin-bottom: 10px;
    box-sizing: border-box
}

.login-panel .loginlocal .user-name-panel i,.register-panel .user-name-panel i,.register-panel .display-name-panel i {
    background: url(../images/login-user.png) no-repeat;
    width: 65px;
    height: 65px
}

.login-panel .loginlocal .user-name-panel .user-name,.login-panel .loginlocal .pass-panel .pass,.register-panel .user-name-panel .user-name,.register-panel .pass-panel .pass,.register-panel .display-name-panel .display-name,.register-panel .email-panel .email {
    width: 335px;
    height: 65px;
    font-size: 20px;
    padding: 0 20px;
    margin-bottom: 10px;
    border: 1px solid #e9e9e9;
    display: block;
    box-sizing: border-box
}

.login-panel .email-panel i,.register-panel .email-panel i {
    background: url(../images/login-mail.png) no-repeat;
    width: 65px;
    height: 65px
}

.login-panel .loginlocal .pass-panel i,.register-panel .pass-panel i {
    background: url(../images/login-pass.png) no-repeat;
    width: 65px;
    height: 65px
}

.login-panel .loginlocal .captchar input,.register-panel .captchar input {
    float: left;
    width: 290px;
    height: 45px;
    font-size: 20px;
    padding: 0 10px;
    margin-left: 10px;
    border: 1px solid #e9e9e9;
    box-sizing: border-box
}

.login-panel .loginlocal .user-name-panel .user-name:hover,.login-panel .loginlocal .pass-panel .pass:hover,.login-panel .loginlocal .captchar input:hover,.register-panel .user-name-panel .user-name:hover,.register-panel .pass-panel .pass:hover,.register-panel .display-name-panel .display-name:hover,.register-panel .email-panel .email:hover,.register-panel .captchar input:hover,.login-panel .loginlocal .user-name-panel .user-name:focus,.login-panel .loginlocal .pass-panel .pass:focus,.login-panel .loginlocal .captchar input:focus,.register-panel .user-name-panel .user-name:focus,.register-panel .pass-panel .pass:focus,.register-panel .display-name-panel .display-name:focus,.register-panel .email-panel .email:focus,.register-panel .captchar input:focus {
    border: 2px solid #00c7de
}

.login-panel .loginlocal .submit,.register-panel .submit {
    line-height: 60px;
    margin-top: 10px;
    width: 400px;
    height: 62px;
    border: 1px solid #e9e9e9;
    -moz-border-radius: 4px;
    -khtml-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    background: #474d5d;
    color: #fff;
    font-size: 20px;
    font-weight: 700;
    cursor: pointer;
    box-sizing: border-box
}

.login-panel .loginlocal .submit:hover,.register-panel .submit:hover {
    color: #00c7de
}

.login-panel .loginlocal .alert-error,.register-panel .alert-error {
    color: red;
    margin-top: 15px;
    width: 405px;
    max-width: 100%;
    margin-bottom: 10px
}

.login-panel .loginlocal .account-more {
    width: 400px;
    max-width: 100%
}

.notification-popup {
    background: rgba(0,0,0,.4);
    cursor: pointer;
    display: none;
    height: 100%;
    position: fixed;
    text-align: center;
    top: 0;
    width: 100%;
    z-index: 10000
}

.notification-popup .noti-helper {
    display: inline-block;
    height: 100%;
    vertical-align: middle
}

.notification-popup .noti-div {
    background-color: #fff;
    box-shadow: 10px 10px 60px #555;
    display: inline-block;
    height: auto;
    max-width: 280px;
    min-height: 65px;
    vertical-align: middle;
    width: 60%;
    position: relative;
    border-radius: 8px;
    padding: 10px 10px 35px
}

.notification-popup .notification-close {
    position: absolute;
    bottom: 10px;
    width: calc(100% - 20px);
    color: #2196f3;
    font-weight: 600;
    font-size: 16px
}

.img-loading {
    background: url(../images/loading.gif) no-repeat center center transparent;
    min-height: 20px
}

.a-h:hover,.a-h:hover * {
    color: #f1c40f!important
}

.text-nowrap {
    max-width: 100%;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    display: inline-block
}

.color-red {
    color: red!important
}

@media screen and (max-width: 1300px) {
    .container {
        max-width:calc(100% - 20px)
    }
}

@media screen and (max-width: 1050px) {
    .container {
        max-width:calc(100% - 20px)
    }

    .container-header .container-header-top {
        padding: 5px 10px 15px
    }

    .container-header .header-menu {
        width: 100%
    }

    .container-main-left {
        width: 100%
    }

    .container-main-right {
        width: 100%;
        margin-top: 20px
    }

    .panel-topview,.panel-newest,.container-footer-content .pn-hot-link {
        /* display:flex; */
    }

    .container-footer-content .pn-contacts {
        width: 100%
    }

    .container-header-top .box-search {
        width: 100%
    }

    .container-header-top .box-search .search-story {
        width: 100%
    }

    .container-header-top .box-user-options {
        width: 100%
    }

    .login-panel .loginlocal,.login-panel .login-fb {
        width: 100%
    }

    .login-panel .login-fb {
        border-top: 2px solid #e5e5e5;
        padding-top: 10px;
        margin-top: 10px
    }

    .login-panel .loginlocal .user-name-panel i,.login-panel .loginlocal .pass-panel i,.register-panel .user-name-panel i,.register-panel .display-name-panel i,.register-panel .email-panel i,.register-panel .pass-panel i {
        width: 32px;
        height: 32px;
        background-size: 32px
    }

    .login-panel .loginlocal .user-name-panel .user-name,.login-panel .loginlocal .pass-panel .pass,.register-panel .user-name-panel .user-name,.register-panel .display-name-panel .display-name,.register-panel .email-panel .email,.register-panel .pass-panel .pass {
        width: 368px;
        height: 32px;
        max-width: calc(100% - 32px);
        background-size: 30px;
        padding: 0 20px;
        font-size: 16px
    }

    .login-panel .loginlocal .captchar input,.register-panel .captchar input {
        max-width: calc(100% - 100px)
    }

    .login-panel .loginlocal .submit,.register-panel .submit {
        max-width: 100%
    }

    .user-panel-left {
        width: 100%
    }

    .user-panel-right {
        width: 100%;
        margin-top: 10px
    }
}

@media(min-width: 800px) {
    .container-header .header-menu {
        display:inline!important
    }
}

@media(max-width: 800px) {
    .container {
        max-width:100%
    }

    .container-header .header-mobile-menu {
        display: block
    }

    .container-header .header-menu {
        display: none;
        width: 100%
    }

    .container-header .header-menu a {
        width: 100%;
        background: #fff;
        color: #fd5e18
    }

    .container-header {
        margin: 10px auto 0
    }

    .container-header .logo {
        width: 100%;
        background: #fff;
        margin-bottom: 10px
    }

    .container-header .container-header-top {
        width: 100%;
        padding: 0 10px 10px
    }

    .panel-content-homepage .content-homepage-item {
        width: calc(100% - 20px)
    }

    .panel-story-chapter-list .chapter-view,.panel-story-chapter-list .row-title-chapter-view {
        display: none
    }

    .panel-story-chapter-list .chapter-name {
        width: calc(75% - 120px);
    }

    .panel-story-chapter-list .row-title-chapter-name {
        width: calc(78% - 85px);
    }

    .panel-story-info .story-info-left {
        width: 100%;
        margin: 0
    }

    .panel-story-info .story-info-right {
        width: 100%
    }

    .panel-page-number {
        text-align: center
    }

    .panel-page-number .group-page {
        float: none;
        margin-bottom: 10px
    }

    .panel-page-number .group-qty {
        float: none
    }

    .panel-search-story .search-story-item {
        width: calc(100% - 20px)
    }
}
