html,body {
    font-family: verdana, sans-serif;
    margin:0;
    padding:0;
    background: #666;
}
* {
    box-sizing: border-box;
}
#message_window {
    background: #fff;
    /*height: 500px;
    width: 320px;*/
    height: 100%;
    width: 100%;
    z-index:999;
    /*margin: 2rem auto;*/
}
#message_window.disconnected #info {
  background: #f2dede;
  padding: 10px 5px;
  position: fixed; color:#a94442;
  top: 0; z-index:999;
  left: 0;
  width: 100%;
  line-height: 18px;
  text-align: center;
  font-size: 14px;
}
#message_window.connecting #info{
  background: #dff0d8;
  padding: 0 5px;
  position: fixed; color:#3c763d;
  top: 0; z-index:999;
  left: 0;
  width: 100%;
  line-height: 51px;
  text-align: center;
  font-size: 14px;  
}

#message_window.connected #info {
    display: none;
}

#message_window section {
    overflow-y: auto;
    height: calc(100% - 40px);
}

.sectionWithBotImg {
    height: calc(100% - 120px) !important;
}

#message_window section div div {
    margin: 3px 6px;
    font-size: 13px;
    clear: both;
    word-wrap: break-word;
}
#message_window section{}
#message_window section > div > div {
}

#message_window footer {
    box-shadow:#666 0 0 3px; position:relative; z-index:999; float:left; width:100%;
}

#message_window form {
    margin: 0;
}
#message_window footer input[type="text"], #message_window footer input[type="tel"] {
  font-size:15px;
  color:#333;
  font-family:verdana, sans-serif;
  padding:0 10px;
  height: 40px;
  background:#fff;
  width:calc(100% - 60px);
  border:none;
  float:left;
  outline:none; cursor:text;
}
#message_list 			{ width:100%; height:100%; overflow:hidden; overflow-y:auto}
#message_window footer button {
    width: 50px;
    height: 40px;
    text-align:center; cursor:pointer;
	background:none;
    border: 0; padding:0 10px;
    float:right;
}
#message_window footer button img 			{ width:100%; display:block;}
#message_window footer input[type="text"]:disabled {
    opacity: 0.5;
        cursor: not-allowed;
}
#message_template {
    display: none;
}

.message {
    padding:10px 15px;
    background: #f2f2f2;
    border-radius: 5px;
    width: auto;
    display: inline-block;
    max-width: 75%;
}

.message.outgoing {
    background-color: #c6ebf9;
    color: black;
    box-shadow:none;
    border: none;
}
.message.incoming img {
  max-height: 22px;
  vertical-align: middle;
  padding-right: 3px;
}
.reply {
  text-align: right;
}

#message_replies {
    text-align: center;
}

#message_window section.attachment 			{ position:relative;}
#message_window section.attachment  #message_list			{ float:left; width:100%}
#message_window section.attachment #attach_replies {padding:5px 12px; display:block; text-align:center; width: calc(100% - 10px); float:left}
#message_window footer button:disabled img 				{ opacity:0.4}
#message_window section.attachment #attach_replies a 	{border:#aeb0b0 solid 1px;height:38px;padding:0 15px;font-size: 14px;color:#00658c;font-family:verdana, sans-serif;display:inline-block;line-height:38px;margin:0 3px 5px 3px;background:#fff;text-decoration:none;border-radius:7px;float: left;}
#message_window section.attachment #attach_replies a:hover 		{border:#aeb0b0 solid 1px; background:#00658c; color:#fff;}
#message_window section.attachment #attach_replies a.selected		{ background:#c6ebf9; color:#000; float: left;}
#message_window section.attachment #attach_replies a.more 		{border:#029f11 solid 1px; font-weight:bold;background:#fff; color:#029f11; float: left;}
#message_window section.attachment #attach_replies a.more:hover 		{border:#029f11 solid 1px; font-weight:bold;background:#029f11; color:#fff; float: left;}
#message_window section.attachment #attach_replies a.submit   { background: #777; border: #777 solid 1px; color: #fff;  float: left;}

#message_window section.attachment #attach_replies a.hide_1	  { display:none;}
#message_window section.attachment #attach_replies a.hide_2	  { display:none;}
#message_window section.attachment #attach_replies a.hide_3	  { display:none;}
#message_window section.attachment #attach_replies a.hide_4	  { display:none;}
#message_window section.attachment #attach_replies a.noneofabove 		{border:#ccc solid 1px; font-weight:bold;background:#fff; color:#6a6868; float: left;}
#message_window section.attachment #attach_replies a.noneofabove:hover 		{border:#ccc solid 1px; font-weight:bold;background:#6a6868; color:#fff; float: left;}

#message_window section::-webkit-scrollbar-track
{
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	border-radius: 10px;
	background-color: #F5F5F5;
}

#message_window section::-webkit-scrollbar
{
	width: 12px;
	background-color: #F5F5F5;
}

#message_window section::-webkit-scrollbar-thumb
{
	border-radius: 10px;
	-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
	background-color: #D62929;
}


@media only screen and (max-width: 767px) {
  .message {padding: 6px 10px;}
  #message_window section.attachment #attach_replies a   {height:32px;padding: 0 10px;line-height:30px;text-align: left;}
}

#divBotStaticImg {
    position: relative;
    bottom: 0;
    width: 50%;
    text-align: center;
    /* left: 25%; */
    margin: 0 auto;
    display: none;
    height: 80px;
}
#imgBotStaticImg {
  width: auto;
  height: 100%;
}

.show {
  display: block !important;
}
.hide {
  display: none !important;
}