body .content {
    width: 100%;
}

body .SetItemName {
    color: #00ffff;
    font-size: 13px;
}

.generalItemName {
    color: #fff;
    font-size: 13px;
}

.yellowItemName {
    color: #FFD700;
    font-size: 13px;
    font-weight: bold;
}

.petItemName {
    color: #ee5fff;
    font-size: 13px;
    font-weight: bold;
}

.layui-table {
    background-color: #121212;
    color: #999;
}

.layui-btn {
    border: none;
}

.layui-menu, .layui-panel {
    background-color: #FF5722;
}

.layui-menu li {
    color: #FFF;
}

.layui-menu li:hover {
    background-color: #431805;
}

.layui-panel {
    border-color: #431805;
}

.layui-table td, .layui-table th, .layui-table-fixed-r, .layui-table-header, .layui-table-page, .layui-table-tips-main, .layui-table-tool, .layui-table-view, .layui-table[lay-skin=row], .layui-table[lay-skin=line] {
    border-color: rgb(44, 46, 49);
}

.layui-table tbody tr:hover, .layui-table thead tr, .layui-table-click, .layui-table-header, .layui-table-hover, .layui-table-mend, .layui-table-patch, .layui-table-tool, .layui-table-total, .layui-table-total tr, .layui-table[lay-even] tr:nth-child(even) {
    background-color: #111111;
}

.layui-layer-btn0, .layui-layer-btn1 {
    background-color: #FF5722 !important;
    color: #fff !important;
    border: none !important;
}

.layui-table-page {
    text-align: right;
    background-color: #161616;
    height: 50px;
    padding: 12px 7px 0;
}

.layui-table-page > div {
    text-align: center;
}

.layui-form-trading-item {

}

.layui-form-item {
    margin-bottom: 0;
}

/*.layui-form-pane .layui-form-label {*/
/*    background-color: #080A0C;*/
/*    border: none;*/
/*    border-bottom: solid 1px rgb(45, 47, 50);*/
/*}*/

.layui-form-pane .layui-form-label:hover {
    border-bottom: solid 1px rgb(45, 47, 50);
}

.layui-form-item .layui-inline {
    height: 30px;
    margin-bottom: 0;
    margin-right: 5px;
}

.layui-input, .layui-select {
    height: 26px;
    line-height: 26px;
}

/*.layui-form-label {*/
/*    width: 90px !important;*/
/*}*/

.trading-warehouse-list {
    width: 800px;
    height: 600px;
}

#warehouse_item_list > div > ul {
    padding-left: 0px;
}

#warehouse_item_list > div > ul > li {
    display: block;
    width: 38px;
    height: 38px;
    border: rgb(49, 49, 49) solid 1px;
    margin: 2px;
    float: left;
}

div#qTip {
    z-index: 20210912 !important;
}

body .layui-layer-msg {
    border: rgb(49, 49, 49) solid 1px;
    background-color: rgba(0, 0, 0, 0.5);
}

body .layui-layer-ico16 {
    background-size: 100%;
}

.layui-layer-title {
    border-bottom: none;
}

.layui-layer-content {
    background-color: rgba(19, 23, 28, 0.91);
}

.layui-elem-field {
    border-color: rgba(19, 23, 28, 0.90);
}

label {
    border-color: rgba(19, 23, 28, 0.90);
}

.layui-layer-monster {
    background-color: rgba(19, 23, 28, 0.91);
    border: rgb(49, 49, 49) solid 1px;

}

.layui-layer-monster .layui-layer-title {
    background-color: rgba(0, 0, 0, 0.51);
    border: none;
    /*border-bottom:1px solid rgb(49,49,49);*/
    color: #fff;
}

.layui-layer-monster .layer-content {
    background-color: rgba(0, 0, 0, 0.51);
}

.layui-layer-monster .layui-layer-content {
    background-color: rgba(0, 0, 0, 0.51);
    color: #fff;
}


