.mainlayout {
  display: flex;
  justify-content: center;
  background-color: rgb(237, 237, 229);
  gap: 2px;
}
.mainlayout .leftlayout {
  display: flex;
  flex-direction: column;
  width: 20vw;
  height: 100vh;
  gap: 5px;
}
.mainlayout .leftlayout .row_1 {
  width: 100%;
  height: 35%;
  border: 1px solid black;
  display: flex;
  justify-content: flex-end;
  background-color: rgb(219, 193, 175);
  box-sizing: border-box;
}
.mainlayout .leftlayout .row_1 .avatar {
  width: 80%;
  height: 100%;
}
.mainlayout .leftlayout .row_2 {
  width: 100%;
  height: 30%;
  border: 1px solid black;
  box-sizing: border-box;
  padding: 0 22px;
}
.mainlayout .leftlayout .row_3 {
  width: 100%;
  height: 15%;
  border: 1px solid black;
  box-sizing: border-box;
}

.mainlayout .rightlayout {
  display: flex;
  flex-direction: column;
  width: 25vw;
  height: 100vh;
  gap: 5px;
}
.mainlayout .rightlayout .row1 {
  width: 100%;
  height: 20%;
  border: 1px solid black;
  box-sizing: border-box;
  padding-left: 20px;
}
.mainlayout .rightlayout .row2 {
  width: 100%;
  height: 15%;
  display: flex;
  justify-content: space-between;
  border: 1px solid black;
  box-sizing: border-box;
  padding: 0 20px;
}
.mainlayout .rightlayout .row1 .name {
  font-size: 40px;
  font-weight: bold;
  color: red;
}