html {
  background-color: rgb(20, 20, 20);
  color: rgb(250, 250, 250);
}

#input-box,
.message,
#post-box {
  background-color: rgb(50, 50, 50);
  border-color: rgb(100, 100, 100);
  border-style: solid;
  border-width: 0.3mm;
  padding: 1rem;
  margin-bottom: 1rem;
}

#input-box input,
#input-box button,
#post-box input,
#post-box textarea,
#post-box button,
.message .msg-buttons button,
#toggle-approved-messages-button {
  display: block;

  margin-top: 1rem;
  background-color: transparent;
  color: rgb(250, 250, 250);
  
  background-color: rgb(50, 50, 50);
  border-color: rgb(100, 100, 100);
  border-style: solid;
  border-width: 0.3mm;
}

#input-box input,
#input-box button,
#post-box button,
.message .msg-buttons button {
  margin-left: auto;
  margin-right: auto;
}

#input-box input,
#input-box button,
#post-box input,
#post-box textarea,
#post-box button,
#toggle-approved-messages-button {
  font-size: 150%;
  border-width: 0.2rem;
}

#input-box button {
  padding: 0.5rem;
}

#input-box input {
  min-width: 90%;
}

#input-box button:hover,
#post-box button:hover,
#toggle-approved-messages-button:hover {
  border-color: rgb(200, 200, 200);
}

#post-box textarea {
  width: 100%;
  resize: vertical;
}

#post-response {
  margin-bottom: 0;
}

.message {
  margin-top: 1rem;
  padding: 0;
}

.message .msg-dates {
  margin-top: 1rem;
  margin-left: 1rem;
  color: rgb(150, 150, 150);
}

.message .msg-author,
.message .msg-content {
  margin-left: 1rem;
}

.message .msg-buttons {
  display: flex;
  flex-direction: row;
}

.message .msg-buttons button {
  flex-grow: 1;
}

.message .msg-buttons button:not(*:disabled):hover {
  border-color: rgb(200, 200, 200);
}

.message .msg-buttons button:disabled {
  color: rgb(150, 150, 150);
}