#MonsterText .MonsterText {
    height: 173px;
    overflow: hidden;
    /*border:3px solid #666;*/
}

#MonsterText .Monstertitle {
    color: #fff;
    font-size: 14px;
    height: 30px;
    line-height: 30px;
    background-color: rgba(19, 23, 28, 0.50);

}

#MonsterText .Monstertitle .left {
    text-align: center;
    width: 25%;
    display: inline-block;
}

#MonsterText .Monstertitle .center_1 {
    text-align: center;
    width: 25%;
    display: inline-block;
}

#MonsterText .Monstertitle .center_2 {
    text-align: center;
    width: 25%;
    display: inline-block;
}

#MonsterText .Monstertitle .right {
    text-align: center;
    width: 25%;
    display: inline-block;
}


#MonsterText .MonsterText .Monstermagess ul {
    list-style-type: none;
    margin: 0px;
    padding: 0px;
}

#MonsterText .MonsterText .Monstermagess ul li {
    color: #fff;
    font-size: 13px;
    line-height: 30px;
}

#MonsterText .MonsterText .Monstermagess #tMonster .left {
    text-align: center;
    width: 25%;
    display: inline-block;
}

#MonsterText .MonsterText .Monstermagess #tMonster .center {
    text-align: center;
    width: 25%;
    display: inline-block;
}

#MonsterText .MonsterText .Monstermagess #tMonster .right {
    text-align: center;
    width: 25%;
    display: inline-block;
}

.trading-sell-box {
    background-color: rgba(0, 0, 0, 0.8);
    border: rgb(49, 49, 49) solid 1px;
    width: 1122px;
    height: 30PX;
    margin: 2px 0;
    border-radius: 5px;
    text-align: center;
    line-height: 30px;
    color: rgb(255, 255, 255);
    font-size: 16px;
}

::after, ::before {
    box-sizing: content-box;
}

body .layui-layer-close {
    background-position: 1px -40px;
    cursor: pointer;
}

.layui-layer-confirm {
    background-color: rgba(0, 0, 0, 0.9);
    border: rgb(49, 49, 49) solid 1px;
    border-radius: 8px;
}

.layui-layer-confirm .layui-layer-content {
    text-align: center;
    color: #fff;
}

.layui-layer-confirm .layui-layer-btn {
    text-align: center;
}

.layui-layer-confirm .layui-layer-btn .layui-layer-btn0 {
    background-color: rgb(254, 86, 33);
    border-color: rgb(254, 86, 33);
    color: #fff;
}

.layui-layer-confirm .layui-layer-btn .layui-layer-btn1 {
    background-color: rgb(48, 48, 48);
    border-color: rgb(48, 48, 48);
    color: #fff;
}

.layui-layer-prompt {
    background-color: rgba(19, 23, 28, 0.91);
    border: 1px solid rgb(49, 49, 49);
    border-radius: 8px;
}

.layui-layer-prompt .layui-layer-title {
    background-color: rgba(19, 23, 28, 0.91);
    border: none;
    color: #fff;
}

.layui-btn-primary {
    border: 1px solid rgb(49, 49, 49);
    background-color: rgb(49, 49, 49);
    color: #fff;
}

.layui-btn-primary:hover {
    border-color: #666;
    color: #fff;
}

/*webkit定义滚动条宽高及背景，宽高分别对应横竖滚动条的尺寸*/
::-webkit-scrollbar {
    width: 6px;
    height: 16px;
    background-color: rgba(19, 23, 28, 0.91);
}

/*定义滚动条的轨道，内阴影及圆角*/
::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
    border-radius: 10px;

}

/*定义滑块，内阴影及圆角*/
::-webkit-scrollbar-thumb {
    /*width: 10px;*/
    height: 20px;
    border-radius: 10px;
    -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
    background-color: #555;
}

