.conver{
    background-image:-webkit-linear-gradient(to bottom right, #96533c, #823d8e);
    background-image:linear-gradient(to bottom right,#96533c,#823d8e);
    height: 740px;
    overflow: hidden;
}
.conver .content{
    width: 1200px;
    height: 740px;
    overflow: hidden;
    margin: 0 auto;
}
.conver .content .menu{
    width: 92px;
    height: 740px;
    background: rgba(0,0,0,0.5);
    /*opacity: 0.5;*/
    overflow: hidden;
    float: left;
}
.conver .content .menu ul li{
    list-style-type: none;
    height: 62px;
    line-height: 62px;
    color: #c6bab7;
    font-size: 16px;
    text-align: center;
    cursor: pointer;
}
.conver .content .menu ul li div{
    border: 1px solid #65463e;
    width: 80px;
    margin: 0 auto;
}
.conver .content div#video{
    width : 416px;
    height: 740px;
    float: left;
    overflow: hidden;
    /*background: #000;*/
    /*opacity: 0.2;*/
}
.conver .content div.header{
    height: 50px;
    width: 416px;
    /*background: #8e8390;*/
    /*opacity: 0.5;*/
    background: rgba(142,131,144,0.5);
    margin-top: 0;
    /*margin-left: 92px;*/
    position: absolute;
    z-index: 100;
    overflow: hidden;
}
.conver .content div.header img{
    width: 36px;
    height: 36px;
    border: 1px solid #a399a5;
    border-radius: 100%;
    margin-top: 7px;
    margin-left: 7px;
    float: left;
}
.conver .content div.header div{
    height: 36px;
    width: 206px;
    margin-top:7px;
    margin-left: 10px;
    overflow: hidden;
    float: left;
}
.conver .content div.header div p.userName{
    line-height: 20px;
    color: #fff;
    font-size:16px;
}
.conver .content div.header div p.aud{
    line-height: 16px;
    color: #fff;
    font-size:14px;
}
.conver .content div.header button{
    width: 48px;
    height: 24px;
    display: block;
    background: #e45aff;
    border-radius: 5px;
    border: none;
    outline: none;
    font-size: 12px;
    color: #fff;
    line-height: 24px;
    text-align: center;
    margin-top: 13px;
    cursor: pointer;
}
.loading{
    width: 350px;
    height: 350px;
    position: absolute;
    z-index: 1;
    margin-top: 360px;
    margin-left: 276px;
    /*transform: translate(-50% , -50%);*/
    display: none;
}
.loading span{
    display: inline-block;
    width: 5px;
    /*height: 100%;*/
    border-radius: 4px;
    background: #faf;
    -webkit-animation: load 1s ease infinite;
}
@-webkit-keyframes load{
    0%,100%{
        height: 20px;
        background: #C26AFF;
    }
    50%{
        height: 40px;
        margin: -16px 0;
        background: #faf;
    }
}
.loading span:nth-child(2){
    -webkit-animation-delay:0.2s;
}
.loading span:nth-child(3){
    -webkit-animation-delay:0.4s;
}
.loading span:nth-child(4){
    -webkit-animation-delay:0.6s;
}
.loading span:nth-child(5){
    -webkit-animation-delay:0.8s;
}
.conver .content div.chatList{
    width: 330px;
    height: 740px;
    overflow: hidden;
    position: relative;
    float: left;
    background-image:-webkit-linear-gradient(to bottom right, #753f3b, #69336b);
    background-image:linear-gradient(to bottom right,#753f3b,#69336b);
    /*background: #000;*/
    /*opacity: 0.1;*/
}

.conver .content div.chatList div.inRoom{
    width: 100%;
    height: 142px;
    border-bottom: 1px solid #571426;
}
.conver .content div.chatList div.chat{
    height: 672px;
    width: 312px;
    margin-top: 10px;
    margin-left: 18px;
    overflow-y: auto;
    overflow-x: hidden;
}
.conver .content div.chatList div.send{
    width: 100%;
    height: 100%;
    overflow: hidden;
}
.conver .content div.chatList div.send div span{
     width: 40px;
     height: 26px;
     background: #6e4362;
     display: block;
     margin-top: 6px;
     margin-left: 6px;
     border-radius: 5px;
     cursor: pointer;
    float: left;
 }
.conver .content div.chatList div.send div span img{
    width: 20px;
    height: 20px;
    margin-top: 3px;
    margin-left: 2px;
    display: block;
}
.conver .content div.chatList div.send div{
    width: 234px;
    height: 38px;
    /*background: #5a2c57;*/
    background: rgba(90,44,86,0.5);
    /*opacity: 0.5;*/
    display: block;
    margin-top: 6px;
    margin-left: 14px;
    border-radius: 5px;
    float: left;
}
.conver .content div.chatList div.send a{
    width: 72px;
    height: 38px;
    background: #d83cfb;
    display: block;
    float: left;
    margin-left: 10px;
    margin-top: 6px;
    text-align: center;
    line-height: 38px;
    color: #fff;
    font-size: 16px;
    border-radius: 5px;
}
.conver .content div.chatList div.send input#chatSend{
    width: 190px;
    line-height: 38px;
    height: 38px;
    background: none;
    margin-left: 10px;
    color: #998393;
    font-size: 14px;
    border: 0;
    outline: 0;
    float: left;
}
.conver .content div #remianSend{
    float: left;
    margin-left: 205px;
    margin-top: -25px;
    font-size: 14px;
    color: #fff;
}

.conver .content div.chatList div#getRoom{
    width: 312px;
    height: 118px;
    overflow-y: auto;
    margin-top: 10px ;
    margin-left: 18px;
    overflow-y:auto;
    overflow-x:hidden;
}
.conver .content div.chatList p{
    width: 300px;
    line-height: 22px;
    vertical-align: middle;
    font-size:12px;
    margin-top: 5px;
}
.conver .content div.chatList p span.level{
    float: left;
    width: 44px;
    height: 22px;
    display: block;
    color:#fff;
    font-size: 14px;
    line-height: 22px;
    text-indent: 24px;
}
.conver .content p span.l_1{
    background: url("../../images/room/icon.png") no-repeat scroll 0 0;
}
.conver .content p span.l_2{
    background: url("../../images/room/icon.png") no-repeat scroll -44px 0;
}
.conver .content p span.l_3{
    background: url("../../images/room/icon.png") no-repeat scroll -88px 0;
}
.conver .content p span.l_4{
    background: url("../../images/room/icon.png") no-repeat scroll -132px 0;
}
.conver .content p span.l_5{
    background: url("../../images/room/icon.png") no-repeat scroll -176px 0;
}
.conver .content p span.l_6{
    background: url("../../images/room/icon.png") no-repeat scroll -220px 0;
}
.conver .content p span.l_7{
    background: url("../../images/room/icon.png") no-repeat scroll -264px 0;
}
.conver .content div.chatList p span.Name{
    margin-left:10px;
    color: #9f6a63;
    cursor: pointer;
}
.conver .content div.chatList p span.text{
    color: #fff;
    word-wrap: break-word;
}
.conver .content div.chatList div#system p {
    color: #EB9DFF;
}
.conver .content div.usrList{
    width: 362px;
    height: 100%;
    overflow: hidden;
    float: left;
    background: #753c5f;
}
.conver .content div.usrList div.title{
    height: 44px;
    border-bottom: 1px solid #98677c;
    margin: 0 auto;
    overflow: hidden;
}
.conver .content div.usrList div.title span#userNum,.conver .content div.usrList div.title span#familyNum{
    width: 49%;
    color: #9c8591;
    font-size: 16px;
    line-height: 44px;
    text-align: center;
    display: block;
    float: left;
    cursor: pointer;
}
.conver .content div.usrList div.title span div{
    width: 100px;
    height: 6px;
    background: url("../../images/room/liveActive.png") no-repeat center center;
    margin:-6px auto 0;
}
.conver .content div.usrList div.title span.active{
    color: #efa8ff !important;
}
.conver .content div.usrList div.list{
    height: 416px;
    position: relative;
    width: 362px;
    /*overflow-y: auto;*/
    /*overflow-x: hidden;*/
    overflow: auto;
    /*max-width:97%;*/
    -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
}
/*音量条*/
input[type=range]::-webkit-slider-runnable-track{
    width: 100%;
    height: 6px;
    border-radius: 3px;
    border: none;
}
/*滑块*/
input[type=range]::-webkit-slider-thumb{
    /*::-webkit-slider-thumb是代表给滑块的样式进行变更*/
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none; /*//这三个是去掉滑块原有的默认样式，划重点！！*/
    width: 14px;
    height: 14px;
    border-radius: 100%;
    background: #fff;
    margin-top: -4px;
    cursor: pointer;
}
input[type=range]::-ms-fill-lower {
    /*进度条已填充的部分*/
    height: 6px;
    border-radius: 10px;
    background: linear-gradient(to right, #059CFA, white 100%, white);
}

input[type=range]::-ms-fill-upper {
    /*进度条未填充的部分*/
    height: 6px;
    border-radius: 10px;
    background: #584748;
}
input[type=range]:focus::-ms-fill-lower {
    background: linear-gradient(to right, #059CFA, white 100%, white);
}

input[type=range]:focus::-ms-fill-upper {
    background: #584748;
}
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
    width: 4px !important;
    /*height:10px;*/
    background: rgba(216,60,251,0.6) !important;
    border-radius: 2px !important;
}
.mCSB_scrollTools .mCSB_draggerRail {
    brakground: rgba(0, 0, 0, 0.6);
    width: 4px !important;
}
/*!*
/*::-webkit-scrollbar-thumb{*/
    /*width: 4px;*/
    /*!*height:10px;*!*/
    /*background: rgba(255,255,255,0.2);*/
    /*border-radius: 2px;*/
/*}*/
/*::-webkit-scrollbar{*/
    /*width: 4px;*/
    /*!*background-color: #000;*!*/
/*}*/
.conver .content div.usrList div#list p, .conver .content div.usrList div#family p{
    height: 60px;
    width: 290px;
    margin: 0 auto;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.conver .content div.usrList div#list p.color, .conver .content div.usrList div#family p.color{
    background: #7b3e65;
}
.conver .content div.usrList div#list p img, .conver .content div.usrList div#family p img{
    width: 42px;
    height: 42px;
    vertical-align: middle;
    border-radius: 100%;
    float: left;
    margin-top: 9px;
}
.conver .content div.usrList div#list p span.level, .conver .content div.usrList div#family p span.level{
    float: left;
    width: 44px;
    height: 22px;
    display: block;
    color:#fff;
    font-size: 14px;
    line-height: 22px;
    text-indent: 24px;
    margin-left:10px;
    margin-top: 19px;
}
.conver .content div.usrList div#list p span.u, .conver .content div.usrList div#family p span.u{
    margin-left:10px;
    color: #fff;
    line-height: 60px;
    cursor: pointer;
}




