body {
  background-color: white;
  font-family: "Montserrat", sans-serif;
}

.bgImg {
  background-image: url("../images/loginBg.jpg");
  background-repeat: no-repeat;
  background-size: cover;
}

/* Custom scrollbar */
#chatMessages {
  max-height: 450px; /* Set a max height for the chat messages container */
  overflow-y: auto; /* Enable vertical scrollbar */
}

/* Style the scrollbar */
#chatMessages::-webkit-scrollbar {
  width: 10px; /* Set the width of the scrollbar */
}

/* Track */
#chatMessages::-webkit-scrollbar-track {
  background: #f1f1f1; /* Set the background color of the scrollbar track */
}

/* Handle */
#chatMessages::-webkit-scrollbar-thumb {
  background: #888; /* Set the color of the scrollbar handle */
}

/* Handle on hover */
#chatMessages::-webkit-scrollbar-thumb:hover {
  background: #555; /* Set the color of the scrollbar handle on hover */
}

/* Custom scrollbar */
#rooms {
  max-height: 450px; /* Set a max height for the chat messages container */
  overflow-y: auto; /* Enable vertical scrollbar */
}

/* Style the scrollbar */
#rooms::-webkit-scrollbar {
  width: 10px; /* Set the width of the scrollbar */
}

/* Track */
#rooms::-webkit-scrollbar-track {
  background: #f1f1f1; /* Set the background color of the scrollbar track */
}

/* Handle */
#rooms::-webkit-scrollbar-thumb {
  background: #888; /* Set the color of the scrollbar handle */
}

/* Handle on hover */
#rooms::-webkit-scrollbar-thumb:hover {
  background: #555; /* Set the color of the scrollbar handle on hover */
}

#messageContainer {
  max-width: 600px; /* Adjust width as needed */
  margin: 0 auto; /* Center the container horizontally */
  text-decoration: none;
}

.message {
  background-color: #f0f0f0; /* Message background color */
  padding: 10px; /* Padding around each message */
  margin-bottom: 10px; /* Margin between messages */
}

.messageLink {
  text-decoration: none; /* Remove underline from the link */
  color: inherit; /* Inherit color from the parent */
}

.messageHeader {
  font-weight: bold; /* Make room name bold */
  margin-bottom: 5px; /* Margin below room name */
}

.messageContent {
  flex-grow: 1; /* Allow message content to grow */
  padding-left: 20px; /* Indent message content */
  display: flex; /* Use flexbox layout */
  align-items: center; /* Vertically center content */
}

.username {
  font-weight: bold; /* Make username bold */
}

.timestamp {
  font-size: 0.8em; /* Smaller font size for timestamp */
  color: #888; /* Gray color for timestamp */
  margin-left: auto; /* Push timestamp to the right */
}/*# sourceMappingURL=main.css.map */