html {
    -ms-word-break: normal;
    -ms-word-wrap: break-word;
}

html, body {
    -ms-word-break: normal;
    -ms-word-wrap: break-word;
    color: #666666;
    font: 14px/1.5 Helvetica,"Î¢ÈíÑÅºÚ","ºÚÌå",Arial,Tahoma;
    text-align: center;
}

.chatListColumn .nickName {
    -ms-word-wrap: normal;
    -ms-text-overflow: ellipsis;
}

.chatListColumn .desc {
    -ms-word-wrap: normal;
    -ms-text-overflow: ellipsis;
}

.loadingIcon {
    background: url("../Images/ico_loading117ced3.gif") no-repeat center;
    margin: 20px auto;
    width: 20px;
    height: 20px;
}

.chatPanel .unreadDot {
    background: url("../Images/button_chat1832d7.png") no-repeat -5px -980px;
    margin: -7px 0px 0px -21px;
    left: 64px;
    width: 28px;
    height: 24px;
    text-align: center;
    color: rgb(255, 255, 255);
    line-height: 25px;
    font-size: 12px;
    position: absolute;
    _left: -5px;
}

.chatPanel .unreadDotS {
    background: url("../Images/button_chat1832d7.png") no-repeat -156px -1008px;
    left: 45px;
    top: 1px;
    width: 19px;
    height: 19px;
    position: absolute;
}