/*IE*/
* {
    scrollbar-3dlight-color: rgba(19, 23, 28, 0.91);
    scrollbar-highlight-color: #fff;
    scrollbar-face-color: rgb(49, 49, 49);
    scrollbar-arrow-color: #666;
    scrollbar-shadow-color: rgba(19, 23, 28, 0.91);
    scrollbar-darkshadow-color: rgba(19, 23, 28, 0.91);
    scrollbar-base-color: #D7DCE0;
    scrollbar-track-color: rgba(19, 23, 28, 0.91);
}

body .layui-input, .layui-select, .layui-textarea {
    height: 38px;
    line-height: 1.3;
    line-height: 38px \9;
    border: 0px;
    border-bottom: solid 1px rgb(45, 47, 50);
    /*background-color: transparent;*/
    outline: none;
    border-radius: 2px;
    color: #000000;
}

.layui-input:focus, .layui-textarea:focus, .layui-input:hover {
    border-color: #808080 !important;
}

body .layui-btn:focus {
    outline: none;
}

.layui-form-select dl {
    background-color: #121212;
    border: 1px solid rgb(44, 46, 49);
}

.layui-form-select dl dd.layui-this, .layui-form-select dl dd:hover {
    background-color: rgb(44, 46, 49);
    color: #999;
}

.card, .table {
    color: #ffe393;
}

.zhe {
    width: 100%;
    height: 276px;
    background: #000;
    opacity: .9;
    filter: alpha(opacity=90);
    position: absolute;
    top: 0;
    left: 0;
    text-align: center;
    line-height: 150px;
    display: none;
}

#knapsack {
    width: 279px;
    height: 276px;
    background-color: rgba(0, 0, 0, 0.8);
    border: rgb(49, 49, 49) solid 1px;
}

#knapsack ul {
    margin: 0;
    padding: 0;
    list-style-type: none;
}

#knapsack ul > li {
    display: block;
    width: 32px;
    height: 32px;
    margin-top: 2px;
    margin-left: 2px;
    border: rgb(49, 49, 49) solid 1px;
    float: left;
    list-style-type: none;
}

#Ite {
    text-align: center;
    width: 279px;
    height: 208px;
    background: url(/public/img/trading/Inventory.jpg);
    position: relative;
}

#Ite img {
    margin: auto;
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: 100%;
}

.attribute {
    float: left;
    width: 279px;
    height: 488px;
    background-color: rgba(0, 0, 0, 0.5);
    border: rgb(49, 49, 49) solid 2px;
    overflow: hidden;
    border-radius: 2px;
    background: url(/public/img/trading/attribute-bg.png);
    text-align: center;
    color: #FCBD00;
}

.attribute .character-avatars {
    height: 80px;
    text-align: center;
    padding-top: 10px;
}

.attribute .character-name {
    width: 95%;
    height: 25px;
    text-align: center;
    padding-top: 5px;
    font-size: 13px;
    border-bottom: rgb(49, 49, 49) solid 1px;
    margin: 0 auto;
}

.attribute .character-attribute {
    width: 95%;
    font-size: 12px;
    border-bottom: rgb(49, 49, 49) solid 1px;
    margin: 0 auto;
}

.attribute .character-attribute ul > li {
    display: block;
    list-style-type: none;
    margin-top: 3px;
    padding-left: 30px;
    text-align: left;
    width: 100%;
    height: 20px;
    line-height: 20px;
}

.attribute .character-point {
    width: 95%;
    font-size: 12px;
    border-bottom: rgb(49, 49, 49) solid 1px;
    margin: 0 auto;
}

.attribute .character-point ul {
    margin: 0 0;
    padding: 0 0;
}

.attribute .character-point ul > li {
    display: block;
    list-style-type: none;
    margin-top: 3px;
    width: 100%;
    height: 20px;
}

.attribute .character-point ul > li > span {
    display: block;
    width: 40%;
    float: left;
    text-align: left;
    padding-left: 25px;
}

