body{font-size:12px;font-family: Arial;line-height: 150%;margin:0px;background-color: #eeeeee;}
a{text-decoration: none;}
a:hover{text-decoration: underline;}

div.boxChat{display: table;margin:auto;width:100%;max-width:650px;background-color: white;border-radius: 4px 4px 0 0;box-shadow: 0px 0px 5px gray;min-width:280px;}
div.boxChat div.head{float: left;width:100%;border-bottom: #eeeeee 1px solid;position: relative;}
div.boxChat div.head div.title{float: left;width:100%;background-color: #f42952;color: #ffffff;text-align: center;font-weight: bold;line-height: 24px;border-radius: 4px 4px 0 0;}
div.boxChat div.head div.info{float: left;width:100%;position: relative;min-height: 45px;}
div.boxChat div.head div.info img{position: absolute;left: 10px; top:-15px; border-radius:50%;	width:55px;height: 55px;border: #bfbfbf 1px solid;}
div.boxChat div.head div.info div{float: left; width: calc(100% - 80px);	margin-left: 80px;}
div.boxChat div.head div.info div strong{display: block;margin-top:4px;}
div.boxChat div.head div.info div strong a{color: #0000cd;}
div.boxChat div.head div.info div span{color: #727272;display: block;}
div.boxChat div.head div.info div span label{color: red;font-weight: bold;}
div.boxChat div.head div.info div a.out{position: absolute; right:10px; top: 5px;color: red; z-index: 1;}
div.boxChat div.head div.info div span.group{position: absolute; bottom: 2px; right: 10px;z-index: 1;}
div.boxChat div.head div.info div span.group input{float: left;}
div.boxChat div.head div.info div span.group em{float: left;}


div.boxChat div.content{float: left;width: calc(100% - 20px);min-height: 40px;padding: 10px;overflow: auto;font-size:13px;font-family: Tahoma;position: relative; background-color: white;}
div.boxChat div.content div{float: left;margin-bottom:2px;clear:both; border-radius:4px; padding: 3px 10px 3px 10px;}
div.boxChat div.content div.line2{background-color: #f4f4f4;color: black; border: #e4e4e4 1px solid;} /*left*/
div.boxChat div.content div.line1{float: right;background-color: #f1ca28;color: black; border: #e6bb0f 1px solid;} /*right*/
div.boxChat div.content div.center{float: left;width:100%;text-align: center;font-size:15px;margin:10px 0 10px 0;padding:0px;border-bottom: #dddddd 1px solid;padding-bottom:10px;color: #343434;}
div.boxChat div.content div.center strong{color: red;}
div.boxChat div.content div.line1 strong,
div.boxChat div.content div.line2 strong{color: #dd0d12;}
div.boxChat div.content div.time{font-size:11px;color: #6a6a6a!important;background-color: transparent!important;padding:0 10px 0 10px!important;border:none!important;}
div.boxChat div.content div.red{color:red;}
div.boxChat div.content div.blue{color: blue;}
div.boxChat div.content div.logout{	position: fixed; bottom: 83px; width:100%;text-align: center; padding:0px;margin:0px;background-color: rgba(0,0,0,0.3); left:0px;border-radius:0px;line-height: 20px;color: black; z-index: 10;}
div.boxChat div.content div.logout a{background-color: white; font-weight: normal;display: table;margin:auto;margin:2px auto; padding: 2px;color: red;cursor: pointer;}

div.boxChat div.content div a.img{float: left;position: relative;}
div.boxChat div.content div a.img img{max-width:250px; width:100%;}
div.boxChat div.content div a.img label{position: absolute; bottom:0px;right:0px; width:16px;height: 16px;z-index: 1;}
div.boxChat div.content div a.img label.loading{background: url(img/loading.gif) center no-repeat;}
div.boxChat div.content div a.img label.ok{background: url(img/checked.gif) center no-repeat;}
div.boxChat div.content div a.img label.warning{background: url(img/warning.png) center no-repeat;}
div.boxChat div.content div em{color: #727272;font-style: normal;}

div.boxChat form{float: left;width:100%;margin:0px;background-color: #eeeeee;border-top: #cbcbcb 1px solid;position: relative;}
div.boxChat form textarea{	border: #c6c6c6 1px solid;float: left;	padding:10px; width: calc(100% - 152px);border-radius:3px; height: 40px;margin: 10px 3px 10px 3px;font-family: Arial;font-size:13px;}
div.boxChat form input[type='text']{width:104px;margin-left:10px;border-radius:3px;border: #c6c6c6 1px solid;margin-top:10px;padding:10px;}
div.boxChat form input[name='phone']{margin-left:4px;}
div.boxChat form textarea:hover,
div.boxChat form input[type='text']:hover{border-color: #999999;}
div.boxChat form textarea.error,
div.boxChat form input[type='text'].error{border-color:#ff5353; background-color: #ffd7d7;}
div.boxChat form input[type='submit']{	float: left;width:60px;margin-top:32px;height: 38px;background-color: #f42952;border: #aa0a0e 1px solid;	border-radius:3px;font-size:15px;color: white;font-weight: bold;cursor: pointer;}
div.boxChat form input[type='submit']:hover{	background-color: #f44d51;}
div.boxChat form div.maxLength{position: absolute; bottom:54px;right:51px;color: red;}
div.boxChat form div.sound{background: url(img/sound.png) no-repeat;	width: 30px; height: 20px;position: absolute; right: 12px;bottom: 56px;cursor: pointer;}
div.boxChat form div.on{background-position: 5px -22px;}
div.boxChat form div.off{background-position: 5px 0px;}

div.boxChat div.join{position: absolute; z-index: 10;background-color: rgba(0,0,0,0.5); width:100%;height:100%;}
div.boxChat div.join div{width:80%; float:left; margin: 10px 8% 10px 8%;padding: 5px 2% 5px 2%;background-color: white; border-radius:2px;}
div.boxChat div.join div label{color: red;float:left;width:100%;line-height: 25px;height: 25px;}
div.boxChat div.join div span{float:left;width:150px; margin-left: calc(50% - 75px); text-align: center;font-weight: bold;line-height: 25px;height: 25px;cursor: pointer;border-radius:2px;color: #f1ca28;background-color: #dd0d12;}
div.boxChat div.join div span:hover{color: black;background-color: #e5ba00;}
div.boxChat div.join div img.avatar{width:20px;height: 20px;border-radius:50%;float: left;}
div.boxChat div.join div label em{float: left;margin-left:5px;color: #006400;font-style: normal;}
div.boxChat div.join div label em strong{color: red;}
div.boxChat div.head div.join div{margin: 5px 8% 5px 8%;}



div.jqueryUpload{float: left; width: 40px;margin-left:10px;margin-top:10px;border: #d0d0d0 1px solid; border-radius:5px;}
div.jqueryUpload:hover{border-color: #858585;}
div.jqueryUpload div{ position: relative; height: 60px; float: left; width:100%; background: white url(img/upload.png) center no-repeat;border-radius:5px; opacity: 0.5}
div.jqueryUpload:hover div{opacity: 1;}
div.jqueryUpload div input[type="file"]{width: 100%; height: 100%; overflow: hidden; cursor: pointer; float: left; position: absolute;z-index: 1; background-color: transparent;border:none;text-indent: -1000px;opacity:0;}


div.boxChat div.content div.sendmail{position: absolute;top:0px;left:0px;z-index: 1; margin:0px;padding:0px;width:100%;min-height: 100%;;background-color: rgba(0,0,0,0.5);border-radius:0px;}
div.boxChat div.content div.sendmail div.box{padding:20px;background-color: white;border-radius:0px;margin:4px auto;float: none; width:60%; min-width:240px;box-shadow: 0px 0px 4px white;display: table;}
div.boxChat div.content div.sendmail div.box div{padding:0px;margin:0px;position: relative;width:100%;}
div.boxChat div.content div.sendmail div input{display: block;border-radius:2px;border: #c6c6c6 1px solid;padding:5px; width:90%;margin:10px 0 10px 0;}
div.boxChat div.content div.sendmail div input.error{border-color:#ff5353; background-color: #ffd7d7;}
div.boxChat div.content div.sendmail div input:hover{border-color: #999999;}
div.boxChat div.content div.sendmail div p{float: left;width:100%;margin:0px;}
div.boxChat div.content div.sendmail div p a{float: left;background-color: #dd0d12;padding:4px 7px 4px 7px;color: white;font-weight: bold;margin:0px 4px 0 0; border-radius:3px;cursor: pointer;border: #aa0a0e 1px solid;}
div.boxChat div.content div.sendmail div p a:hover{text-decoration: none;background-color: #f44d51;}
div.boxChat div.content div.sendmail div span{cursor: pointer;position: absolute; top:0px;cursor: pointer; top: -19px;right:-19px;background-color: black;color:white;font-weight: bold;width:20px;height: 20px;line-height: 20px;text-align: center; border-radius:2px;}
div.boxChat div.content div.sendmail div span:hover{background-color: red;color: black;}
div.boxChat div.content div.sendmail div p strong{color: red;}

div.boxChat div.content div.avatar{width:100%;padding:0px;}
div.boxChat div.content div.avatar div{padding:0px;text-align: center;margin: 0 10px 5px 0;clear:none;}
div.boxChat div.content div.avatar div img{border-radius:50%; width:50px;height:50px; border: #626262 1px solid;padding:2px;}
div.boxChat div.content div.avatar div span{display: block;text-align: center;color: black;}
div.boxChat div.content div.avatar div.active1 img{opacity: 0.4;}
div.boxChat div.content div.avatar div.active1 span{color: #626262;}
div.boxChat div.content div.avatar div.active2:hover img{border-color:red;}
div.boxChat div.content div.avatar div.active2:hover span{color: red;}
div.boxChat div.content div.avatar div.blue,
div.boxChat div.content div.avatar div.red{width:100%;text-align: left;margin:0px 0 6px 0;}