/* 背景颜色 */
body{
    background-color: rgb(30, 25, 25);
}

/* 内容正文的底纹颜色以及文字大小 */
#wrapper{
 background-color: rgb(30, 25, 25);
 /* width 调整页面整体宽度，height 调整页面整体高度 */
 width: 100%;
 height:auto;
 min-height: auto; /*最小高度，确保没内容时的高度*/
 margin: auto; /*控制页面的准度，使内容对齐页面*/
}

/* 标题字体的背景的大小和颜色,以及图片填充 */
header{
  width: 100%; /*控制标题栏和导航栏的宽度*/
  height: 150px; /*控制高度*/

  background-color: white; 
  border-bottom-color: black 4px solid; /*不知道实际控制哪里*/

  background-image: url(../img/BackgroundTexture.jpg); /*背景图片*/
  background-position: center; /*图片居中*/
  background-size: cover; /*图片覆盖*/
  background-repeat: no-repeat; /*防止图片重复*/
  padding:20px 0; /* 为 header 添加上下内边距 */
  box-sizing: border-box; /*内外边距设置选项*/
}

header h1, header h2 {
    margin: 0;
    padding-left: 20px;
    color: white;
}

section{
    width: 100%;
    height: auto;
    margin: 0;
    padding: 0;
}

/* 字体样式大小 */
h1,h2,p{
    font-family: 'Eras bold ITC','Gill Sans', 'Gill Sans MT', 'Calibri', 'Trebuchet Ms', sans-serif;
    color: white;
}

/*正文字体颜色*/
p{
    color: white;
}
/*标题字体颜色（使用点+名字进行引用）*/
.main-text{
    color: white;
    margin-left: 20px; /* 设置左外边距为20像素 */
}

/*h1和h2的字体大小*/
h1{
    font-size: 40px;
}

h2{
    font-size: 25px;
}


.intro {
    display: block; /* 启用 Block 布局 让文本上下排列*/
    align-items: center; /* 垂直居中对齐 */
    margin: 20px 0; /* 添加上下边距，调整与其他内容的间距 */
}

.intro p {
    flex: 1; /* 使文本部分占用剩余空间 */
    margin-right: 20px; /* 为文本和图片之间添加间距 */
    font-size: 16px; /* 根据需要调整文本大小 */
    line-height: 1.5; /* 调整行高，以增加可读性 */
    color: white; /* 确保文本颜色与背景对比明显 */
}

.intro img.me {
    max-width: 300px; /* 保持您已设置的宽度 */
    height: auto; /* 自动调整高度以保持比例 */
    margin-left: 20px; /* 为图片添加左边距，确保与文本分开 */
}
/*ChatGpt sentences are end (Author claim)*/

img {
    max-width: 100%; /* 图片宽度不会超过容器宽度 */
    height: auto;    /* 高度根据宽度自动调整，保持比例 */
    display: block;  /* 让图片独占一行，避免多余空白 */
    margin: 0 auto;  /* 如果需要图片居中，可以使用 */
}

/*导航和链接*/
nav{
    width:100%; /*导航栏宽度*/
    height: 50px;; /*导航栏高度*/
    background-color: rgb(30, 25, 25); 
    margin-top: 20px;  /* 导航栏与标题的间距 */

}

nav ul{
    display: flex; /* 导航栏横向排列 */
    width:100%;
    height:auto;
    margin:0; /*清除列表外边距*/
    padding:0; /*清除列表内边距*/
}

nav ul li{
    list-style: none; /*去除默认项目编号 “·”*/
    border: dashed 1px gray; /*为列表添加灰色虚线框*/
    text-align: center; /*文本内容水平居中对齐*/
    line-height: 45px; /*设置行高，使文字内容垂直居中*/
    padding:0 15px; /*为列表左右两边设置15像素内边距，确保文字边框的边距*/
    flex: 1; /*使列表等分空间*/
}

nav ul li a {
    color: white; /*控制导航窗格内链接文字的颜色*/
    text-decoration: none; /*移除了默认下划线*/
}


nav ul li a:hover{
    color: goldenrod; /*鼠标移动上导航栏后的颜色*/

}

a {
    color: white;
}

.carousel {
    position: relative;
    width: 100%;
    max-width: 1100px; /* 根据需要调整大小 */
    margin: auto;
    overflow: hidden; /* 隐藏超出容器的部分 */
}

.carousel-inner {
    display: flex;
    transition: transform 0.5s ease-in-out; /* 平滑过渡效果 */
}

.carousel-inner a {
    flex-shrink: 0;
    width: 100%; /* 每个链接占用整个轮播宽度 */
    text-align: center;
}

.carousel-inner img {
    width: 100%;
    display: block;
    transition: transform 0.3s ease, filter 0.3s ease; /* 平滑过渡 */
}

.carousel-inner img:hover {
    transform: scale(1.1); /* 放大效果 */
    filter: brightness(1.2); /* 提升亮度 */
}

.carousel-inner img.no-hover:hover {
    transform: none; /* 禁止缩放 */
    filter: none; /* 禁止亮度变化 */
}

.carousel-btn {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background-color: rgba(0, 0, 0, 0.5);
    color: white;
    border: none;
    padding: 10px 20px;
    cursor: pointer;
    z-index: 10;
}

.carousel-btn.prev {
    left: 10px;
}

.carousel-btn.next {
    right: 10px;
}

.carousel-btn:hover {
    background-color: rgba(0, 0, 0, 0.8);
}

.pdf-link {
    display: inline-block; /* 让链接呈现为块状 */
    font-size: 18px; /* 链接文字大小 */
    color: #900049; /* 链接颜色 */
    text-decoration: none; /* 移除下划线 */
    border: 2px solid #900049; /* 添加边框 */
    padding: 10px 20px; /* 内边距 */
    border-radius: 5px; /* 圆角 */
    transition: background-color 0.3s, color 0.3s; /* 鼠标悬停效果 */
}

.pdf-link:hover {
    background-color: #900049; /* 鼠标悬停背景色 */
    color: #fff; /* 鼠标悬停文字颜色 */
}

.image-row {  /* 图片并排设置 */
    display: flex; /* 使用flex布局 */
    justify-content: space-around; /* 图片间距 */
    gap: 20px; /* 图片之间的间距 */
    margin: 20px 0;
}

.image-row img {
    width: 48%; /* 每张图片占50%宽度，留出间隙 */
    height: auto; /* 保持比例 */
    border-radius: 8px; /* 可选：圆角 */
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2); /* 可选：阴影 */
}

.carousel-inner img.no-hover:hover {  /* 特定图片禁止放大变色特效 */
    transform: none; /* 禁止缩放 */
    filter: none; /* 禁止亮度变化 */
}