@charset "utf-8";
#chat-window {
  width: 100%;
  height: 300px;
  margin: 0 auto;
  padding: 10px;
  background-color: #f7f7f7;
  box-shadow: 2px 2px 10px rgba(0, 0, 0, 0.1);
  overflow-y: scroll;
  overflow-x: hidden;
  border-radius: 5px;
}

#chat-window::-webkit-scrollbar {
  width: 10px;
}

#chat-window::-webkit-scrollbar-thumb {
  background-color: #db3232;
  border-radius: 5px;
}

#chat-window p {
  margin: 0;
  font-size: 14px;
}

#chat-window .cmessages strong {
  color: #db3232;
}

.input-box {
  max-width: 100%;
  height: 40px;
  padding: 2px 5px;
  font-size: 16px;
  border: 0px solid #d7d7d7;
  outline: none;
}

#send-button {
  padding:0px;
  font-size: 14px;
  text-align:center;
  width:60px;
  height:40px;
  line-height:40px;
  background-color: #db3232;
  color: white;
  border: none;
  cursor: pointer;
}

#send-button:hover {
  background-color: #005A6E;
}

.user {  position:relative; clear:both; width:100%; margin-bottom:5px; }
.usericon { height:35px; width:35px; background:#e7e7e7; 
	border-radius:21px; border:1px solid #d7d7d7; } 
.usericon img { height:35px; width:35px; border-radius:18px; }
.namepart { height:40px; max-width:100%; line-height:40px; padding-left:5px; }
.username { font-size: 13px; height:17.5px; line-height:17.5px; }
.usertime { font-size: 12px; height:17.5px; line-height:17.5px; color:#999; }
.cmessages  { font-size: 14px; clear:both; max-width:100%; padding:7px 10px; margin-bottom:10px;
border-radius:20px; border:1px solid #d7d7d7; }
.floatleft { float:left; }
.floatright { float:right; }
.textleft { text-align:left; }
.textright { text-align:right; }

.textright .sv_on { text-align:left; }

.bgyellow { background:#ffeb34;  }
.bgwhite { background:#fff;  }

.username.textright { min-width:100px; }

#input-area { margin:0px auto; padding-top:15px; position:relative; clear:both; text-align:left; }
#input-area .input-left { float:left; padding:0px; margin:0px; height:40px; width:calc(100% - 60px); }
#input-area .input-left #talk { height:40px; width:100%; overflow:hidden; }

#input-area .input-left #talk::placeholder { color: #aaa; }

#input-area .input-right { float:right; padding:0px; margin:0px; height:40px; width:60px; text-align:right;}
#input-area .input-right #user_id { max-width:100%;}