body {
  margin: 0;
  font-family: Arial, sans-serif;
  background-color: #f4f4f4;
  padding-bottom: 60px; /* 确保底部有足够的空间 */
}



.active {
  background-color: #498ee2; /* 激活链接的背景颜色 */
  color: white;
}

.navbar {
  background-color: #333;
  overflow: hidden;
}

.navbar a {
  float: left;
  display: block;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

.navbar a:hover {
  background-color: #ddd;
  color: black;
}

.container {
  margin: 20px auto; /* 调整为自动居中，并设置上下外边距 */
  width: 90%; /* 容器宽度调整为90% */
}

.scroll-box {
  overflow-x: auto; /* 始终显示横向滚动条 */
  overflow-y: auto; /* 纵向滚动条在需要时出现 */
  max-width: 100%; /* 最大宽度，根据需要调整 */
  max-height: 600px; /* 最大高度，确保内容超过这个高度时纵向滚动条会出现 */
  margin: 20px auto; /* 上下边距20px，左右自动（居中） */
  border: 3px solid #ced1d5; /* 边框，根据需求调整颜色和宽度 */
  box-shadow: 0 4px 8px rgba(0,0,0,0.1); /* 添加轻微的阴影效果 */
  background-color: #f9f9f9; /* 轻微的灰色背景，增强对比 */
  border-radius: 5px; /* 边框圆角 */
}

/* 定制滚动条的样式 */
.scroll-box::-webkit-scrollbar {
  -webkit-appearance: none;
}

.scroll-box::-webkit-scrollbar:vertical {
  width: 10px; /* 设置垂直滚动条宽度 */
}

.scroll-box::-webkit-scrollbar:horizontal {
  height: 10px; /* 设置横向滚动条高度，之前是2px，现根据需要调整 */
}

.scroll-box::-webkit-scrollbar-thumb {
  border-radius: 8px; /* 设置滚动条的圆角 */
  border: 2px solid rgba(255,255,255,.4); /* 设置滚动条的边框 */
  background-color: rgba(0, 0, 0, .5); /* 设置滚动条的颜色 */
}


/* 添加斜体样式 */
.italic {
  font-style: italic;
}


table {
  width: 100%; /* 表格宽度100% */
  border-collapse: collapse; /* 边框合并 */
}

th, td {
  border: 1px solid #ccc; /* 单元格边框 */
  padding: 10px; /* 单元格内边距 */
  text-align: left; /* 左对齐文本 */
}

th {
  background-color: #e9ecef; /* 表头背景色 */
  color: #495057; /* 表头文字颜色 */
  position: sticky; /* 固定位置 */
  top: 0; /* 表头固定在容器顶部 */
  z-index: 2; /* 提高层级，确保覆盖其他元素 */
}


footer {
  background-color: #333;
  color: white;
  text-align: center;
  padding: 10px;
  bottom: 0;
  /* width: 100%; */
}

/* 调整容器的底部外边距以适应固定位置的页脚 */
.container {
  margin-bottom: 50px;
}





button {
  padding: 5px 10px;
  background-color: transparent; /* 设置背景为透明 */
  color: #007bff; /* 设置文字颜色为蓝色 */
  border: none; /* 去除边框 */
  border-radius: 5px;
  cursor: pointer;
  margin-left: 10px;
  outline: none; /* 去除焦点时的边框 */
}

button:hover {
  color: #0056b3; /* 鼠标悬停时的文字颜色变为更深的蓝色 */
  text-decoration: underline; /* 悬停时添加下划线，提高可点击的视觉反馈 */
}