@charset "utf-8";
/* CSS Document */

.form-chats1{
	margin: 0;
	padding: 0;
}

.formRong1 {
	padding: 0;
	margin: 0;
}
.formRong1 .form-Top1{margin: 20px 1px;text-align:left;font: 22px/57px 'Kanit', Arial, sans-serif;width: 540px;height: 57px;color: #765b90;text-indent: 60px;border-bottom: 5px solid;background: url("../images/form-chats/rong1.png") top left no-repeat;}
.formRong1 .form-mid1{
	min-height: 500px;
}					
.formRong1 .form-buttom1{
	
}					
				
.formRong2 {
	padding: 0;
	margin: 0;
}
.formRong2 .form-Top2{

margin: 20px 1px;

text-align:left;

font: 33px/63px 'Kanit', Arial, sans-serif;

width: 649px;

height: 57px;

color: #765b90;

text-indent: 72px;

border-bottom: 5px solid;

background: url("../images/form-chats/rong2.png") top left no-repeat;
}
.formRong2 .form-mid2{
	height: 650px;
	overflow-y: scroll;
}	




.formRong2 .form-mid2 .chatbox{
	
background: #e6dcf7;
	
min-height: 190px;
	
width: auto;
	
border-radius: 20px;
}
.qq{
	font: 21px/26px 'Kanit', Arial, sans-serif;
	color:#765b90;
	width: max-content;
	padding: 3px 10px;
	background: #c6a4ff;
	border-radius: 18px;
}
.box-qq{
	font: 18px/26px 'Kanit', Arial, sans-serif;
	color:#765b90;
	width: max-content;
	padding: 10px 10px;
	background: #c6a4ff;
	border-radius: 18px;
}
.aw{
	font: 21px/26px 'Kanit', Arial, sans-serif;
	color:#fff;
	width: max-content;
	padding: 3px 10px;
	background: #ab79ff;
	border-radius: 18px;
}
.box-aw{
	font: 18px/26px 'Kanit', Arial, sans-serif;
	color:#fff;
	width: max-content;
	padding: 10px 10px;
	background: #ab79ff;
	border-radius: 18px;
}
.formRong2 .form-buttom2{
	
}		
.formRong3 {
	padding: 0;
	margin: 0;
}
.formRong3 .form-Top3{

margin: 20px 1px;

text-align:left;

font: 33px/57px 'Kanit', Arial, sans-serif;

width: 540px;

height: 57px;

color: #765b90;

text-indent: 70px;

border-bottom: 5px solid;

background: url("../images/form-chats/rong3.png") top left no-repeat;
}
.formRong3 .form-mid3{
	min-height: 500px;
}					
.formRong3 .form-buttom3{
	
}		
.formRong4 {
	padding: 0;
	margin: 0;
}
.formRong4 .form-Top4{
margin: 20px 1px;
text-align:left;
font: 33px/57px 'Kanit', Arial, sans-serif;
width: 540px;
height: 57px;
color: #765b90;
text-indent: 60px;
border-bottom: 5px solid;
background: url("../images/form-chats/rong1.png") top left no-repeat;
}
.formRong4 .form-mid4{
	min-height: 500px;
}					
.formRong4 .form-buttom4{
	
}		
/* width */
.formRong2 ::-webkit-scrollbar {
  width: 10px;
}

/* Track */
.formRong2 ::-webkit-scrollbar-track {
  background:#e8e7e9; 
  border-radius: 10px;
}
 
/* Handle */
.formRong2 ::-webkit-scrollbar-thumb {
  background: #cdcdcf; 
  border-radius: 10px;
}

/* Handle on hover */
.formRong2 ::-webkit-scrollbar-thumb:hover {
  background: #c4c4c7; 
}
@media (max-width: 575px) {
	.form-chats1{
		margin-top: 55px;
	}

	.formRong1 .form-Top1{
		font: 22px/57px 'Kanit', Arial, sans-serif;
	}
	.formRong2 .form-Top2{
		font: 22px/57px 'Kanit', Arial, sans-serif;
	}
	.formRong3 .form-Top3{
		font: 22px/57px 'Kanit', Arial, sans-serif;
	}
	.formRong4 .form-Top4{
		font: 22px/57px 'Kanit', Arial, sans-serif;
	}
}