xingli

#container {
  display: flex;
  justify-content: center;
  margin: 0 auto;
  flex-direction: column; /* Arrange vertically */
}

#header {
  display: flex;
  margin: 0 auto;
  flex-direction: column; /* Arrange vertically */
  border-bottom: 6px solid gainsboro;
}

#sidebar {
  width: 450px;
  text-align: left;
  overflow: hidden;
  border: 1px solid #FFFFFF;
}

#menu {
  display: flex;
  justify-content: end; /* Align to the right */
}

#footer {
  margin: 0 auto;
  margin-top: 10px;
  background-color: #0e3717;
  text-align: center; /* Center text */
  line-height: 60px;
  color: white;
  height: 60px; /* Background color dimensions */
  width: 900px;
}

#pagebody {
  display: flex;
  margin: 0 auto;
  margin-top: 10px;
}

#mainbody img {
  width: 100%;
}

#menu {
  display: flex;
  flex-wrap: wrap;
  margin-top: -65px;
}

#banner {
  margin-top: 22px;
  bottom: 5px solid #000000;
  clear: both;
}

a {
  text-decoration: none; /* Remove underline */
  color: #6f6f6f;
  flex-direction: row; /* Arrange horizontally */
}

a:hover {
  color: #FF0000;
}

ul {
  list-style-type: none; /* Remove bullet points */
  flex-wrap: wrap;
  flex: 0 0 auto;
  display: flex;
  height: 150%;
  margin-right: 10px;
}

li {
  position: relative; /* Absolute positioning */
  align-items: center;
  font-weight: 600;
  border: none;
  height: 150%;
  margin-right: 5px;
}

li a {
  display: flex;
  width: 100%;
  height: 150%;
}

li a::after {
  content: ""; /* Pseudo-element */
  border-right: gray solid 1px;
  margin-left: 10px;
}

li:nth-child(11) a::after {
  border: none; /* Remove line from the 11th li element */
}