.Inventory {
    float: left;
    width: 279px;
    height: 488px;
    background-color: rgba(0, 0, 0, 0.5);
    border: rgb(49, 49, 49) solid 2px;
    overflow: hidden;
    border-radius: 2px;
}

/*快捷搜索按钮*/
.search-btn > li {
    list-style: none !important;
    display: inline-block;
    height: 20px;
    line-height: 20px !important;
    padding: 0 10px;
    font-size: 10px;
    background-color: #FF5722;
    color: #fff;
    margin: auto 5px 0px auto !important;
    border-radius: 5px;
    cursor: pointer;
}

/*藏宝阁购买销售日志*/
#tradinglog {
    width: 800px;
    height: 500px;
    text-align: center;
    display: none;
}

#tradinglog > ul {
    display: block;
    width: 760px;
    height: 460px;
    margin: 30px auto 10px auto;
    border: rgb(44, 46, 49) solid 2px;
    text-align: left;
    padding: 5px 10px;
    background-color: rgba(18, 18, 18, 0.8);
    overflow: auto;
}

#tradinglog > ul > li {
    list-style: none;
    display: block;
    height: 26px;
    line-height: 26px;
    margin-bottom: 0px;
}

#tradinglog > ul > li > div {
    height: 24px;
    line-height: 24px;
    display: inline-block;
    padding-left: 28px;
}

#tradinglog > ul > li > span {
    color: #ffd700;
}

.layui-flow-more {
    display: none;
}

#tradinglog .trading-log-message {
    text-align: right;
    padding-top: 5px;
    padding-right: 20px;
}

#tradinglog .trading-log-message > span {
    color: #ffd700;
}

/*购物车*/
#cart {
    display: none;
    width: 600px;
    height: 460px;
    margin-left: 25px;
}

#cart .cart-message {
    float: left;
    width: 480px;
    height: 30px;
    line-height: 30px;
    text-align: right;
}

#cart .cart-message > span {
    color: #ffd700;
}

#cart .cart-btn {
    float: left;
    width: 100px;
    height: 30px;
    margin-left: 20px;
    text-align: right;
}

/*tips*/
body .layui-layer-tips .layui-layer-content .layui-layer-TipsR {
    top: 0px;
    border-bottom-color: #2C2E31;
}

body .layui-layer-tips .layui-layer-content {
    padding: 0px 15px;
    background-color: #2C2E31;
}

body .layui-layer-tips .layui-layer-content > span {
    color: #ffd700;
}

/*藏宝阁排行*/
.trading-rank {
    display: none;
}

.trading-rank .content {
    width: 320px;
    height: 320px;
    padding-left: 20px;
}

.trading-rank .content .title {
    height: 20px;
    line-height: 20px;
}

.trading-rank .content .title > span {
    display: block;
    float: left;
    text-align: center;
    font-size: 14px;
    font-weight: bold;
}

.trading-rank .content .rank-content > ul {
    margin: 0px;
    padding: 0px;
}

.trading-rank .content .rank-content > ul > li {
    display: block;
    list-style: none;
    height: 50px;
    line-height: 50px;
    border-top: solid 1px #1F2022;
}

.trading-rank .content .rank-content > ul > li > span {
    display: block;
    float: left;
    text-align: center;
    font-size: 12px;
    color: #868686;
}

.trading-rank .content .rank-content > ul > li > span:nth-child(1) {
    width: 50px;
}

.trading-rank .content .rank-content > ul > li > span:nth-child(2) {
    width: 150px;
}

.trading-rank .content .rank-content > ul > li > span:nth-child(3) {
    width: 70px;
}

.trading-rank .content .rank-content > ul > li > span > img {
    border-radius: 50%;
    margin-top: -3px;
}

