.mosaic {
  position: fixed;
  bottom: 0px;
}

.chat-text {
  max-width: 800px;
  width: 100%;
  height: 230px;
  background-color: white;
  position: fixed;
  bottom: 60px;
  right: 0px;
  font-size: 0.9em;
  display: flex;
}

.chat-text .chat-general,
.chat-text .chat-alliance {
  height: inherit;
  padding-top:2px;
}

.chat-text .chat-general .chat-inner,
.chat-text .chat-alliance .chat-inner {
  overflow-y: auto;
  height: 191px;
}

.chat-text .chat-general .chat-inner > div,
.chat-text .chat-alliance .chat-inner > div{
  padding:2px;
}

.chat-button {
  position: fixed;
  bottom: 22px;
  right: 0px;
}

.chat-button .btn {
  font-size: 1.2rem;
}

.mosaic {
  position: fixed;
  bottom: 0px;
}

.chat-text {
  max-width: 800px;
  width: 100%;
  height: 230px;
  background-color: white;
  position: fixed;
  bottom: 66px;
  right: 0px;
  font-size: 0.9em;
  display: flex;
}

@media (max-width:575px) {
  .chat-text {
    bottom: 109px;
  }
}

.chat-text .chat-general,
.chat-text .chat-alliance {
  height: inherit;
  padding-top:2px;
}

.chat-text .chat-general .chat-inner,
.chat-text .chat-alliance .chat-inner {
  overflow-y: auto;
  height: 191px;
}

.chat-text .chat-general .chat-inner > div,
.chat-text .chat-alliance .chat-inner > div{
  padding:2px;
}

.chat-button {
  position: fixed;
  bottom: 22px;
  right: 0px;
}

.chat-button .btn {
  font-size: 1.2rem;
}

Fix chat on xs devices
Fix chat on xs devices