body {
  display: flex;
  flex-direction: column;
  align-items: center;
  align-content: center;
  background-color: rgb(31, 30, 30);
}

.topbar {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  align-content: center;
  text-align: center;
  flex-grow: 0;
  padding: 0.5em;
  max-height: 100px;
  height: 5vh;
  width: 98%;
  margin-top: 0;
  margin-right: 2vw;
  margin-left: 2vw;
  margin-bottom: 0.1em;
  border-radius: 15px;
  border: 3px solid rgba(255, 255, 255, 0.7);
  background-color: rgba(119, 99, 99, 0.904);
}

.main {
  display: flex;
  flex-direction: row;
  gap: 0.5em;
  width: 98vw;
  height: 90vh;
  margin-left: 1vw;
  background-color: rgba(112, 92, 92, 0.815);
  border-radius: 15px;
  border: 3px solid rgba(255, 255, 255, 0.7);
}

.leftsidebar {
  display: flex;
  flex-direction: column;
  flex-grow: 0;
  padding: 0.5em;
  width: 20%;
  max-width: 500px;
  background-color: rgba(45, 48, 250, 0.89);
}

.cuntent {
  display: flex;
  flex-direction: column;
  width: 100%;

}