button, .button {
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    cursor: pointer;
    background-image: url(/assets/img/button.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    padding: 19px 45px;
    border: none;
    color: #fff;
    text-shadow: 2px 2px 0px rgb(0 0 0 / 20%);
    position: relative;
    z-index: 1;
    text-align: center;
    text-transform: uppercase;
    font-family: Candara, Calibri, Segoe, Segoe UI, Optima, Arial, sans-serif;
    font-size: 15px;
    -webkit-box-shadow: 0px 10px 15px 0px rgb(0 0 0 / 20%);
    box-shadow: 0px 10px 15px 0px rgb(0 0 0 / 20%);
}

.layui-tab-title li {
    min-width: 22%;
    color: #fff000;
}

.layui-tab-title li a {
    color: #fff000;
}

/*.layui-form-label {*/
/*    color: #dad4dc;*/
/*}*/

.layui-tab {
    margin-bottom: 2em !important;
}

.layui-tab-title {
    text-align: center;
}

.layui-table-cell {
    color: #fff3cd;
}

/*v2*/
.layui-badge-rim, .layui-border, .layui-colla-content, .layui-colla-item, .layui-collapse, .layui-elem-field, .layui-form-pane .layui-form-item[pane], .layui-form-pane .layui-form-label, .layui-input, .layui-layedit, .layui-layedit-tool, .layui-panel, .layui-quote-nm, .layui-select, .layui-tab-bar, .layui-tab-card, .layui-tab-title, .layui-tab-title .layui-this:after, .layui-textarea {
    border-color: #ffe3935e;
}

.layui-table-init, .layui-form-pane .layui-form-label {
    background-color: rgba(0,0,0,0.5);
    color: #fff;
}

.layui-elem-quote {
    background-color: #200707;
    border-left: 5px solid #da3b01a8;
    border-right: 1px solid #ffe3932e;
    border-top: 1px solid #ffe3932e;
    border-bottom: 1px solid #ffe3932e;
    color: #000000;
}

.layui-form-select dl dd.layui-this {
    background-color: #D76440;
}

.layui-nav .layui-this:after, .layui-nav-bar {
    background-color: #D76440;
}
.layui-elem-quote {
    border-left: 5px solid #D76440;
}

.layui-form-select dl dd{
    background-color: #fff3cd;
    color: #0a0a0a;
}

.layui-btn {
    background-color: #da3b01;
    /*background: #CE160A;*/
    /*background-size: cover;*/
}
.layui-btn-normal {
    background-color: #da3b01;
}
.layui-bg-blue {
    background-color: unset!important;
}
.layui-btn-primary {
    color: #eee;
}
.layui-table tbody tr {
    border: 1px solid #9792831a !important;
}
.layui-table-cell{height: unset;}
.layui-table-tool-temp {padding-right: unset}
.layui-form-item .layui-form-checkbox[lay-skin=primary] {margin-top: unset;}
.layui-table, .layui-table-view {margin: 0 0 10px 0;}
.layui-form-item .layui-inline {margin-bottom: 0;margin-right: 0;}
.layui-form-radio {margin: 0;}
.layui-form-pane .layui-form-checkbox {margin: 0}
.layui-form-checkbox[lay-skin=primary] {padding-left: 23px;}
.layui-form-pane .layui-form-radio, .layui-form-pane .layui-form-switch {margin-left: 5px;}
.layui-form-checkbox[lay-skin=primary] span {padding-right: 10px;}
.layui-elem-quote {padding: 10px;}
.search-btn>li {list-style: none!important;display: inline-block;height: 20px;line-height: 20px!important;padding: 0 10px;font-size: 10px;background-color: #FF5722;color: #fff;margin: auto 5px 0px auto!important;border-radius: 5px;cursor: pointer;}
.layui-form-checkbox {
    margin-top: 10px !important;
}
.layui-inline{
    padding-top: 15px;
}
.layui-inline input,.layui-inline .layui-input-inline{
    max-width: 105px;
}
.layui-form-item .layui-inline{
    padding-top: 0;
}

.layui-form-select dl dd.layui-this {
    color: #0a0a0a;
}
.layui-inline .layui-form-label{
    padding-left: 5px;
    padding-right: 5px;
    max-width: 60px;
}