.bg-c {background: #ffffff !important;} /* 白色背景 */
.bg-d {background: #9dda61 !important;} /* 绿色背景 */
.bg-e {background: #f8f8f8 !important;} /* 淡灰色背景 */
.bg-f {background: #b9b9b9 !important;} /* 灰色背景 */
.bg-g {background: #f2f2f2 !important;} /* 整体背景色 */
.bg-h {background: #f6c101 !important;} /* 按钮黄色 */
.bg-i {background: #dedede !important;} /* 按钮已选灰色 */
.bg-j {background: #ff6b6e !important;} /* 淡红色背景 */
.bg-k {background: #1dd2ff !important;} /* 蓝色背景 */
.bg-l {background: #efefef !important;} /* 列表操作背景 */
.bg-m {background: #ffefd8 !important;} /* 列表操作on背景 */
.bg-n {background: #87d0f5 !important;} /* 男色 */
.bg-o {background: #ffa3a3 !important;} /* 女色 */
.bg-p {background: #fefced !important;} /* 内容特殊提示背景 */
.bg-q {background: #95ec69 !important;} /* 聊天绿 */
.bg-r {background: #9b9b9b !important;} /* A深灰 */

.zy-a {color: #ffffff !important;} /* 白色文字 */
.zy-c {color: #929292 !important;} /* 次要文字999 */
.zy-b {color: #ff9645 !important;} /* 主颜色橙色 */
.zy-d {color: #cacaca !important;} /* 黑色背景灰色文字 */
.zy-e {color: #000000 !important;} /* 黑色标题文字 */
.zy-f {color: #666666 !important;} /* 次要黑色标题文字 */
.zy-g {color: #b7b7b7 !important;} /* 次次要灰色文字 */
.zy-h {color: #333333 !important;} /* 3333文字 */
.zy-i {color: #fd4e4e !important;} /* 头条红色 */
.zy-j {color: #87d0f5 !important;} /* 男色 */
.zy-k {color: #ffa3a3 !important;} /* 女色 */
.zy-l {color: #6d94bd !important;} /* 链接色 */
.zy-m {color: #f6c101 !important;} /* 操作黄色 */
.zy-n {color: #1dd2ff !important;} /* 蓝色文字 */
.zy-o {color: #95ec69 !important;} /* 绿色文字 */
.zy-p {color: #ffb4b4 !important;} /* 神评红色 */

.zs-a {text-shadow: 1px 1px 0 rgba(0, 0, 0, 0.4);} /* 文字阴影 */

.sh-a {border-top: 1px solid #efefef !important;} /* 上分割 */
.xh-a {border-bottom: 1px solid #f5f5f5 !important;} /* 下分割 */
.xh-b {border-bottom: 1px solid #efefef !important;} /* 下分割 */
.xh-c {border-bottom: 1px solid #e6e6e6 !important;} /* 下分割 */
.xh-d {border-bottom: 1px solid rgba(255, 255, 255, 0.35) !important;} /* 下分割透明 */
.xh-e {border-bottom: 1px solid #8f8f8f !important;} /* 下分割 */
.yh-a {border-right: 1px solid #efefef !important;} /* 右分割 */
.yh-b {border-right: 1px solid #e5e5e5 !important;} /* 右分割 */
.zh-a {border-left: 1px solid #efefef !important;} /* 左分割 */
.bk-a {border: 1px solid #e0e0e0 !important;} /* 边框灰色 */
.bk-b {border: 1px solid #ff9645 !important;} /* 边框橙色 */
.bk-c {border: 1px solid #f8f8f8 !important;} /* 边框淡灰 */
.bk-d {border: 1px dashed #ececec !important;} /* 边框虚灰 */
.bk-e {border: 1px solid #efefef !important;} /* 边框灰色 */

.ab-a {background: -webkit-linear-gradient(left top, #f2af3a , #fc8205);background: -o-linear-gradient(bottom right, #f2af3a, #fc8205);background: -moz-linear-gradient(bottom right, #f2af3a, #fc8205);background: linear-gradient(to bottom right, #f2af3a , #fc8205);}  /* 变色橙色按钮 */
.ab-b {background: -webkit-linear-gradient(left top, #cacaca , #a9a9a9);background: -o-linear-gradient(bottom right, #cacaca, #a9a9a9);background: -moz-linear-gradient(bottom right, #cacaca, #a9a9a9);background: linear-gradient(to bottom right, #cacaca , #a9a9a9);}  /* 变色灰色按钮 */
.ab-c {background: -webkit-linear-gradient(left top, #99db5f , #87c14f);background: -o-linear-gradient(bottom right, #99db5f, #87c14f);background: -moz-linear-gradient(bottom right, #99db5f, #87c14f);background: linear-gradient(to bottom right, #99db5f , #87c14f);}  /* 变色绿色按钮 */
.ab-d {background: -webkit-linear-gradient(left top, #fe8063 , #f04e0d);background: -o-linear-gradient(bottom right, #fe8063, #f04e0d);background: -moz-linear-gradient(bottom right, #fe8063, #f04e0d);background: linear-gradient(to bottom right, #fe8063 , #f04e0d);}  /* 个人签到按钮 */
.ab-e {background: -webkit-linear-gradient(left top, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0));background: -o-linear-gradient(bottom right, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0));background: -moz-linear-gradient(bottom right, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0));background: linear-gradient(to bottom right, rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0));}  /* 变色透明按钮 */
.ab-h {background: -webkit-linear-gradient(left top, #58c2ff , #34b9fe);background: -o-linear-gradient(bottom right, #58c2ff, #34b9fe);background: -moz-linear-gradient(bottom right, #58c2ff, #34b9fe);background: linear-gradient(to bottom right, #58c2ff , #34b9fe);}  /* 侧栏菜单按钮 */
.ab-i {background: -webkit-linear-gradient(left top, #535f6c , #3f4954);background: -o-linear-gradient(bottom right, #535f6c, #3f4954);background: -moz-linear-gradient(bottom right, #535f6c, #3f4954);background: linear-gradient(to bottom right, #535f6c , #3f4954);}  /* 发帖变色按钮 */



/**
提示框
 */
 .spop-container {
    z-index: 22220216;
    position: fixed
  }
  
  .spop-container, .spop-container *, .spop-container:after, .spop-container:before {
    box-sizing: border-box
  }
  
  .spop--top-left {
    top: 0;
    left: 0
  }
  
  .spop--top-left .spop {
    -webkit-transform-origin: 0 0;
    -ms-transform-origin: 0 0;
    transform-origin: 0 0
  }
  
  .spop--top-center {
    top: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
  }
  
  .spop--top-center .spop {
    -webkit-transform-origin: 50% 0;
    -ms-transform-origin: 50% 0;
    transform-origin: 50% 0
  }
  
  .spop--top-right {
    top: 10px;
    right: 10px;
  }
  
  .spop--top-right .spop {
    -webkit-transform-origin: 100% 0;
    -ms-transform-origin: 100% 0;
    transform-origin: 100% 0
  }
  
  .spop--center {
    top: 50%;
    left: 50%;
    -webkit-transform: translate3d(-50%, -50%, 0);
    transform: translate3d(-50%, -50%, 0)
  }
  
  .spop--center .spop {
    -webkit-transform-origin: 50% 0;
    -ms-transform-origin: 50% 0;
    transform-origin: 50% 0
  }
  
  .spop--bottom-left {
    bottom: 0;
    left: 0
  }
  
  .spop--bottom-left .spop {
    -webkit-transform-origin: 0 100%;
    -ms-transform-origin: 0 100%;
    transform-origin: 0 100%
  }
  
  .spop--bottom-center {
    bottom: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    transform: translateX(-50%)
  }
  
  .spop--bottom-center .spop {
    -webkit-transform-origin: 50% 100%;
    -ms-transform-origin: 50% 100%;
    transform-origin: 50% 100%
  }
  
  .spop--bottom-right {
    bottom: 60px;
    right: 10px
  }
  
  .spop--bottom-right .spop {
    -webkit-transform-origin: 100% 100%;
    -ms-transform-origin: 100% 100%;
    transform-origin: 100% 100%
  }
  
  .spop {
    position: relative;
    min-height: 56px;
    line-height: 1.25;
    font-size: 14px;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    border-radius: 3px !important;
    box-shadow: 0 0 5px rgba(0, 0, 0, .13);
  }
  
  @media screen and (min-width: 30em) {
    .spop {
        border-radius: 2px;
        max-width: 400px;
        min-width: 300px;
        margin: .7em;
        margin-right: .3em;
    }
  }
  
  .spop--error, .spop--info, .spop--success, .spop--message, .spop--warning {
    color: #232323;
    background-color: rgba(255, 255, 255, 1)
  }
  
  @-webkit-keyframes spopIn {
    0% {
        opacity: 0;
        -webkit-transform: scale(.2, 1);
        transform: scale(.2, 1)
    }
    100% {
        opacity: 1;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1)
    }
  }
  
  @keyframes spopIn {
    0% {
        opacity: 0;
        -webkit-transform: scale(.2, 1);
        transform: scale(.2, 1)
    }
    100% {
        opacity: 1;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1)
    }
  }
  
  @-webkit-keyframes spopOut {
    0% {
        opacity: 1;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1)
    }
    100% {
        opacity: 0;
        -webkit-transform: scale(0, 1);
        transform: scale(0, 1)
    }
  }
  
  @keyframes spopOut {
    0% {
        opacity: 1;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1)
    }
    100% {
        opacity: 0;
        -webkit-transform: scale(0, 1);
        transform: scale(0, 1)
    }
  }
  
  .spop--out {
    -webkit-animation: spopOut .2s ease-in-out;
    animation: spopOut .2s ease-in-out
  }
  
  .spop--in {
    -webkit-animation: spopIn .2s ease-in-out;
    animation: spopIn .2s ease-in-out
  }
  
  .spop-body {
    padding: 1.4em;
    cursor: pointer;
  }
  
  .spop-body p {
    margin: 0
  }
  
  .spop-body a {
    color: #fff;
    text-decoration: underline
  }
  
  .spop-body a:hover {
    color: rgba(255, 255, 255, .8);
    text-decoration: none
  }
  
  .spop-title {
    margin-top: 0;
    margin-bottom: .25em;
    color: #fff
  }
  
  .spop-close {
    position: absolute;
    right: 0;
    top: 0;
    height: 32px;
    width: 32px;
    padding-top: 0.9em;
    padding-right: 15px;
    font-size: 22px;
    text-align: right;
    line-height: .6;
    color: #bbbbbb;
  }
  
  .spop-close:hover {
    opacity: .7;
    cursor: pointer
  }
  
  .spop-icon {
    position: absolute;
    top: 13px;
    left: 16px;
    width: 30px;
    height: 30px;
    border-radius: 50%;
    -webkit-animation: spopIn .4s .4s ease-in-out;
    animation: spopIn .4s .4s ease-in-out
  }
  
  .spop-icon:after, .spop-icon:before {
    content: "";
    position: absolute;
    display: block
  }
  
  .spop-icon + .spop-body {
    padding-left: 4.2em;
    padding-right: 2.5em;
  }
  
  .spop-icon--error, .spop-icon--info {
    border: 2px solid #3a95ed
  }
  
  .spop-icon--error:before, .spop-icon--info:before {
    top: 5px;
    left: 11px;
    width: 4px;
    height: 4px;
    background-color: #3a95ed
  }
  
  .spop-icon--error:after, .spop-icon--info:after {
    top: 12px;
    left: 11px;
    width: 4px;
    height: 9px;
    background-color: #3a95ed
  }
  
  .spop-icon--error {
    border-color: #ff5656
  }
  
  .spop-icon--error:before {
    top: 16px;
    background-color: #ff5656
  }
  
  .spop-icon--error:after {
    top: 5px;
    background-color: #ff5656
  }
  
  .spop-icon--message {
    display: none;
  }
  
  .spop--message .avatar {
    width: 40px;
    height: 40px;
    border-right: 2px;
    margin-right: 10px;
    float: left;
  }
  
  .spop--message p.nickname {
    font-size: 14px;
    font-width: 600;
    padding-bottom: 6px;
    margin-top: -1px;
  }
  
  .spop--message p.content {
    color: #888;
    font-size: 12px;
  }
  
  .spop--message p.content img {
    max-height: 24px;
  }
  
  .spop--message .spop-icon + .spop-body {
    padding: 10px !important;
  }
  
  .spop-icon--success {
    border: 2px solid #2ecc54
  }
  
  .spop-icon--success:before {
    top: 6px;
    left: 5px;
    width: 13px;
    height: 8px;
    border-bottom: 3px solid #2ecc54;
    border-left: 3px solid #2ecc54;
    -webkit-transform: rotate(-45deg);
    -ms-transform: rotate(-45deg);
    transform: rotate(-45deg)
  }
  
  .spop-icon--warning {
    border: 2px solid #fcd000
  }
  
  .spop-icon--warning:before {
    top: 6px;
    left: 5px;
    width: 0;
    height: 0;
    border-style: solid;
    border-color: transparent transparent #fcd000;
    border-width: 0 8px 12px
  }