@charset "utf-8";
    body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,
    legend,input,button,textarea,p,blockquote,th,td,section,article,aside,
    header,footer,nav,dialog,figure,i,em,b{
        margin:0;padding:0;
        font-style:normal;
        font-weight: normal;
        font-family:"microsoft yahei","Microsoft YaHei UI",sans-serif;
    }
    ul,ol,li {
      list-style:none;
    }
    a {
      color:#333;
      text-decoration:none;
      cursor: pointer;
      outline:none;
      font-family:"microsoft yahei","Microsoft YaHei UI",sans-serif;
    }
    /* 清除浮动--clear */
    .clear {
      clear: both;
    }
　　::-webkit-input-placeholder { /* WebKit browsers */
　　color: #fff;
　　}
　　:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
　　color: #fff;
　　}
　　::-moz-placeholder { /* Mozilla Firefox 19+ */
　　color: #fff;
　　}
　　:-ms-input-placeholder { /* Internet Explorer 10+ */
　　color: #fff;
　　}
    /*滚动条样式*/
    span.tooltip {
        outline:none;
        position: relative;
    }

    span.tooltip:hover {
        text-decoration:none;
    } 

    .callout {
        z-index:20;
        position:absolute;
        top:30px;
        border:0;
        left:-12px;
    }
    /*CSS3 extras*/
    span.tooltip span {
        border-radius:4px;
        box-shadow: 5px 5px 8px #CCC;
    }
    /*定义滚动条宽高及背景，宽高分别对应横竖滚动条的尺寸*/
    ::-webkit-scrollbar {
        width: 3px;
        height: 3px;
        background-color: #f5f5f5;
    }
    /*定义滚动条的轨道，内阴影及圆角*/
    ::-webkit-scrollbar-track{
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
        border-radius: 1px;
        background-color: 0 none;
    }
    /*定义滑块，内阴影及圆角*/
    ::-webkit-scrollbar-thumb{
        height: 20px;
        border-radius: 3px;
        -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0);
        background-color: #646464;
    }


        @charset "utf-8";
    body {
        background: url("../images/bg.jpg") no-repeat 0 center;
    }
    /*通用文本输入框*/
    .input.text {
        padding: 0 5px;
        height: 32px;
        line-height: 32px;
        border: 1px solid #cbcbcb;
        font-size: 17px;
        font-family: "微软雅黑";
        color: #666;
    }
    /*通用按钮样式*/
    a.btn {
        display: inline-block;
        padding: 0 0.5%;
        height: 20px;
        line-height: 20px;
        background: #333;
        color: #fff;
        text-decoration: none;
        font-size: 12px;
        border-radius: 4px;
        cursor: pointer;
    }
    .wrapper {
        width: 1200px;
        margin: 0 auto;
        height: 720px;
        border-radius: 3px;
        background: #f0f0f0;
        /*overflow: hidden;*/
    }




    /*主要内容*/
    .primaryDiv {
        float: right;
        /*width: 980px;*/
        width: 1200px;
        position: relative;
    }
    .shadeForPrimary {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(255, 255, 255, 0.6);
        cursor: not-allowed;
        text-indent: -9999px;
    }
    .primaryDiv .shadeForPrimary {
        display: none;
    }
    .primaryDiv.initPrimaryDiv .shadeForPrimary {
        display: block;
    }
    .userInfo {
        width: 100%;
        height: 53px;
        line-height: 53px;
        text-indent: 15px;
        border-bottom: 1px solid #cfcfcf;
        color: #333;
        font-size: 16px;
    }
    .userInfo .serviceName {
        color: #cc2222;
    }
    .dialogList {
        height: 440px;
        overflow-y: scroll;
        overflow-x: hidden;
    }
    .dialogList ul li {
        padding: 0 15px;
    }
    .dialogList ul {
        display: none;
    }
    .dialogList ul.on {
        display: block;
    }
    .dialogList ul li em {
        display: inline-block;
        padding-top: 20px;
        width: 100%;
        height: 12px;
        line-height: 12px;
        text-align: center;
        color: #999;
        font-size: 12px;
    }
    .personProtrait {
        display: inline-block;
        width: 30px;
        height: 30px;
        border-radius: 3px;
        overflow: hidden;;
    }
    .personProtrait img {
        display: inline-block;
        width: 100%;
        max-height: 30px;
    }
    .personName {
        display: block;
        height: 14px;
        line-height: 14px;
        font-size: 14px;
        color: #666;
    }
    .dialogItem {
        /*position: relative;*/
        display: block;
        margin-top: 10px;
        /*width: auto;*/
        max-width: 80%;
        padding: 0 20px 15px;
        font-size: 14px;
        color: #333;
        background: #ffd496;
        border-radius: 3px;
    }
    /*.dialogItem i {
        position: relative;
        display: block;
        width: 12px;
        height: 15px;
    }*/
    .dialogItem .dialogContent {
        float: right;
        padding: 10px;
        background-color: #fcdbd4;
        text-align: left;
        line-height: 20px;
        word-break: break-all;
        word-wrap: break-word;
        overflow: hidden;
    }
    .dialogItem .dialogContent .dialogContentSingleImg {
        margin: 0 auto;
        width: 150px;
        max-height: 200px;
        overflow: hidden;
    }
    .dialogItem .dialogContent .dialogContentSingleImg img {
        display: inline-block;
        max-width: 100%;
        max-height: 100%;
        text-align: center;
        cursor: pointer;
    }
    .dialogItem .dialogContent img {
        display: inline-block;
        max-width: 100%;
    }
    .dialogItem .dialogContent a {
        display: block;
        width: 500px;
    }
    .dialogItem .dialogContent a .dialogImage {
        float: left;
        display: block;
        width: auto;
        max-width: 50%;
    }
    .dialogItem .dialogContent a span {
        display: block;
        padding-bottom: 2px;
        width: auto;
    }
    .dialogItem .dialogContent a:hover span {
        text-decoration: underline;
    }
    .userDialog .personProtrait {
        float: left;
        margin-right: 10px;
    }
    .userDialog .personName {
        text-align: left;
        color: #666;
    }
    .userDialog .dialogItem {
        float: left;
        margin-left: 11px;
        padding-left: 11px;
        padding-right: 0;
       /* padding-top: 15px;*/
       background: url("../images/leftArrow.png") no-repeat 0 10px;
    }
    .userDialog .dialogContent {
        padding: 10px;
        text-align: justify;
        background: #ffd496;
        overflow: hidden;
    }
    .userDialog .dialogItem i {
        /*top: 10px;
        left: -11px;
        right: 0 none;
        background: url("../images/icon.png") no-repeat 0 -70px; */
    }
    .userDialog .dialogItem .dialogContent a .dialogImage {
        margin-left: 10px;
    }
    .serviceDialog .personProtrait {
        float: right;
        margin-left: 10px;
    }
    .serviceDialog .personName {
        text-align: right;
        color: #cc2222;
    }
    .serviceDialog .dialogItem {
        float: right;
        text-align: right;
        padding-right: 11px;
        margin-right: 11px;
        background: url(../images/rightArrow.png) no-repeat right 10px;
    }
    .serviceDialog .dialogItem i {
        /*position: relative;
        top: 10px;
        right: -48px;
        display: block;
       background: url("../images/icon.png") no-repeat -20px -70px;
       background: red;*/
    }
    .serviceDialog .dialogItem .dialogContent a .dialogImage {
        margin-right: 10px;
    }
    /*对话回复--dialogReply*/
    .dialogReply {
        padding: 0 15px;
        height: 225px;
    }
    .operateDiv {
        padding: 11px 0 12px;
        height: 22px;
    }
    .expressDiv {
        position: relative;
    }
    .allExpressionDiv {
        min-width: 140px;
        padding: 5px;
        min-height: 150px;
        background: #fff;
        display: none;
        position: absolute;
        bottom: 10px;
        left: 15px;
        z-index: 999;
    }
    .allExpressionDiv img {
        /*margin: 3px;*/
        padding: 1px;
        border:1px solid #fff;
        cursor: pointer;
    }
    .allExpressionDiv img:hover {
        border:1px solid #000;
    }
    .operateDiv a.operateBtn {
        float: left;
        margin-right: 15px;
        display: inline-block;
        width: 20px;
        height: 20px;
        text-indent: -9999px;
    }
    .operateDiv a.operateBtn.expressBtn {
        background: url(../images/icon.png) no-repeat 0 -91px; 
    }
    .operateDiv a.operateBtn.expressBtn:hover {
        background: url(../images/icon.png) no-repeat -25px -91px; 
    }
    .operateDiv a.operateBtn.loadFileBtn {
        background: url(../images/icon.png) no-repeat 0 -120px; 
    }
    .operateDiv a.operateBtn.loadFileBtn:hover {
        background: url(../images/icon.png) no-repeat -25px -120px; 
    }
    .operateDiv a.operateBtn.presentBtn {
        background: url(../images/icon.png) no-repeat 0 -150px; 
    }
    .operateDiv a.operateBtn.presentBtn:hover {
        background: url(../images/icon.png) no-repeat -25px -150px; 
    }
    .operateDiv #loadFileInput {
        display: none;
    }
    .fastReply {
        display: inline-block;
    }
    .fastReply a {
        float: left;
        margin-right: 10px;
        padding: 0 10px;
        display: inline-block;
        height: 20px;
        line-height: 20px;
        border-radius: 10px;
        border: 1px solid #333;
        font-size: 12px;
        color: #333;
    }
    .fastReply a:hover {
        background: #333;
        color: #fff;
    }
    .dialogReply textarea {
        padding: 10px 2%;
        width: 96%;
        line-height: 20px;
        height: 100px;
        border: 0 none;
    }
    .dialogReply textarea {
        padding: 10px 2%;
        width: 96%;
        line-height: 20px;
        height: 100px;
        border: 0 none;
    }
    .textareaTips {
        float: right;
        margin: 15px 10px 0 0;
        height: 30px;
        line-height: 30px;
        color: #999;
        font-size: 14px;
    }
    .sendBtn {
        float: right;
        margin-top: 15px;
        display: inline-block;
        padding: 0 25px;
        height: 28px;
        line-height: 28px;
        color: #333;
        font-size: 14px;
        border: 1px solid #b3b3b3;
        border-radius: 3px;
        background: #fff;
}