.boxsd {
    box-shadow: rgba(155, 153, 157, 0.23) 1px 2px 3px;
}

.all_jbbg {
    background: -webkit-linear-gradient(left, #8a99fb, #5b7bff)!important;
    /* Safari 5.1 - 6.0 */
    background: linear-gradient(to right, #8a99fb, #5b7bff)!important;
}


/* 登录注册图片 */

.logos {
    margin: 90px auto 20px;
    display: block;
    width: 96px;
    height: 58px;
}

.release_tyq {
    width: 28px;
    height: 28px;
    margin: 6px 15px 5px 0px;
}

.friend_lists {
    background: #f5f5f5;
    text-indent: 5px;
    color: #373d54;
    font-size: 14px;
    display: inline-block;
    float: right;
    width: 100%;
    margin-top: 10px;
}


/* 头部导航栏 */

.headbox {
    height: 40px;
    color: #000;
    font-size: 18px;
    background-size: 100% 100%;
    line-height: 42px;
    background: #fff;
}

.headbox .goback {
    width: 16%;
    height: 40px;
    position: relative;
    left: 0;
    min-height: 1px;
    font-size: 16px;
    color: #333;
}

.headbox .head_left {
    width: 11px;
    height: 18px;
    margin: 11px 5px 5px 14px;
}

.headbox .texth {
    width: 68%;
    text-align: center;
    position: relative;
    left: 0%;
    min-height: 1px;
    line-height: 40px;
    color: #4c4c4e;
    font-size: 17px;
}

.headbox .righth {
    width: 16%;
    position: relative;
    left: 0%;
    height: 40px;
    min-height: 1px;
    line-height: 42px;
    color: #333;
    font-size: 16px;
}

.headbox .user_img {
    height: 27px;
    width: 24px;
    margin: 9px 0 0 14px;
}

.headbox .user_img2 {
    height: 20px;
    width: 20px;
    margin: 10px 0 0 14px;
}


/* 聊天框 */

.chat_box {
    width: 94%;
    margin: 0px auto 12px;
}

.chat_box .chata .chat_photo {
    width: 46px;
    height: 46px;
    border-radius: 50%;
}

.chat_box .chata .chat_le {
    width: 20%;
}

.chat_box .chata .chat_le_r {
    background: #fff;
    max-width: 66%;
    border-radius: 5px;
    padding: 3%;
    position: relative;
    margin-left: 10px;
}

.chat_box .chata .chat_le_list {
    border: 1px solid #eee;
    background: #fff;
    width: 88%;
    margin: 10px auto 0;
}

.chat_box .chata .chat_le_li {
    padding: 4px 8px;
    border: 1px solid #eee;
    margin: 5px;
}

.chat_box .chats .chat_ri {
    width: 20%;
}

.chat_box .chats .chat_photo {
    width: 46px;
    height: 46px;
    border-radius: 50%;
}

.chat_box .chats .chat_le_r {
    text-align: left;
    background: #fff;
    border-radius: 5px;
    padding: 3%;
    position: relative;
    margin-right: 10px;
    color: #fff;
    max-width: 66%;
}

.chat_box .chats .chat_le_r_bgs {
    background: -webkit-linear-gradient(left, #8a99fb, #5b7bff);
    /* Safari 5.1 - 6.0 */
    background: -o-linear-gradient(right, #8a99fb, #5b7bff);
    /* Opera 11.1 - 12.0 */
    background: -moz-linear-gradient(right, #8a99fb, #5b7bff);
    /* Firefox 3.6 - 15 */
    background: linear-gradient(to right, #8a99fb, #5b7bff);
}


/* 音频介绍 */

.audio_play2 {
    width: 18px;
    height: 18px;
    margin: 1px 8px 0 0;
}

.audio_play2_sty {
    width: 15px;
    height: 15px;
    margin: 7.5px;
}


/* self下的infor头部 */

.inf_head_inf {
    height: 95px;
    color: #fff;
    background: #fff;
}

.inf_head_name {
    margin: 26px 0 0 15px;
}

.inf_head_photo {
    margin: 5px 0 0 15px;
}

.inf_head_right {
    width: 26px;
    height: 26px;
    margin: 70px 15px 0 0;
}

.inf_head_divbg {
    background: #f5f5f5;
    height: 10px;
}

.inf_head_divbgtit {
    height: 50px;
    line-height: 50px;
    text-indent: 10px;
    border-bottom: 1px solid #f2f2f2;
}


/* 信息列表*/

.inf_list {
    height: 55px;
    margin-left: 20px;
    line-height: 57px;
    border-bottom: 1px solid #f5f5f5;
    text-align: left;
}

.inf_li_list .inf_list:last-child {
    /* border-bottom: 0px; */
}

.inf_li_list {
    border-top: 1px solid #eeeeee;
    /* border-bottom: 1px solid #eeeeee; */
    background: #fff;
}


/* 信息框 */

.infors_box {
    color: #fff;
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 99999;
}

.infors_box_bg {
    background: rgba(0, 0, 0, 0.5);
    position: absolute;
    width: 100%;
    height: 100%;
}

.infors_box_cen {
    background: #fff;
    position: absolute;
    width: 78%;
    height: 100%;
    color: #000;
}


/*文字抖动提示样式*/

.tips {
    position: fixed;
    top: 8rem;
    padding: 5px 20px;
    border-radius: 5px;
    background: rgba(0, 0, 0, 0.6);
    color: #fff;
    font-size: 15px;
    z-index: 9999;
    left: 50%;
}

.photo_wall {
    height: 170px;
    width: 100%;
}

.fd_user_photo {
    width: 57px;
    height: 57px;
    margin-top: 56px;
    margin-bottom: 5px;
    border-radius: 50%;
}

.fd_user_name {
    color: #333;
    font-size: 15px;
}


/* friend模块下 列表框*/

.fd_list_box {
    margin: 0px auto 0;
    padding-bottom: 50px;
}

.fd_list_boxbd {
    border-bottom: 1px solid #f1f1f1;
    margin-bottom: 20px;
    padding: 0 15px 20px;
}

.fd_list_box .fd_list_boxbd:first-child {
    border-top: 1px solid #f1f1f1;
    padding-top: 30px;
}

.fd_list_box .user_photo {
    width: 60px;
    height: 60px;
    border-radius: 50%;
}

.fd_list_box .fd_photo {
    width: 28%;
    margin-right: 10px;
    margin-top: 10px;
}

.fd_list_box .play_text {
    width: 32px;
    height: 32px;
    margin-right: 5px;
}

.fd_list_box .tap_zan {
    width: 32px;
    height: 32px;
    margin-right: 10px;
}

.fd_list_box .fd_le {
    width: 18%;
}

.fd_list_box .fd_ri {
    width: 82%;
}

.fd_list_box .fd_ri .fri_user_name {
    color: #566685;
}


/* 处理弹出层*/

.lay_box {
    position: fixed;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 9;
}

.lay_box_bg {
    background: #000;
    position: absolute;
    width: 100%;
    height: 100%;
    opacity: 0.5;
}

.lay_box_con {
    background: #fff;
    position: absolute;
}


/* .fd_top_bgs{background: url(../images/photo_wall.png);background-size: 100% 100%;height: 200px;text-align: center;} */


/* .speak_box .set_spe{width: 50%;} */


/* .play_voice{width: 25px;height: 25px;} */


/* .play_voice2{width: 25px;height: 25px;margin: 12px 10px 0 10px;} */


/* .chat_le_r_vol{border: 1px solid #797979;}
.tap_speak{text-align: center;line-height: 30px;}
.headle_list{height: 200px;background: #F2F2F2;}
.audio_times{height: 30px;line-height: 40px;margin-right: 10px;} */


/* .bexpr{width: 25px;height: 25px;float: left;margin: 12px 0 0 10px;}
.contenteditable{width: 54%;height: 30px;line-height: 30px;border: 1px solid #eee;border-radius: 5px;margin: 9px 0px 0px 0px;resize: none;background: #fff;float: left;overflow-y: scroll;overflow-x: hidden;text-indent: 5px;}*/


/* .cont_kee_tab{height: 40px;border-bottom: 1px solid #f2f2f2;}
.cont_kee_tab .conta_hous_seles{width: 33.3%;text-align: center;box-sizing: border-box;margin-top: 10px;height: 20px;line-height: 20px;}
.cont_kee_tab .conta_hous_seles_bd{padding-bottom: 29px;color: #4588ff;border-bottom: 1px solid #4588ff;} */


/* .conta_list_boxs{margin-bottom: 50px;} */


/* .conta_list{height: 50px;}
.conta_list_photo{width: 40px;height: 40px;border-radius: 50%;margin-top: 5px;} */


/* .conta_textq{border-bottom: 1px solid #f2f2f2;height: 50px;text-indent: 15px;line-height: 50px;} */


/* .contac_list_photo{width: 40px;height: 40px;border-radius: 50%;margin-top: 5px;}
.contac_list_searchs{width: 100%;height: 26px;background: rgba(0,0,0,0.3);color: #fff;border: none;border-radius: 11px;text-indent: 26px;} */


/* .ltmbs_right{width:66px;border-left: 1px solid #e8e8e8;margin-left: 20px;float: right;text-align: right;} */


/* 聊天组件*/

.speak_box {
    width: 100%;
    position: fixed;
    bottom: 0;
    margin: 0 auto;
}

.speak_b {
    background: #fff;
    height: 50px;
}

.speak_b_inp {
    border: 1px solid #eee;
    width: 60%;
    height: 30px;
    margin-top: 10px;
    float: left;
    border-radius: 5px;
    background: #f5f5f5
}

.speak_b_jia {
    width: 25px;
    height: 25px;
    float: left;
    color: #B9B9B9;
    margin: 12px 0 0 10px;
}

.speak_b_send {
    width: 40px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    margin: 10px 0 0 10px;
    background: #45C01A;
    border-radius: 5px;
    font-size: 12px;
    color: #fff;
}


/* 点击加号后的样式 */

.speak_imgs {
    height: 108px;
    border-top: 1px solid #f5f5f5;
    background: #FBFBFB;
}

.speak_imgs_con {
    width: 25%;
    height: 100%;
    text-align: center;
}

.speak_imgs_con .texfs {
    font-size: 12px;
    margin: 6px 0 0 0;
}

.speak_imgs_im {
    width: 30px;
    height: 30px;
    padding: 16px 10px 0px 10px;
    margin-top: 16px;
}


/* 音频 */

.audio_box {
    background: #A2E95D;
    width: 100px;
    height: 30px;
    float: right;
    border-radius: 5px;
    margin-top: 12px;
}


/* 提示录音层 */

.chat_sound_gif {
    position: fixed;
    top: 40%;
    left: 50%;
    width: 200px;
    text-align: center;
    margin-left: -100px;
    height: 120px;
    margin-top: -60px;
    background: #6a6a6a;
    border-radius: 10px;
    color: #fff;
}

.chat_sound {
    width: 100px;
    height: 76px;
    margin-top: 12px
}


/* 视频截图*/

.conta_call_img {
    width: 26px;
    height: 26px;
    margin: 16px 10px 0 0;
}


/* self contacts列表层 */

.contac_list_boxs {
    margin-bottom: 50px;
}

.contac_list_boxs .contac_list {
    height: 60px;
    line-height: 60px;
}

.contac_list_boxs .contac_list .contac_textq_le {
    width: 30%;
    text-indent: 10px;
    min-height: 1px;
    height: 60px;
}

.contac_list_boxs .contac_list .contac_textq_ri {
    border-bottom: 1px solid #f5f5f5;
    width: 74%;
    height: 59px;
}


/* call中图片要求*/

.resi_img_l {
    width: 100%;
}


/* 各种图片大小 */

.inf_right2 {
    width: 20px;
    height: 20px;
    margin: 15px 10px 0 0;
}

.resi_user_photo {
    width: 70px;
    height: 70px;
    border-radius: 50%;
    margin: 12px 0 0 20px;
}

.msg_textq {
    border-bottom: 1px solid #f2f2f2;
    height: 50px;
    text-indent: 15px;
    line-height: 50px;
}

.unread_red {
    width: 10px;
    height: 10px;
    background: red;
    border-radius: 50%;
    margin: 18px 18px 0 0;
}

.msg_list_photo {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    margin-top: 5px;
}

.msg_list_searchs {
    width: 90%;
    height: 30px;
    background: #eee;
    color: #000;
    border: none;
    border-radius: 11px;
    text-align: center;
    padding: 0 5%;
}

.msg_search {
    position: absolute;
    top: 14px;
    left: 50%;
    width: 16px;
    height: 16px;
    margin-left: -14%;
}

.ltmbs_left {
    width: 66px;
    border-right: 1px solid #e8e8e8;
    margin-right: 20px;
    float: left;
}


/*语音录入的input框宽度*/

@media screen and (max-width: 320px) {
    .contenteditable,
    .speak_b_inp {
        width: 55%;
    }
    .msg_search {
        margin-left: -24%;
    }
    /*首页星球样式*/
    .star_tyq_text {
        right: 114px!important;
        top: -5px!important;
    }
    .star_tfw_text {
        right: 185px!important;
        top: 64px!important;
    }
    .star_tjk_text {
        right: 128px!important;
        top: 134px!important;
    }
    .star_yjfk_text {
        right: 176px!important;
        top: 205px!important;
    }
    .star_wydz_text {
        right: 50px!important;
        top: 240px!important;
    }
    .star_yjhj_text {
        width: 135px!important;
        height: 180px!important;
        top: 48px!important;
        line-height: 226px!important;
        text-indent: 46px!important;
    }
    .star_youq {
        width: 275px!important;
        height: 310px!important;
    }
}

@media screen and (min-width: 321px) and (max-width:374px) {
    .contenteditable,
    .speak_b_inp {
        width: 59%;
    }
    .msg_search {
        margin-left: -21%;
    }
}

@media screen and (min-width:375px) and (max-width:413px) {
    .contenteditable,
    .speak_b_inp {
        width: 62%;
    }
    .msg_search {
        margin-left: -21%;
    }
}

@media screen and (min-width:414px) and (max-width:640px) {
    .contenteditable,
    .speak_b_inp {
        width: 67%;
    }
    .star_tyq_text {
        right: 166px!important;
        top: 8px!important;
    }
    .star_tfw_text {
        right: 256px!important;
        top: 88px!important;
    }
    .star_tjk_text {
        right: 186px!important;
        top: 168px!important;
    }
    .star_yjfk_text {
        right: 248px!important;
        top: 256px!important;
    }
    .star_wydz_text {
        right: 90px!important;
        top: 300px!important;
    }
    .star_yjhj_text {
        width: 166px!important;
        height: 222px!important;
        top: 58px!important;
        line-height: 266px!important;
        text-indent: 74px!important;
    }
    .star_youq {
        width: 340px!important;
        height: 378px!important;
    }
    .star_box {
        font-size: 17px;
    }
}

.animated {
    -webkit-animation-duration: 300ms;
    animation-duration: 300ms;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}

@-webkit-keyframes fadeInLeft {
    from {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

@keyframes fadeInLeft {
    from {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
    to {
        opacity: 1;
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.fadeInLeft {
    -webkit-animation-name: fadeInLeft;
    animation-name: fadeInLeft;
}

@-webkit-keyframes fadeOutLeft {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
}

@keyframes fadeOutLeft {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
        -webkit-transform: translate3d(-100%, 0, 0);
        transform: translate3d(-100%, 0, 0);
    }
}

.fadeOutLeft {
    -webkit-animation-name: fadeOutLeft;
    animation-name: fadeOutLeft;
}

@-webkit-keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes fadeIn {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.fadeIn {
    -webkit-animation-name: fadeIn;
    animation-name: fadeIn;
}

@-webkit-keyframes fadeOut {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

@keyframes fadeOut {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

.fadeOut {
    -webkit-animation-name: fadeOut;
    animation-name: fadeOut;
}

.el-radio-button__orig-radio:checked+.el-radio-button__inner {
    -webkit-box-shadow: 0 0 0 0 #333333!important;
    box-shadow: 0 0 0 0 #333333!important;
    background-color: #333333!important;
    border-color: #333333!important;
}