@import url("https://cdn.jsdelivr.net/npm/water.css@2/out/dark.css");

body {
  max-width: none;
}

.main {
  display: flex;
  flex-direction: row;

  @media screen and (max-width: 800px) {
    flex-flow: column;
  }
}

.video {
  /* width: 50%; */
  flex-basis: 40%;
  display:flex;
  flex-direction:column;

  @media screen and (max-width: 800px) {
    width: auto;
    max-width: unset;
  }
}


.chat {
  /* width: 50%; */
  flex-basis: 40%;

  @media screen and (min-width: 550px) {
    margin-left: 0;
  }

  @media screen and (max-width: 800px) {
    width: auto;
  }
}

.chat-scroll {
  height: 350px;
  overflow: scroll;
}

.chat-row {
  display: flex;
  margin-bottom: 1em;
}

.chat-right {
  margin-left: 1em;
}

.chat-right-top {
  display: flex;
}

.chat-date {
  color: gray;
  margin-left: 1em;
  font-size: small;
}

.chat-edit {
  margin-left: 1em;
  font-size: small;
}

.msg-input {
  display: inline;
}

.msg-send {
  display: inline;
}

button {
  margin:0px
}

.whiteboard {
  flex-basis: 20%;
}