/* ====================== 1. 全局基础样式 ====================== */
body {
    padding: 10% 5% 5% 5%;
}

/* ====================== 2. 页面外层卡片容器 ====================== */
.html8-wrap {
    text-align: center;
    border-width: 1px;
    border-style: solid;
    border-color: rgb(2, 204, 245);
    background-color: #79918e6b;
    border-radius: 20px;
}

/* ====================== 3. 底部版权文字区域 ====================== */
.wrapper {
    color: blueviolet;
    padding-top: 10px;
}
.xhx {
	text-decoration: none;
}

/* ====================== 4. 按钮布局容器 ====================== */
.html8-item {
    display: flex;
    justify-items: center;
    margin-bottom: 10px;
}
.html8-wraps {
    padding: 0 220px;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

/* ====================== 5. 站点按钮样式 ====================== */
.html8 {
    border-radius: 10px;
    padding: 7px 30px;
    color: #fff;
    border-style: solid;
    text-decoration: none;
    margin-right: 10px;
}

/* ====================== 6. 背景图样式 ====================== */
.my-bj{
	background-image: url('https://pic1.imgdb.cn/item/6a4a07b456011c55398c7033.jpg');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: cover;
	background-attachment: fixed;
}

/* ====================== 7. 移动端响应式适配（580px以下） ====================== */
@media screen and (max-width:580px) {
    body {
        padding: 10% 5% 5% 5%;
    }
    .html8-wraps {
        padding: 0 20px;
    }
    .html8 {
        min-width: 120px;
        padding: 7px 10px;
        margin-right: 0;
    }
    .html8-item .html8:first-child {
        margin-right: 5px;
        margin-left: 5px;
    }
}