/*飘窗样式*/

/*等级样式*/

/*.level{*/
    /*width: 200px;*/
    /*height: 15px;*/
    /*border: 1px solid red;*/
    /*position: absolute;*/
    /*top: 20px;*/
    /*left: 60px;*/
/*}*/
.jinrank{
    width:30px;
    height:15px;
    border: 1px solid  green;
    float: left;
}
.jiver{
    font-size: 12px;
    text-indent: 22px;
    line-height: 22px;
    color: #fff;
    margin-left: 4px;
}



.jinlevel{
    width: 246px;
    height: 22px;
    position: absolute;
    top: 20px;
    left: 60px;
}
.jinlevel span.lev1{
    width: 32px;
    height: 20px;
    text-align: right;
    font-size: 12px;
    line-height: 20px;
    color: #fff;
    float: left;
    display: block;
    background: url(../../images/room/contribution/lev0.png) no-repeat center center;
    background-size: 100%;
}
.jinlevel span.lev2{
    width: 32px;
    height: 20px;
    text-align: right;
    font-size: 12px;
    line-height: 20px;
    color: #fff;
    float: left;
    display: block;
    background: url(../../images/room/contribution/lev1.png) no-repeat center center;
    background-size: 100%;
}
.jinlevel span.lev3{
    width: 32px;
    height: 20px;
    text-align: right;
    font-size: 12px;
    line-height: 20px;
    color: #fff;
    float: left;
    display: block;
    background: url(../../images/room/contribution/lev2.png) no-repeat center center;
    background-size: 100%;
}
.jinlevel span.lev4{
    width: 32px;
    height: 20px;
    text-align: right;
    font-size: 12px;
    line-height: 20px;
    color: #fff;
    float: left;
    display: block;
    background: url(../../images/room/contribution/lev3.png) no-repeat center center;
    background-size: 100%;
}
.jinlevel span.lev5{
    width: 32px;
    height: 20px;
    text-align: right;
    font-size: 12px;
    line-height: 20px;
    color: #fff;
    float: left;
    display: block;
    background: url(../../images/room/contribution/lev4.png) no-repeat center center;
    background-size: 100%;
}
.jinlevel span.lev6{
    width: 32px;
    height: 20px;
    text-align: right;
    font-size: 12px;
    line-height: 20px;
    color: #fff;
    float: left;
    display: block;
    background: url(../../images/room/contribution/lev5.png) no-repeat center center;
    background-size: 100%;
}
.jinlevel span.lev7{
    width: 32px;
    height: 20px;
    text-align: right;
    font-size: 12px;
    line-height: 20px;
    color: #fff;
    float: left;
    display: block;
    background: url(../../images/room/contribution/lev6.png) no-repeat center center;
    background-size: 100%;
}