html {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

body {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

div {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

span {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

applet {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

object {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

iframe {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

h1 {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

h2 {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

h3 {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

h4 {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

h5 {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

h6 {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

p {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

blockquote {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

pre {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

a {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

abbr {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

acronym {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

address {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

big {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

cite {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

code {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

del {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

dfn {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

em {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

img {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

ins {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

kbd {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

q {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

s {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

samp {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

small {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

strike {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

strong {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

sub {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

sup {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

tt {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

var {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

b {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

u {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

i {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

center {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

dl {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

dt {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

dd {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

ol {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

ul {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

li {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

fieldset {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

form {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

label {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

legend {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

table {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

caption {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

tbody {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

tfoot {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

thead {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

tr {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

th {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

td {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

article {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

aside {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

canvas {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

details {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

embed {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

figure {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

figcaption {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

footer {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

header {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

hgroup {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

menu {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

nav {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

output {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

ruby {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

section {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

summary {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

time {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

mark {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

audio {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

video {
    font: inherit;
    margin: 0px;
    padding: 0px;
    border: 0px currentColor;
    vertical-align: baseline;
    font-size-adjust: inherit;
    font-stretch: inherit;
}

article {
    display: block;
}

aside {
    display: block;
}

details {
    display: block;
}

figcaption {
    display: block;
}

figure {
    display: block;
}

footer {
    display: block;
}

header {
    display: block;
}

hgroup {
    display: block;
}

menu {
    display: block;
}

nav {
    display: block;
}

section {
    display: block;
}

body {
    line-height: 1;
}

ol {
    list-style: none;
}

ul {
    list-style: none;
}

blockquote {
    quotes: none;
}

q {
    quotes: none;
}

blockquote::before {
    content: none;
}

blockquote::after {
    content: none;
}

q::before {
    content: none;
}

q::after {
    content: none;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
}

html {
  background: url("../Images/bg_universal17ced3.png") 0px 0px rgb(78, 83, 89);
    font: 14px/1.5 Helvetica, "Î¢ÈíÑÅºÚ", "ºÚÌå", Arial, Tahoma;
 
    text-align: center;
    color: rgb(102, 102, 102);
    -ms-overflow-y: auto;
    
    font-size-adjust: none;
    font-stretch: normal;
}

body {
    background: url("../Images/bg_universal17ced3.png") 0px 0px rgb(78, 83, 89);
    font: 14px/1.5 Helvetica, "Î¢ÈíÑÅºÚ", "ºÚÌå", Arial, Tahoma;  
    text-align: center;
    color: rgb(102, 102, 102);
    -ms-overflow-y: auto;
    font-size-adjust: none;
    font-stretch: normal;
}

body {
    position: relative;
}

a {
}

input {
}

a:link {
    color: rgb(85, 85, 170);
    text-decoration: none;
}

a:visited {
    color: rgb(85, 85, 170);
    text-decoration: none;
}

a:hover {
    color: rgb(85, 85, 170);
    text-decoration: underline;
}

a:active {
    color: rgb(85, 85, 170);
    text-decoration: underline;
}

.pointer {
    cursor: pointer;
}

.lightBorder {
    border-color: rgb(221, 221, 221);
}

.lightText {
    color: rgb(204, 204, 204);
}

.loadingMask {
    background: url("../Images/ico_loading117ced3.gif") no-repeat center rgba(0, 0, 0, 0.5);
    border-radius: 0px 0px 4px 4px;
    left: 0px;
    top: 0px;
    width: 415px;
    height: 356px;
    margin-top: -33px;
    margin-left: -17px;
    position: absolute;
    z-index: 101;
    opacity: 0.5;
}

.loadingMaskWind {
    margin: auto;
    border-radius: 4px;
    width: 100%;
    height: 100%;
    opacity: 0.5;
    background-color: rgb(0, 0, 0);
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
}

.chatPanel .media a {
    display: block;
}

.chatPanel .media {
    margin: 0px auto;
    border-radius: 5px;
    border: 1px solid rgb(174, 180, 185);
    width: 365px;
    box-shadow: 0px 1px 1px #d7d7d7;
    background-color: rgb(250, 250, 250);
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}

    .chatPanel .media .mediaPanel {
        margin: 0px;
        padding: 0px;
    }

    .chatPanel .media .mediaImg {
        margin: 16px 0px -10px;
    }

        .chatPanel .media .mediaImg .mediaImgPanel {
            margin: 0px;
            padding: 0px;
            width: 100%;
            height: 164px;
            overflow: hidden;
            position: relative;
        }

        .chatPanel .media .mediaImg img {
            left: 0px;
            position: absolute;
        }

        .chatPanel .media .mediaImg .mediaImgFooter {
            padding: 0px 11px;
            top: -29px;
            height: 29px;
            text-align: left;
            color: rgb(255, 255, 255);
            line-height: 29px;
            position: relative;
            text-shadow: none;
            background-color: rgba(0, 0, 0, 0.4);
        }

            .chatPanel .media .mediaImg .mediaImgFooter a:hover p {
                color: rgb(184, 179, 179);
            }

            .chatPanel .media .mediaImg .mediaImgFooter .mesgTitleTitle {
                height: 26px;
                color: rgb(255, 255, 255);
                line-height: 28px;
                overflow: hidden;
                white-space: nowrap;
                -ms-text-overflow: ellipsis;
                max-width: 318px;
                -o-text-overflow: ellipsis;
            }

    .chatPanel .media .mesgIcon {
        background: url("../Images/button_chat1832d7.png") no-repeat -174px -987px;
        margin: 8px 0px -2px 4px;
        width: 13px;
        height: 13px;
        display: inline-block;
    }

    .chatPanel .media .mediaContent {
        margin: 0px;
        padding: 0px;
    }

        .chatPanel .media .mediaContent .mediaMesg {
            padding: 0px 10px;
            border-top-color: rgb(215, 215, 215);
            border-top-width: 1px;
            border-top-style: solid;
        }

            .chatPanel .media .mediaContent .mediaMesg .mediaMesgDot {
                border-radius: 3px;
                left: 20px;
                top: -3px;
                width: 6px;
                height: 6px;
                display: block;
                position: relative;
                -moz-border-radius: 3px;
                -webkit-border-radius: 3px;
            }

            .chatPanel .media .mediaContent .mediaMesg .mediaMesgTitle:hover p {
                color: rgb(26, 23, 23);
            }

            .chatPanel .media .mediaContent .mediaMesg .mediaMesgTitle a {
                color: rgb(112, 117, 119);
            }

                .chatPanel .media .mediaContent .mediaMesg .mediaMesgTitle a:hover p {
                    color: rgb(68, 68, 64);
                }

            .chatPanel .media .mediaContent .mediaMesg .mediaMesgTitle p {
                text-align: left;
                color: rgb(93, 98, 101);
                line-height: 1.5em;
                overflow: hidden;
                margin-top: 2px;
                -ms-text-overflow: ellipsis;
                max-height: 45px;
                min-width: 176px;
                max-width: 286px;
                -o-text-overflow: ellipsis;
            }

            .chatPanel .media .mediaContent .mediaMesg .mediaMesgIcon img {
                width: 45px;
                height: 45px;
            }

    .chatPanel .media .mediaHead {
        padding: 0px 8px 4px;
        color: rgb(165, 16, 0);
        font-size: 16px;
        border-bottom-color: rgb(211, 216, 220);
        border-bottom-width: 1px;
        border-bottom-style: solid;
    }

        .chatPanel .media .mediaHead .title {
            text-align: left;
            line-height: 1.2em;
            margin-top: 22px;
            display: block;
            max-width: 312px;
        }

.chatPanel .mediaFullText .mediaImg {
    margin: 17px 0px 0px;
    padding: 0px 0px 5px;
    width: 100%;
    height: 164px;
    overflow: hidden;
    position: relative;
}

    .chatPanel .mediaFullText .mediaImg img {
        margin-top: 17px;
        position: absolute;
    }

.chatPanel .mediaFullText .mediaContent {
    padding: 6px 8px 10px;
    text-align: left;
    color: rgb(102, 107, 110);
    line-height: 1.5em;
    font-size: 12px;
}

.chatPanel .mediaFullText .mediaContentP {
    padding: 12px 8px 10px;
}

.chatPanel .media .mediaHead .time {
    margin: 21px 0px 0px;
    width: auto;
    color: rgb(130, 136, 140);
}

.chatPanel .media .mediaFooter {
    border-radius: 0px 0px 5px 5px;
    background-color: rgb(240, 244, 248);
    -moz-border-radius: 0px 0px 5px 5px;
    -webkit-border-radius: 0px 0px 5px 5px;
}

    .chatPanel .media .mediaFooter a {
        padding: 0px 7px;
        color: rgb(121, 47, 46);
        font-size: 14px;
    }

    .chatPanel .media .mediaFooter .mesgIcon {
        margin: 12px 3px 0px 0px;
    }

.chatPanel .media a:hover {
    cursor: pointer;
}

    .chatPanel .media a:hover .mesgIcon {
        background: url("../Images/button_chat1832d7.png") no-repeat -188px -987px;
    }

.chatPanel .chatListSearch {
    margin: 0px;
    height: 71px;
    border-top-color: rgb(255, 255, 255);
    border-bottom-color: rgb(171, 176, 180);
    border-top-width: 1px;
    border-bottom-width: 1px;
    border-top-style: solid;
    border-bottom-style: solid;
    background-color: rgb(231, 235, 238);
}

    .chatPanel .chatListSearch span.chatListSearchIcon {
        background: url("../Images/icon_chat17ced3.png") no-repeat -36px -166px;
        width: 28px;
        height: 93%;
        display: block;
    }

.chatPanel .chatListSearchPanel {
    margin: 0px;
    padding: 0px 10px;
}

.chatPanel .chatListSearchInput {
    border-radius: 15px;
    border: 1px solid rgb(152, 156, 161);
    width: 100%;
    height: 20px;
    margin-top: 6px;
    box-shadow: 0px 1px 0px #fff;
    background-color: rgb(255, 255, 255);
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
}

    .chatPanel .chatListSearchInput .searchClean {
        background: url("../Images/button_chat1832d7.png") no-repeat -4px -432px;
        width: 21px;
        height: 23px;
        cursor: pointer;
    }

        .chatPanel .chatListSearchInput .searchClean:active {
            background-position: -38px -432px;
        }

.chatPanel input {
    font: 13px/20px Arial;
    border: currentColor;
    width: 78%;
    height: 92%;
    font-size-adjust: none;
    font-stretch: normal;
}

.chatPanel .chatListSearchPanel .listOperatorContent .conmu {
    width: 49%;
    height: 100%;
}

.chatPanel .chatListSearchPanel .listOperatorContent .addr {
    width: 49%;
    height: 100%;
}

.chatPanel .chatListSearchPanel .listOperatorContent .bag {
    background: url("../Images/icon_chat17ced3.png");
    margin: 0px auto;
    width: 40px;
    height: 30px;
}

.chatPanel .chatListSearchPanel .listOperatorContent .conmu .bag {
    background-position: 1px 3px;
}

.chatPanel .chatListSearchPanel .listOperatorContent .addr .bag {
    background-position: 1px 10px;
}

.chatPanel .chatListSearchPanel .listOperatorContent .cutOffRule {
    width: 0px;
    height: 15px;
    margin-top: 11px;
    border-right-color: rgb(255, 255, 255);
    border-left-color: rgb(126, 126, 126);
    border-right-width: 1px;
    border-left-width: 1px;
    border-right-style: dotted;
    border-left-style: dotted;
    float: left;
}

.chatPanel .chatListSearchPanel .listOperatorContent .conmu {
    height: 100%;
    display: block;
}

.chatPanel .chatListSearchPanel .listOperatorContent .addr {
    height: 100%;
    display: block;
}

.chatPanel .chatListSearchPanel .listOperatorContent .conmu .bag {
    background: url("../Images/button0217ced3.png") no-repeat;
    margin: 8px auto 0px;
    width: 25px;
    height: 22px;
    display: block;
}

.chatPanel .chatListSearchPanel .listOperatorContent .addr .bag {
    background: url("../Images/button0217ced3.png") no-repeat;
    margin: 8px auto 0px;
    width: 25px;
    height: 22px;
    display: block;
}

.chatPanel .chatListSearchPanel .listOperatorContent .conmu .bag {
    background-position: -1px -69px;
}

.chatPanel .chatListSearchPanel .listOperatorContent .active .conmuButton .bag {
    background-position: -28px -69px;
}

.chatPanel .chatListSearchPanel .listOperatorContent .addr .bag {
    background-position: -56px -69px;
}

.chatPanel .chatListSearchPanel .listOperatorContent .active .addrButton .bag {
    background-position: -84px -69px;
}

.chatPanel .chatListSearchPanel .listOperatorContent .conmu .unreadDot {
    margin: -32px 0px 0px 9px;
}

.chatPanel .listContentWrap .listGroupTitle {
    background: 0px 0px rgb(220, 226, 230);
    padding: 4px 10px;
    width: 240px;
    text-align: left;
    color: rgb(150, 153, 157);
    line-height: 20px;
    margin-top: 0px;
    border-top-color: rgba(255, 255, 255, 0.4);
    border-bottom-color: rgba(0, 0, 0, 0.1);
    border-top-width: 1px;
    border-bottom-width: 1px;
    border-top-style: solid;
    border-bottom-style: solid;
    position: absolute;
}

.chatPanel .listGroupTitle .iconFavoriteFriend {
    background: url("../Images/icon_chat17ced3.png") no-repeat -38px -39px;
    width: 22px;
    height: 18px;
    vertical-align: top;
}

a.ico_close_circle {
    background: url("../Images/video_icon.png") no-repeat -256px -128px;
    padding: 0px;
    top: -10px;
    width: 23px;
    height: 23px;
    right: -11px;
    text-indent: -9999px;
    overflow: hidden;
    display: block;
    position: absolute;
    z-index: 55;
}

a.ico_close_circle_blue {
    background: url("../Images/video_icon.png") no-repeat -256px -128px;
    padding: 0px;
    top: -10px;
    width: 23px;
    height: 23px;
    right: -11px;
    text-indent: -9999px;
    overflow: hidden;
    display: block;
    position: absolute;
    z-index: 55;
}

.ico_close_circle:hover {
    background-position: -256px -96px;
}

a.ico_close_circle_blue:hover {
    background-position: -256px -96px;
}

.left {
    float: left;
}

.right {
    float: right;
}

.clear {
    clear: both;
}

.hide {
    display: none;
}

.mask {
    background: rgb(14, 16, 17);
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 110;
    opacity: 0.6;
}

.trans {
    opacity: 0;
}

.dialog {
    background: rgb(236, 237, 237);
    border-radius: 5px;
    border: 1px solid rgb(163, 163, 163);
    width: 328px;
    position: absolute;
    z-index: 1100;
    opacity: 0.95;
    box-shadow: 0px 1px 3px #bfbfbf;
    -webkit-opacity: 0.95;
    -moz-opacity: 0.95;
    -o-opacity: 0.95;
}

    .dialog .header {
        border-radius: 4px 4px 0px 0px;
        height: 15px;
        border-bottom-color: rgb(199, 199, 199);
        border-bottom-width: 1px;
        border-bottom-style: solid;
        background-color: rgb(233, 233, 233);
        -moz-border-radius: 4px 4px 0px 0px;
        -webkit-border-radius: 4px 4px 0px 0px;
    }

.tourTip.dialog {
    padding: 0px;
    box-shadow: 0px 6px 10px #444;
}

.dialog .dialogContainer {
    background: rgb(255, 255, 255);
    border-radius: 0px 0px 5px 5px;
    border: 1px solid rgb(255, 255, 255);
    position: relative;
    z-index: 999;
}

.dialog .dialogContent {
    color: rgb(46, 44, 44);
    font-size: 16px;
    text-shadow: 0px 1px 0px white;
}

    .dialog .dialogContent .default {
        padding: 50px 0px 38px;
        text-align: center;
    }

    .dialog .dialogContent .modifyAvatarTips {
        padding: 20px 35px;
        text-align: left;
    }

    .dialog .dialogContent .verificationRequest {
        padding: 20px 0px;
        text-align: center;
        line-height: 30px;
        font-size: 14px;
    }

    .dialog .dialogContent .inputVerify {
        padding: 3px 5px;
        width: 170px;
        margin-top: 10px;
    }

.dialogOperator {
    margin: 0px auto;
    padding: 10px;
    border-radius: 0px 0px 3px 3px;
    height: 20px;
    text-align: center;
    overflow: hidden;
    border-top-color: rgb(224, 224, 224);
    border-top-width: 1px;
    border-top-style: solid;
    background-color: rgb(249, 249, 249);
    -moz-border-radius: 0px 0px 3px 3px;
    -webkit-border-radius: 0px 0px 3px 3px;
}

    .dialogOperator .wrapContent a.btn {
        width: 64px;
        height: 21px;
    }

        .dialogOperator .wrapContent a.btn b {
            height: 20px;
            line-height: 20px;
            font-size: 12px;
        }

    .dialogOperator .wrapContent a.chatSend {
        margin-right: 10px;
        float: right;
    }

    .dialogOperator .wrapContent a.singleBtn {
        margin: 0px auto;
        float: none;
    }

    .dialogOperator .wrapContent a.btnGray {
        border-radius: 2px;
        float: right;
        -moz-border-radius: 2px;
        -webkit-border-radius: 2px;
    }

        .dialogOperator .wrapContent a.btnGray b {
            color: rgb(0, 0, 0);
        }

.dialog a.btn {
    border-radius: 3px;
    text-align: center;
    text-decoration: none;
    float: right;
    display: block;
}

    .dialog a.btn b {
        border-radius: 2px;
        height: 30px;
        text-align: center;
        line-height: 30px;
        font-size: 14px;
        display: block;
        text-shadow: none;
    }

.tourTip .dialogContainer {
    background: rgb(229, 229, 229);
    padding: 25px 0px 0px;
}

.tourTipContent {
    background: rgb(240, 239, 239);
    margin: 20px 0px 0px;
    padding: 10px 27px;
    border-radius: 0px 0px 5px 5px;
}

    .tourTipContent .desc {
        padding: 20px 84px;
        text-align: left;
        line-height: 1.7em;
    }

.tourTip .tourTipFileTransporterPic {
    background: url("../Images/illustration_chat17ced3.png") no-repeat 0px 0px;
    width: 370px;
    height: 170px;
}

.dialog a.iconClose {
    top: 5px;
    width: 28px;
    height: 28px;
    right: 5px;
    position: absolute;
}

    .dialog a.iconClose img {
        background: url("../Images/button_chat1832d7.png") no-repeat -3px -462px;
        width: 100%;
        height: 100%;
    }

    .dialog a.iconClose:hover img {
        background-position: -37px -462px;
    }

    .dialog a.iconClose:active img {
        background-position: -71px -462px;
    }

a.btnPrimary {
    background: rgb(88, 142, 209);
    margin: 13px auto;
    border-radius: 4px;
    border: 1px solid rgb(100, 134, 211);
    width: 120px;
    height: 30px;
    text-align: center;
    color: rgb(255, 255, 255);
    line-height: 30px;
    font-size: 16px;
    text-decoration: none;
    display: block;
    box-shadow: 0px 1px 3px #d3d3d3;
    text-shadow: 0px -1px 0px #4f739f;
}

    a.btnPrimary:hover {
        background: rgb(36, 103, 204);
        border: 1px solid rgb(71, 120, 166);
        color: rgb(255, 255, 255);
        text-shadow: 0px 1px 0px #333;
    }

    a.btnPrimary:active {
        background: rgb(36, 100, 196);
        border: 1px solid rgb(71, 120, 166);
        color: rgb(255, 255, 255);
        box-shadow: 0px 1px 3px #d3d3d3;
        text-shadow: 0px 1px 1px #444;
    }

    a.btnPrimary b {
        display: block;
    }

a.btnSecondary {
    background: rgb(233, 233, 233);
    border: 1px solid rgb(153, 153, 153);
    color: rgb(102, 102, 102);
    line-height: 30px;
    font-size: 16px;
    text-shadow: 0px 1px 0px #fff;
}

    a.btnSecondary:hover {
        background: rgb(240, 240, 240);
        border: 1px solid rgb(153, 153, 153);
        color: rgb(102, 102, 102);
        text-shadow: 0px 1px 0px #fff;
    }

    a.btnSecondary:active {
        background: rgb(233, 233, 233);
        border: 1px solid rgb(153, 153, 153);
        color: rgb(102, 102, 102);
        text-shadow: 0px 1px 0px #fff;
    }

.clr {
    height: 1px;
    overflow: hidden;
    clear: both;
    display: block;
}

.clrLeft {
    height: 1px;
    overflow: hidden;
    clear: left;
}

.clrRight {
    height: 1px;
    overflow: hidden;
    clear: right;
}

/*.loginPanel {
    border-radius: 4px;
    left: 400px;
    width: 500px;
    height: 380px;
    text-align: center;
    position: absolute;
}

    .loginPanel .title {
        border-radius: 4px 4px 0px 0px;
        height: 50px;
        line-height: 50px;
        font-size: 22px;
        text-shadow: 0px 1px 0px #fff;
    }

    .loginPanel .panelContent {
        padding: 20px;
    }

    .loginPanel .qrcode {
        border-width: 1px;
        border-style: solid;
        width: 200px;
    }

    .loginPanel .info {
        margin: 10px 0px 0px;
    }*/
    
.chatPanel .triangle {
    background: url("../Images/button_chat1832d7.png") no-repeat -88px -977px;
    margin: 3px 0px 0px 5px;
    width: 16px;
    height: 16px;
}

.loginPanel .errorMsg {
    display: none;
}

.loginPanel a.operatorBtn {
    margin-top: 10px;
}

.chatPanel {
    margin: 0px auto 0 20px;
    padding: 40px 0px 30px;
    border-radius: 4px;
    width: 95%;
    text-align: center;
    position: relative;
}

    .chatPanel .content {
        position: relative;
        z-index: 2;
    }

    .chatPanel .panelBackground {
        top: 180px;
        right: 253px;
        color: rgb(53, 57, 60);
        font-size: 24px;
        position: absolute;
        z-index: 1;
        text-shadow: 0px 1px 1px #535353;
    }

        .chatPanel .panelBackground img {
            background: url("../Images/illustration_chat17ced3.png") no-repeat -360px -165px;
            width: 65px;
            height: 65px;
        }

    .chatPanel .list {
        border-radius: 6px;
        border: 1px solid rgb(66, 68, 72);
        width: 276px;
        float: left;
        position: relative;
        z-index: 99;
        box-shadow: 0px 2px 6px #313131;
    }

        .chatPanel .list .top {
            border-radius: 3px 3px 0px 0px;
            border-top-color: rgb(155, 163, 174);
            border-bottom-color: rgb(51, 51, 51);
            border-top-width: 1px;
            border-bottom-width: 1px;
            border-top-style: solid;
            border-bottom-style: solid;
            background-color: rgb(91, 103, 116);
        }

            .chatPanel .list .top .title {
                border-radius: 5px 5px 0px 0px;
                height: 39px;
            }

    .chatPanel .search {
        border-top-color: rgb(255, 255, 255);
        border-bottom-color: rgb(221, 221, 221);
        border-top-width: 1px;
        border-bottom-width: 1px;
        border-top-style: solid;
        border-bottom-style: solid;
        background-color: rgb(240, 240, 240);
    }

    .chatPanel .searchText {
        border: 1px solid rgb(240, 240, 240);
    }

    .chatPanel .myProfile {
        width: 100%;
        display: block;
    }

        .chatPanel .myProfile .avatar {
            background: url("../Images/border_myprofile_avatar.ie17ced3.png") no-repeat;
            left: 5px;
            top: -26px;
            width: 68px;
            height: 68px;
            position: absolute;
            z-index: 101;
        }

        .chatPanel .myProfile img {
            background: url("../Images/avatar_default17ced3.png") no-repeat center;
            left: 9px;
            top: -22px;
            width: 60px;
            height: 60px;
            position: absolute;
            z-index: 100;
        }

        .chatPanel .myProfile a {
            text-decoration: none;
        }

        .chatPanel .myProfile .nickName {
            text-align: left;
            color: rgb(255, 255, 255);
            overflow: hidden;
            font-family: "Î¢ÈíÑÅºÚ", Helvetica, Arial, sans-serif;
            font-size: 14px;
            margin-top: 0px;
            float: left;
            display: block;
            white-space: nowrap;
            -ms-word-wrap: normal;
            -ms-text-overflow: ellipsis;
            max-width: 113px;
            text-shadow: none;
        }

        .chatPanel .myProfile .info {
            margin: 10px 0px 0px 74px;
            width: 150px;
            float: left;
        }

    .chatPanel .info a {
        float: left;
    }

.myProfile .unreadTotalCount {
    background: url("../Images/button_chat1832d7.png") no-repeat -5px -670px;
    left: 47px;
    top: 21px;
    width: 25px;
    height: 25px;
    color: rgb(93, 73, 20);
    line-height: 27px;
    font-size: 12px;
    position: absolute;
    z-index: 110;
    text-shadow: 0px 1px 0px #20252b;
}

    .myProfile .unreadTotalCount:hover {
        background-position: -39px -670px;
        text-decoration: none;
    }

    .myProfile .unreadTotalCount:active {
        background-position: -72px -670px;
        text-decoration: none;
    }

.chatPanel .listContentWrap {
    width: 100%;
    height: 452px;
    overflow: hidden;
    -ms-overflow-y: auto;
    background-color: rgb(245, 245, 245);
}

.scrollbarBox {
    width: 9px;
}

    .scrollbarBox .scrollbar {
        border-radius: 10px;
        width: 100%;
        opacity: 0.6;
        background-color: rgb(107, 116, 122);
    }

.chatPanel .listContent .viewport {
    width: 320px;
    height: 498px;
    overflow: hidden;
    position: relative;
}

.chatPanel .listContent .overview {
    list-style: none;
    left: 0px;
    top: 0px;
    position: absolute;
}

.chatPanel .listContent .thumb .end {
    background-color: rgb(0, 61, 93);
}

.chatPanel .listContent .thumb {
    background-color: rgb(0, 61, 93);
}

.chatPanel .listContent .scrollbar {
    width: 15px;
    float: right;
    position: relative;
}

.chatPanel .listContent .track {
    padding: 0px 1px;
    width: 13px;
    height: 100%;
    position: relative;
    background-color: rgb(216, 238, 253);
}

.chatPanel .listContent .thumb {
    top: 0px;
    width: 13px;
    height: 20px;
    overflow: hidden;
    position: absolute;
    cursor: pointer;
}

    .chatPanel .listContent .thumb .end {
        width: 13px;
        height: 5px;
        overflow: hidden;
    }

.chatPanel .listContent .listDesc {
    padding: 20px 0px;
    text-align: center;
    font-size: 12px;
    border-top-color: rgb(255, 255, 255);
    border-top-width: 1px;
    border-top-style: solid;
}

.chatPanel .chatListColumn {
    padding: 7px 10px;
    text-align: left;
    position: relative;
    _padding-right: 10px;
 
}
.chatListColumnSelect {
    background-color:#0099CC
 
}
  

    .chatPanel .chatListColumn .avatar_wrap {
        line-height: 0;
        margin-right: 10px;
        float: left;
    }

    .chatPanel .chatListColumn .avatar {
        background: rgb(164, 167, 184);
        border-radius: 0px;
        border: 1px solid rgb(255, 255, 255);
        width: 42px;
        height: 42px;
    }

    .chatPanel .chatListColumn .extend {
        float: right;
    }

    .chatPanel .chatListColumn .nickName .name {
        padding: 2px 0px 0px;
        overflow: hidden;
        font-size: 13px;
        margin-top: 2px;
        white-space: nowrap;
        -ms-word-wrap: normal;
        -ms-text-overflow: ellipsis;
        max-width: 121px;
        -o-text-overflow: ellipsis;
    }

        .chatPanel .chatListColumn .nickName .name .emoji {
            margin-top: 0px;
        }

    .chatPanel .chatListColumn .nickName .personNum {
        color: rgb(163, 163, 162);
        font-size: 12px;
        margin-top: 4px;
        margin-left: 5px;
    }

.descWrapper {
    overflow: hidden;
}

    .descWrapper .tipIcon {
        background: url("../Images/icon_chat17ced3.png") no-repeat;
        width: 20px;
        height: 20px;
        float: left;
    }

    .descWrapper .iconSendFailed {
        background-position: 50% -220px;
        margin-left: -6px;
    }

    .descWrapper .iconSending {
        background-position: 50% -200px;
        margin-left: -2px;
    }

.chatPanel .chatListColumn .desc {
    margin: 0px;
    width: 150px;
    height: 20px;
    color: rgb(119, 121, 122);
    line-height: 20px;
    overflow: hidden;
    font-size: 12px;
    display: inline-block;
    white-space: nowrap;
}

.chatPanel.hasSysScroll .chatListColumn .desc {
    width: 135px;
}

.chatPanel .chatListColumn .time {
    color: rgb(71, 119, 141);
    font-size: 12px;
    margin-top: 3px;
    text-shadow: none;
}

.chatPanel .chatListColumn .mute {
    background: url("../Images/button0217ced3.png") no-repeat -76px -36px;
    width: 17px;
    height: 19px;
    margin-right: 0px;
    float: right;
}

.chatPanel .chatListColumn .info {
    overflow: hidden;
    text-shadow: none;
}

.chatPanel .chatListColumn {
    height: 45px;
    overflow: hidden;
    border-top-color: rgb(247, 247, 247);
    border-bottom-color: rgb(213, 214, 215);
    border-top-width: 1px;
    border-bottom-width: 1px;
    border-top-style: solid;
    border-bottom-style: solid;
    cursor: pointer;
    text-shadow: 0px 1px 0px white;
}

    .chatPanel .chatListColumn .nickName {
        width: 150px;
        color: rgb(52, 52, 52);
        overflow: hidden;
        font-size: 15px;
        white-space: nowrap;
        -ms-text-overflow: ellipsis;
        -o-text-overflow: ellipsis;
    }

    .chatPanel .chatListColumn .desc {
        color: rgb(182, 182, 182);
    }

.chatPanel a.loadMoreConv {
    height: auto;
    text-align: center;
    font-size: 12px;
    display: block;
}

    .chatPanel a.loadMoreConv .desc {
        color: rgb(190, 190, 190);
        font-size: 12px;
    }

.chatPanel a.loadMoreConv {
    color: rgb(191, 195, 198);
    text-decoration: none;
    border-bottom-color: currentColor;
    border-bottom-width: medium;
    border-bottom-style: none;
    text-shadow: 0px 1px 0px #fff;
}

    .chatPanel a.loadMoreConv:hover {
        color: rgb(191, 195, 198);
        text-decoration: none;
        border-bottom-color: currentColor;
        border-bottom-width: medium;
        border-bottom-style: none;
        text-shadow: 0px 1px 0px #fff;
    }

    .chatPanel a.loadMoreConv:active {
        color: rgb(191, 195, 198);
        text-decoration: none;
        border-bottom-color: currentColor;
        border-bottom-width: medium;
        border-bottom-style: none;
        text-shadow: 0px 1px 0px #fff;
    }

        .chatPanel a.loadMoreConv:active span.desc {
            color: rgb(158, 158, 158);
            text-shadow: 0px 1px 0px #fff;
        }

    .chatPanel a.loadMoreConv .tipPic {
        background: url("../Images/button_chat1832d7.png") no-repeat -2px -914px;
        margin: 8px auto 3px;
        width: 25px;
        height: 25px;
        display: block;
    }

    .chatPanel a.loadMoreConv:hover .tipPic {
        background-position: -32px -914px;
    }

    .chatPanel a.loadMoreConv:active .tipPic {
        background-position: -62px -914px;
    }

.chatPanel .list .listOperator {
    border-radius: 0px 0px 5px 5px;
    left: 0px;
    width: 276px;
    font-size: 12px;
    border-top-color: rgb(238, 239, 240);
    border-top-width: 1px;
    border-top-style: solid;
    position: absolute;
    background-color: rgb(234, 236, 238);
}

.chatPanel .list .listOperatorContent {
    border-radius: 0px 0px 5px 5px;
    height: 27px;
    margin-top: 2px;
    margin-bottom: 4px;
}

.chatPanel .list .listBarContent {
    border-radius: 0px 0px 5px 5px;
    height: 5px;
}

.list .chatLeftPanelShadow {
    left: 50%;
    width: 276px;
    height: 46px;
    bottom: -51px;
    margin-left: -138px;
    position: absolute;
    border-bottom-right-radius: 5px;
    border-bottom-left-radius: 5px;
    -webkit-border-bottom-right-radius: 5px;
    -webkit-border-bottom-left-radius: 5px;
    -moz-border-radius-bottomright: 5px;
    -moz-border-radius-bottomleft: 5px;
}

.chatPanel .listContent div.activeColumn {
    padding: 7px 10px;
    font-weight: normal;
    border-top-color: rgb(133, 152, 172);
    border-bottom-color: rgb(201, 206, 211);
    border-top-width: 1px;
    border-bottom-width: 1px;
    border-top-style: solid;
    border-bottom-style: solid;
    text-shadow: 0px 1px 0px #fff;
    background-color: rgb(122, 134, 156);
}

.chatPanel .listContent .activeColumn a.friendDetail {
}

.chatPanel .listContent .activeColumn a.friendDetail {
}

.chatPanel .listContent div.activeColumn .nickName {
    color: rgb(255, 255, 255);
}

.chatPanel .listContent div.activeColumn .personNum {
    color: rgb(255, 255, 255);
}

.chatPanel .listContent div.activeColumn .desc {
    color: rgb(255, 255, 255);
}

.chatPanel .listContent div.activeColumn .time {
    color: rgb(255, 255, 255);
}

.chatPanel .listContent .desc img {
    margin-top: -2px;
    margin-bottom: -7px;
}

.chatPanel .activeColumn .clicked {
    background: url("../Images/bg_chat_listclick_blue17ced3.png") 0px 0px;
    left: 0px;
    top: 0px;
    width: 11px;
    height: 73px;
    position: absolute;
}

.chatPanel .activeColumn .nickName {
}

.chatPanel .activeColumn .desc {
}

.chatPanel .activeColumn .time {
}

.chatPanel .activeColumn .lightText {
}

.chatPanel .activeColumn .edited {
    display: none;
}

.chatPanel .chat {
    border-radius: 6px;
    margin-left: 312px;
    z-index: 20;
    box-shadow: 0px 2px 6px #313131;
    _height: 400px;
}

.chatPanel .chatContainer {
    border-radius: 2px 2px 6px 6px;
    border: 1px solid rgb(66, 68, 72);
    overflow: hidden;
    position: relative;
    -moz-border-radius: 2px 2px 6px 6px;
    -webkit-border-radius: 2px 2px 6px 6px;
    _height: 400px;
}

.chatPanel .chatTitle {
    border-radius: 4px 4px 0px 0px;
    height: 40px;
    border-top-color: rgb(155, 163, 174);
    border-bottom-color: rgb(51, 51, 51);
    border-top-width: 1px;
    border-bottom-width: 1px;
    border-top-style: solid;
    border-bottom-style: solid;
    position: relative;
    background-color: rgb(107, 120, 136);
    -moz-border-radius: 4px 4px 0 0;
    -webkit-border-radius: 4px 4px 0 0;
    -o-border-radius: 4px 4px 0 0;
    -ms-border-radius: 4px 4px 0 0;
}

.chatPanel .chatNameWrap {
    border-radius: 6px 6px 0px 0px;
    text-align: center;
    font-size: 16px;
}

    .chatPanel .chatNameWrap .chatName {
        margin: 0px auto;
        width: 400px;
        color: rgb(255, 255, 255);
        overflow: hidden;
        padding-top: 10px;
        font-family: "Î¢ÈíÑÅºÚ";
        font-size: 14px;
        white-space: nowrap;
        -ms-word-wrap: normal;
        -ms-text-overflow: ellipsis;
        text-shadow: none;
        -o-text-overflow: ellipsis;
    }

.chatPanel .chatScorll {
    width: 100%;
    height: 390px;
    overflow: hidden;
    -ms-overflow-y: auto;
    min-height: 200px;
    background-color: rgb(239, 243, 247);
}

.chatPanel .chatContent {
    padding: 10px;
    width: 100%;
    overflow: hidden;
    position: relative;
}

.chatItem {
    padding: 4px 0px 10px;
    _background: none;
    _border: none;
}

.chatItemContent {
    cursor: pointer;
}

.cloudPannel {
    position: relative;
    _position: static;
}

.chatItem .time {
    margin: 0px auto 10px;
    padding: 2px 0px;
    border-radius: 20px;
    width: 140px;
    color: rgb(127, 127, 127);
    font-size: 12px;
    text-shadow: 0px 1px 0px #fff;
}

    .chatItem .time .timeBg {
        width: 27px;
        height: 1px;
        margin-top: 8px;
        background-color: rgb(180, 184, 189);
    }

.chatItem .avatar {
    border: 1px solid rgb(255, 255, 255);
    width: 38px;
    height: 38px;
    box-shadow: 0px 1px 0px #b3b6ba;
}

.chatItem .cloud {
    position: static;
    cursor: default;
    max-width: 300px;
}

.chatItem .cloud {
    margin: 0px;
    padding: 0px;
}

.chatItem .cloudContent {
    text-align: left;
    font-size: 14px;
    font-weight: normal;
    -ms-word-wrap: break-word;
    min-height: 20px;
}

.zoomIn {
    border-radius: 1px;
}

.zoomOut {
}

.chatPanel .cloud .text {
    padding: 5px;
}

.cloudMesg .cloudBody {
    border-radius: 7px;
    border: 1px solid rgb(151, 151, 151);
    background-color: rgb(239, 240, 244);
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
}

.chatPanel .cloud .file {
    border-radius: 6px;
    cursor: pointer;
    box-shadow: 0px 1px 3px #9e9e9e;
}

    .chatPanel .cloud .file a {
        height: 77px;
        display: block;
    }

        .chatPanel .cloud .file a:hover .name {
            color: rgb(84, 96, 114);
        }

    .chatPanel .cloud .file .fileIcon {
        margin: 0px;
        padding: 0px;
        border-radius: 3px 0px 0px 3px;
        width: 75px;
        height: 75px;
    }

        .chatPanel .cloud .file .fileIcon .fileImg {
            background: url("../Images/file_type17ced3.png") no-repeat -64px -64px;
            margin: 13px 0px 0px 14px;
            width: 45px;
            height: 50px;
            display: block;
        }

.chatPanel .cloud .fileOfWord .fileIcon .fileImg {
    background-position: -65px -3px;
}

.chatPanel .cloud .fileOfExcel .fileIcon .fileImg {
    background-position: -125px -5px;
}

.chatPanel .cloud .fileOfPowerPoint .fileIcon .fileImg {
    background-position: -185px -5px;
}

.chatPanel .cloud .fileOfMusic .fileIcon .fileImg {
    background-position: -245px -5px;
}

.chatPanel .cloud .fileOfPdf .fileIcon .fileImg {
    background-position: -4px -64px;
    width: 49px;
}

.chatPanel .cloud .fileOfLink .fileIcon .fileImg {
    background-position: -5px -5px;
}

.chatPanel .cloud .ffileOfPhoto .fileIcon .fileImg {
    background-position: -185px -5px;
}

.chatPanel .cloud .fileOfText .fileIcon .fileImg {
    background-position: -65px -64px;
}

.chatPanel .cloud .fileOfZip .fileIcon .fileImg {
    background-position: -124px -64px;
}

.chatPanel .cloud .file .fileIcon {
    border-width: 1px;
    border-style: solid;
    border-color: rgb(121, 101, 142) rgb(98, 71, 139) rgb(99, 85, 132) rgb(110, 92, 137);
    background-color: rgb(107, 90, 136);
}

.chatPanel .cloud .fileOfZip .fileIcon {
    border-width: 1px;
    border-style: solid;
    border-color: rgb(81, 125, 156) rgb(57, 97, 125) rgb(60, 104, 135) rgb(72, 116, 147);
    background-color: rgb(69, 113, 145);
}

.chatPanel .cloud .fileOfExcel .fileIcon {
    border-width: 1px;
    border-style: solid;
    border-color: rgb(72, 141, 61) rgb(56, 97, 44) rgb(53, 122, 71) rgb(64, 133, 65);
    background-color: rgb(62, 131, 66);
}

.chatPanel .cloud .fileOfPowerPoint .fileIcon {
    border-width: 1px;
    border-style: solid;
    border-color: rgb(190, 118, 16) rgb(151, 78, 34) rgb(177, 88, 9) rgb(187, 93, 10);
    background-color: rgb(188, 94, 10);
}

.chatPanel .cloud .fileOfMusic .fileIcon {
    border-width: 1px;
    border-style: solid;
    border-color: rgb(34, 143, 156) rgb(43, 117, 139) rgb(28, 128, 140) rgb(46, 139, 151);
    background-color: rgb(51, 143, 154);
}

.chatPanel .cloud .fileOfWord .fileIcon {
    border-width: 1px;
    border-style: solid;
    border-color: rgb(81, 125, 156) rgb(57, 97, 125) rgb(60, 104, 135) rgb(69, 112, 144);
    background-color: rgb(70, 114, 145);
}

.chatPanel .cloud .fileOfPdf .fileIcon {
    border-width: 1px;
    border-style: solid;
    border-color: rgb(187, 79, 100) rgb(154, 64, 81) rgb(161, 58, 80) rgb(176, 66, 89);
    background-color: rgb(175, 66, 88);
}

.chatPanel .cloud .fileOfLink .fileIcon {
    border-width: 1px;
    border-style: solid;
    border-color: rgb(65, 132, 181) rgb(48, 104, 139) rgb(50, 118, 171) rgb(44, 113, 167);
    background-color: rgb(45, 114, 168);
}

.chatPanel .cloud .fileOfPhoto .fileIcon {
    border-width: 1px;
    border-style: solid;
    border-color: rgb(32, 147, 140) rgb(18, 101, 101) rgb(29, 125, 117) rgb(30, 129, 126);
    background-color: rgb(30, 125, 122);
}

.chatPanel .cloud .fileOfText .fileIcon {
    border-width: 1px;
    border-style: solid;
    border-color: rgb(121, 101, 142) rgb(98, 71, 139) rgb(99, 85, 132) rgb(110, 92, 137);
    background-color: rgb(107, 90, 136);
}

.chatPanel .cloud .fileOfZip .fileIcon {
    border-width: 1px;
    border-style: solid;
    border-color: rgb(112, 139, 150) rgb(85, 111, 123) rgb(88, 112, 123) rgb(101, 127, 137);
    background-color: rgb(101, 127, 137);
}

.chatPanel .cloud .file .info {
    border-width: 1px 1px 1px medium;
    border-style: solid solid solid none;
    border-color: rgb(151, 151, 151) rgb(151, 151, 151) rgb(151, 151, 151) currentColor;
    padding: 15px 10px 20px 9px;
    border-radius: 0px 3px 3px 0px;
    width: 103px;
    height: 40px;
    background-color: rgb(239, 240, 244);
    -moz-border-radius: 0px 3px 3px 0px;
    -webkit-border-radius: 0px 3px 3px 0px;
}

.chatPanel .cloud .file .name {
    height: 16px;
    text-align: left;
    color: rgb(31, 37, 43);
    line-height: 1.2em;
    overflow: hidden;
    font-size: 13px;
    font-weight: bold;
    white-space: nowrap;
    -ms-text-overflow: ellipsis;
    max-width: 200px;
    -o-text-overflow: ellipsis;
}

.chatPanel .cloud .file .desc {
    text-align: left;
    color: rgb(86, 92, 97);
    padding-top: 8px;
    font-size: 12px;
    text-shadow: none;
}

.cloudVoice .replyVoice {
    position: absolute;
}

.systemTip {
    background: rgb(238, 238, 238);
    margin: 10px auto;
    padding: 8px 10px;
    border-radius: 4px;
    width: 300px;
    text-align: center;
    color: rgb(119, 119, 119);
    font-size: 12px;
    display: block;
    -ms-word-wrap: break-word;
    opacity: 0.4;
    text-shadow: none;
}

    .systemTip .verifyUniContacts {
        color: rgb(85, 85, 170);
        cursor: pointer;
    }

.chatItem .cloudMesg {
    border-radius: 6px;
    border: 1px solid rgb(151, 151, 151);
    width: 194px;
    box-shadow: 0px 1px 3px #9e9e9e;
    -moz-border-radius: 6px;
    -webkit-border-radius: 6px;
}

.chatItem .cloudMesgWord.cloudMesg {
    height: inherit;
}

.chatItem .cloudMesgImg.cloudMesg {
    width: inherit;
    height: inherit;
}

.chatItem .chatItemContent .cloudMesg .cloudBody {
    border-width: medium 9px medium medium;
    border-style: none solid none none;
    border-color: currentColor rgb(99, 163, 8) currentColor currentColor;
    border-radius: 5px;
}

.chatItem .cloudMesg .cloudContent {
    padding: 4px 7px 2px 0px;
    background-color: rgb(239, 240, 244);
}

.chatItem .cloudMesg .cloudMesgPanel {
    padding: 13px 10px;
    border-radius: 5px 0px 0px 5px;
    width: 90%;
    font-size: 14px;
    -moz-border-radius: 5px 0px 0px 5px;
    -webkit-border-radius: 5px 0px 0px 5px;
}

.chatItem .cloudMesgLink .cloudMesgPanel {
    padding: 0px 10px;
    border-radius: 5px 0px 0px 5px;
    width: 90%;
    font-size: 14px;
    -moz-border-radius: 5px 0px 0px 5px;
    -webkit-border-radius: 5px 0px 0px 5px;
}

.chatItem .cloudMesgFile .cloudMesgPanel {
    padding: 0px 10px;
    border-radius: 5px 0px 0px 5px;
    width: 90%;
    font-size: 14px;
    -moz-border-radius: 5px 0px 0px 5px;
    -webkit-border-radius: 5px 0px 0px 5px;
}

.chatItem .cloudMesg .cloudMesgPanel .cloudMesgContent p {
    width: 90px;
    height: 15px;
    color: rgb(31, 37, 43);
    line-height: 1em;
    overflow: hidden;
    white-space: nowrap;
    -ms-text-overflow: ellipsis;
    max-height: 29px;
    -o-text-overflow: ellipsis;
}

.chatItem .cloudMesg .cloudMesgPanel .cloudMesgContent span {
    width: 100%;
    height: 17px;
    color: rgb(86, 92, 97);
    overflow: hidden;
    font-size: 12px;
    margin-top: 0px;
    display: block;
    white-space: nowrap;
    -ms-text-overflow: ellipsis;
    -o-text-overflow: ellipsis;
}

.chatItem .cloudMesgWord .cloudContent {
    border-radius: 5px 0px 0px 5px;
    -moz-border-radius: 5px 0px 0px 5px;
    -webkit-border-radius: 5px 0px 0px 5px;
}

.chatItem .cloudMesgImg.cloudMesg .cloudMesgPanel .cloudMesgWordPanel {
    line-height: 0;
}

.chatItem .cloudMesg .cloudMesgPanel .cloudMesgWordPanel {
    margin: 0px;
    padding: 0px;
}

.chatItem .cloudMesg .cloudMesgPanel .cloudMesgLinkFilePanel {
    margin: 0px;
    padding: 0px;
}

.chatItem .cloudMesg .cloudMesgPanel .cloudMesgWordPanel p {
    -ms-word-break: break-all;
    -ms-word-wrap: break-word;
    max-width: 183px;
}

.chatItem .cloudMesgLink .cloudMesgLinkFilePanel .cloudMesgIcon {
    padding: 0px;
    width: 62px;
    height: 62px;
    margin-right: 13px;
    margin-left: -5px;
    box-shadow: 0px 1px 0px #fff;
}

.chatItem .cloudMesgFile .cloudMesgLinkFilePanel .cloudMesgIcon {
    padding: 0px;
    width: 62px;
    height: 62px;
    margin-right: 13px;
    margin-left: -5px;
    box-shadow: 0px 1px 0px #fff;
}

.chatItem .cloudMesgLink .cloudMesgLinkFilePanel .cloudMesgContent {
    padding: 0px;
    width: 90px;
    margin-top: 0px;
}

.chatItem .cloudMesgFile .cloudMesgLinkFilePanel .cloudMesgContent {
    padding: 0px;
    width: 90px;
    margin-top: 0px;
}

.chatListloadingMoreMsg.chatItem {
    top: 10px;
    display: none;
    position: absolute;
    z-index: 1;
}

    .chatListloadingMoreMsg.chatItem .systemTip {
        color: rgb(149, 152, 154);
        opacity: 1;
        background-color: rgb(231, 234, 236);
    }

.customEmoji {
    width: 100px;
}

.emojiPanel {
    position: absolute;
    z-index: 120;
    -ms-zoom: 1;
}

.bottle_mail .fast_rly .faceWrap {
    left: 15px;
    bottom: 94px;
}

.replyContainer .faceWrap {
    left: 68px;
    top: 14px;
    bottom: auto;
}

.replyContainer .touchWrap {
    left: 68px;
    top: 14px;
    bottom: auto;
}

.replyContainer .sendImgWrap {
    left: 68px;
    top: 14px;
    bottom: auto;
}

.replyContainer .trueBottleWrap {
    left: 68px;
    top: 14px;
    bottom: auto;
}

.penfriendWrap {
    left: 68px;
    top: 14px;
    bottom: auto;
}

.close_interact_wrap {
    left: 68px;
    top: 14px;
    bottom: auto;
}

.bottle_send .sendImgWrap {
    left: 20px;
    width: 406px;
    bottom: -2px;
}

.uploaded .selectPicPanel {
    display: none;
}

.faceBox {
    /*background: url("../Images/qqSmilies17ced3.png") no-repeat;*/
    width: 435px;
    overflow: hidden;
    clear: both;
    position: relative;
    cursor: pointer;
}

    .faceBox a {
        width: 28px;
        height: 28px;
        border-right-color: rgb(223, 230, 246);
        border-bottom-color: rgb(223, 230, 246);
        border-right-width: 1px;
        border-bottom-width: 1px;
        border-right-style: solid;
        border-bottom-style: solid;
        float: left;
        display: block;
    }
      .faceBox a img{
        width: 24px;
        height: 24px; 
    }

.facePreview {
    background: rgb(0, 138, 255);
    padding: 1px;
    border: 1px solid rgb(223, 230, 246);
    top: 0px;
    width: 53px;
    height: 0px;
    text-align: center;
    right: 1px;
    clear: both;
    position: absolute;
}

    .facePreview div {
        background: rgb(255, 255, 255);
        border: 1px solid rgb(229, 243, 255);
        padding-top: 6px;
    }

    .facePreview p {
        height: 28px;
        overflow: hidden;
        display: block !important;
    }

    .facePreview .faceName {
        background: rgb(241, 241, 241);
        height: 17px;
        color: rgb(153, 153, 153);
        line-height: 19px;
    }

.facePreviewLeft {
    left: 0px;
}

.cmtTip {
    -webkit-animation-name: opacity;
    -webkit-animation-duration: 0.3s;
    -webkit-animation-timing-function: ease-in-out;
}

.goTopBox {
    -webkit-animation-name: opacity;
    -webkit-animation-duration: 0.3s;
    -webkit-animation-timing-function: ease-in-out;
}

.D {
    -webkit-animation-name: opacity;
    -webkit-animation-duration: 0.3s;
    -webkit-animation-timing-function: ease-in-out;
}

.delChose {
    -webkit-animation-name: opacity;
    -webkit-animation-duration: 0.3s;
    -webkit-animation-timing-function: ease-in-out;
}

.faceWrap {
    -webkit-animation-name: opacity;
    -webkit-animation-duration: 0.3s;
    -webkit-animation-timing-function: ease-in-out;
}

.vloadWrap {
    -webkit-animation-name: opacity;
    -webkit-animation-duration: 0.3s;
    -webkit-animation-timing-function: ease-in-out;
}

.mloadWrap {
    -webkit-animation-name: opacity;
    -webkit-animation-duration: 0.3s;
    -webkit-animation-timing-function: ease-in-out;
}

.badgeTips {
    -webkit-animation-name: opacity;
    -webkit-animation-duration: 0.3s;
    -webkit-animation-timing-function: ease-in-out;
}

.atWrap {
    -webkit-animation-name: opacity;
    -webkit-animation-duration: 0.3s;
    -webkit-animation-timing-function: ease-in-out;
}

.faceWrap {
    border: 1px solid rgb(202, 200, 200);
    position: absolute;
    z-index: 20;
    box-shadow: 1px 1px 3px rgba(0,0,0,0.2);
    background-color: rgb(255, 255, 255);
    -moz-box-shadow: 1px 1px 2px #CAC8C8;
    -o-box-shadow: 1px 1px 2px #CAC8C8;
    -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);
    -ms-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);
}

.touchWrap {
    border: 1px solid rgb(202, 200, 200);
    position: absolute;
    z-index: 20;
    box-shadow: 1px 1px 3px rgba(0,0,0,0.2);
    background-color: rgb(255, 255, 255);
    -moz-box-shadow: 1px 1px 2px #CAC8C8;
    -o-box-shadow: 1px 1px 2px #CAC8C8;
    -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);
    -ms-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);
}

.sendImgWrap {
    border: 1px solid rgb(202, 200, 200);
    position: absolute;
    z-index: 20;
    box-shadow: 1px 1px 3px rgba(0,0,0,0.2);
    background-color: rgb(255, 255, 255);
    -moz-box-shadow: 1px 1px 2px #CAC8C8;
    -o-box-shadow: 1px 1px 2px #CAC8C8;
    -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);
    -ms-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);
}

.trueBottleWrap {
    border: 1px solid rgb(202, 200, 200);
    position: absolute;
    z-index: 20;
    box-shadow: 1px 1px 3px rgba(0,0,0,0.2);
    background-color: rgb(255, 255, 255);
    -moz-box-shadow: 1px 1px 2px #CAC8C8;
    -o-box-shadow: 1px 1px 2px #CAC8C8;
    -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);
    -ms-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);
}

.penfriendWrap {
    border: 1px solid rgb(202, 200, 200);
    position: absolute;
    z-index: 20;
    box-shadow: 1px 1px 3px rgba(0,0,0,0.2);
    background-color: rgb(255, 255, 255);
    -moz-box-shadow: 1px 1px 2px #CAC8C8;
    -o-box-shadow: 1px 1px 2px #CAC8C8;
    -webkit-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);
    -ms-box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);
}

.faceWrap {
    padding: 46px 20px 20px;
    border-radius: 3px;
    border: 1px solid rgb(159, 160, 160);
    left: 5px;
    width: 434px;
    bottom: 4px;
    margin-bottom: 88px;
    position: absolute;
    z-index: 0;
    -ms-overflow-y: hidden;
    box-shadow: 0px 0px 6px rgba(94,89,89,0.57);
    background-color: rgb(255, 255, 255);
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    _height: 150px;
    -moz-box-shadow: 0px 0px 6px rgba(94, 89, 89, 0.57);
    -o-box-shadow: 0px 0px 6px rgba(94, 89, 89, 0.57);
    -webkit-box-shadow: 0px 0px 6px rgba(94, 89, 89, 0.57);
    -ms-box-shadow: 0px 0px 6px rgba(94, 89, 89, 0.57);
}

    .faceWrap .tips_arrow {
        left: 33px;
    }

    .faceWrap .rabbitContent {
        height: 153px;
        margin-right: -20px;
        margin-bottom: -1px;
        margin-left: -5px;
        -ms-overflow-y: auto;
    }

    .faceWrap .rabbitPanel {
        background: url("../Images/tusiji_expression17ced3.png") no-repeat;
        height: 352px;
        padding-left: 2px;
    }

    .faceWrap .rabbitBox a {
        width: 75px;
        height: 78px;
        margin-right: 16px;
        margin-bottom: 13px;
        border-right-color: currentColor;
        border-bottom-color: currentColor;
        border-right-width: medium;
        border-bottom-width: medium;
        border-right-style: none;
        border-bottom-style: none;
        float: left;
        display: block;
    }

        .faceWrap .rabbitBox a:hover {
            background: url("../Images/46017ced3.gif") no-repeat 0% 0% / 75px 77px;
            -webkit-background-size: 75px 77px;
            -moz-background-size: 75px 77px;
        }

.emojiPanel a.faceCloseIcon {
    background: url("../Images/button_chat1832d7.png") no-repeat -3px -846px;
    top: -304px;
    width: 28px;
    height: 27px;
    position: absolute;
    z-index: 10;
}

    .emojiPanel a.faceCloseIcon:hover {
        background: url("../Images/button_chat1832d7.png") no-repeat -37px -846px;
    }

    .emojiPanel a.faceCloseIcon:active {
        background: url("../Images/button_chat1832d7.png") no-repeat -71px -846px;
    }

.emojiPanel a:hover {
    cursor: pointer;
}

.emojiPanel .faceTriangle {
    top: -67px;
    width: 20px;
    height: 20px;
    margin-left: 14px;
    display: none;
    position: absolute;
    z-index: 10;
}

.emojiPanel .faceTrianglePanel {
    margin: 0px;
    padding: 0px;
    position: relative;
}

.emojiPanel .faceTriangle .faceTriangle1 {
    border-width: 8px;
    border-style: solid;
    border-color: rgb(211, 208, 208) transparent transparent;
    left: 0px;
    top: 1px;
    position: absolute;
}

.emojiPanel .faceTriangle .faceTriangle2 {
    border-width: 8px;
    border-style: solid;
    border-color: rgb(246, 248, 251) transparent transparent;
    left: 0px;
    top: 0px;
    position: absolute;
}

.faceWrap .emojiBox {
    height: 195px;
}

    .faceWrap .emojiBox .emojiContent {
        margin: 7px -20px 12px 0px;
        top: -7px;
        height: 203px;
        position: relative;
        -ms-overflow-y: auto;
    }

.emojiBox .emojiContent .emojiFacePanel {
    background: url("../Images/emojiPanel17ced3.png") no-repeat;
    height: 368px;
}

.faceWrap .emojiBox a {
    width: 28px;
    height: 28px;
    border-right-color: rgb(223, 230, 246);
    border-bottom-color: rgb(223, 230, 246);
    border-right-width: 1px;
    border-bottom-width: 1px;
    border-right-style: solid;
    border-bottom-style: solid;
    float: left;
    display: block;
}

.faceWrap a.borderRightNone {
    margin-right: 0px;
    border-right-color: currentColor;
    border-right-width: medium;
    border-right-style: none;
}

.faceWrap a.borderBottomNone {
    border-bottom-color: currentColor;
    border-bottom-width: medium;
    border-bottom-style: none;
}

.faceWrap .faceWrapFooter {
    margin: 10px 0px 0px;
    position: relative;
}

ul.faceTab {
    font: bold 12px/normal verdana, arial;
    margin: 0px 0px 0px 5px;
    border-radius: 3px 3px 0px 0px;
    width: 457px;
    height: 6px;
    bottom: 331px;
    padding-bottom: 23px;
    padding-left: 17px;
    border-bottom-color: rgb(213, 213, 213);
    border-left-color: rgb(202, 200, 200);
    border-bottom-width: 1px;
    border-left-width: 1px;
    border-bottom-style: solid;
    border-left-style: solid;
    list-style-type: none;
    position: relative;
    z-index: 10;
    font-size-adjust: none;
    font-stretch: normal;
    background-color: rgb(246, 246, 246);
    -moz-border-radius: 3px 3px 0px 0px;
    -webkit-border-radius: 3px 3px 0px 0px;
}

    ul.faceTab li {
        margin: 0px;
        height: 29px;
        float: left;
        background-color: rgb(246, 248, 251);
    }

    ul.faceTab a:link {
        padding: 5px 10px 3px;
        color: rgb(107, 107, 107);
        line-height: 21px;
        font-family: Helvetica, Arial, "ËÎÌå", sans-serif;
        font-size: 12px;
        font-weight: normal;
        text-decoration: none;
        border-right-color: transparent;
        border-left-color: transparent;
        border-right-width: 1px;
        border-left-width: 1px;
        border-right-style: solid;
        border-left-style: solid;
        display: block;
    }

    ul.faceTab a:visited {
        padding: 5px 10px 3px;
        color: rgb(107, 107, 107);
        line-height: 21px;
        font-family: Helvetica, Arial, "ËÎÌå", sans-serif;
        font-size: 12px;
        font-weight: normal;
        text-decoration: none;
        border-right-color: transparent;
        border-left-color: transparent;
        border-right-width: 1px;
        border-left-width: 1px;
        border-right-style: solid;
        border-left-style: solid;
        display: block;
    }

.rabbitBox a.r11:hover {
    background: url("../Images/emoji/rabbit/icon_00217ced3.gif") no-repeat 5px 10px rgb(233, 236, 239);
}

.rabbitBox a.r12:hover {
    background: url("../Images/emoji/rabbit/icon_00717ced3.gif") no-repeat 5px 10px rgb(233, 236, 239);
}

.rabbitBox a.r13:hover {
    background: url("../Images/emoji/rabbit/icon_01017ced3.gif") no-repeat 5px 10px rgb(233, 236, 239);
}

.rabbitBox a.r14:hover {
    background: url("../Images/emoji/rabbit/icon_01217ced3.gif") no-repeat 5px 10px rgb(233, 236, 239);
}

.rabbitBox a.r15:hover {
    background: url("../Images/emoji/rabbit/icon_01317ced3.gif") no-repeat 5px 10px rgb(233, 236, 239);
}

.rabbitBox a.r21:hover {
    background: url("../Images/emoji/rabbit/icon_01817ced3.gif") no-repeat 5px 10px rgb(233, 236, 239);
}

.rabbitBox a.r22:hover {
    background: url("../Images/emoji/rabbit/icon_01917ced3.gif") no-repeat 5px 10px rgb(233, 236, 239);
}

.rabbitBox a.r23:hover {
    background: url("../Images/emoji/rabbit/icon_02117ced3.gif") no-repeat 5px 10px rgb(233, 236, 239);
}

.rabbitBox a.r24:hover {
    background: url("../Images/emoji/rabbit/icon_02217ced3.gif") no-repeat 5px 10px rgb(233, 236, 239);
}

.rabbitBox a.r25:hover {
    background: url("../Images/emoji/rabbit/icon_02417ced3.gif") no-repeat 5px 10px rgb(233, 236, 239);
}

.rabbitBox a.r31:hover {
    background: url("../Images/emoji/rabbit/icon_02717ced3.gif") no-repeat 5px 10px rgb(233, 236, 239);
}

.rabbitBox a.r32:hover {
    background: url("../Images/emoji/rabbit/icon_02917ced3.gif") no-repeat 5px 10px rgb(233, 236, 239);
}

.rabbitBox a.r33:hover {
    background: url("../Images/emoji/rabbit/icon_03017ced3.gif") no-repeat 5px 10px rgb(233, 236, 239);
}

.rabbitBox a.r34:hover {
    background: url("../Images/emoji/rabbit/icon_03517ced3.gif") no-repeat 5px 10px rgb(233, 236, 239);
}

.rabbitBox a.r35:hover {
    background: url("../Images/emoji/rabbit/icon_04017ced3.gif") no-repeat 5px 10px rgb(233, 236, 239);
}

.rabbitBox a.r41:hover {
    background: url("../Images/emoji/rabbit/icon_02017ced3.gif") no-repeat 5px 10px rgb(233, 236, 239);
}

ul.faceTab a.chooseFaceTab {
    border-width: medium 1px 1px;
    border-style: none solid solid;
    border-color: currentColor rgb(213, 213, 213) rgb(255, 255, 255);
    background-color: rgb(255, 255, 255);
}

.faceWrap .faceBox .borderRight {
    border-right-color: currentColor;
    border-right-width: medium;
    border-right-style: none;
}

.faceWrap .faceBox .borderBottom {
    border-bottom-color: currentColor;
    border-bottom-width: medium;
    border-bottom-style: none;
}

.faceWrap .faceWrapFooter .changePointPannel {
    margin: 20px auto 0px;
    width: 36px;
    height: 12px;
}

.faceWrap .point1 a {
    background: url("../Images/button_chat1832d7.png") no-repeat -13px -1108px;
    width: 10px;
    height: 10px;
    float: left;
    display: block;
    cursor: pointer;
}

.faceWrap .point2 a {
    background: url("../Images/button_chat1832d7.png") no-repeat -13px -1108px;
    width: 10px;
    height: 10px;
    float: left;
    display: block;
    cursor: pointer;
}

.faceWrap .point3 a {
    background: url("../Images/button_chat1832d7.png") no-repeat -13px -1108px;
    width: 10px;
    height: 10px;
    float: left;
    display: block;
    cursor: pointer;
}

.faceWrap .point1 a:hover {
    background-position: -1px -1108px;
}

.faceWrap .point2 a:hover {
    background-position: -1px -1108px;
}

.faceWrap .point3 a:hover {
    background-position: -1px -1108px;
}

.faceWrap .postLocalFace {
    margin: 4px 0px -7px;
    height: 24px;
    float: right;
}

    .faceWrap .postLocalFace .postLocalFaceMiddle {
        border-radius: 12px;
        width: 120px;
        height: 20px;
        border-top-color: rgb(218, 224, 229);
        border-bottom-color: rgb(255, 255, 255);
        border-top-width: 1px;
        border-bottom-width: 1px;
        border-top-style: solid;
        border-bottom-style: solid;
        background-color: rgb(233, 237, 242);
        -moz-border-radius: 12px;
        -webkit-border-radius: 12px;
    }

        .faceWrap .postLocalFace .postLocalFaceMiddle a {
            height: 20px;
            line-height: 20px;
            overflow: hidden;
            text-shadow: none;
        }

    .faceWrap .postLocalFace a {
        width: 120px;
        color: rgb(143, 150, 158);
        float: left;
    }

        .faceWrap .postLocalFace a:hover {
            text-decoration: underline;
        }

    .faceWrap .postLocalFace .postLocalFaceMiddle .faceHook {
        border-width: 5px;
        border-style: solid;
        border-color: rgb(233, 237, 242) rgb(233, 237, 242) rgb(139, 144, 150);
        margin: 3px 9px 0px;
        width: 0px;
        height: 0px;
        float: left;
    }

.slidePic {
    float: left;
    position: absolute;
}

    .slidePic a.iconClose {
        border-radius: 0px 0px 0px 138px;
        top: 0px;
        width: 50px;
        height: 50px;
        right: 0px;
        position: fixed;
        background-color: rgb(57, 57, 57);
        -moz-border-radius: 0px 0px 0px 138px;
        -webkit-border-radius: 0px 0px 0px 138px;
    }

    .slidePic .iconClose span {
        background: url("../Images/button0217ced3.png") no-repeat -38px -37px;
        margin: 10px 5px 0px 0px;
        width: 34px;
        height: 34px;
        float: right;
        display: block;
    }

    .slidePic img {
        z-index: 49;
        cursor: move;
        box-shadow: 0px 4px 30px #333;
    }

.chatPanel .dragUploaderPanel {
    margin: -189px 0px 0px;
}

    .chatPanel .dragUploaderPanel .close {
        right: 5px;
        font-size: 14px;
        position: absolute;
    }

    .chatPanel .dragUploaderPanel div {
        background: url("../Images/illustration_chat17ced3.png") no-repeat 0px -407px;
        width: 100%;
        height: 135px;
        text-align: center;
        color: rgb(83, 110, 130);
        line-height: 170px;
        text-shadow: 0px 1px 0px #cfcfcf;
    }

    .chatPanel .dragUploaderPanel .dragUploaderIcon {
        background: url("../Images/illustration_chat17ced3.png") no-repeat 0px -170px;
        left: 180px;
        top: -108px;
        width: 108px;
        height: 108px;
        display: block;
        position: absolute;
    }

.chatPanel .inputArea {
    padding: 14px 10px 0px 5px;
    height: 43px;
}

    .chatPanel .inputArea .attach {
        float: left;
    }

        .chatPanel .inputArea .attach a.func {
            background: url("../Images/button_chat1832d7.png") no-repeat 0px 0px;
            width: 34px;
            height: 34px;
            text-decoration: none;
            margin-right: 2px;
            float: left;
            display: block;
        }

        .chatPanel .inputArea .attach a.expression:link {
            background-position: 3px -1px;
        }

        .chatPanel .inputArea .attach a.expression:visited {
            background-position: 3px -1px;
        }

        .chatPanel .inputArea .attach a.expression:hover {
            background-position: -29px -1px;
            border: currentColor;
        }

        .chatPanel .inputArea .attach a.expression:active {
            background-position: -61px -1px;
        }

        .chatPanel .inputArea .attach a.sendVoice:link {
            background-position: -1px -66px;
        }

        .chatPanel .inputArea .attach a.sendVoice:visited {
            background-position: -1px -66px;
        }

        .chatPanel .inputArea .attach a.sendVoice:hover {
            background-position: -33px -66px;
        }

        .chatPanel .inputArea .attach a.sendVoice:active {
            background-position: -65px -66px;
        }

        .chatPanel .inputArea .attach a.photoActive:link {
            background-position: -4px -34px;
        }

        .chatPanel .inputArea .attach a.photoActive:visited {
            background-position: -4px -34px;
        }

        .chatPanel .inputArea .attach a.photoActive:hover {
            background-position: -32px -34px;
            cursor: pointer;
        }

        .chatPanel .inputArea .attach a.photoActive:active {
            background-position: -64px -34px;
        }

        .chatPanel .inputArea .attach a.screensnap:link {
            background-position: -1px -98px;
        }

        .chatPanel .inputArea .attach a.screensnap:visited {
            background-position: -1px -98px;
        }

        .chatPanel .inputArea .attach a.screensnap:hover {
            background-position: -32px -98px;
        }

        .chatPanel .inputArea .attach a.screensnap:active {
            background-position: -62px -98px;
        }

        .chatPanel .inputArea .attach a.file:link {
            background-position: 0px -34px;
        }

        .chatPanel .inputArea .attach a.file:visited {
            background-position: 0px -34px;
        }

        .chatPanel .inputArea .attach a.file:hover {
            background-position: -31px -34px;
        }

        .chatPanel .inputArea .attach a.file:active {
            background-position: -64px -34px;
        }

.chatPanel .chatInput {
    background: rgb(250, 250, 250);
    font: 14px/1.2em Helvetica, "Î¢ÈíÑÅºÚ", "ºÚÌå", Arial, Tahoma;
    margin: 0px 10px;
    padding: 7px 10px 2px;
    border-radius: 2px;
    border: 1px solid rgb(204, 204, 204);
    width: 400px;
    height: 20px;
    float: left;
    font-size-adjust: none;
    font-stretch: normal;
    box-shadow: inset 1px 1px 2px #bbb;
    resize: none;
}

    .chatPanel .chatInput:focus {
        background: rgb(255, 255, 255);
    }

.chatPanel .chatOperator {
    border-radius: 0px 0px 4px 4px;
    height: 55px;
    text-align: left;
    color: rgb(56, 62, 69);
    border-top-color: rgb(128, 131, 132);
    border-bottom-color: rgb(221, 221, 221);
    border-top-width: 1px;
    border-bottom-width: 1px;
    border-top-style: solid;
    border-bottom-style: solid;
    position: relative;
    background-color: rgb(234, 236, 238);
    -moz-border-radius: 0 0 4px 4px;
    -webkit-border-radius: 0 0 4px 4px;
}

a.chatSend {
 background: rgb(72, 108, 180);
margin: 0px 1px 1px 0px;
border-radius: 2px;
border: 1px solid rgb(41, 68, 126);
width: 120px;
height: 28px;
text-align: center;
color: rgb(255, 255, 255);
text-decoration: none;
float: right;
display: block;
box-shadow: 0px 1px 3px #d9d9d9;
text-shadow: 0px 1px 1px #444;
-moz-border-radius: 2px;
-webkit-border-radius: 2px;
line-height: 28px;
}

    a.chatSend:active {
        background: rgb(95, 120, 171);
        border: 1px solid rgb(27, 74, 178);
        color: rgb(255, 255, 255);
        box-shadow: 0px 1px 3px #d3d3d3;
        text-shadow: 0px 1px 1px #444;
    }

    a.chatSend b {
        border-radius: 3px;
        text-align: center;
        line-height: 28px;
        font-size: 14px;
        border-top-color: rgb(123, 143, 184);
        border-top-width: 1px;
        border-top-style: solid;
        display: block;
        text-shadow: 0px -1px 0px #4f739f;
    }

.chatPanel .chatMainPanel {
    border-radius: 2px 2px 6px 6px;
    width: 100%;
    position: absolute;
}

.chatPanel .chatOperator a.chatSend:active b {
    border-top-color: rgb(95, 120, 171);
    border-top-width: 1px;
    border-top-style: solid;
}

.chatDetails {
    border-radius: 6px 6px 0px 0px;
    width: 100%;
    position: absolute;
    -moz-border-radius: 6px 6px 0px 0px;
    -webkit-border-radius: 6px 6px 0px 0px;
}

    .chatDetails .chatDetailsContent {
        margin: 0px;
        padding: 0px;
        border-radius: 0px 0px 6px 6px;
        background-color: rgb(255, 255, 255);
        -moz-border-radius: 0px 0px 6px 6px;
        -webkit-border-radius: 0px 0px 6px 6px;
    }

        .chatDetails .chatDetailsContent .chatDetailsTitle {
            border-radius: 3px;
            border: 1px solid rgb(222, 222, 222);
            height: 33px;
            margin-top: -53px;
            margin-bottom: 56px;
        }

            .chatDetails .chatDetailsContent .chatDetailsTitle input {
                font: 14px/30px Helvetica, "Microsoft YaHei", Arial, Tahoma;
                border: currentColor;
                left: 1px;
                top: 1px;
                width: 218px;
                height: 30px;
                text-align: center;
                color: rgb(101, 104, 110);
                position: absolute;
                font-size-adjust: none;
                font-stretch: normal;
            }

        .chatDetails .chatDetailsContent .groupName {
            background: url("../Images/button_chat1832d7.png") no-repeat -105px -1235px;
            margin: 10px 0px 0px 13px;
            width: 20px;
            height: 20px;
            display: none;
        }

        .chatDetails .chatDetailsContent h3 {
            background: rgb(236, 236, 236);
            padding: 0px 5px;
            height: 32px;
            text-align: left;
            line-height: 32px;
            border-top-color: white;
            border-right-color: rgb(217, 217, 217);
            border-top-width: 1px;
            border-right-width: 1px;
            border-top-style: solid;
            border-right-style: solid;
        }

        .chatDetails .chatDetailsContent .partiTitleName {
            padding: 0px 10px;
            width: 200px;
            height: 32px;
            color: rgb(101, 104, 110);
            line-height: 33px;
            overflow: hidden;
            border-top-color: white;
            border-left-color: white;
            border-top-width: 1px;
            border-left-width: 1px;
            border-top-style: solid;
            border-left-style: solid;
            white-space: nowrap;
            cursor: pointer;
            -ms-word-wrap: normal;
            -ms-text-overflow: ellipsis;
            background-color: rgb(249, 249, 249);
            -o-text-overflow: ellipsis;
        }

            .chatDetails .chatDetailsContent .partiTitleName .emoji {
                margin-top: 5px;
            }

            .chatDetails .chatDetailsContent .partiTitleName:hover {
                background: rgb(236, 236, 236);
            }

            .chatDetails .chatDetailsContent .partiTitleName input {
                font: 15px/30px Helvetica, "Microsoft YaHei", Arial, Tahoma;
                border: currentColor;
                left: 0px;
                top: 0px;
                width: 207px;
                height: 30px;
                position: absolute;
                font-size-adjust: none;
                font-stretch: normal;
            }

    .chatDetails .exitGroup {
        border-radius: 3px;
        border: 1px solid rgb(222, 222, 222);
        width: 146px;
        height: 33px;
        margin-top: 3px;
        margin-bottom: 2px;
        display: none;
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
    }

    .chatDetails .exitGroupPanel {
        margin: 0px;
        padding: 0px;
        border-top-color: rgb(255, 255, 255);
        border-top-width: 1px;
        border-top-style: solid;
    }

        .chatDetails .exitGroupPanel .exitGroupIcon {
            background: url("../Images/button_chat1832d7.png") no-repeat -144px -1224px rgb(236, 236, 236);
            width: 38px;
            height: 32px;
            border-right-color: rgb(217, 217, 217);
            border-right-width: 1px;
            border-right-style: solid;
            border-top-left-radius: 3px;
            border-bottom-left-radius: 3px;
            -webkit-border-bottom-left-radius: 3px;
            -moz-border-radius-bottomleft: 3px;
            -webkit-border-top-left-radius: 3px;
            -moz-border-radius-topleft: 3px;
        }

        .chatDetails .exitGroupPanel .exitGroupWorld {
            width: 106px;
            height: 32px;
            text-align: center;
            color: rgb(101, 104, 110);
            line-height: 32px;
            border-left-color: rgb(255, 255, 255);
            border-left-width: 1px;
            border-left-style: solid;
            border-top-right-radius: 3px;
            border-bottom-right-radius: 3px;
            text-shadow: 0px 1px 0px #fff;
            background-color: rgb(247, 247, 247);
            -webkit-border-bottom-right-radius: 3px;
            -moz-border-radius-bottomright: 3px;
            -webkit-border-top-right-radius: 3px;
            -moz-border-radius-topright: 3px;
        }

        .chatDetails .exitGroupPanel a.exitGroupWorld:hover {
            text-decoration: none;
            background-color: rgb(236, 236, 236);
        }

    .chatDetails .section {
        padding: 70px 10px 16px;
        overflow: hidden;
    }

        .chatDetails .section span {
        }

    .chatDetails .participant {
        margin: 10px 12px 0px;
        padding: 14px 3px 14px 22px;
        border: 1px solid rgb(227, 231, 237);
        -ms-overflow-y: auto;
        background-color: rgb(246, 249, 252);
    }

        .chatDetails .participant .contr {
            padding-top: 10px;
        }

    .chatDetails .chatPerson {
        border: 1px solid rgb(219, 227, 237);
        height: 128px;
        margin-right: 12px;
        margin-bottom: 7px;
        position: relative;
        box-shadow: 0px 1px 1px #eef1f4;
        background-color: rgb(255, 255, 255);
    }

        .chatDetails .chatPerson a {
            padding: 10px;
            line-height: 0;
            display: block;
        }

        .chatDetails .chatPerson:hover {
            background-color: rgb(229, 234, 239);
        }

        .chatDetails .chatPerson .personClose {
            display: none;
        }

        .chatDetails .chatPerson:hover .personClose {
            background: url("../Images/button_chat1832d7.png") no-repeat 1px -813px;
            top: 0px;
            width: 12px;
            height: 12px;
            right: 0px;
            margin-top: -11px;
            margin-right: -16px;
            display: block;
            position: absolute;
        }

            .chatDetails .chatPerson:hover .personClose:hover {
                background: url("../Images/button_chat1832d7.png") no-repeat -34px -813px;
            }

        .chatDetails .chatPerson img {
            width: 80px;
            height: 80px;
        }

        .chatDetails .chatPerson .participantName {
            margin: 0px 10px;
            width: 80px;
            text-align: center;
            color: rgb(90, 89, 89);
            overflow: hidden;
            white-space: nowrap;
            -ms-word-wrap: normal;
            -ms-text-overflow: ellipsis;
            o-text-overflow: ellipsis;
        }

        .chatDetails .chatPerson .participantFemale {
            background: url("../Images/button_chat1832d7.png") no-repeat;
            width: 20px;
            height: 20px;
            margin-top: -2px;
            float: left;
        }

        .chatDetails .chatPerson .participantMale {
            background: url("../Images/button_chat1832d7.png") no-repeat;
            width: 20px;
            height: 20px;
            margin-top: -2px;
            float: left;
        }

        .chatDetails .chatPerson .participantFemale {
            background-position: -79px -1232px;
        }

        .chatDetails .chatPerson .participantMale {
            background-position: -60px -1232px;
        }

    .chatDetails .addButton {
        border: 1px dashed rgb(208, 208, 208);
        width: 100px;
        height: 128px;
        cursor: pointer;
    }

        .chatDetails .addButton:hover {
            background-color: rgb(229, 234, 239);
        }

        .chatDetails .addButton a {
            background: url("../Images/button_chat1832d7.png") no-repeat -4px -1010px;
            margin: 48px auto;
            padding: 0px;
            width: 28px;
            height: 30px;
            display: block;
        }

        .chatDetails .addButton:hover a {
            background-position: -34px -1010px;
        }

.chatPanel .chatScroll {
    border-bottom-color: rgb(221, 221, 221);
    border-bottom-width: 1px;
    border-bottom-style: solid;
}

.wx_ico_video {
    background: url("../Images/ico_video17ced3.png") no-repeat;
    margin: -18px 0px 0px -18px;
    left: 50%;
    top: 50%;
    width: 36px;
    height: 36px;
    display: inline-block;
    position: absolute;
    z-index: 3;
    cursor: pointer;
    opacity: 0.8;
    _background: none;
    -moz-transition: opacity 0.1s ease-in;
    -webkit-transition: opacity 0.1s ease-in;
    -o-transition: opacity 0.1s ease-in;
}

    .wx_ico_video:hover {
        filter:;
        opacity: 1;
    }

.wx_video_duration {
    background: rgba(0, 0, 0, 0.6);
    border-radius: 0px 0px 1px 1px;
    text-align: right;
    color: rgb(255, 255, 255);
    line-height: 20px;
    padding-right: 8px;
    margin-top: -20px;
    position: relative;
    z-index: 3;
    text-shadow: none;
    _margin-right: 1px;
}

.footer {
    background: url("../Images/button_login17ced3.png") no-repeat -12px -181px;
    left: 50%;
    width: 376px;
    bottom: 20px;
    color: rgb(36, 38, 39);
    margin-left: -188px;
    position: absolute;
    text-shadow: 0px 1px 0px #5b5c5e;
}

    .footer .recommend_wrp {
        top: -100px;
        width: 100%;
        position: absolute;
    }

        .footer .recommend_wrp a {
            color: rgb(156, 161, 164);
            font-size: 12px;
            text-shadow: 0px 1px 0px #000;
        }

            .footer .recommend_wrp a:hover {
                color: rgb(255, 255, 255);
                text-decoration: none;
            }

a.icon_faq {
    margin: 0px auto;
    width: 37px;
    display: block;
}

    a.icon_faq img {
        background: url("../Images/button_login17ced3.png") no-repeat 0px -1px;
        width: 37px;
        height: 37px;
    }

    a.icon_faq:active img {
        background-position: -38px -2px;
    }

.chatPanel .activeChatVernier {
    top: 153px;
    width: 34px;
    position: absolute;
}

    .chatPanel .activeChatVernier img {
        background: url("../Images/icon_chat17ced3.png") no-repeat -8px -40px;
        width: 16px;
        height: 16px;
        _margin-left: -20px;
        _margin-top: 50px;
    }

.iconOperater {
    background: url("../Images/button0217ced3.png") no-repeat -2px -96px;
    top: 14px;
    width: 12px;
    height: 12px;
    right: 10px;
    text-indent: -9999px;
    display: block;
    position: absolute;
}

a.iconOperater:active {
    background-position: -17px -96px;
}

.operaterBox {
    padding: 0px;
    border-radius: 3px;
    border: 1px solid rgb(162, 172, 180);
    top: 43px;
    width: 140px;
    right: 2px;
    position: absolute;
    z-index: 999;
    box-shadow: 0px 1px 7px #8d8d8d;
    background-color: rgb(255, 255, 255);
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}

    .operaterBox .operaterBoxPanel {
        position: relative;
    }

        .operaterBox .operaterBoxPanel a.iconLogout {
            margin: 0px;
            padding: 7px 2px 6px 9px;
            color: rgb(0, 0, 0);
            line-height: 21px;
            font-size: 12px;
            border-bottom-color: rgb(192, 197, 201);
            border-bottom-width: 1px;
            border-bottom-style: solid;
            display: block;
        }

        .operaterBox .operaterBoxPanel a.voiceCancel {
            margin: 0px;
            padding: 7px 2px 6px 9px;
            color: rgb(0, 0, 0);
            line-height: 21px;
            font-size: 12px;
            border-bottom-color: rgb(192, 197, 201);
            border-bottom-width: 1px;
            border-bottom-style: solid;
            display: block;
        }

        .operaterBox .operaterBoxPanel a.DesktopRemind {
            margin: 0px;
            padding: 7px 2px 6px 9px;
            color: rgb(0, 0, 0);
            line-height: 21px;
            font-size: 12px;
            border-bottom-color: rgb(192, 197, 201);
            border-bottom-width: 1px;
            border-bottom-style: solid;
            display: block;
        }

        .operaterBox .operaterBoxPanel a.addFriends {
            margin: 0px;
            padding: 7px 2px 6px 9px;
            color: rgb(0, 0, 0);
            line-height: 21px;
            font-size: 12px;
            border-bottom-color: rgb(192, 197, 201);
            border-bottom-width: 1px;
            border-bottom-style: solid;
            display: block;
        }

    .operaterBox a.feedback {
        margin: 0px;
        padding: 7px 2px 6px 9px;
        color: rgb(0, 0, 0);
        line-height: 21px;
        font-size: 12px;
        border-bottom-color: rgb(192, 197, 201);
        border-bottom-width: 1px;
        border-bottom-style: solid;
        display: block;
    }

    .operaterBox .operaterBoxPanel a.iconLogout {
        border: currentColor;
    }

    .operaterBox .operaterBoxPanel a:active {
        color: rgb(255, 255, 255);
        text-shadow: none;
        background-color: rgb(25, 96, 174);
    }

    .operaterBox .operaterBoxPanel .iconPic {
        background: url("../Images/button_chat1832d7.png") no-repeat;
        width: 20px;
        height: 20px;
        margin-right: 6px;
        margin-left: 6px;
    }

    .operaterBox .operaterBoxPanel .addFriends .iconPic {
        background-position: -118px -599px;
    }

    .operaterBox .operaterBoxPanel .iconLogout .iconPic {
        background-position: -5px -599px;
    }

    .operaterBox .operaterBoxPanel .voiceCancel .iconPic {
        background-position: -26px -599px;
    }

    .operaterBox .operaterBoxPanel .DesktopRemind .iconPic {
        background-position: -71px -599px;
    }

    .operaterBox .operaterBoxPanel .addFriends:active .iconPic {
        background-position: -118px -570px;
    }

    .operaterBox .operaterBoxPanel a.iconLogout:active .iconPic {
        background-position: -5px -570px;
    }

    .operaterBox .operaterBoxPanel a.voiceCancel:active .iconPic {
        background-position: -26px -570px;
    }

    .operaterBox .operaterBoxPanel a.DesktopRemind:active .iconPic {
        background-position: -71px -570px;
    }

    .operaterBox .operaterBoxPanel .DesktopRemind .iconPicDeskRem {
        background-position: -95px -599px;
    }

    .operaterBox .operaterBoxPanel .voiceCancel .iconPicVoice {
        background-position: -50px -599px;
    }

    .operaterBox .operaterBoxPanel a.voiceCancel:active .iconPicVoice {
        background-position: -50px -570px;
    }

    .operaterBox .operaterBoxPanel a.DesktopRemind:active .iconPicDeskRem {
        background-position: -95px -570px;
    }

    .operaterBox .operaterBoxPanel .feedback .iconFeedback {
        background-position: -140px -599px;
    }

    .operaterBox .operaterBoxPanel a.feedback:active .iconFeedback {
        background-position: -140px -570px;
    }

.chatPanel a.iconCreateNewChat {
    border-width: 1px;
    border-style: solid;
    border-color: rgb(255, 255, 255) rgb(255, 255, 255) rgb(201, 202, 205);
    border-radius: 6px 6px 0px 0px;
    width: 178px;
    height: 54px;
    color: rgb(67, 73, 80);
    text-decoration: none;
    display: block;
    position: relative;
    text-shadow: 0px 1px 0px #fff;
}

    .chatPanel a.iconCreateNewChat::after {
        border-width: 9px;
        border-style: solid;
        border-color: transparent transparent rgb(226, 229, 231);
        top: -18px;
        width: 0px;
        height: 0px;
        right: 29px;
        display: block;
        position: absolute;
        content: "";
    }

    .chatPanel a.iconCreateNewChat::before {
        border-width: 9px;
        border-style: solid;
        border-color: transparent transparent rgb(255, 255, 255);
        top: -19px;
        width: 0px;
        height: 0px;
        right: 29px;
        display: block;
        position: absolute;
        content: "";
    }

    .chatPanel a.iconCreateNewChat span.iconPic {
        background: url("../Images/button_chat1832d7.png") no-repeat -4px -564px;
        margin: 17px 0px 0px 22px;
        width: 28px;
        height: 26px;
        float: left;
        display: block;
    }

    .chatPanel a.iconCreateNewChat span.desc {
        margin: 20px 0px 0px 10px;
        float: left;
    }

    .chatPanel a.iconCreateNewChat:hover {
        background: rgb(125, 135, 146);
        border-width: 1px;
        border-style: solid;
        border-color: rgb(114, 124, 134) rgb(114, 124, 134) rgb(95, 99, 105);
    }

        .chatPanel a.iconCreateNewChat:hover::after {
            border-bottom-color: rgb(125, 135, 146);
        }

        .chatPanel a.iconCreateNewChat:hover::before {
            border-bottom-color: rgb(114, 124, 134);
        }

        .chatPanel a.iconCreateNewChat:hover span.iconPic {
            background-position: -38px -564px;
        }

        .chatPanel a.iconCreateNewChat:hover span.desc {
            color: rgb(255, 255, 255);
            text-shadow: 0px 1px 0px #585f66;
        }

.chatPanel a.iconLogout:hover span.desc {
    color: rgb(255, 255, 255);
    text-shadow: 0px 1px 0px #585f66;
}

.chatPanel a.iconLogout span.desc {
    margin: 4px 0px 0px 10px;
    float: left;
}

.chatPanel a.iconCloseChat {
    background: url("../Images/button_chat1832d7.png") 0px -462px;
    margin: 7px 9px 0px 0px;
    width: 30px;
    height: 30px;
    right: 0px;
    display: block;
    position: absolute;
    z-index: 1;
    _margin-left: -500px;
}

.chatPanel .backToChat {
    top: 0px;
    width: 59px;
    height: 46px;
    margin-top: 1px;
    position: absolute;
}

.chatPanel .rightOpBtn {
    top: 0px;
    width: 59px;
    height: 46px;
    margin-top: 1px;
    position: absolute;
}

.chatPanel .backToChat {
    left: 0px;
}

.chatPanel .rightOpBtn {
    right: 0px;
}

.chatPanel .singleChat a {
    background: url("../Images/button0217ced3.png") no-repeat;
    width: 32px;
    height: 37px;
    position: absolute;
    z-index: 1;
}

.chatPanel .groupChat a {
    /*background: url("../Images/button0217ced3.png") no-repeat;*/ width: 32px;
    height: 37px;
    position: absolute;
    z-index: 1;
}

.chatPanel .backToChat a {
    background: url("../Images/button0217ced3.png") no-repeat;
    width: 32px;
    height: 37px;
    position: absolute;
    z-index: 1;
}

.chatPanel .singleChat a {
    background-position: -102px -91px;
    width: 27px;
    right: 0px;
    margin-top: 6px;
    margin-right: 10px;
    display: block;
}

    .chatPanel .singleChat a:active {
        background-position: -129px -91px;
        display: block;
    }

.chatPanel .groupChat a {
    background-position: -62px -91px;
    width: 27px;
    height: 25px;
    right: 0px;
    margin-top: 6px;
    margin-right: 10px;
    display: block;
    position: absolute;
}

    .chatPanel .groupChat a:active {
        background-position: -90px -91px;
    }

.chatPanel .backToChat a {
    background-position: -29px -92px;
    left: 10px;
    top: 5px;
    width: 18px;
    height: 28px;
    margin-top: 2px;
    display: block;
    position: absolute;
}

    .chatPanel .backToChat a:active {
        background-position: -45px -92px;
    }

.chatPanel a.iconCloseChat:hover {
    background-position: -34px -462px;
}

.chatPanel a.iconCloseChat:active {
    background-position: -68px -462px;
}

.complexDialog {
    border-radius: 8px;
    text-align: left;
    position: absolute;
}

    .complexDialog .titleContainer {
        background: url("../Images/bg_top17ced3.png") rgb(80, 85, 92);
        border-radius: 4px 4px 0px 0px;
    }

    .complexDialog .title {
        padding: 0px 5px 0px 10px;
        border-radius: 4px 4px 0px 0px;
        height: 45px;
        text-align: left;
        border-top-color: rgba(255, 255, 255, 0.16);
        border-bottom-color: rgba(0, 0, 0, 0.3);
        border-top-width: 1px;
        border-bottom-width: 1px;
        border-top-style: solid;
        border-bottom-style: solid;
    }

        .complexDialog .title h3 {
            color: rgb(255, 255, 255);
            line-height: 50px;
            font-size: 15px;
            font-weight: normal;
            text-shadow: none;
        }

        .complexDialog .title a.iconTitleClose {
            margin: 7px 6px 8px;
            float: right;
        }

            .complexDialog .title a.iconTitleClose img {
                background: url("../Images/button_chat1832d7.png") no-repeat 0px -460px;
                width: 34px;
                height: 34px;
            }

            .complexDialog .title a.iconTitleClose:active img {
                background: url("../Images/button_chat1832d7.png") no-repeat -32px -460px;
                width: 34px;
                height: 34px;
            }

        .complexDialog .title .iconTitleCreateNewChat {
            background: url("../Images/button_chat1832d7.png") no-repeat -100px -527px;
            width: 30px;
            height: 30px;
            vertical-align: middle;
        }

    .complexDialog .content {
        background: rgb(248, 248, 248);
        border-radius: 0px 0px 4px 4px;
        margin-top: -1px;
    }

.createNewChat {
    left: 400px;
    top: 200px;
    width: 400px;
    z-index: 999;
}

    .createNewChat .selectGroupContainer {
        border-bottom-color: rgba(0, 0, 0, 0.3);
        border-bottom-width: 1px;
        border-bottom-style: solid;
    }

    .createNewChat .choosePersGroup {
        width: 100%;
        height: 33px;
        font-size: 14px;
        border-bottom-color: rgb(222, 230, 233);
        border-bottom-width: 1px;
        border-bottom-style: solid;
    }

        .createNewChat .choosePersGroup a {
            text-shadow: none;
        }

        .createNewChat .choosePersGroup .selectPersChat {
            border-width: 1px;
            border-style: solid;
            border-color: rgb(197, 205, 211) rgb(126, 134, 140) rgb(151, 161, 169) rgb(171, 181, 189);
            width: 198px;
            height: 100%;
            text-align: center;
            color: rgb(73, 81, 87);
            line-height: 33px;
            background-color: rgb(171, 181, 189);
        }

        .createNewChat .choosePersGroup a:hover div {
            background: rgb(171, 181, 189);
        }

        .createNewChat .choosePersGroup a:hover {
            text-decoration: none;
        }

        .createNewChat .choosePersGroup .selectGroupChat {
            border-width: 1px;
            border-style: solid;
            border-color: rgb(195, 203, 209) rgb(171, 181, 189) rgb(150, 162, 169) rgb(189, 197, 203);
            width: 198px;
            height: 100%;
            text-align: center;
            color: rgb(73, 81, 87);
            line-height: 33px;
            margin-top: -9px;
            background-color: rgb(171, 181, 189);
        }

@media not all {
    .createNewChat .choosePersGroup .selectGroupCha {
        margin-top: -10px;
    }
}

.createNewChat .choosePersGroup .selectedChat {
    background: rgb(197, 205, 211);
}

.createNewChat .choosePersGroup a:hover .selectedChat {
    background: rgb(197, 205, 211);
}

.createNewChat .selectFriendContainer .search {
    background: rgb(206, 215, 220);
    padding: 7px 10px 8px;
    margin-top: 1px;
    border-top-color: rgb(255, 255, 255);
    border-bottom-color: rgb(170, 170, 170);
    border-top-width: 1px;
    border-bottom-width: 1px;
    border-top-style: solid;
    border-bottom-style: solid;
}

.createNewChat .selectFriendContainer .searchBar {
    background: rgb(255, 255, 255);
    border-radius: 28px;
    border: 1px solid rgb(170, 170, 170);
    width: 100%;
    height: 26px;
    text-align: left;
    line-height: 28px;
    display: block;
    box-shadow: 0px 1px 0px rgba(255,255,255,0.5);
}

    .createNewChat .selectFriendContainer .searchBar .iconSearch {
        background: url("../Images/icon_chat17ced3.png") no-repeat -40px -167px;
        margin: 4px 0px 5px 7px;
        width: 18px;
        height: 18px;
        float: left;
    }

    .createNewChat .selectFriendContainer .searchBar input {
        border: 0px solid rgb(255, 255, 255);
        width: 86%;
        height: 24px;
        color: rgb(102, 102, 102);
        line-height: 25px;
        font-size: 14px;
        float: left;
    }

    .createNewChat .selectFriendContainer .searchBar .searchClean {
        background: url("../Images/searchCloseIcon17ced3.png") no-repeat 0px;
        width: 21px;
        height: 25px;
        cursor: pointer;
    }

.createNewChat .friendList {
    border-radius: 0px 0px 4px 4px;
    height: 373px;
    overflow: auto;
    -ms-overflow-x: hidden;
    background-color: rgb(245, 245, 245);
    -moz-border-radius: 0px 0px 4px 4px;
    -webkit-border-radius: 0px 0px 4px 4px;
}

.createNewChat .selectGroupContainer .friendList {
    border-top-color: rgb(136, 136, 136);
    border-top-width: 1px;
    border-top-style: solid;
    background-color: rgb(245, 245, 245);
}

.createNewChat .groupTitle {
    padding: 8px 31px 3px;
    text-align: left;
    color: rgb(83, 97, 117);
    line-height: 20px;
    font-size: 12px;
    text-decoration: none;
    border-top-color: rgb(208, 216, 226);
    border-top-width: 1px;
    border-top-style: solid;
    display: block;
    text-shadow: none;
}

    .createNewChat .groupTitle .lapIcon {
        background: url("../Images/button0217ced3.png") no-repeat -109px -34px;
        width: 17px;
        height: 20px;
        display: block;
    }

.createNewChat a.groupTitle:active .lapIcon {
    background-position: -121px -34px;
}

.createNewChat .groupTitle .lapedIcon {
    background-position: -135px -34px;
}

.createNewChat a.groupTitle:active .lapedIcon {
    background-position: -149px -34px;
}

.createNewChat .groupTitle .lapIcon .createNewChat .starFriendsTitle {
    border-top-color: rgb(247, 247, 247);
    border-top-width: 1px;
    border-top-style: solid;
}

.createNewChat .groupTitle .iconFavoriteFriend {
    background: url("../Images/button0217ced3.png") no-repeat -91px -35px;
    width: 22px;
    height: 18px;
    margin-left: -24px;
    vertical-align: top;
}

.createNewChat .groupTitle .groupTitleLetter {
    font-size: 14px;
    font-weight: bold;
}

.createNewChat a.friendDetail {
    background: rgb(245, 245, 245);
    padding: 5px 10px 5px 32px;
    display: block;
    cursor: pointer;
}

    .createNewChat a.friendDetail .name {
        width: 300px;
        overflow: hidden;
        white-space: nowrap;
        -ms-text-overflow: ellipsis;
        max-width: 306px;
        -o-text-overflow: ellipsis;
    }

    .createNewChat a.friendDetail span.photoEnter {
        display: none;
    }

    .createNewChat a.friendDetail:hover {
        background: rgb(238, 243, 244);
        text-decoration: none;
    }

        .createNewChat a.friendDetail:hover span.photoEnter {
            display: inline;
        }

.createNewChat a.activeColumn {
    background-color: rgb(122, 134, 156);
}

    .createNewChat a.activeColumn:hover {
        background-color: rgb(184, 183, 181);
    }

    .createNewChat a.activeColumn .nickName {
        color: rgb(255, 255, 255);
        text-shadow: none;
    }

.createNewChat .friendDetail .checkbox {
    background: url("../Images/button_chat1832d7.png") no-repeat 0px -493px;
    margin: 3px 5px 3px 0px;
    width: 34px;
    height: 34px;
    float: left;
    display: block;
}

    .createNewChat .friendDetail .checkbox img {
        width: 34px;
        height: 34px;
    }

.createNewChat .friendDetail .checked img {
    background: url("../Images/button_chat1832d7.png") no-repeat -34px -493px;
    width: 34px;
    height: 34px;
}

.createNewChat .friendDetail .avatar {
    width: 36px;
    height: 36px;
    float: left;
    display: block;
}

    .createNewChat .friendDetail .avatar img {
        border: 1px solid rgb(255, 255, 255);
        width: 33px;
        height: 33px;
        display: block;
    }

.createNewChat .friendDetail .nickName {
    text-align: left;
    color: rgb(52, 52, 52);
    overflow: hidden;
    padding-top: 4px;
    font-size: 12px;
    margin-top: 5px;
    margin-left: 10px;
    float: left;
    display: block;
    white-space: nowrap;
    -ms-word-wrap: normal;
    -ms-text-overflow: ellipsis;
    text-shadow: 0px 1px 0px #ffffff;
}

.createNewChat .friendDetail .photoEnter {
    background: url("../Images/button0217ced3.png") no-repeat -116px -124px;
    width: 23px;
    height: 25px;
    margin-top: 4px;
    display: block;
}

    .createNewChat .friendDetail .photoEnter:active {
        background-position: -143px -124px;
    }

.createNewChat .friendDetail .nickName .emoji {
    margin-top: 0px;
    vertical-align: bottom;
}

.createNewChat .friendDetail .nickName .name {
    width: 170px;
    overflow: hidden;
    padding-top: 4px;
    margin-top: -4px;
    white-space: nowrap;
    -ms-text-overflow: ellipsis;
    max-width: 187px;
    -o-text-overflow: ellipsis;
}

.hasSysScroll .createNewChat .friendDetail .nickName .name {
    max-width: 170px;
}

.createNewChat.complexDialog .friendDetail .nickName {
    max-width: 250px;
}

    .createNewChat.complexDialog .friendDetail .nickName .personNum {
        color: rgb(163, 163, 162);
        margin-left: 5px;
    }

    .createNewChat.complexDialog .friendDetail .nickName .name {
        width: 223px;
        overflow: hidden;
        padding-top: 5px;
        margin-top: -5px;
        white-space: nowrap;
        -ms-word-wrap: normal;
        -ms-text-overflow: ellipsis;
        max-width: 261px;
        -o-text-overflow: ellipsis;
    }

.createNewChat a.activeColumn .avatar img {
    border: 1px solid rgb(255, 255, 255);
}

.createNewChat .selectedPanel {
    height: 70px;
    display: none;
}

    .createNewChat .selectedPanel a.arrowLeft {
        width: 40px;
        height: 70px;
        float: left;
        cursor: pointer;
    }

    .createNewChat .selectedPanel a.arrowRight {
        width: 40px;
        height: 70px;
        float: right;
        cursor: pointer;
    }

    .createNewChat .selectedPanel a.arrowLeft img {
        background: url("../Images/button_chat1832d7.png") no-repeat;
        margin: 26px 11px;
        width: 18px;
        height: 18px;
    }

    .createNewChat .selectedPanel a.arrowRight img {
        background: url("../Images/button_chat1832d7.png") no-repeat;
        margin: 26px 11px;
        width: 18px;
        height: 18px;
    }

    .createNewChat .selectedPanel a.arrowLeft img {
        background-position: -7px -748px;
    }

    .createNewChat .selectedPanel a.arrowRight img {
        background-position: -7px -782px;
    }

    .createNewChat .selectedPanel a.arrowLeft:hover img {
        background-position: -41px -748px;
    }

    .createNewChat .selectedPanel a.arrowRight:hover img {
        background-position: -41px -782px;
    }

    .createNewChat .selectedPanel .selectedList {
        height: 70px;
        overflow: hidden;
        position: relative;
    }

    .createNewChat .selectedPanel .selectedListScroll {
        position: absolute;
    }

    .createNewChat .selectedPanel .selectedList span {
        margin: 16px 11px 0px 5px;
        float: left;
        position: relative;
    }

    .createNewChat .selectedPanel .selectedList .avatar {
        border-radius: 4px;
        border: 1px solid rgb(204, 204, 204);
        width: 48px;
        height: 48px;
        box-shadow: 0px 1px 0px #999;
    }
    /*.createNewChat .selectedPanel .selectedList .iconRemove {
	background: url("../Images/button_chat1832d7.png") no-repeat -4px -813px; margin: -12px 0px 0px 35px; width: 25px; height: 25px; position: absolute; cursor: pointer;
}*/
    .createNewChat .selectedPanel .selectedList .iconRemove:hover {
        background-position: -4px -813px;
    }

.complexDialog .operationBar {
    background: rgb(197, 202, 206);
    border-radius: 0px 0px 4px 4px;
    height: 60px;
    text-align: center;
    border-top-color: rgb(255, 255, 255);
    border-bottom-color: rgb(170, 170, 170);
    border-top-width: 1px;
    border-bottom-width: 1px;
    border-top-style: solid;
    border-bottom-style: solid;
}

    .complexDialog .operationBar .chatSend {
        margin: 12px auto;
        float: none;
    }

.faqPanel {
    left: 100px;
    top: 200px;
    width: 500px;
    z-index: 1009;
}

    .faqPanel .titleContainer {
        background: rgb(142, 184, 202);
    }

    .faqPanel .title a.iconTitleClose img {
        background: url("../Images/button_chat1832d7.png") no-repeat 0px -428px;
    }

    .faqPanel .title a.iconTitleClose:hover img {
        background: url("../Images/button_chat1832d7.png") no-repeat -34px -428px;
    }

    .faqPanel .title a.iconTitleClose:active img {
        background: url("../Images/button_chat1832d7.png") no-repeat -68px -428px;
    }

    .faqPanel .title h3 {
        color: rgb(117, 157, 174);
        font-size: 24px;
        font-weight: bold;
        margin-left: 5px;
        text-shadow: 0px 1px 0px rgba(255,255,255,0.5);
    }

    .faqPanel .content {
        padding: 30px;
        color: rgb(102, 102, 102);
        text-shadow: none;
    }

        .faqPanel .content dt {
            color: rgb(68, 68, 68);
        }

        .faqPanel .content dd {
            margin-bottom: 20px;
        }

        .faqPanel .content ol li {
            margin-left: 23px;
            list-style-type: disc;
        }

    .faqPanel .tips {
        color: rgb(119, 165, 185);
    }

.imageView {
    position: absolute;
}

    .imageView .imageContent {
        position: relative;
    }

    .imageView a.iconClose {
        background: rgb(223, 223, 223);
        margin: -13px -13px 0px 0px;
        border-radius: 24px;
        top: 0px;
        right: 0px;
        float: right;
        position: absolute;
        z-index: 1000;
    }

        .imageView a.iconClose img {
            background: url("../Images/button_chat1832d7.png") no-repeat -8px -470px;
            margin: 5px;
            width: 17px;
            height: 17px;
            display: block;
        }

        .imageView a.iconClose:hover img {
            background-position: -42px -470px;
        }

        .imageView a.iconClose:active img {
            background-position: -76px -470px;
        }

    .imageView .imageContent .image {
        border-radius: 6px;
        box-shadow: 0px 0px 20px #111;
    }

        .imageView .imageContent .image img {
            border-radius: 6px;
            width: 500px;
            display: block;
        }

.imageViewControllBar {
    width: 100%;
    bottom: 40px;
    position: absolute;
    z-index: 200;
}

    .imageViewControllBar .controllBar {
        background: rgb(51, 51, 51);
        margin: 0px auto;
        padding: 0px 0px 0px 20px;
        border-radius: 40px;
        width: 166px;
        box-shadow: 0px 1px 2px #000;
    }

        .imageViewControllBar .controllBar a.icon {
            margin: 8px 0px;
            padding: 0px 10px;
            float: left;
            display: block;
        }

        .imageViewControllBar .controllBar .icon img {
            background: url("../Images/button_chat1832d7.png") no-repeat;
            width: 34px;
            height: 28px;
            margin-top: 4px;
            display: block;
        }

        .imageViewControllBar .controllBar .iconBorderLeft {
            border-left-color: rgb(71, 71, 71);
            border-left-width: 1px;
            border-left-style: solid;
        }

        .imageViewControllBar .controllBar .iconBorderRight {
            border-right-color: rgb(44, 44, 44);
            border-right-width: 1px;
            border-right-style: solid;
        }

        .imageViewControllBar .controllBar a.iconZoomOut img {
            background-position: 0px -258px;
        }

        .imageViewControllBar .controllBar a.iconZoomeIn img {
            background-position: 0px -292px;
        }

        .imageViewControllBar .controllBar a.iconDownload img {
            background-position: 0px -326px;
        }

        .imageViewControllBar .controllBar a.iconZoomOut:active img {
            background-position: -34px -258px;
        }

        .imageViewControllBar .controllBar a.iconZoomeIn:active img {
            background-position: -34px -292px;
        }

        .imageViewControllBar .controllBar a.iconDownload:active img {
            background-position: -34px -326px;
        }

.uploadPreview {
    background: rgb(240, 243, 244);
    border-width: 1px;
    border-style: solid;
    border-color: rgb(204, 204, 204) rgb(170, 170, 170) rgb(170, 170, 170);
    padding: 19px;
    border-radius: 4px;
    width: 622px;
    height: 451px;
    display: none;
    position: absolute;
    z-index: 120;
}

    .uploadPreview a.iconClose {
        top: -13px;
        width: 28px;
        height: 28px;
        right: -13px;
        position: absolute;
    }

        .uploadPreview a.iconClose img {
            background: url("../Images/button_chat1832d7.png") no-repeat -3px -845px;
            width: 100%;
            height: 100%;
        }

        .uploadPreview a.iconClose:hover img {
            background-position: -37px -845px;
        }

        .uploadPreview a.iconClose:active img {
            background-position: -71px -845px;
        }

    .uploadPreview .picPreviewWrap {
        width: 630px;
        height: 370px;
        text-align: center;
        line-height: 0;
        overflow: hidden;
        display: table;
        position: relative;
    }

    .uploadPreview .picPreviewInner {
        vertical-align: middle;
        display: table-cell;
    }

    .uploadPreview .picPreviewWrap img {
        margin: 0px auto;
        border-radius: 3px;
    }

    .uploadPreview .picPreviewOperator {
        height: 50px;
        padding-top: 26px;
    }

.picPreviewOperator a.btnSendPic {
    background: rgb(247, 249, 250);
    margin: 0px 10px;
    padding: 2px 3px 2px 10px;
    border-radius: 22px;
    border: 1px solid rgb(202, 205, 207);
    color: rgb(72, 82, 97);
    display: inline-block;
}

.picPreviewOperator a.btnCancelPic {
    background: rgb(247, 249, 250);
    margin: 0px 10px;
    padding: 2px 3px 2px 10px;
    border-radius: 22px;
    border: 1px solid rgb(202, 205, 207);
    color: rgb(72, 82, 97);
    display: inline-block;
}

.picPreviewOperator a.btnSendPic input {
    text-shadow: 0px 1px 0px #d0d2d7;
}

.picPreviewOperator a.btnCancelPic input {
    text-shadow: 0px 1px 0px #d0d2d7;
}

.picPreviewOperator a.btnSendPic span {
    margin: 3px 0px -19px;
    width: 17px;
    height: 17px;
    float: left;
    display: block;
}

.picPreviewOperator a.btnCancelPic span {
    margin: 3px 0px -19px;
    width: 17px;
    height: 17px;
    float: left;
    display: block;
}

.picPreviewOperator a.btnSendPic span.tipPic {
    background: url("../Images/button_chat1832d7.png") no-repeat -7px -367px;
}

.picPreviewOperator a.btnCancelPic span.tipPic {
    background: url("../Images/button_chat1832d7.png") no-repeat -7px -399px;
}

.picPreviewOperator a.btnSendPic:hover {
    background: rgb(139, 169, 192);
    border-color: rgb(89, 123, 150);
    text-decoration: none;
}

.picPreviewOperator a.btnCancelPic:hover {
    background: rgb(139, 169, 192);
    border-color: rgb(89, 123, 150);
    text-decoration: none;
}

.picPreviewOperator a.btnSendPic:hover input {
    color: rgb(255, 255, 255);
    text-shadow: 0px 1px 0px #627e93;
}

.picPreviewOperator a.btnCancelPic:hover input {
    color: rgb(255, 255, 255);
    text-shadow: 0px 1px 0px #627e93;
}

.picPreviewOperator .btnSendPic:hover .tipPic {
    background-position: -41px -368px;
}

.picPreviewOperator .btnCancelPic:hover .tipPic {
    background-position: -43px -400px;
}

.picPreviewOperator input {
    border: currentColor;
    color: rgb(72, 82, 97);
    margin-left: 8px;
    cursor: pointer;
}

.profileMesg {
    padding: 16px;
    border-radius: 2px;
    text-align: left;
    color: rgb(52, 52, 52);
    letter-spacing: 0em;
    position: relative;
    max-width: 213px;
    box-shadow: 0px 0px 2px #fff;
    background-color: rgb(238, 240, 242);
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
}

    .profileMesg .triangleRight {
        border-width: 5px;
        border-style: solid;
        top: 0px;
        width: 0px;
        height: 0px;
        margin-top: 10px;
        position: absolute;
    }

    .profileMesg .triangleLeft {
        border-width: 5px;
        border-style: solid;
        top: 0px;
        width: 0px;
        height: 0px;
        margin-top: 10px;
        position: absolute;
    }

    .profileMesg .triangleRight {
        border-color: transparent transparent transparent rgb(238, 240, 242);
        right: 0px;
        margin-right: -10px;
    }

    .profileMesg .triangleLeft {
        border-color: transparent rgb(238, 240, 242) transparent transparent;
        left: 0px;
        margin-left: -10px;
    }

    .profileMesg .profileNormMesgPanel {
        margin: 0px 0px 15px;
        padding-bottom: 15px;
        border-bottom-color: rgb(181, 183, 184);
        border-bottom-width: 1px;
        border-bottom-style: dotted;
    }

        .profileMesg .profileNormMesgPanel .avatar_wrap {
            margin: 0px 13px 0px 0px;
            padding: 0px;
            border: 1px solid rgb(255, 255, 255);
            width: 60px;
            height: 60px;
            float: left;
        }

    .profileMesg .avatar_wrap img.avatar {
        width: 60px;
        height: 60px;
    }

    .profileMesg .nickname {
        overflow: hidden;
        font-size: 14px;
        white-space: nowrap;
        -ms-text-overflow: ellipsis;
        max-width: 109px;
        text-shadow: 0px 1px 0px;
        -o-text-overflow: ellipsis;
    }

    .profileMesg .genderIcon {
        margin: 5px;
    }

    .profileMesg .profileNormMesgPanel .profileNormMesgContent {
        float: left;
    }

    .profileMesg .profileNormMesgContent .profileNormMesgName {
        color: rgb(52, 52, 52);
        font-size: 18px;
        text-shadow: 0px 1px 0px #ccc;
    }

    .profileMesg .profileNormMesgContent .profileNormMesgID {
        overflow: hidden;
        font-size: 12px;
        white-space: nowrap;
        -ms-text-overflow: ellipsis;
        max-width: 137px;
        text-shadow: 0px 1px 0px #fff;
        -o-text-overflow: ellipsis;
    }

    .profileMesg .profileNormMesgSign {
        margin: 0px;
        padding: 1px 3px;
        font-size: 12px;
        text-shadow: 0px 1px 0px #fff;
        background-color: rgb(230, 234, 238);
    }

.noMsgIip {
    margin: 100px 0px 0px;
    color: rgb(204, 204, 204);
}

.window {
    border-radius: 5px;
    border: 1px solid rgb(130, 147, 151);
    width: 415px;
    text-align: left;
    box-shadow: 0px 0px 6px #757575;
    background-color: white;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}

    .window .header {
        border-radius: 5px 5px 0px 0px;
        height: 34px;
        border-top-color: rgb(241, 241, 241);
        border-bottom-color: rgb(175, 179, 185);
        border-top-width: 1px;
        border-bottom-width: 1px;
        border-top-style: solid;
        border-bottom-style: solid;
        background-color: rgb(221, 225, 230);
        -moz-border-radius: 5px 5px 0px 0px;
        -webkit-border-radius: 5px 5px 0px 0px;
    }

        .window .header p {
            color: rgb(67, 75, 85);
            line-height: 35px;
            font-size: 13px;
            font-weight: bold;
            margin-left: 13px;
            text-shadow: 0px 1px 0px #ebebeb;
        }

        .window .header .closeIconPanel {
            width: 35px;
            height: 35px;
            margin-top: -36px;
            border-left-color: rgb(229, 232, 235);
            border-left-width: 1px;
            border-left-style: solid;
            display: block;
            box-shadow: 1 0 0 #b9c3ce;
        }

        .window .header .closeIcon {
            background: url("../Images/button0217ced3.png") no-repeat -73px -17px;
            width: 17px;
            height: 17px;
            margin-top: 8px;
            margin-left: 9px;
            display: block;
        }

            .window .header .closeIcon:active {
                background-position: -90px -17px;
            }

    .window .content {
        padding: 32px 17px 23px;
    }

        .window .content .section {
            padding: 8px 0px;
        }

        .window .content .friendImg {
            
            border: 2px solid rgb(255, 255, 255);
            width: 98px;
            height: 98px;
            margin-right: 14px;
            box-shadow: 0px 1px 0px #b9b9b9;
        }

        .window .content .personalInfo {
            margin-top: -19px;
        }

            .window .content .personalInfo .friendMesg {
                width: 250px;
                bottom: 0px;
                position: relative;
                min-height: 103px;
            }

            .window .content .personalInfo .nickname {
                height: 20px;
                color: rgb(67, 75, 85);
                overflow: hidden;
                font-size: 13px;
                margin-right: 5px;
                white-space: nowrap;
                -ms-text-overflow: ellipsis;
                max-width: 200px;
                text-shadow: none;
                -o-text-overflow: ellipsis;
            }

            .window .content .personalInfo p {
                color: rgb(169, 176, 182);
                line-height: 22px;
                font-size: 12px;
                text-shadow: none;
            }

            .window .content .personalInfo .modifyInput {
                margin: 0px;
                padding: 0px;
                width: 100px;
                line-height: 15px;
            }

            .window .content .personalInfo .remarkSection a {
                color: rgb(169, 176, 182);
                padding-right: 10px;
                text-decoration: none;
            }

                .window .content .personalInfo .remarkSection a .remarkname {
                    height: 16px;
                    line-height: 16px;
                    overflow: hidden;
                    vertical-align: middle;
                    display: inline-block;
                    white-space: nowrap;
                    -ms-text-overflow: ellipsis;
                    max-width: 120px;
                    -o-text-overflow: ellipsis;
                }

                .window .content .personalInfo .remarkSection a .editRemarkNameIcon {
                    background: url("../Images/button0217ced3.png") no-repeat 2px -153px;
                    width: 18px;
                    height: 16px;
                    margin-bottom: -3px;
                    margin-left: 5px;
                    display: inline-block;
                    visibility: hidden;
                }

                .window .content .personalInfo .remarkSection a .show.editRemarkNameIcon {
                    visibility: visible;
                }

                .window .content .personalInfo .remarkSection a:hover .editRemarkNameIcon {
                    display: inline-block;
                    visibility: visible;
                }

                .window .content .personalInfo .remarkSection a:active .editRemarkNameIcon {
                    background: url("../Images/button0217ced3.png") no-repeat -13px -153px;
                    display: inline-block;
                    visibility: visible;
                }

            .window .content .personalInfo .replyWrapper {
                padding-top: 5px;
                margin-top: 7px;
                border-top-color: rgb(238, 238, 238);
                border-top-width: 1px;
                border-top-style: solid;
            }

            .window .content .personalInfo .replyVerifyMsg {
                padding: 0px 5px;
                border-radius: 9px;
                border: 1px solid rgb(221, 221, 221);
                font-size: 12px;
                float: right;
                cursor: pointer;
                background-color: rgb(238, 238, 238);
            }

                .window .content .personalInfo .replyVerifyMsg:hover {
                    color: inherit;
                    text-decoration: none;
                    background-color: rgb(234, 234, 234);
                }

            .window .content .personalInfo p.valiMesg {
                padding: 2px 4px;
                border-radius: 6px;
                color: rgb(99, 103, 107);
                line-height: 20px;
                display: inline-block;
                background-color: rgb(221, 221, 221);
            }

            .window .content .personalInfo .valiMesg .hook {
                border-width: 5px;
                border-style: solid;
                border-color: transparent rgb(221, 221, 221) transparent transparent;
                left: -9px;
                top: 9px;
                width: 0px;
                height: 0px;
                display: block;
                position: absolute;
            }

            .window .content .personalInfo .valiMesg .hook1 {
                display: none;
            }

            .window .content .personalInfo .valiMesg .valiMesgContent {
                display: block;
                max-width: 254px;
            }

        .window .content .verification label {
            color: rgb(161, 170, 184);
            font-size: 12px;
            text-shadow: none;
        }

        .window .content .verification p {
            color: rgb(160, 164, 170);
            font-size: 12px;
            margin-bottom: 3px;
        }

        .window .content .verification .inputVerifi {
            border-width: 1px;
            border-style: solid;
            border-color: rgb(221, 225, 230) rgb(222, 226, 230) rgb(253, 253, 253);
            margin: 4px auto 0px;
            padding: 4px 2px;
            width: 220px;
            box-shadow: 0px -1px 0px #c6cace;
            background-color: rgb(230, 233, 236);
        }

            .window .content .verification .inputVerifi:focus {
                background-color: rgb(255, 255, 255);
            }

a.btnBrown:hover {
    text-decoration: none;
    cursor: pointer;
}

a.btnGray:hover {
    text-decoration: none;
    cursor: pointer;
}

a.btnBrown {
    margin: 0px auto;
    border-radius: 15px;
    border: 1px solid rgb(66, 76, 85);
    display: inline-block;
    background-color: rgb(89, 102, 116);
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
}

    a.btnBrown:active {
        background-color: rgb(78, 88, 102);
    }

        a.btnBrown:active input {
            color: rgb(192, 200, 209);
        }

    a.btnBrown input {
        border-width: 1px;
        border-style: solid;
        border-color: rgb(117, 130, 147) rgb(93, 106, 120) rgb(82, 94, 108);
        margin: 0px;
        padding: 3px 30px;
        border-radius: 15px;
        color: rgb(255, 255, 255);
        display: block;
        cursor: pointer;
        -moz-border-radius: 15px;
        -webkit-border-radius: 15px;
    }

a.btnGray {
    margin: 0px auto;
    border-radius: 15px;
    border: 1px solid rgb(170, 170, 170);
    display: inline-block;
    background-color: rgb(230, 232, 234);
    -moz-border-radius: 15px;
    -webkit-border-radius: 15px;
}

    a.btnGray:active {
        background-color: rgb(78, 88, 102);
    }

        a.btnGray:active input {
            color: rgb(123, 134, 145);
        }

    a.btnGray input {
        border-width: 1px medium medium;
        border-style: solid none none;
        border-color: rgb(255, 255, 255) currentColor currentColor;
        margin: 0px;
        padding: 3px 30px;
        border-radius: 15px;
        color: rgb(92, 105, 119);
        display: block;
        cursor: pointer;
        text-shadow: 0px 1px 0px #f3f4f5;
        -moz-border-radius: 15px;
        -webkit-border-radius: 15px;
    }

.friendInfo a.btnBrown {
    margin: 0px auto;
    color: rgb(255, 255, 255);
    line-height: 24px;
    font-size: 12px;
    text-shadow: none;
}

.friendInfo a.btnGray {
    margin: 0px auto;
    color: rgb(255, 255, 255);
    line-height: 24px;
    font-size: 12px;
    text-shadow: none;
}

.friendInfo .nextStep {
    text-align: center;
}

.friendInfo .verification a.btnGray input {
    padding-top: 0px;
    padding-bottom: 0px;
}

.friendInfo .verification a.btnBrown input {
    padding-top: 0px;
    padding-bottom: 0px;
}

.friendInfo a.btnBrown input {
    text-align: center;
    line-height: 20px;
}

.friendInfo a.btnGray input {
    text-align: center;
    line-height: 20px;
}

.genderIcon {
    background: url("../Images/button_chat1832d7.png") no-repeat;
    width: 17px;
    height: 15px;
    margin-top: 2px;
    display: block;
}

.maleIcon {
    background-position: -138px -984px;
    margin-top: 1px;
}

.femaleIcon {
    background-position: -157px -984px;
}

.window .content .physicalInfor {
    margin: 1px -17px 2px;
    border-bottom-color: rgb(224, 224, 224);
    border-bottom-width: 1px;
    border-bottom-style: solid;
}

    .window .content .physicalInfor .tr {
        line-height: 33px;
        overflow: hidden;
        clear: both;
        font-size: 12px;
        border-top-color: rgb(224, 224, 224);
        border-top-width: 1px;
        border-top-style: solid;
        display: block;
        min-height: 33px;
    }

    .window .content .physicalInfor .photoAlbum.tr {
        line-height: 50px;
        min-height: 50px;
    }

    .window .content .physicalInfor .tr .tdLeft {
        width: 29%;
        text-align: right;
        color: rgb(150, 158, 166);
        margin-right: 14px;
        display: block;
    }

    .window .content .physicalInfor .tr .tdRight {
        color: rgb(67, 75, 85);
        line-height: 1.5em;
        padding-top: 8px;
        max-width: 262px;
    }

    .window .content .physicalInfor .photoAlbum a {
        height: 50px;
        display: block;
    }

        .window .content .physicalInfor .photoAlbum a:hover {
            background-color: rgb(238, 238, 238);
        }

    .window .content .physicalInfor .photoAlbum div {
        margin: 3px 2px -9px 0px;
        border: 2px solid rgb(247, 247, 247);
        width: 40px;
        height: 40px;
        overflow: hidden;
        position: relative;
    }

    .window .content .physicalInfor .photoAlbum img {
        position: absolute;
    }

.window .content .verification {
    text-align: center;
}

    .window .content .verification .operBtn {
        margin: 15px auto 0px;
        width: 56%;
    }

.window .content .btnPrimary {
    margin: auto;
}

.window .content .btnSecondary {
    border-radius: 4px;
    width: 120px;
    height: 30px;
    text-align: center;
    display: block;
    box-shadow: 0px 1px 3px lightgrey;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
}

.window .content .btnPrimary input {
    border: currentColor;
}

.window .content .verification .btnSecondary input {
    border: currentColor;
}

.window .content .btnPrimary input {
    color: rgb(255, 255, 255);
}

.window .content .btnSecondary input {
    color: rgb(109, 109, 109);
}

.window .content .nextStep .complementOper {
    font-size: 12px;
    text-shadow: none;
}

    .window .content .nextStep .complementOper .addBlacklist {
        color: rgb(167, 176, 188);
        margin-right: 10px;
    }

    .window .content .nextStep .complementOper .report {
        color: rgb(167, 176, 188);
    }

    .window .content .nextStep .complementOper .addBlacklistIcon {
        background: url("../Images/button0217ced3.png") no-repeat;
        width: 18px;
        height: 18px;
        display: block;
    }

    .window .content .nextStep .complementOper .reportIcon {
        background: url("../Images/button0217ced3.png") no-repeat;
        width: 18px;
        height: 18px;
        display: block;
    }

    .window .content .nextStep .complementOper .addBlacklistIcon {
        background-position: -1px -17px;
    }

    .window .content .nextStep .complementOper .reportIcon {
        background-position: -37px -17px;
    }

    .window .content .nextStep .complementOper a:active .addBlacklistIcon {
        background-position: -19px -17px;
    }

    .window .content .nextStep .complementOper a:active .reportIcon {
        background-position: -55px -17px;
    }

.avatorInfo {
    height: 300px;
}

.editAvartorContent.avatorInfo {
    margin-bottom: 25px;
}

.avatorInfo .editAvartorContent .editAvartorPanel {
    margin-left: 32px;
}

.avatorInfo .preAvartorContent {
    text-align: center;
}

    .avatorInfo .preAvartorContent img {
        margin: 0px auto 10px;
        border: 1px solid rgb(255, 255, 255);
        width: 90px;
        height: 90px;
        box-shadow: 0px 1px 0px #b9b9b9;
    }

.avatorInfo .editAvartorContent .editIcon {
    background: url("../Images/button0217ced3.png") no-repeat -107px -17px;
    width: 15px;
    height: 15px;
    margin-top: 2px;
    margin-right: -16px;
    display: block;
}

.avatorInfo .editAvartorContent p {
    text-align: center;
    margin-bottom: 28px;
}

.avatorInfo .preForm {
    margin-bottom: 30px;
}

.avatorInfo .preOper {
    position: relative;
}

.avatorInfo .editOper {
    margin: 0px auto;
    width: 232px;
}

.avatorInfo .preOper a {
    text-align: center;
    right: 0px;
    overflow: hidden;
    margin-top: 47px;
    margin-right: -8px;
    position: absolute;
    cursor: pointer;
}

.avatorInfo .preOper input {
    margin: 0px;
    width: 100%;
    height: 100%;
    font-size: 100px;
    position: absolute;
    cursor: pointer;
    opacity: 0;
}

.avatorInfo .editBox {
    border: 2px solid rgb(255, 255, 255);
    width: 230px;
    height: 230px;
    margin-right: 22px;
    margin-left: 25px;
    box-shadow: 0px 1px 0px #b9b9b9;
}

.avatorInfo .previewBox {
    background: url("../Images/avatar_default17ced3.png") no-repeat center;
    border: 2px solid rgb(255, 255, 255);
    width: 70px;
    height: 69px;
    box-shadow: 0px 1px 0px #b9b9b9;
}

.chatItem .callingCard {
    margin: 0px auto;
    width: 238px;
    float: none;
}

.callingCard .cloudBody {
    border-radius: 2px;
    border: 1px solid rgb(165, 165, 165);
    width: 237px;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
}

.callingCard .cloudPannel {
    box-shadow: 0px 1px 2px #c5c5c5;
}

.callingCard .cloudBody .content {
    padding: 4px 4px 3px;
    background-color: rgb(255, 255, 255);
}

.callingCard .cloudBody .friendMesg {
    width: 124px;
    color: rgb(76, 91, 124);
    overflow: hidden;
}

    .callingCard .cloudBody .friendMesg .nickname {
        width: 119px;
        height: 20px;
        overflow: hidden;
        font-size: 12px;
        font-weight: bold;
        display: block;
        white-space: nowrap;
        -ms-text-overflow: ellipsis;
        -o-text-overflow: ellipsis;
    }

    .callingCard .cloudBody .friendMesg p {
        width: 120px;
        height: 15px;
        color: rgb(166, 166, 166);
        line-height: 1.2em;
        overflow: hidden;
        font-size: 12px;
        margin-top: 2px;
        white-space: nowrap;
        -ms-text-overflow: ellipsis;
        -o-text-overflow: ellipsis;
    }

.callingCard .cloudBody .content img {
    background: url("../Images/avatar_default17ced3.png") no-repeat center;
    width: 79px;
    height: 79px;
    margin-right: 10px;
}

.callingCard .cloudBody .footer {
    padding: 3px 5px;
    border-radius: 0px 0px 2px 2px;
    width: auto;
    color: rgb(130, 130, 130);
    line-height: 21px;
    font-size: 12px;
    margin-left: auto;
    border-top-color: rgb(222, 222, 222);
    border-top-width: 1px;
    border-top-style: solid;
    position: static;
    text-shadow: none;
    background-image: none;
    background-color: rgb(242, 242, 242);
    -moz-border-radius: 0px 0px 2px 2px;
    -webkit-border-radius: 0px 0px 2px 2px;
}

    .callingCard .cloudBody .footer .callingCardIcon {
        background: url("../Images/button0217ced3.png") no-repeat;
        width: 15px;
        height: 15px;
        margin-top: 3px;
        margin-right: 5px;
        display: block;
    }

    .callingCard .cloudBody .footer .friendScanIcon {
        background-position: -64px 0px;
    }

    .callingCard .cloudBody .footer .friendAroundIcon {
        background-position: -16px 0px;
    }

    .callingCard .cloudBody .footer .friendShakeIcon {
        background-position: -97px 0px;
    }

    .callingCard .cloudBody .footer .addresIcon {
        background-position: -32px 0px;
        width: 12px;
    }

    .callingCard .cloudBody .footer .bottleIcon {
        background-position: -48px 0px;
    }

    .callingCard .cloudBody .footer .facebookIcon {
        background-position: -80px 0px;
    }

    .callingCard .cloudBody .footer .qqIcon {
        background-position: -113px 0px;
        width: 13px;
    }

a.btnBlue {
    border-radius: 2px;
    border: 1px solid rgb(66, 76, 85);
    height: 19px;
    margin-top: 1px;
    display: block;
    -moz-border-radius: 2px;
    -webkit-border-radius: 2px;
}

    a.btnBlue:active .btnBluePanel {
        background-color: rgb(83, 96, 114);
    }

.btnBlue .btnBluePanel {
    border-top-color: rgb(117, 130, 147);
    border-top-width: 1px;
    border-top-style: solid;
    background-color: rgb(98, 111, 128);
}

.btnBlue .btnGrayAdded .btnPanel {
    background-color: rgb(241, 242, 243);
}

.btnBlue .btnWord {
    padding: 0px 4px;
    height: 18px;
    color: rgb(255, 255, 255);
    line-height: 18px;
    font-size: 12px;
    display: block;
}

.callingCard .cloudBody .footer .addIcon {
    background: url("../Images/button0217ced3.png") no-repeat -121px -17px;
    margin: 4px -1px 0px 6px;
    width: 12px;
    height: 11px;
    display: block;
}

.callingCard .cloudBody .footer a:active .addIcon {
    background-position: -131px -17px;
}

.tips {
    padding: 10px 20px;
    border-radius: 3px;
    width: 146px;
    height: 32px;
    color: rgb(255, 255, 255);
    line-height: 32px;
    font-size: 14px;
    z-index: 100000;
    opacity: 0.5;
    text-shadow: 0px 1px 0px #000;
    background-color: rgb(0, 0, 0);
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}

    .tips .tipsIcon {
        background: url("../Images/button0217ced3.png") no-repeat 2px -37px;
        width: 42px;
        height: 32px;
        display: block;
    }

    .tips .errorIcon {
        background-position: -37px -37px;
        width: 40px;
    }

.inputArea .recordInput .recordVol {
    width: 300px;
    margin-left: 95px;
    position: relative;
}

    .inputArea .recordInput .recordVol span {
        background: rgb(141, 151, 164);
        border-width: 1px;
        border-style: solid;
        border-color: rgb(96, 102, 109) rgb(143, 153, 166) rgb(184, 187, 195);
        width: 2px;
        height: 11px;
        bottom: 7px;
        margin-right: 1px;
        margin-left: 1px;
        display: block;
        position: absolute;
    }

    .inputArea .recordInput .recordVol .voiceBac {
        background: rgb(52, 118, 170);
        border-width: 1px;
        border-style: solid;
        border-color: rgb(41, 98, 143) rgb(50, 112, 162) rgb(184, 187, 195);
    }

.inputArea .recordInput .recordTime {
    color: rgb(83, 87, 90);
}

.preAvartor {
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    margin-top: -1px;
    position: absolute;
    z-index: 201;
    background-color: rgb(248, 248, 248);
}

    .preAvartor img {
        border: 2px solid rgb(255, 255, 255);
        left: 63px;
        top: 0px;
        width: 250px;
        height: 250px;
        position: absolute;
        box-shadow: 0px 1px 0px #a5a5a5;
    }

    .preAvartor .bigAvatar {
        background: url("../Images/edit_avatar17ced3.png") no-repeat center;
        border: 2px solid rgb(255, 255, 255);
        left: 67px;
        top: 0px;
        width: 250px;
        height: 250px;
        position: absolute;
        box-shadow: 0px 1px 0px #a5a5a5;
    }

    .preAvartor .editOper {
        left: 71px;
        top: 251px;
        margin-top: 20px;
        position: absolute;
    }

        .preAvartor .editOper a {
            margin-left: 73px;
        }

.editAvartor {
    left: 0px;
    top: 0px;
    position: absolute;
}

    .editAvartor .editAvartorContent .postPhoto {
        padding: 0px 11px;
        border-radius: 4px;
        color: rgb(129, 129, 129);
        font-size: 12px;
        margin-top: 10px;
        margin-left: 1px;
    }

    .editAvartor .editAvartorContent a:active {
        color: rgb(0, 0, 0);
    }

    .editAvartor .editOper {
        width: 223px;
        margin-top: 20px;
        margin-left: 82px;
    }

.fileLoad {
    margin: 25px 0px 0px;
    padding: 0px;
}

    .fileLoad .fileLoadPanel {
        border-radius: 4px;
        width: 98px;
        height: 4px;
        right: 0px;
        position: relative;
        box-shadow: 0px 1px 0px #fff;
        background-color: rgb(174, 186, 198);
        -moz-border-radius: 4px;
        -webkit-border-radius: 4px;
    }

        .fileLoad .fileLoadPanel .progrBar {
            border-radius: 2px;
            left: 0px;
            top: 0px;
            width: 62px;
            height: 4px;
            position: absolute;
            background-color: rgb(139, 149, 161);
            -moz-border-radius: 2px;
            -webkit-border-radius: 2px;
        }

        .fileLoad .fileLoadPanel .closeFileLoad {
            background: url("http://dev.web.weixin.qq.com/zh_CN/htmledition/Images/button02.png") no-repeat -74px -18px;
            top: 0px;
            width: 15px;
            height: 15px;
            right: 0px;
            margin-top: -4px;
            margin-right: -7px;
            display: block;
            position: absolute;
            z-index: 3;
            border-image: initial;
        }

            .fileLoad .fileLoadPanel .closeFileLoad:active {
                background-position: -91px -18px;
            }

.cloudImgLoad .fileLoad .fileLoadPanel {
    margin-top: -18px;
    margin-left: 8px;
}

.chatPanel .recordInput {
    padding: 0px;
    border: currentColor;
    width: 385px;
    height: 31px;
    box-shadow: none;
}

    .chatPanel .recordInput .recordBakLeft {
        background: url("../Images/voice0117ced3.png") no-repeat center;
        width: 12px;
        height: 100%;
    }

    .chatPanel .recordInput .recordBakMiddle {
        background: url("../Images/voice0217ced3.png") repeat-x center;
        border-radius: 0px 5px 5px 0px;
        width: 371px;
        height: 100%;
        line-height: 30px;
        border-right-color: rgb(129, 135, 142);
        border-right-width: 1px;
        border-right-style: solid;
    }

        .chatPanel .recordInput .recordBakMiddle .recordInfo {
            line-height: 32px;
            font-size: 12px;
            text-shadow: none;
        }

    .chatPanel .recordInput .recordBakRight {
        background: url("../Images/voice0317ced3.png") no-repeat center;
        width: 30px;
        height: 100%;
        margin-top: -31px;
        margin-right: 2px;
        display: block;
    }

    .chatPanel .recordInput a.recordBakRight:active {
        background: url("../Images/voice03hl17ced3.png") no-repeat center;
    }

.newMsgPlayer img {
    left: -100000px;
}

.popupPhotoAlbumWindow {
    border-radius: 5px;
    border: 1px solid rgb(58, 59, 63);
    height: 100%;
    overflow: hidden;
    background-color: rgb(255, 255, 255);
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}

    .popupPhotoAlbumWindow .popupPhotoAlbumPanel {
        margin: 0px;
        padding: 0px;
        height: 100%;
        background-color: rgb(51, 58, 66);
    }

.popupPhotoAlbumPanel .friendCirL {
    width: 77%;
    height: 100%;
    border-right-color: rgba(35, 38, 43, 0.8);
    border-right-width: 1px;
    border-right-style: solid;
}

.popupPhotoAlbumPanel .friendCirR {
    width: 22%;
}

.popupPhotoAlbumPanel .friendCirLPanel {
    margin: 0px;
    padding: 60px 16px 16px;
    height: 100%;
    border-right-color: rgb(27, 28, 32);
    border-right-width: 1px;
    border-right-style: solid;
    background-color: rgb(255, 255, 255);
}

    .popupPhotoAlbumPanel .friendCirLPanel .photoView .photoViewOper {
        top: 50%;
        width: 49px;
        height: 49px;
        margin-top: -25px;
        display: none;
        position: absolute;
    }

    .popupPhotoAlbumPanel .friendCirLPanel .photoView .photoViewOperRight {
        right: 40px;
    }

    .popupPhotoAlbumPanel .friendCirLPanel .photoView .photoViewOperLeft {
        left: 40px;
    }

    .popupPhotoAlbumPanel .friendCirLPanel .photoView .photoViewOper a {
        height: 100%;
        display: block;
    }

    .popupPhotoAlbumPanel .friendCirLPanel .photoView a.photoPre {
        background: url("../Images/friend17ced3.png") no-repeat -39px -33px;
    }

    .popupPhotoAlbumPanel .friendCirLPanel .photoView .title {
        border: currentColor;
        color: rgb(206, 207, 210);
        padding-bottom: 5px;
        font-size: 20px;
        text-shadow: 0px 1px 0px #fff;
    }

        .popupPhotoAlbumPanel .friendCirLPanel .photoView .title .data {
            font-size: 40px;
        }

    .popupPhotoAlbumPanel .friendCirLPanel .photoView a.photoNext {
        background: url("../Images/friend17ced3.png") no-repeat -114px -34px;
    }

    .popupPhotoAlbumPanel .friendCirLPanel .photoView a.photoPre:active {
        background-position: -38px -88px;
    }

    .popupPhotoAlbumPanel .friendCirLPanel .photoView a.photoNext:active {
        background-position: -114px -89px;
    }

    .popupPhotoAlbumPanel .friendCirLPanel .photoView .photoViewBox {
        border-width: 1px;
        border-style: solid;
        border-color: rgb(236, 236, 237) rgb(227, 227, 227) rgb(211, 211, 211);
        margin: 0px auto;
        width: 80%;
        text-align: center;
        position: relative;
        box-shadow: 0px 1px 3px #dededf;
        background-color: rgb(255, 255, 255);
    }

        .popupPhotoAlbumPanel .friendCirLPanel .photoView .photoViewBox .photoWrapper img {
            vertical-align: middle;
            position: absolute;
        }

    .popupPhotoAlbumPanel .friendCirLPanel .photoViewBox .photoViewPanel {
        height: 100%;
        position: relative;
        z-index: 1;
    }

    .popupPhotoAlbumPanel .friendCirLPanel .photoView p {
        text-align: left;
        color: rgb(18, 18, 18);
        font-size: 14px;
        margin-left: 67px;
    }

    .popupPhotoAlbumPanel .friendCirLPanel .photoViewBox .albumContentWrapper {
        left: 0px;
        width: 100%;
        bottom: 0px;
        position: absolute;
        z-index: 2;
    }

    .popupPhotoAlbumPanel .friendCirLPanel .photoViewBox p.albumContent {
        padding: 5px 3%;
        width: 94%;
        height: 21px;
        text-align: left;
        color: rgb(255, 255, 255);
        font-size: 14px;
        margin-left: 0px;
        white-space: nowrap;
        -ms-text-overflow: ellipsis;
        text-shadow: none;
        background-color: rgba(50, 50, 50, 0.4);
    }

    .popupPhotoAlbumPanel .friendCirLPanel .photoViewBox .showAll p.albumContent {
        height: auto;
        white-space: normal;
    }

    .popupPhotoAlbumPanel .friendCirLPanel .photoPreView {
        margin-top: 31px;
    }

    .popupPhotoAlbumPanel .friendCirLPanel .albumContent {
        height: 42px;
        overflow: hidden;
    }

    .popupPhotoAlbumPanel .friendCirLPanel .photoPreView .photoPreList {
        margin: 19px auto 0px;
        width: 80%;
        position: relative;
    }

        .popupPhotoAlbumPanel .friendCirLPanel .photoPreView .photoPreList .photoListOper {
            width: 25px;
            height: 25px;
            margin-top: 20px;
            display: block;
        }

        .popupPhotoAlbumPanel .friendCirLPanel .photoPreView .photoPreList a {
            height: 100%;
            display: block;
        }

            .popupPhotoAlbumPanel .friendCirLPanel .photoPreView .photoPreList a.photoPreListPre {
                background: url("../Images/friend17ced3.png") no-repeat -48px -160px;
            }

            .popupPhotoAlbumPanel .friendCirLPanel .photoPreView .photoPreList a.photoPreListNext {
                background: url("../Images/friend17ced3.png") no-repeat -126px -160px;
            }

            .popupPhotoAlbumPanel .friendCirLPanel .photoPreView .photoPreList a.photoPreListPre:active {
                background-position: -48px -193px;
            }

            .popupPhotoAlbumPanel .friendCirLPanel .photoPreView .photoPreList a.photoPreListNext:active {
                background-position: -126px -193px;
            }

        .popupPhotoAlbumPanel .friendCirLPanel .photoPreView .photoPreList .photoPreListBox {
            margin: 12px auto 0px;
            height: 86px;
            overflow: hidden;
            max-width: 917px;
        }

            .popupPhotoAlbumPanel .friendCirLPanel .photoPreView .photoPreList .photoPreListBox ul {
                height: 100%;
            }

        .popupPhotoAlbumPanel .friendCirLPanel .photoPreView .photoPreList ul li {
            width: 93px;
            margin-right: 5px;
            float: left;
        }

        .popupPhotoAlbumPanel .friendCirLPanel .photoPreView .photoPreList ul a {
            border: 4px solid rgb(255, 255, 255);
            width: 78px;
            height: 78px;
            text-align: center;
            line-height: 76px;
            overflow: hidden;
            position: relative;
            background-color: rgb(227, 226, 226);
        }

            .popupPhotoAlbumPanel .friendCirLPanel .photoPreView .photoPreList ul a img {
                border: 1px solid rgb(255, 255, 255);
            }

        .popupPhotoAlbumPanel .friendCirLPanel .photoPreView .photoPreList .thumbPreView {
            padding: 2px;
            border: 1px solid rgb(183, 190, 198);
            left: 50%;
            top: -50px;
            display: none;
            position: absolute;
            box-shadow: 0px 1px 2px #eaebed;
            background-color: rgb(255, 255, 255);
        }

            .popupPhotoAlbumPanel .friendCirLPanel .photoPreView .photoPreList .thumbPreView .hook {
                left: 50%;
                bottom: 3px;
                margin-bottom: -5px;
                margin-left: -5px;
                position: relative;
            }

                .popupPhotoAlbumPanel .friendCirLPanel .photoPreView .photoPreList .thumbPreView .hook .hook2 {
                    border-width: 6px;
                    border-style: solid;
                    border-color: rgb(255, 255, 255) transparent transparent;
                    top: 0px;
                    width: 0px;
                    height: 0px;
                    display: block;
                    position: absolute;
                }

                .popupPhotoAlbumPanel .friendCirLPanel .photoPreView .photoPreList .thumbPreView .hook .hook1 {
                    border-width: 6px;
                    border-style: solid;
                    border-color: rgb(183, 190, 198) transparent transparent;
                    top: 1px;
                    width: 0px;
                    height: 0px;
                    display: block;
                    position: absolute;
                }

        .popupPhotoAlbumPanel .friendCirLPanel .photoPreView .photoPreList ul span {
            background: url("../Images/friend_photo_cover17ced3.png") no-repeat;
            left: 0px;
            top: 0px;
            width: 80px;
            height: 80px;
            display: block;
            position: absolute;
            z-index: 2;
        }

        .popupPhotoAlbumPanel .friendCirLPanel .photoPreView .photoPreList ul img {
            vertical-align: middle;
        }

        .popupPhotoAlbumPanel .friendCirLPanel .photoPreView .photoPreList .on a {
            border: 4px solid rgb(168, 189, 217);
            box-shadow: 0px 1px 0px #ebebeb;
        }

            .popupPhotoAlbumPanel .friendCirLPanel .photoPreView .photoPreList .on a span {
                display: none;
            }

.popupPhotoAlbumPanel .friendCirRPanel {
    margin: 0px;
    padding: 24px 0px 24px 10px;
}

    .popupPhotoAlbumPanel .friendCirRPanel a.closeIcon {
        background: url("../Images/friend17ced3.png") no-repeat -48px -286px;
        width: 22px;
        height: 22px;
        margin-top: -14px;
        margin-right: -10px;
        float: right;
        display: block;
    }

        .popupPhotoAlbumPanel .friendCirRPanel a.closeIcon:active {
            background-position: -45px -324px;
            width: 23px;
            height: 23px;
        }

    .popupPhotoAlbumPanel .friendCirRPanel .friendMsg {
        margin-top: 42px;
    }

        .popupPhotoAlbumPanel .friendCirRPanel .friendMsg .friendMsgInfo {
            margin-bottom: 26px;
        }

        .popupPhotoAlbumPanel .friendCirRPanel .friendMsg .avatar {
            border-radius: 3px;
            border: 1px solid rgb(0, 0, 0);
            width: 58px;
            height: 58px;
            margin-right: 12px;
            box-shadow: 0px 1px 3px #1e2126;
            -moz-border-radius: 3px;
            -webkit-border-radius: 3px;
        }

        .popupPhotoAlbumPanel .friendCirRPanel .friendMsg .name {
            width: 196px;
            color: rgba(255, 255, 255, 0.8);
            overflow: hidden;
            font-size: 25px;
            margin-bottom: 5px;
            white-space: nowrap;
            -ms-text-overflow: ellipsis;
            text-shadow: none;
            -o-text-overflow: ellipsis;
        }

        .popupPhotoAlbumPanel .friendCirRPanel .friendMsg .location {
            color: rgba(255, 255, 255, 0.8);
            text-shadow: none;
        }

    .popupPhotoAlbumPanel .friendCirRPanel .praise {
        margin: 0px -19px 40px -9px;
        padding: 27px 11px 2px 14px;
        overflow: hidden;
        border-top-color: rgb(44, 49, 56);
        border-bottom-color: rgb(44, 49, 56);
        border-top-width: 1px;
        border-bottom-width: 1px;
        border-top-style: solid;
        border-bottom-style: solid;
        max-height: 130px;
        box-shadow: 0px 1px 0px #3f4653;
        background-color: rgb(48, 53, 59);
    }

    .popupPhotoAlbumPanel .friendCirRPanel .showAll.praise {
        max-height: none;
    }

    .popupPhotoAlbumPanel .friendCirRPanel .title .blueColor {
        color: rgb(148, 171, 221);
    }

    .popupPhotoAlbumPanel .friendCirRPanel .praise .title {
        padding: 0px 14px 17px 0px;
        border: currentColor;
        height: auto;
        color: rgba(255, 255, 255, 0.8);
        font-size: 12px;
        margin-bottom: 12px;
        text-shadow: 0px 1px 0px #1d2024;
    }

    .popupPhotoAlbumPanel .friendCirRPanel .praise ul {
    }

    .popupPhotoAlbumPanel .friendCirRPanel .praise .title .icon {
        background: url("../Images/friend17ced3.png") no-repeat -48px -244px;
        width: 19px;
        height: 17px;
        margin-right: 5px;
    }

    .popupPhotoAlbumPanel .friendCirRPanel .praise li {
        margin: 0px 4px 12px 0px;
        float: left;
    }

        .popupPhotoAlbumPanel .friendCirRPanel .praise li a {
            height: 39px;
            display: block;
        }

        .popupPhotoAlbumPanel .friendCirRPanel .praise li img {
            width: 40px;
            height: 39px;
        }

    .popupPhotoAlbumPanel .friendCirRPanel .praise a.moreIcon {
        background: url("../Images/friend17ced3.png") no-repeat -44px -361px;
        margin: 0px auto;
        top: -14px;
        width: 25px;
        height: 25px;
        display: block;
        position: relative;
    }

        .popupPhotoAlbumPanel .friendCirRPanel .praise a.moreIcon:active {
            background-position: -142px -130px;
        }

    .popupPhotoAlbumPanel .friendCirRPanel .comments {
        color: rgba(255, 255, 255, 0.8);
        text-shadow: 0px 1px 0px #000;
    }

        .popupPhotoAlbumPanel .friendCirRPanel .comments .title {
            padding: 0px;
            border-radius: 0px;
            height: auto;
            border-top-color: currentColor;
            border-bottom-color: rgb(65, 72, 82);
            border-top-width: medium;
            border-bottom-width: 1px;
            border-top-style: none;
            border-bottom-style: solid;
        }

        .popupPhotoAlbumPanel .friendCirRPanel .comments .titlePanel {
            padding: 0px 9px 7px;
            border-bottom-color: rgb(38, 43, 51);
            border-bottom-width: 1px;
            border-bottom-style: solid;
        }

            .popupPhotoAlbumPanel .friendCirRPanel .comments .titlePanel .commentIcon {
                background: url("../Images/friend17ced3.png") no-repeat -129px -244px;
                margin: 0px 5px -7px 0px;
                width: 20px;
                height: 19px;
                display: inline-block;
            }

        .popupPhotoAlbumPanel .friendCirRPanel .comments .title a {
            color: rgba(255, 255, 255, 0.8);
            text-shadow: 0px 1px 0px #000;
        }

            .popupPhotoAlbumPanel .friendCirRPanel .comments .title a:hover {
                text-decoration: none;
            }

        .popupPhotoAlbumPanel .friendCirRPanel .comments .commentContent span.emoji {
            vertical-align: text-bottom;
        }

        .popupPhotoAlbumPanel .friendCirRPanel .comments .commentContent img {
            vertical-align: middle;
        }

        .popupPhotoAlbumPanel .friendCirRPanel .comments ul {
            -ms-overflow-y: scroll;
        }

            .popupPhotoAlbumPanel .friendCirRPanel .comments ul li {
                margin-top: 11px;
                border-bottom-color: rgb(65, 72, 82);
                border-bottom-width: 1px;
                border-bottom-style: solid;
            }

                .popupPhotoAlbumPanel .friendCirRPanel .comments ul li a {
                    padding: 0px 8px 11px;
                    border-bottom-color: rgb(38, 43, 51);
                    border-bottom-width: 1px;
                    border-bottom-style: solid;
                    display: block;
                }

                    .popupPhotoAlbumPanel .friendCirRPanel .comments ul li a:hover {
                        text-decoration: none;
                    }

            .popupPhotoAlbumPanel .friendCirRPanel .comments ul img.avatar {
                border-radius: 0px;
                border: currentColor;
                width: 40px;
                height: 40px;
                box-shadow: none;
            }

        .popupPhotoAlbumPanel .friendCirRPanel .comments .commentPanel {
            margin-left: 52px;
        }

            .popupPhotoAlbumPanel .friendCirRPanel .comments .commentPanel p {
                color: rgb(47, 47, 47);
                line-height: 1em;
                font-size: 14px;
                margin-bottom: 8px;
                max-width: 292px;
                text-shadow: none;
            }

            .popupPhotoAlbumPanel .friendCirRPanel .comments .commentPanel .commentContent {
                margin: 4px 0px 0px;
                color: rgba(255, 255, 255, 0.8);
                line-height: 20px;
                font-size: 12px;
                text-shadow: 0px 1px 0px #000;
            }

            .popupPhotoAlbumPanel .friendCirRPanel .comments .commentPanel .commentor {
                margin: 0px;
                color: rgba(255, 255, 255, 0.8);
                overflow: hidden;
                font-size: 14px;
                display: inline-block;
                white-space: nowrap;
                -ms-text-overflow: ellipsis;
                max-width: 73px;
                text-shadow: 0px 1px 0px #000;
                -o-text-overflow: ellipsis;
            }

            .popupPhotoAlbumPanel .friendCirRPanel .comments .commentPanel .reply {
                color: rgb(94, 116, 155);
                font-size: 12px;
            }

            .popupPhotoAlbumPanel .friendCirRPanel .comments .commentPanel .time {
                color: rgb(166, 166, 166);
                font-size: 12px;
            }

.feedbackWin {
    padding: 0px;
    margin-top: -15px;
    margin-bottom: 20px;
    position: relative;
}

    .feedbackWin .left {
        right: 5px;
        bottom: 5px;
        font-family: Constantia, Georgia;
        font-size: 22px;
        font-style: italic;
        position: absolute;
    }

    .feedbackWin textarea {
        font: 14px/1.2em Helvetica, "Î¢ÈíÑÅºÚ", "ºÚÌå", Arial, Tahoma;
        padding: 5px;
        border: 1px solid rgb(152, 156, 161);
        width: 97%;
        height: 80px;
        overflow: auto;
        -ms-word-wrap: break-word;
        font-size-adjust: none;
        font-stretch: normal;
        resize: none;
    }

    .feedbackWin .opArea {
        width: 200px;
        margin-top: 5px;
        float: right;
    }

.cloudVoice {
    cursor: pointer;
}

    .cloudVoice .replyVoice {
        position: absolute;
    }

.cloudText img {
    margin-bottom: -5px;
    vertical-align: text-bottom;
}

.cloudImg {
    line-height: 0;
}

    .cloudImg .cloudContent {
        min-height: 30px;
        max-height: 200px;
    }

        .cloudImg .cloudContent img {
            min-height: 50px;
            min-width: 50px;
        }

            .cloudImg .cloudContent img.waitingEffect {
                left: -30px;
                top: 23px;
                width: 16px;
                height: 16px;
                position: absolute;
                min-height: 0px;
                min-width: 0px;
            }

.cloudVideo {
    line-height: 0;
}

.chatItem .cloudBody {
    border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-top-colors: none;
    -moz-border-right-colors: none;
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
}

.chatItem .cloudContent {
    border-radius: 5px;
    text-shadow: none;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
}

.you {
    width: 100%;
    float: left;
    _background: none;
    _border: none;
}

    .you .avatar {
        float: left;
    }

    .you .sendStatus {
        top: 50%;
        width: 200px;
        text-align: left;
        right: -198px;
        color: rgb(184, 184, 184);
        font-size: 12px;
        margin-top: -23px;
        position: absolute;
    }

        .you .sendStatus span {
            margin-top: 7px;
            margin-left: 7px;
            display: block;
        }

        .you .sendStatus .iconSendFailed {
            background: url("../Images/icon_chat17ced3.png") no-repeat -7px -136px;
            width: 17px;
            height: 17px;
            margin-top: 14px;
        }

        .you .sendStatus .unread {
            background: url("../Images/icon_chat17ced3.png") no-repeat -8px -72px;
            margin: 6px 0px -12px 3px;
            width: 17px;
            height: 17px;
        }

    .you .cloud {
        margin: 0px 0px 0px 15px;
        float: left;
        min-width: 50px;
        max-width: 300px;
    }

        .you .cloud .cloudPannel .file {
            border-radius: 8px;
            height: 77px;
            -moz-border-radius: 8px;
            -webkit-border-radius: 8px;
        }

            .you .cloud .cloudPannel .file .fileIcon {
                border-radius: 0px 6px 6px 0px;
                float: right;
                -moz-border-radius: 0px 6px 6px 0px;
                -webkit-border-radius: 0px 6px 6px 0px;
            }

            .you .cloud .cloudPannel .file .info {
                border-radius: 6px 0px 0px 6px;
                border-right-color: currentColor;
                border-left-color: rgb(151, 151, 151);
                border-right-width: medium;
                border-left-width: 1px;
                border-right-style: none;
                border-left-style: solid;
                float: left;
                -moz-border-radius: 6px 0px 0px 6px;
                -webkit-border-radius: 6px 0px 0px 6px;
            }

        .you .cloud .cloudPannel .cloudFileArrow {
            background: url("../Images/filetype_guid_right1db6f8.png") no-repeat;
            left: -9px;
            top: 10px;
            width: 17px;
            height: 24px;
            right: -12px;
            position: absolute;
        }

    .you .cloudBody {
        border-radius: 6px;
        border: 1px solid rgb(159, 159, 159);
        box-shadow: 0px 1px 0px #d5d5d5;
        background-color: rgb(236, 236, 236);
    }

    .you .cloudContent {
        padding: 7px 10px;
        color: rgb(3, 3, 3);
        border-top-color: rgb(255, 255, 255);
        border-right-color: rgb(242, 242, 242);
        border-bottom-color: rgb(242, 242, 242);
        border-top-width: 1px;
        border-right-width: 1px;
        border-bottom-width: 1px;
        border-top-style: solid;
        border-right-style: solid;
        border-bottom-style: solid;
        background-color: rgb(236, 236, 236);
        
    }

    .you .cloudVoice {
        margin-left: 10px;
    }

        .you .cloudVoice .replyVoice {
            left: 35px;
            top: 15px;
        }

        .you .cloudVoice .cloudBody {
            margin: 0px 8px 9px 7px;
            padding-left: 18px;
            position: relative;
        }

        .you .cloudVoice .cloudArrow {
            background: url("../Images/bubble_white_guid1dbc1c.png") no-repeat 0px 0px;
            left: 0px;
            top: 11px;
            width: 18px;
            height: 25px;
            position: absolute;
        }

        .you .cloudVoice .cloudContent {
            padding: 7px 6px;
            border-radius: 7px;
            margin-left: -20px;
            display: block;
            -moz-border-radius: 7px;
            -webkit-border-radius: 7px;
        }

            .you .cloudVoice .cloudContent .icoVoice {
                background: url("../Images/icon_sound_new1dbc39.png") no-repeat 0px -1px;
                width: 25px;
                height: 20px;
                margin-left: 0px;
                float: left;
                display: inline-block;
                cursor: pointer;
            }

            .you .cloudVoice .cloudContent .icoVoicePlaying {
                background: url("../Images/voice0021dbc50.gif") no-repeat left 0px;
                width: 20px;
                height: 20px;
                float: left;
                display: inline-block;
            }

    .you .cloudText .sendStatus {
        margin-top: -8px;
    }

    .you .cloudText .cloudArrow {
        background: url("../Images/bubble_white_guid1dbc1c.png") no-repeat;
        left: -7px;
        top: 11px;
        width: 13px;
        height: 24px;
        position: absolute;
    }

    .you .cloudImg .cloudContent {
        padding: 6px;
        color: rgb(3, 3, 3);
        max-height: 150px;
    }

    .you .cloudImg .cloudArrow {
        background: url("../Images/bubble_white_guid1dbc1c.png") no-repeat;
        left: -7px;
        top: 10px;
        width: 17px;
        height: 24px;
        right: -12px;
        position: absolute;
    }

    .you .cloudVideo .cloudContent {
        padding: 7px;
        border-radius: 13px;
        color: rgb(3, 3, 3);
    }

    .you .cloudVideo .cloudArrow {
        background: url("../Images/bubble_white_guid1dbc1c.png") no-repeat;
        left: -7px;
        top: 10px;
        width: 17px;
        height: 24px;
        right: -12px;
        position: absolute;
    }

    .you .cloudMesg .cloudContent {
        border-radius: 5px 0px 0px 5px;
        border: currentColor;
        -moz-border-radius: 5px 0px 0px 5px;
        -webkit-border-radius: 5px 0px 0px 5px;
    }

    .you .cloudMesg .cloudArrow {
        background: url("../Images/bubble_openapi1d20a9.png") no-repeat;
        left: -8px;
        top: 10px;
        width: 13px;
        height: 24px;
        position: absolute;
    }

    .you .chatItemContent .cloudMesgLink .cloudBody {
        background-color: rgb(250, 250, 250);
    }

    .you .chatItemContent .cloudMesgFile .cloudBody {
        background-color: rgb(250, 250, 250);
    }

    .you .cloudMesgAppEmojiPanel .cloudMesgIcon {
        float: left;
    }

    .you .haveAvatarCard {
        margin-left: 20px;
        float: left;
    }

        .you .haveAvatarCard .cloudBody {
            border-radius: 2px;
            -moz-border-radius: 2px;
            -webkit-border-radius: 2px;
        }

        .you .haveAvatarCard .cloudContent {
            padding: 0px;
        }

.me {
    width: 100%;
    float: right;
}

    .me .avatar {
        margin-right: 18px;
        float: right;
    }

    .me .cloud {
        margin: 0px 15px 0px 0px;
        float: right;
        min-width: 50px;
        max-width: 300px;
    }

        .me .cloud .cloudPannel .file {
            border: 1px solid rgb(117, 151, 92);
            height: 77px;
        }

        .me .cloud .cloudPannel .cloudFileArrow {
            background: url("../Images/filetype_guid_left1db6f8.png") no-repeat 0px 0px;
            top: 8px;
            width: 18px;
            height: 25px;
            right: -14px;
            position: absolute;
        }

    .me .cloudBody {
        border: 1px solid rgb(159, 159, 159);
        box-shadow: 0px 1px 0px #d5d5d5;
        /*background-color: rgb(178, 207, 115);*/
    }

    .me .cloudContent {
        /*background: rgb(178, 207, 115);*/
        padding: 7px 10px;
        border-radius: 4px;
        color: rgb(0, 0, 0);
        overflow: hidden;
        border-top-color: #CCCCCC;
        border-bottom-color: #CCCCCC;
        border-left-color: #CCCCCC;
        border-top-width: 1px;
        border-bottom-width: 1px;
        border-left-width: 1px;
        border-top-style: solid;
        border-bottom-style: solid;
        border-left-style: solid;
        text-shadow: none;
        -moz-border-radius: 4px;
        -webkit-border-radius: 4px;
       
    }

    .me .sendStatus {
        left: -250px;
        top: 50%;
        width: 250px;
        text-align: right;
        color: rgb(184, 184, 184);
        font-size: 12px;
        margin-top: -9px;
        position: absolute;
    }

        .me .sendStatus .iconSendFailed {
            background: url("../Images/icon_chat17ced3.png") no-repeat 50% -240px;
            width: 30px;
            height: 30px;
            margin-top: -5px;
        }

            .me .sendStatus .iconSendFailed:active {
                background: url("../Images/icon_chat17ced3.png") no-repeat 50% -240px;
            }

    .me .cloudText .cloudBody {
        margin-left: 8px;
    }

    .me .cloudText .cloudArrow {
        background: url("../Images/bubble_green_guid1dbc1c.png") no-repeat;
        top: 11px;
        width: 13px;
        height: 24px;
        right: -12px;
        position: absolute;
    }

    .me .cloudText .cloudContent {
        vertical-align: top;
    }

    .me .cloudText .sendStatus {
        margin-top: -10px;
    }

    .me .cloudMesg .cloudBody {
        /*background-color: rgb(164, 195, 99);*/
    }

    .me .cloudMesg .cloudContent {
        border-bottom-color: currentColor;
        border-bottom-width: medium;
        border-bottom-style: none;
    }

    .me .cloudMesg .cloudArrow {
        background: url("../Images/bubble_green_guid1dbc1c.png") no-repeat;
        top: 10px;
        width: 17px;
        height: 24px;
        right: -17px;
        position: absolute;
    }

    .me .cloudVoice {
        margin-right: 10px;
    }

        .me .cloudVoice .cloudBody {
            margin: 0px 7px;
            position: relative;
            _display: none;
        }

        .me .cloudVoice .cloudContent {
            padding: 7px;
            border: currentColor;
        }

        .me .cloudVoice .imageBorder {
            border: 1px solid rgb(164, 164, 164);
        }

        .me .cloudVoice .cloudArrow {
            background: url("../Images/bubble_green_guid1dbc1c.png") no-repeat 0px 0px;
            top: 11px;
            width: 18px;
            height: 25px;
            right: -10px;
            position: absolute;
        }

        .me .cloudVoice .icoVoice {
            background: url("../Images/icon_sound_new1dbc39.png") no-repeat -24px -1px;
            width: 25px;
            height: 20px;
            float: right;
            display: inline-block;
            cursor: pointer;
        }

        .me .cloudVoice .icoVoicePlaying {
            background: url("../Images/voice0011dbc39.gif") no-repeat left 0px;
            width: 18px;
            height: 20px;
            float: right;
            display: inline-block;
        }

        .me .cloudVoice .replyVoice {
            top: 0px;
            right: 30px;
        }

    .me .cloudImg .cloudBody {
        /*background: rgb(229, 229, 229);*/
        border-radius: 6px;
        border: 1px solid rgb(159, 159, 159);
        _display: none;
    }

    .me .cloudImg .cloudContent {
        padding: 5px;
        border-radius: 8px;
        border: currentColor;
        max-height: 150px;
    }

    .me .cloudImg .imageBorder {
        border-radius: 0px;
        border: 5px solid rgb(229, 229, 229);
    }

    .me .cloudImg .sendStatus {
        margin-top: -10px;
    }

    .me .cloudImg .cloudArrow {
        background: url("../Images/bubble_green_guid1dbc1c.png") no-repeat 0px 0px;
        top: 8px;
        width: 18px;
        height: 25px;
        right: -17px;
        position: absolute;
    }

    .me .cloudVideo .imageBorder {
        border: 1px solid rgb(164, 164, 164);
    }

    .me .cloudVideo .cloudBody {
        /*background: rgb(229, 229, 229);*/
        border-radius: 6px;
        border: 1px solid rgb(159, 159, 159);
        _display: none;
    }

    .me .cloudVideo .cloudContent {
        padding: 7px;
        border-radius: 6px;
    }

    .me .cloudVideo .cloudArrow {
        background: url("../Images/bubble_green_guid1dbc1c.png") no-repeat;
        top: 10px;
        width: 17px;
        height: 24px;
        right: -16px;
        position: absolute;
    }

    .me .cloudMesgWord .cloudContent {
        border-radius: 5px;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
    }

    .me .chatItemContent .cloudMesg .cloudBody {
        padding: 0px;
        border-radius: 6px 5px 5px 6px;
        border-right-color: currentColor;
        border-right-width: medium;
        border-right-style: none;
    }

    .me .chatItemContent .cloudMesgFile .cloudBody {
        border: currentColor;
        /*background-color: rgb(239, 240, 244);*/
    }

    .me .cloudMesgAppEmojiPanel .cloudMesgIcon {
        float: right;
    }

    .me .haveAvatarCard {
        margin-right: 20px;
        float: right;
    }

        .me .haveAvatarCard .cloudBody {
            border-radius: 2px;
            -moz-border-radius: 2px;
            -webkit-border-radius: 2px;
        }

        .me .haveAvatarCard .cloudContent {
            margin: 0px;
            padding: 0px;
        }

.loginFrame {

    text-align: center;
    width: 100%;
    height: 400px;
    display: block;/*divÄÚÁª»»ÐÐ*/
}






.txt {
    border: 1px solid #73A0DF;
    background: white;
    padding: 0px 3px;
    -moz-border-radius: 2px;
    -khtml-border-radius: 2px;
    -webkit-border-radius: 2px;
    border-radius: 2px;
    margin-right: 1px;
    height: 20px;
    line-height: 20px;
    font-size: 12px;
}

.tag {
    padding-left: 10px;
    text-align: right;
}

body, p, form, button, input, textarea, th, td {
    margin: 0;
    padding: 0;
}

.btnHigh {
    margin: 2px 0px 0px 3px;
    font-size: 12px;
    padding: 3px 8px 3px 8px;
    cursor: pointer;
    display: inline-block;
    text-align: center;
    line-height: 1;
    height: 2em;
    /*letter-spacing: 2px;*/
    font-weight: bold;
    font-family: Î¢ÈíÑÅºÚ;
    width: auto;
    overflow: visible;
    color: #000;
    border: solid 1px #999;
    border-radius: 3px;
    background: #DDD;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#FFFFFF', endColorstr='#DDDDDD');
    background: linear-gradient(top, #FFF, #DDD);
    background: -moz-linear-gradient(top, #FFF, #DDD);
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#FFF), to(#DDD));
    text-shadow: 0px 1px 1px rgba(255, 255, 255, 1);
    box-shadow: 0 1px 0 rgba(255, 255, 255, .7), 0 -1px 0 rgba(0, 0, 0, .09);
    -moz-transition: -moz-box-shadow linear .2s;
    -webkit-transition: -webkit-box-shadow linear .2s;
    transition: box-shadow linear .2s;
}

    .btnHigh::-moz-focus-inner {
        border: 0;
        padding: 0;
        margin: 0;
    }

    .btnHigh:focus {
        outline: none 0;
        border-color: #426DC9;
        box-shadow: 0 0 8px rgba(66, 109, 201, .9);
    }

    .btnHigh:hover {
        color: #000;
        border-color: #666;
    }

    .btnHigh:active {
        border-color: #666;
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#DDDDDD', endColorstr='#FFFFFF');
        background: linear-gradient(top, #DDD, #FFF);
        background: -moz-linear-gradient(top, #DDD, #FFF);
        background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#DDD), to(#FFF));
        box-shadow: inset 0 1px 5px rgba(66, 109, 201, .9), inset 0 1px 1em rgba(0, 0, 0, .3);
    }

    .btnHigh[disabled] {
        cursor: default;
        color: #666;
        background: #DDD;
        border: solid 1px #999;
        filter: alpha(opacity=50);
        opacity: .5;
        box-shadow: none;
    }


/*µÇÂ¼ÑùÊ½*/
.loginPanelMtalk {
    width: 400px;
    border: medium none;
    margin: 0 auto;
    padding: 17px 0 0;
    position: static;
    margin-top: 100px;
}

    /*.loginPanelMtalk .list {
                border: 1px solid #424448;
                border-radius: 6px 6px 6px 6px;
                box-shadow: 0 2px 6px #313131;
                float: left;
                position: relative;
                width: 100%;
                z-index: 99;
            }*/

    .loginPanelMtalk .loginlist {
        border-radius: 6px;
        border: 1px solid rgb(66, 68, 72);
        width: 400px;
        float: left;
        position: relative;
        z-index: 99;
        box-shadow: 0px 2px 6px #313131;
    }
        /*.loginPanelMtalk .list .top {
                    background-color: #5B6774;
                    background-image: -moz-linear-gradient(center top, #6A7786 10%, #5E6977 50%, #56616D 90%, #545E6A 100%);
                    border-bottom: 1px solid #333333;
                    border-radius: 3px 3px 0 0;
                    border-top: 1px solid #9BA3AE;
                }*/

        .loginPanelMtalk .loginlist .logintop {
            border-radius: 3px 3px 0px 0px;
            border-top-color: rgb(155, 163, 174);
            border-bottom-color: rgb(51, 51, 51);
            border-top-width: 1px;
            border-bottom-width: 1px;
            border-top-style: solid;
            border-bottom-style: solid;
            background-color: rgb(91, 103, 116);
        }
            /*.loginPanelMtalk .list .top .title {
                        border-radius: 5px 5px 0 0;
                        height: 39px;
                    }*/
            .loginPanelMtalk .loginlist .logintop .logintitle {
                border-radius: 5px 5px 0px 0px;
                height: 39px;
                text-align:left;
            }

    /*.loginPanelMtalk .chatContent {
                overflow: hidden;
                padding: 10px;
                position: relative;
                width: 100%;
            }*/
    .loginPanelMtalk .loginchatContent {
        padding: 10px;
        width: 100%;
        overflow: hidden;
        position: relative;
    }

    /* .loginPanelMtalk .chatScorll {
                background-color: #EFF3F7;
                height: 390px;
                min-height: 200px;
                overflow-x: hidden;
                overflow-y: auto;
                width: 100%;
            }*/
    .loginPanelMtalk .loginchatScorll {
        width: 100%;
        height: 390px;
        overflow: hidden;
        -ms-overflow-y: auto;
        min-height: 200px;
        background-color: rgb(239, 243, 247);
    }

    /*.loginPanelMtalk .chatOperator {
                background: -moz-linear-gradient(center top, #F8F9FA, #DADDDF) repeat scroll 0 0 rgba(0, 0, 0, 0);
                border-bottom: 1px solid #DDDDDD;
                border-radius: 0 0 4px 4px;
                border-top: 1px solid #808384;
                color: #383E45;
                height: 40px;
                position: relative;
                text-align: left;
            }*/

    .loginPanelMtalk .loginchatOperator {
        border-radius: 0px 0px 4px 4px;
        height: 30px;
        text-align: left;
        color: rgb(56, 62, 69);
        border-top-color: rgb(128, 131, 132);
        border-bottom-color: rgb(221, 221, 221);
        border-top-width: 1px;
        border-bottom-width: 1px;
        border-top-style: solid;
        border-bottom-style: solid;
        position: relative;
        background-color: rgb(234, 236, 238);
        -moz-border-radius: 0 0 4px 4px;
        -webkit-border-radius: 0 0 4px 4px;
    }
    
.dialogDiv {
    display: none;

}

.messageImage {
    max-width:100%;
    max-height:300px; 
    cursor:pointer;
}

 .goods_name { 
    color: #666; 
    display: block;
    line-height: 18px;
    padding: 5px 0px 10px 2px;
    font-weight: 600;
} 