﻿body, ul, li {
    padding: 0;
    margin: 0;
    border: 0;
}
body {
    margin: 0px;
    padding: 0px 0px 0px 0px;
    border: 0px;
    font-size: 10pt;
    FONT-FAMILY: Tahoma;
}
body {
    -webkit-text-size-adjust: none;
    font-family: helvetica;
}

*,*:after,*:before {
	box-sizing:border-box;
	outline:none
}
body,html {
	height:100%;
	font-family:"Microsoft YaHei",sans-serif;

	line-height:1.42857143
}
body {
	margin:0;background-color:#ebebeb;
}
p { margin-top:0px;margin-bottom:0px;}
a {
	text-decoration:none;
	cursor:pointer
}
a img {
	border:0
}
#header {
    position: absolute;
    z-index: 2;
    top: 0;
    left: 0;
    width: 100%;
    height: 42px;
    padding: 0;
}
#headerBox p {
   float:left; font-family:微软雅黑; font-size:18px; color:#FFF; line-height:42px;
}
#headerBox img 
{
  margin-left:8px;
    float:left;
    height:70%; 
    margin-top:6px;
    
}
.bottomsend {
    width: 100%;
    height: 45px;
    top: 8px;
    left: 0;
    position: absolute;
    z-index: 100;
}
#footer 
{
	background-color:#fff;
    position: absolute;
    z-index: 2;
    bottom:0;
    left: 0;
    width: 100%;
    height: 65px;
    padding: 0;
}
#mainContent {
    position: absolute;
    z-index: 1;
    top: 42px;
    bottom: 65px;
    left: 0;
    width: 100%;
    overflow: auto;
    overflow-x: hidden;
}
#chatMessageArea {
    position: absolute;
    z-index: 1;
    -webkit-tap-highlight-color: rgba(0,0,0,0);
    width: 100%;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left:6px;
    padding-right:10px;

}

a.button_1 {
    width: 30px;
    height: 30px;
    display: block;
    margin: 0px;
}
.btn-camera {
    display: block;
    height: 76px;
    cursor: pointer;
}
.icon-camera {
    background-repeat: no-repeat;
    display: block;
    height: 76px;
    background-size: contain;
}
#cameraFile,#cameraFile1 {
    position: absolute;
    visibility: hidden;
}

.logo {
    background-image: url(../newMobile/up3.gif);
    width: 30px;
    height: 30px;
    top: 6px;
    left: 6px;
    position: absolute;
    z-index: 101;
}
.toptitle {
    width: 100%;
    height: 42px;
    top: 0px;
    left: 0px;
    position: absolute;
    z-index: 100;
}
.topclose {
    height: 30px;
    position: absolute;
    right: 8px;
    top: 8px;
    width: 30px;
    z-index: 101;
}
.topclose img {
    width:25px;height:25px;cursor:pointer;
}
#bottomtip 
{
	display:block;
	white-space:nowrap;
	overflow:hidden;
    width: 100%;
    height: 20px;
    top: 45px;
    left: 0px;
    position: absolute;
    z-index: 100;
}


.editor 
{
	font: 12pt/16px Arial;
    BORDER: 0;
    width: 100%;
    overflow: hidden;
    resize: none;
    border-bottom-width: 1px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: solid;
	border-left-style: none;
	border-bottom-color: #ebebeb;	
    padding-top: 8px;
    height: 30px;
}
#emotionsBox, #emotionsBox1 {margin: 0px; padding: 0px;width: 100%;position:absolute;display:none;z-Index:999999;padding:0px;left:0px; background-color:#fcfcfc;bottom:66px;border-top-width: 1px;
	border-bottom-style: none;
	border-right-style: none;
	border-top-style: solid;
	border-left-style: none;
	border-top-color: #ebebeb;	}

ol, ul, li, dl, dt, dd {
    list-style: outside none none;
}
#emotionsBox li{width:72px; height:72px; float:left;}
#emotionsBox li img{width:64px; height:64px; margin:4px;}
.msg-box {
	margin-bottom:16px
}
.msg-agent,.msg-client {
	position:relative;
	width:100%;
}
.msg-agent:after,.msg-client:after {
	display:block;
	clear:both;
	content:''
}
.msg-agent .bubble,.msg-client .bubble {
	position:relative;
	padding:8px 12px;
	line-height:20px;
	border-radius:6px;
	word-wrap:break-word;
	word-break:break-all
}
.msg-agent .bubble .text .emoji,.msg-client .bubble .text .emoji {
	width:20px;
	height:20px;
	vertical-align:middle
}
 .text 
 {
 	font-size:15px;
}
.text1 
 {
 	font-size:12px;color: #58595b;line-height:20px;margin-top:-2px
}
.msg-agent .bubble .text a,.msg-client .bubble .text a {
	text-decoration:underline
}
.msg-agent .photo,.msg-client .photo {
	position:relative
}
.msg-agent .photo img,.msg-client .photo img {
	width:auto;
	max-width:100%;
	max-height:280px;
	border-radius:4px
}
.msg-agent .arrow,.msg-agent .arrow-bg,.msg-client .arrow,.msg-client .arrow-bg {
	position:absolute;
	display:block;
	width:0;
	height:0;
	font-size:0
}
.msg-client .bubble,.msg-client .photo {
	float:right;
	width:auto;
	max-width:100%;
	margin-left:35px
}
.msg-client .arrow {
	top:14px;
	right:-6px;
	border-top:5px solid transparent;
	border-bottom:5px solid transparent
}
.msg-agent .agent-avatar {
	position:absolute;
	top:0;
	left:0
}
.msg-agent .agent-avatar>img {
	width:36px;
	height:36px;
	margin-top:1px;
	border-radius:18px
}
.msg-agent .bubble,.msg-agent .photo {
	float:left;
	width:auto;
	max-width:100%;
	margin-right:35px;
	margin-left:50px
}
.msg-agent .bubble {
	color:#000;
	background-color:#fff;
	border:1px solid #f0f0f0
}
.msg-agent .bubble a {
	color:#000
}
.msg-agent .arrow-bg {
	top:13px;
	left:-7px;
	border-top:6px solid transparent;
	border-bottom:6px solid transparent;
	border-right:7px solid #f0f0f0
}
.msg-agent .arrow {
	top:14px;
	left:-6px;
	border-top:5px solid transparent;
	border-bottom:5px solid transparent;
	border-right:6px solid #fff
}
.msg-system 
{
	overflow:hidden;
	width:100%;
	margin-bottom:20px;
	color:#999;
	text-align:center;
	font-size:9pt;
}
.bubble-prologue{
    margin-left:0px!important;
    margin-right:0px!important;
    width:100%!important;
    float:none!important;
}
.msg-client {
	color:#000;
}
.msg-client a {
	color:blue;
}