/*筋斗云*/

.jinflybox{
    width: 344px;
    /*height: 59px;*/
    height: 55px;
    position: absolute;
    right:-90%;

}
.jin_a{
    width: 190px;
    height: 100px;
    float: left;
    background: url(../../images/room/a.png) center no-repeat;
    background-size: 100%;
}
.jin_a img{
    width: 40px;
    height: 40px;
    border-radius: 50%;
    margin-top: 30px;
    margin-left: 8px;
    display: block;
    position: absolute;
}

.jin_b{
    width: auto;
    /* height: 97px; */
    /* height: 47px; */
    /* margin-top: 41px; */
    margin-top: 44px;
    height: 16px;
    float: left;
    background: url(../../images/room/b.png) center no-repeat;
    background-size: 100%;
    overflow: hidden;
}
.jin_c{
    width: 140px;
    height: 49px;
    float: left;
    margin-top: 26px;
    background: url(../../images/room/c.png) center no-repeat;
    background-size: 100%;
}
.jin_p{
    position: absolute;
    /* width: 250px; */
    max-width: 240px;
    left: 60px;
    top: 42px;
    font-size: 12px;
    line-height: 20px;
    text-align: left;
    overflow: hidden;
    /* text-indent: -140px; */
}
/*全站*/
.quanzfly{
    width: 500px;
    height: 58px;
    position: absolute;
    right:-125%;

}
.quanzbox{
    width:auto;
    height: 58px;
    position: absolute;
}
.quanz_a{
    width: 115px;
    height: 60px;
    float: left;
    /* margin-top: 54px; */
    background: url(../../images/room/z1.png) center no-repeat;
    background-size: 100%;
}
.quanz_a img{
    width: 32px;
    height: 32px;
    border-radius: 50%;
    margin-top: 13.5px;
    display: block;
    margin-left: 2px;
    position: absolute;
}
.quanz_b{
    width: auto;
    /*height: 97px;*/
    /*height:47px;*/
    /*margin-top:41px;*/
    height: 14.5px;
    margin-top: 24px;
    float: left;
    background: url("../../images/room/z2.png") center no-repeat;
    background-size: 100%;
}
.quanz_c{
    width: 60px;
    height: 14.5px;
    /* float: left; */
    margin-left: 115px;
    margin-top: 24px;
    background: url(../../images/room/z3.png) center no-repeat;
    background-size: 100%;
}
.quanz_p{
    position: relative;
    /*width: 100px;*/
    width: auto;
    min-width: 100px;
    left: 50px;
    top: 18px;
    font-size: 12px;
    line-height: 26px;
    text-align: left;
    text-indent: 20px;
}

