*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body{
    background-image: linear-gradient(120deg, #bef5c3 0%, #ffe49a 100%) ;
    min-height: 100vh;
}
header  {
    background-color: #061b1d;
    width: 100%;
    height: 80px;
    position: fixed;
}
header h1 {
    color:rgb(255, 255, 255);
    /* position: absolute; */
    left: 5px;
    top: 0;
    line-height: 80px;
}
header ul {
    position: absolute;
    right:5vw;
    top: 0;
    line-height: 80px;
}
header li {
    display: inline;
    margin-left: 4vw;
    font-size: 17px;
}
header a {
    color: rgb(255, 255, 255);
    text-decoration: none;
}
header a:hover {
    text-decoration: underline;
}

#mobile-arrow {
    position: absolute;
    left: 20px; /* 将箭头移到左边 */
    top: 50%;
    transform: translateY(-50%);
    color: white;
    font-size: 36px; /* 放大字体，可按需调整 */
    text-decoration: none;
}

#mobile-arrow:hover {
    color: #ccc;
}
footer{
    /* background-color: rgb(32, 32, 32); */
    color: rgb(133, 133, 133);
    height: 30px;
    /* display: flex;
    justify-content: center;
    align-items: center;
    line-height: 1.8em; */
    font-size: 10px;
    position: fixed;
    left:40%;
    bottom: 0px;

}


#yind  {
    display: flex; /* 使用 flex 布局 */
    flex-direction: row; /* 子元素横向排列 */
    list-style-type: none; /* 移除列表项默认的符号 */
    margin-left: 50px; /* 添加左边距，让列表离左边 20px 距离 */
}

#yind li {
    margin-right: 30px; /* 为子元素添加右外边距，让元素之间有间隔 */
    font-size: 18px; /* 设置字体大小，可根据需求调整数值 */
}

#yind a {
    color: rgb(34, 34, 34);
    text-decoration: none;
}
#yind a:hover {
    text-decoration: underline;
}


.download-item {
    display: flex; /* 使用 Flexbox 布局 */
    align-items: center; /* 垂直居中对齐 */
    border: 1px solid #ccc; /* 添加边框 */
    padding: 10px; /* 添加内边距 */
    margin-bottom: 10px; /* 底部外边距 */
}

.item-image {
    width: 120px; /* 图片宽度 */
    height: 80px; /* 图片高度 */
    margin-right: 15px; /* 图片右侧外边距 */
}

.item-info {
    flex-grow: 1; /* 让信息区域占据剩余空间 */
}

.item-name {
    margin: 0; /* 移除默认外边距 */
    font-size: 18px; /* 名称字体大小 */
    margin-left: 30px;
}

.item-type {
    margin: 0; /* 移除默认外边距 */
    font-size: 15px; /* 类型字体大小 */
    color: #666; /* 类型文字颜色 */
    margin-left: 30px;
}

.download-button {
    background-color: #007BFF; /* 按钮背景颜色 */
    color: white; /* 按钮文字颜色 */
    padding: 8px 15px; /* 按钮内边距 */
    text-decoration: none; /* 移除下划线 */
    border-radius: 4px; /* 按钮圆角 */
    margin-right: 50px; /* 可根据需要调整数值，让元素向左移动 */

}

.download-button:hover {
    background-color: #0056b3; /* 鼠标悬停时按钮背景颜色 */
}

.item-description{
    margin-left: 150px;
    position: relative;
    /* 向上移动，可根据实际情况调整数值 */
    top: -30px; 
}

@media (max-width: 600px) {
    .item-name {
        margin-left: 10px;
    }
    .item-type {
        margin-left: 10px;
    }
    .download-button {
        margin-right: 30px; 
    
    }
    footer {
        left:20%;
    }
}