* {
  margin: 0;
  padding: 0;
}

html {
  height: 100vh;
}

body {
  background-color: rgb(43, 38, 38);
  font-family: "Lato";
  font-weight: 300;
  height: 98%;
  overflow: hidden;
}

body::-webkit-scrollbar {
  display: none; /* for Chrome, Safari, and Opera */
}
form {
  margin: 0 1rem 0 1rem;
  display: flex;
  justify-content: center;
  width: 95%;
  height: 3vmin;
}

form label {
  font-size: 1.5rem;
  font-weight: bold;
  color: #fff;
}

input {
  font-family: "Lato";
}

a {
  color: #fff;
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

p {
  color: #fff;
}

#wrapper,
#loginform {
  padding-bottom: 25px;
  background: #39393a;
  width: 100%;
  max-width: 100%;
  height: 100%;
}

#loginform {
  padding-top: 18px;
  text-align: center;
}

#loginform p {
  padding: 15px 25px;
  font-size: 1.4rem;
  font-weight: bold;
}

#chatbox {
  text-align: left;
  margin: 0 1rem 0 1rem;
  padding: 1vmin;
  background: #2f2f30;
  height: 86%;
  width: 95%;
  overflow: auto;
  border-radius: 4px 4px 0 0;
  color: #fff;
}

#usermsg {
  border-radius: 4px;
  background-color: #323233;
  border: #323233 0px solid;
  color: #fff;
  border-radius: 0 0 0 4px;
  height: 3vmin;
  width: 93%;
}

#name {
  border-radius: 4px;
  border: 1px solid #39393a;
  background-color: #323233;
  color: #fff;
  height: 3vmin;
}

#submitmsg,
#enter {
  background: #4b794d;
  color: white;
  font-weight: bold;
  border: 0;
  height: 3vmin;
  width: 7%;
}

.error {
  color: #fff;
}

#menu {
  padding: 15px 25px;
  display: flex;
}

#menu p.welcome {
  flex: 1;
  color: #fff;
}

a#exit {
  color: white;
  background: #c62828;
  padding: 4px 8px;
  border-radius: 4px;
  font-weight: bold;
  text-decoration: none;
}

.msgln {
  margin: 0 0 5px 0;
}

.msgln span.left-info {
  color: #fff;
}

.msgln span.chat-time {
  color: #fff;
  font-size: 60%;
  vertical-align: center;
}

.msgln b.user-name,
.msgln b.user-name-left {
  font-weight: bold;
  background: #546e7a;
  color: white;
  padding: 2px 4px;
  font-size: 90%;
  border-radius: 4px;
  margin: 0 5px 0 0;
  text-align: center;
}

.msgln b.user-name-left {
  background: orangered;
}