.fangjfly{
    width: 300px;
    height: 100px;
    position: absolute;
    z-index: 22;
    right: -80%;
    font-size: 24px;
    line-height: 80px;
    text-align: center;
    color: white;
}
.fjicon img{
    width: 40px;
    height: 40px;
    border-radius: 50%;
    position: absolute;
    top: 30px;
    left: 0;
    z-index:20;
}
.fangjpiao{
    width: auto;
    min-width: 100px;
    height: 20px;
    line-height: 20px;
    position: absolute;
    z-index: 10;
    background-color: rgba(0,0,0,0.5);
    border-radius: 80px;
    margin-left: 25px;
    margin-top:50px;
    text-align: center;
    text-indent: 20px;
    font-size: 12px;
    padding-right: 20px;
    color: white;
}











/*锁屏弹窗*/

.newMess{
    width: 188px;
    height: 31px;
    /*background: url(../../images/room/messdownbg_03.png) no-repeat center;*/
    /*background-size: 100% 100%;*/
    background-color: #fff;
    border-radius:20px;
    position: absolute;
    bottom: 60px;
    left: 60px;
    display:none;
}
.newMess img{
    display: block;
    float: left;
    width: 12px;
    height: 9px;
    background: url("../../images/room/messdown_03.png") no-repeat center;
    margin-left: 46px;
    margin-top: 10px;
}
.Messages{
    float: left;
    margin-left: 9px;
    line-height: 31px;
    font-size: 14px;
    color: #d83cfb;

}


/*#chatList{*/
    /*position: relative;*/
/*}*/