#chat-wrap {
  background: #e9eaea;
  border:1px solid #aaaeb1;
  color:#222;
  font:12px arial;
  margin:0;
  padding:0;
  position:relative;
  width:auto;
}

#chat-footer {
  margin:10px auto;
  width:auto;
}

#chat-footer p {
  text-align:center;
  padding: 0 10px 10px;
}

#chat-msgs {
  background: #595b65;
  border:1px solid #aaaeb1;
  flex: 1 1 auto;
  font-family: 'Open Sans', arial, 'sans serif';
  font-size: 13px;
  height: 360px;
  margin: 2px 2px 5px;
  padding:0 5px 0 7px;
  overflow-y: scroll;
  text-align:left;
  width:auto;
}

.chat-center-xy {
  position: absolute;
  top: 40%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 999;
}

.loading-msg {
  font-family: Verdana, Geneva, Tahoma, sans-serif;
  font-size: 170%;
  font-weight: bold;
  color: #8ac6f7;
}

ul#messages {
  font-size: 100%;
  list-style-type: none;
  margin: 0;
  padding: 0;
}

ul#messages li {
  padding: 2px 5px 2px 2px;
}

ul#messages li.with-handle {
  padding-top: 5px;
}

.msg {
  color: #fff;
  padding-left: 5px;
}

.handle {
  margin-left: -5px;
  font-size: 102%;
  color: rgb(66 167 255);
}

ul#messages > li.msg > span.msg-text > a {
  position: relative;
  color: rgb(119 197 255)!important;
}

.msg-text > a > div.msg-link {
  background: #313131;
  border-radius: 8px;
  bottom: 0;
  box-shadow: 1px 1px 1px 1px rgb(32 32 32 / 20%);
  display: none;
  min-width: 270px;
  max-width: 270px;
  overflow-x: hidden;
  padding: 0.3rem 0.5rem;
  position: absolute;
  word-break: break-all;
  z-index: 999;
}

.msg-text > a:hover > div.msg-link {
  display: block;
}

.mention {
  color: rgb(241 242 255);
  background: #57598a;
  padding: 0.1rem;
}

.notification {
  background: rgb(255, 252, 178, 90%);
  border: 1px solid #aaa;
  border-radius: 10px;
  color: #444;
  font-size: 110%;
  font-weight: bold;
  line-height: 1.8;
  padding: 2rem 1rem;
  text-align: center;
}

.chat-cta-btn {
  box-shadow:inset 0px 1px 0px 0px #caefab;
  background-color:#77d42a;
  border-radius:3px;
  border:1px solid #268a16;
  display:inline-block;
  cursor:pointer;
  color:#306108 !important;
  font-family:Trebuchet MS, sans-serif;
  font-size:16px;
  padding:12px 32px;
  text-decoration:none;
  text-shadow:0px 1px 0px #aade7c;
}

.chat-cta-btn:hover {
  background-color:#5cb811;
  text-decoration:none;
}

.chat-cta-btn:active {
  position:relative;
  top:1px;
}