html {
	min-width: 1210px;
	height: 100%;
}

 .STYLE2 {font-size: 16px}
    .STYLE3 {
	font-size: 10px;
	font-weight: bold;
}
   .shiny-text {  
    font-size: 10px; 
     font-weight: bold; 
    background: linear-gradient(45deg, red, yellow, aqua, green) ; 
    -webkit-background-clip: text;  
    -webkit-text-fill-color: transparent;  
    animation: gradient 4s ease-in-out infinite;  
    background-size: 200% 100%;  
  }  
   @keyframes gradient {  
    0% {  
      background-position: 0% 50%;  
    }  
    50% {  
      background-position: 100% 50%;  
    }  
    100% {  
      background-position: 0% 50%;  
    }  
  }  
  .shiny-text {  
    font-size: 10px; 
    font-weight: bold; 
    background: linear-gradient(45deg, #FF0000, #FF1100, #FF2200, #FF3300, #FF4400, #FF5500, #FF6600, #FF7700, #FF8800, #FF9900, #FFaa00, #FFbb00, #FFcc00, #FFdd00, #FFee00, #FFff00, #FFee00, #FFdd00, #FFcc00, #FFbb00, #FFaa00, #FF9900, #FF8800, #FF7700, #FF6600, #FF5500, #FF4400, #FF3300, #FF2200, #FF1100) ;
    -webkit-background-clip: text;  
    -webkit-text-fill-color: transparent;  
    animation: gradient 4s ease-in-out infinite;  
    background-size: 200% 100%;  
  } 
 .STYLE12 {font-size: 16px}
.STYLE13 {background: linear-gradient(45deg, red, yellow, aqua, green); -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: gradient 4s ease-in-out infinite; background-size: 200% 100%; font-weight: bold;}
.STYLE14 {background: linear-gradient(45deg, red, yellow, aqua, green); -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: gradient 4s ease-in-out infinite; background-size: 200% 100%; font-weight: bold;}
.STYLE15 {font-size: 12px; font-weight: bold; background: linear-gradient(45deg, red, yellow, aqua, green); animation: gradient 4s ease-in-out infinite; background-size: 200% 100%; }
  .glow-table {  
    width: 100%;  
    border-collapse: collapse;  
  }  
  .glow-table th, .glow-table td {  
    padding: 10px;  
    text-align: center;  
    border-bottom: 1px solid #ddd;  
  }  
    
  /* 鼠标悬停时的发光效果 */  
  .glow-table tr:hover {  
    background-color:; /* 背景色 */  
    transition: background-color 0.3s ease; /* 过渡效果 */  
    box-shadow: 0 0 10px #DC143C /* 发光效果，通过 box-shadow 实现 */  
  } 
      .image-container img {  
        display: inline-block; /* 允许在元素之间设置margin */  
        margin: 0 5px; /* 设置上下间隔为0，左右间隔为10像素 */  
    }  
    /* 移除第一张图片左边的间隔和最后一张图片右边的间隔 */  
    .image-container img:first-child {  
        margin-left: 0;  
    }  
    .image-container img:last-child {  
        margin-right: 0;  
    }  
.dashed-border {  
    border: 3px dashed #FFD700; /* 初始边框样式 */  
    padding: 5px;  
    font-size: 20px;  
    animation: changeBorderColor 2s infinite; /* 应用动画 */  
}  
  
/* 定义动画 */  
@keyframes changeBorderColor {  
    0% {  
        border-color: #FFD700; /* 开始时的颜色 */  
    }  
   50% {  
        border-color: #FF0000; /* 中间时的颜色 */  
    }  
    100% {  
        border-color: #00FF00; /* 结束时的颜色 */  
    }  
}
.dashed-border1 {  
    border: 3px dashed #FFD700; /* 初始边框样式 */  
    padding: 5px;  
    font-size: 20px;  
    animation: changeBorderColor 2s infinite; /* 应用动画 */  
}  
  
/* 定义动画 */  
@keyframes changeBorderColor {  
    0% {  
        border-color: #FFD700; /* 开始时的颜色 */  
    }  
   50% {  
        border-color: #FF0000; /* 中间时的颜色 */  
    }  
    100% {  
        border-color: #00FF00; /* 结束时的颜色 */  
    }  
} 

.popup {  
    display: none; /* 初始状态为隐藏 */  
    position: fixed; /* 根据需要定位 */  
    top: 50%;  
    left: 50%;  
    transform: translate(-50%, -50%); /* 居中显示 */  
    width: 580px; /* 宽度 */  
    height: 350; /* 高度 */  
    border: 1px dashed #FFD700; /* 初始边框样式 */  
    z-index: 1000; /* 确保在其他元素之上 */  
    /* 其他样式... */  
    overflow: hidden; /* 确保内容不会超出容器 */  
}  
  
.video-background {  
    position: absolute;  
    top: 0;  
    left: 0;  
    width: 100%;  
    height: 100%;  
    z-index: -1; /* 确保视频在内容之下 */  
}  
  
.video-background video {  
    position: absolute;  
    top: 50%;  
    left: 50%;  
    min-width: 100%;  
    min-height: 100%;  
    width: auto;  
    height: auto;  
    transform: translate(-50%, -50%);  
    object-fit: cover; /* 保持视频比例并覆盖容器 */  
}

wenzi-1{  
  color: green;  
}

  
  .shiny-text1 {  
    font-size: 10px; 
    font-weight: bold; 
    background-color: #FFFFFF;
    -webkit-background-clip: text;  
    animation: gradient 4s ease-in-out infinite;  
    background-size: 200% 100%; 
    padding: 5px; /* 为文本添加内边距 */
    border-radius: 15px; /* 圆角边框 */
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); /* 添加阴影以增强视觉效果 */	
  } 
    .shiny-text1 a {
    color: inherit; /* 链接文字颜色继承自父级 */
    text-decoration: none; /* 去掉下划线 */
    display: inline-block; /* 确保链接占据按钮的全部空间 */
    width: 100%;
    height: 100%;
  }
  
        body, html {
            margin: 0;
            padding: 0;
        }
 
        /* 主体内容部分，避免被 footer 遮挡 */
        .content {
            padding-bottom: 100px; /* 留出 footer 的高度 */
        }
 
        /* 底部样式 */
        footer {
            /* 移除 position: fixed; 使 footer 可以自由移动 */
            position: relative; /* 或者可以省略，默认是 static */
            bottom: auto; /* 移除 bottom 属性，因为它在 relative 或 static 定位下无效 */
            left: auto; /* 移除 left 属性，因为它在 relative 或 static 定位下无效 */
            width: 100%;
 
            text-align: center;
            padding: 20px 0; /* 使用正值来设置内边距 */
            box-shadow: 0 -2px 5px rgba(0, 0, 0, 0.1); /* 可选：添加阴影 */
        }
 
        .footer-text {
            font-size: 14px;
            line-height: 1.6;
        }
 
        .footer-text img {
            margin: 5px;
            height: 80px; /* 可根据需要调整图片大小 */
        }
 
        /* 示例：使用 margin-top 来向下移动 footer */
        .move-down {
            margin-top: 50px; /* 根据需要调整这个值 */
        }
		
		
        .transparent-button {
            display: inline-flex; /* 使用 inline-flex 布局，使按钮在同一行显示 */
            justify-content: center; /* 水平居中对齐 */
            align-items: center; /* 垂直居中对齐 */
            width: 120px; /* 按钮宽度 */
            height: 40px; /* 按钮高度 */
    background-color: transparent; /* 默认状态：完全透明 */
            border: 1px solid #ebdec2; /* 边框颜色 */
            color: #ffffff; /* 文字颜色 */
            font-size: 16px; /* 文字大小 */
            font-weight: bold; /* 文字加粗 */
            border-radius: 15px; /* 圆角边框 */
            cursor: pointer; /* 鼠标悬停时显示为手型 */
            transition: background-color 0.3s ease; /* 背景颜色过渡效果 */
            margin-right: 10px; /* 按钮之间的间距，最后一个按钮不需要这个间距 */
        }
 
        /* 去掉最后一个按钮的右边距（可选） */
        .transparent-button:last-child {
            margin-right: 0;
        }
 
        .transparent-button:hover {
    background-color: transparent; /* 悬停时完全透明 */
        }
		
		
        .transparent1-button {
            display: inline-flex; /* 使用 inline-flex 布局，使按钮在同一行显示 */
            justify-content: center; /* 水平居中对齐 */
            align-items: center; /* 垂直居中对齐 */
            /* width: 120px; 移除固定宽度 */
            height: 35px; /* 按钮高度 */
            padding: 0 15px; /* 添加左右内边距，确保文字不会紧贴边框 */
    background-color: transparent; /* 默认状态：完全透明 */
            border: 1px solid #ebdec2; /* 边框颜色 */
            color: #ffffff; /* 文字颜色 */
            font-size: 15px; /* 文字大小 */
            font-weight: bold; /* 文字加粗 */
            border-radius: 15px; /* 圆角边框 */
            cursor: pointer; /* 鼠标悬停时显示为手型 */
            transition: background-color 0.3s ease; /* 背景颜色过渡效果 */
            margin-right: 10px; /* 按钮之间的间距，最后一个按钮不需要这个间距 */
        }
 
        /* 去掉最后一个按钮的右边距（可选） */
        .transparent1-button:last-child {
            margin-right: 0;
        }
 
        .transparent1-button:hover {
    background-color: transparent; /* 悬停时完全透明 */
        }
		
		
		
		    .transparent2-button {
            display: inline-flex; /* 使用 inline-flex 布局，使按钮在同一行显示 */
            justify-content: center; /* 水平居中对齐 */
            align-items: center; /* 垂直居中对齐 */
            /* width: 120px; 移除固定宽度 */
            height: 35px; /* 按钮高度 */
            padding: 0 15px; /* 添加左右内边距，确保文字不会紧贴边框 */
    background-color: transparent; /* 默认状态：完全透明 */
            border: 1px solid #ebdec2; /* 边框颜色 */
            color: #ffffff; /* 文字颜色 */
            font-size: 15px; /* 文字大小 */
            border-radius: 15px; /* 圆角边框 */
            cursor: pointer; /* 鼠标悬停时显示为手型 */
            transition: background-color 0.3s ease; /* 背景颜色过渡效果 */
            margin-right: 10px; /* 按钮之间的间距，最后一个按钮不需要这个间距 */
        }
 
        /* 去掉最后一个按钮的右边距（可选） */
        .transparent2-button:last-child {
            margin-right: 0;
        }
 
        .transparent2-button:hover {
    background-color: transparent; /* 悬停时完全透明 */
        }

		
		
		        .centered-text-container {
            display: flex; /* 使用 Flexbox 布局 */
            justify-content: center; /* 水平居中对齐 */
            align-items: center; /* 垂直居中对齐 */
            height: 100vh; /* 使容器占满整个视口高度，便于演示 */
            border: 1px solid #ccc; /* 可选：添加边框以查看容器大小 */
        }
 
        .centered-text {
            font-size: 24px; /* 设置文字大小，可以根据需要调整 */
            /* 你可以添加更多样式来控制文本外观 */
            color: #333; /* 文字颜色 */
            font-weight: bold; /* 文字加粗 */
            text-align: center; /* 确保多行文本也居中对齐（虽然 Flexbox 已经处理了单行） */
        }
		
		
		        .group-info {
            margin-bottom: 20px; /* 为每个群信息添加一些间距 */
        }
 
        .group-title {
            font-size: 18px;
            font-weight: bold;
        }
 
        .group-code {
            color: #F00;
        }
 
        .group-link {
            margin-left: 10px; /* 为链接添加一些左边距 */
            text-decoration: none; /* 移除下划线 */
        }
 
        .badge {
            margin-left: 10px;
            padding: 5px 10px;
            border-radius: 5px;
            color: #fff;
            font-size: 14px;
        }
 
        .bg-danger {
            background-color: #dc3545;
        }
 
        .bg-success {
            background-color: #28a745;
        }
 
        .bg-info {
            background-color: #17a2b8;
        }
 
        /* 可以为每个群信息添加独特的样式，如果需要 */
        .group-one .badge {
            /* 特定于①群的样式（如果需要额外样式） */
        }
 
        .group-two .badge {
            /* 特定于②群的样式（如果需要额外样式） */
        }
 
        .group-three .badge {
            /* 特定于③群的样式（如果需要额外样式） */
        }
		
 
        .video1-background::before {
            content: "天穹奇迹S20 品牌运营六年之久 火爆人气 养老之地";
            position: absolute;
            top: 80%; 
            left: 50%;
            transform: translateX(-50%);
            color: white;
            font-size: 20px;
            font-weight: bold;
            z-index: 1;
            background-color: rgba(0, 0, 0, 0.5);
            padding: 16px;
            border-radius: 5px;
            display: inline-block; /* 让背景自动适应内容宽度 */
            white-space: nowrap; /* 防止文字换行 */
        }