body {  
            font-family: Arial, sans-serif;  
            background-color: #f5f5f5;  
            margin: 0;  
            padding: 0;  
        }  
        
        .navbar {  
            background-color: #0080FF; /* #66CCFF(浅) #0080FF(深) 天蓝色背景 */  
            color: #FFFFFF; /* 白色字体 */  
            padding: 10px;  
            overflow: hidden;  
            display: flex;  
            justify-content: center; /* 使链接居中 */  
        }  
  
        .navbar a {  
           color: #FFFFFF;  
           text-align: center;  
           padding: 10px 16px;  
           text-decoration: none;  
           }  
  
        .navbar a:hover {  
           background-color: #FF7F00; /* 橙色悬停效果 */  
        }  
  
        /* 清除浮动，防止影响其他元素 */  
        .navbar::after {  
           content: "";  
           display: table;  
           clear: both;  
        }
     
        /* 搜索整体控制 */  
        #searchForm {  
           display: flex;  
           justify-content: center; /* 使表单内容（输入框和按钮）居中 */  
           align-items: center; /* 垂直居中（如果需要的话） */  
           margin-top: 20px;  
           width: 100%; /* 确保表单宽度填满其父容器 */  
        }   
        /* 搜索框控制 */  
        #searchInput {  
            width: 200px; /* 根据需要调整宽度 */
            height: 52px;
            padding: 5px; /* 增大内边距 */  
            font-size: 18px;  /* 增大字体大小 */    
            border-radius: 5px;  
            border: 1px solid #FF0009;  
			margin-left: 5px; /* 搜索框右边保持一定距离 */ 
			margin-right: 5px; /*搜索框左边保持一定距离 */  
        }  
        #searchInput:focus {  
           outline: none; /* 移除默认的外框*/  
        }   
        /* 搜索框悬停样式 */  
        #searchInput:hover {  
           border-color: #FF0009; /* 鼠标悬停时改变边框颜色 */  
        }  
        /* 搜索按钮控制 */  
        #searchForm button {  
		    width: 80px; /* 设置搜索按钮的宽度 */  
            height: 52px; /* 设置搜索按钮的高度 */  
            padding: 5px; /* 为按钮设置内边距 */  
            font-size: 18px; /* 增大字体大小 */  
			background-color: #FF9933;   /* 按钮背景色 */  
		    border-color: #FF0009;  
            margin-left: 5px; /* 与搜索框保持一定距离 */      
            color: #ffffff; /* 将按钮文字颜色设置为白色 */  
            border-radius: 5px;  /* 圆角 */ 
            border: none;  
            cursor: pointer;  
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); /* 阴影效果 */  
        }  
        /* 搜索按钮悬停样式 */  
        #searchForm button:hover {  
           background-color: #FF0009; /* 鼠标悬停时改变背景颜色 */  
           border-color: #FF0009; /* 也可以改变边框颜色，如果需要 */  
        }
        

       /* 增大下拉框的宽度和高度 */  
        #searchEngine {  
            width: 138px; /* 根据需要调整宽度 */  
            height: 50px; /* 根据需要调整高度 */  
            padding: 5px; /* 增大内边距 */  
            font-size: 18px;  /* 增大字体大小 */  
            background-color: #FF0009;  
            margin-left: 0px; /* 与搜索框保持一定距离 */      
            color: white;  
            border-radius: 5px;  
            border: none;  
            cursor: pointer;  
      }  
  
        hr {  
           border: none; /* 移除默认的边框 */
           border-top: 2px solid #FF0000; /* 设置顶部边框的颜色和粗细 */  
           height: 5px; /* 设置高度 */  
           background-color: #FF0000; /* 设置颜色 */  
           margin: 20px 0; /* 设置上下边距 */  
        }

       /* 增加外框 */  
        .waikuang {  
            margin: 10px; /* 每列之间的间隙 */  
            background-color: white; /* 背景颜色，可根据需要调整 */  
            padding: 15px; /* 内边距 */  
            box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); /* 阴影效果 */  
            border-radius: 8px; /* 圆角 */  
            text-align: left; /* 文字居中 */ 
            margin-left: 10px; /* 增加左外边距 */  
            margin-top: 10px;  /* 增加上边距离 */  
            margin-right: 10px;  /* 增加右边距离 */  
        }


/* 底部信息开始 */
.footer {
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.15); /* 阴影效果 */
    position: fixed; /* 固定在屏幕底部 */
    background-color: #FFD700;  /*明黄色 FFDB00  暖金黄FFC800  蔚蓝4A9FD8 深宝蓝：#003366 或 #002B5C 青色（边缘部分）：#007BFF 或 #0056B3*/
    color: white;    
    padding: 15px 0 1px;  /* 仅保留上下内边距 */
    text-align: center;
    position: fixed;
    bottom: 0;
    width: 100%;
    /* 添加一些外边距，以防止内容被footer覆盖 */
    margin-top: 15px; /* 根据需要调整 */
    font-size: 12px; /* 控制字体大小，可以根据需要调整 */
    z-index: 1000; /* 确保高于其他内容 */
}

/* 底部导航链接样式 */
.footer-links {  
    padding-left: 0; /* 新增：覆盖浏览器的默认样式 */
    display: flex; /* 使用 Flexbox 布局 */  
    justify-content: space-around; /* 平均分配空间 */  
    list-style-type: none; /* 移除默认项目符号 */  
    padding: 0; /* 移除默认内边距 */  
}

/* 底部导航项样式 */  
.footer-item {  
    position: relative; /* 相对定位 */  
    margin-left: -5px; /* 增加右边距离 */
}

/* 底部链接 */  
.footer-item a {  
    color: #000000; /* 链接颜色 */  
    text-decoration: none; /* 移除下划线 */
    transition: color 0.3s ease; /* 添加过渡效果 */
    display: block; /* 占据块级元素的空间 */  
    text-align: center; /* 文本居中 */  
}

/* 鼠标悬停时的链接样式 */
.footer-item a:hover {  
    color: #ff0000; /* 悬停时的颜色 */
}

/* 底部emoji样式 */  
.footer-icon {  
    font-size: 16px; /* emoji大小 */
    color: #EA4335; /* emoji颜色 */
    display: block; /* 占据块级元素的空间 */
    text-align: center; /* 文本居中 */  
    margin-bottom: 1px; /* 与链接之间的间距 */
}
/* 底部信息结束 */