.innerHeader{color:#fff;-webkit-box-shadow: 0 3px 5px rgba(148,144,133,0.5);}
.headinfo{height:42px;text-align: left;text-indent:10px;border-top: 1px solid rgb(174,203,237);}
.innerContainer{padding:5px 0px 5px 20px;position:relative;left:0;top:0;}
.pl10{padding-left:10%}
.surveyul{list-style: none;}
.surveyul-item{margin-top:10px;}
.surveyul-item input{margin-right:5px;}
.surveyul-mcomments{display:none;margin-top:15px;}
.surveyul-mcomments textarea{width:220px;height:80px;max-width:220px;max-height: 80px;overflow: auto; border: 1px solid #EAEAEA}
.surveyul-showcom,.surveyul-btn{text-align: right;margin-top:15px;padding-right:10%}
.button{min-width:65px;height:35px;color:#45c01a;border: 1px solid #45c01a;background: none;border-radius: 6px;}
.tipwords{color:#5079AA;margin-top:6px;margin-bottom:6px;line-height:25px;}
.errorMessage{margin:10px 0;text-align:left;color:#F6BD86;}
.ml-20{margin-left:20px;}
.tips{position: absolute;background: #FFF8E8;border: 1px solid #FFBA00;padding: 10px;-moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius: 5px;z-index:10000}
h1{padding:0; margin: 0;font-weight:normal; }
form{ vertical-align: top;}
.rechat{width:180px; margin:13px 0 0 0; height:42px; border:none; background:#06a5ef; color:#fff; -webkit-appearance:none; -moz-border-radius:0; -webkit-border-radius:0; -o-border-radius:0; -ms-border-radius:0; border-radius:0; outline:none;}
.zi {
    color: #bdbebf;
    font-size: 10px;
    height: auto;
    line-height: 16px;
    text-align: center;
    width: auto;
}
  .zi img {
    border: 0 none;
    vertical-align: top;
}

.arrow_box,.arrow_box_left,.arrow_box_vote {
	position: relative;
  border-radius: 6px;
  padding: 8px 12px;
   max-width: 82%;
    width: auto;
    word-break: break-all;
    word-wrap: break-word;
}
.arrow_box {
	margin-right:10px;
	background: #b2e866;
    float: right;
   border: 1px solid #94d03f;
}
.arrow_box_left {
    
    margin-right: 15px;
background: #fff;
    float: left;
border: 1px solid #d8d8d8;
}
.arrow_box_vote {
    margin-top: -30px;
background: #b2e866;
border: 1px solid #94d03f;
color: #000;
}
.arrow_box:after, .arrow_box:before,.arrow_box_left:after, .arrow_box_left:before,.arrow_box_vote:after, .arrow_box_vote:before 
{
	border: solid transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	top: 16px;
}
.arrow_box:after, .arrow_box:before 
{
	left: 100%;
}
.arrow_box_left:after, .arrow_box_left:before,.arrow_box_vote:after, .arrow_box_vote:before
{
	right: 100%;
}
.arrow_box:after,.arrow_box_left:after,.arrow_box_vote:after {
	border-width: 6px;
	margin-top: -6px;
}
.arrow_box:after {
	margin-left: -1px;
	border-left-color: #b2e866; 
}
.arrow_box_left:after {
	margin-right: -1px;
	border-right-color: #fff; 
}
.arrow_box_vote:after {
	margin-right: -1px;
	border-right-color: #b2e866; 
}
.arrow_box:before,.arrow_box_left:before,.arrow_box_vote:before {
	border-width: 6px;
	margin-top: -6px;
}
.arrow_box:before{
	border-left-color: #94d03f;
}
.arrow_box_left:before {
	border-right-color: #d8d8d8;
}
.arrow_box_vote:before {
	border-right-color: #94d03f;
}


.tooltd {
cursor:pointer;background-size: contain;background-repeat: no-repeat;width:56px;color:#58595b;font-size: 12px;text-align: center;
}

#emoticon
{
    cursor:pointer;width:30px;
}