body {
    font-size: 16px;
    display: block;
    margin: 8px;
}

a:visited {
    color: #136ec2;
    font-weight: 500;
    text-decoration: none;
}

a:link {
    color: #136ec2;
    font-weight: 500;
    text-decoration: none;
}

.tooltip {
    position: relative;
    display: inline-block;
    color:#136ec2;
}

.tooltip .tooltiptext {
    visibility: hidden;
    width: 160px;
    background-color: black;
    color: #fff;
    text-align: center;
    border-radius: 6px;
    padding: 5px 0;
    position: absolute;
    z-index: 1;
    top: 150%;
    left:100%;
    margin-left: -60px;
}

.tooltip .tooltiptext::after {
    content: "";
    position: absolute;
    bottom: 100%;
    left: 10%;
    margin-left: -5px;
    border-width: 6px;
    border-style: solid;
    border-color: transparent transparent black transparent;
}

.tooltip:hover .tooltiptext {
    visibility: visible;
}
.xuancai_1 {
    display: inline;
    width: 200px;
    height: 22px;
    /*渐变背景*/
    background-image: -webkit-linear-gradient(left, #3498db, #f47920 10%, #d71345 20%, #f7acbc 30%,
    #ffd400 40%, #3498db 50%, #f47920 60%, #d71345 70%, #f7acbc 80%, #ffd400 90%, #3498db);
    color: transparent; /*文字填充色为透明*/
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text; /*背景剪裁为文字，只将文字显示为背景*/
    background-size: 200% 100%; /*背景图片向水平方向扩大一倍，这样background-position才有移动与变化的空间*/
    /* 动画 */
    animation: masked-animation 4s infinite linear;
}
@keyframes masked-animation {
    0% {
        background-position: 0 0; /*background-position 属性设置背景图像的起始位置。*/
    }
    100% {
        background-position: -100% 0;
    }
}

.xuancai_2 {
    display: inline;
    width: 200px;
    height: 22px;
    /*渐变背景*/
    background-image: -webkit-linear-gradient(left, #ffa080, #ffa060 10%, #ffa040 20%, #ffa020 30%,
    #ffa0a0 40%, #ffa080 50%, #ffa060 80%, #ffa040 70%, #ffa020 80%, #ffa000 90%, #ffff00);
    color: transparent; /*文字填充色为透明*/
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text; /*背景剪裁为文字，只将文字显示为背景*/
    background-size: 200% 100%; /*背景图片向水平方向扩大一倍，这样background-position才有移动与变化的空间*/
    /* 动画 */
    animation: masked-animation 4s infinite linear;
}

@keyframes masked-animation {
    0% {
        background-position: 0 0; /*background-position 属性设置背景图像的起始位置。*/
    }
    100% {
        background-position: -100% 0;
    }
}

.xuancai_3 {
    display: inline;
    width: 200px;
    height: 22px;
    /*渐变背景*/
    background-image: -webkit-linear-gradient(left, #ff0080, #ff0060 10%, #ff0040 20%, #ff0020 30%,
    #ff00a0 40%, #ff0080 50%, #ff0060 80%, #ff0040 70%, #ff0020 80%, #ff0000 90%, #ffff00);
    color: transparent; /*文字填充色为透明*/
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text; /*背景剪裁为文字，只将文字显示为背景*/
    background-size: 200% 100%; /*背景图片向水平方向扩大一倍，这样background-position才有移动与变化的空间*/
    /* 动画 */
    animation: masked-animation 4s infinite linear;
}

@keyframes masked-animation {
    0% {
        background-position: 0 0; /*background-position 属性设置背景图像的起始位置。*/
    }
    100% {
        background-position: -100% 0;
    }
}

.xuancai_4 {
    display: inline;
    width: 200px;
    height: 22px;
    /*渐变背景*/
    background-image: -webkit-linear-gradient(left, #90fbe9, #60fbe6 10%, #30fbe3 20%, #10fbe1 30%,
    #00ebff 40%, #80ebff 50%, #60ebff 80%, #40ebff 70%, #20ebff 80%, #00ebff 90%, #10ebff);
    color: transparent; /*文字填充色为透明*/
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text; /*背景剪裁为文字，只将文字显示为背景*/
    background-size: 200% 100%; /*背景图片向水平方向扩大一倍，这样background-position才有移动与变化的空间*/
    /* 动画 */
    animation: masked-animation 4s infinite linear;
}

@keyframes masked-animation {
    0% {
        background-position: 0 0; /*background-position 属性设置背景图像的起始位置。*/
    }
    100% {
        background-position: -100% 0;
    }
}

.xuancai_5 {
    display: inline;
    width: 200px;
    height: 22px;
    /*渐变背景*/
    background-image: -webkit-linear-gradient(left, #ff80b8, #ff60b6 10%, #ff40b4 20%, #ff20b2 30%,
    #ae00ff 40%, #ae80ff 50%, #ae60ff 80%, #ae40ff 70%, #ae20ff 80%, #ae10ff 90%, #ff00b0);
    color: transparent; /*文字填充色为透明*/
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text; /*背景剪裁为文字，只将文字显示为背景*/
    background-size: 200% 100%; /*背景图片向水平方向扩大一倍，这样background-position才有移动与变化的空间*/
    /* 动画 */
    animation: masked-animation 4s infinite linear;
}

@keyframes masked-animation {
    0% {
        background-position: 0 0; /*background-position 属性设置背景图像的起始位置。*/
    }
    100% {
        background-position: -100% 0;
    }
}

.xuancai_6 {
    display: inline;
    width: 200px;
    height: 22px;
    /*渐变背景*/
    background-image: -webkit-linear-gradient(left, #f56dc0, #f56de3 10%, #ba6df5 20%, #796df5 30%,
    #20f4e8 40%, #20f498 50%, #f4206b 60%, #20f4ed 70%, #f7acbc 80%, #3420f4 90%, #cf20f4);
    color: transparent; /*文字填充色为透明*/
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text; /*背景剪裁为文字，只将文字显示为背景*/
    background-size: 200% 100%; /*背景图片向水平方向扩大一倍，这样background-position才有移动与变化的空间*/
    /* 动画 */
    animation: masked-animation 4s infinite linear;
}


.xuancai_7 {
    display: inline;
    width: 200px;
    height: 22px;
    /*渐变背景*/
    background-image: -webkit-linear-gradient(left, #f56dc0, #f56dc0 10%, #f56dc0 20%, #f56dc0 30%,
    #20f4e8 40%, #20f4e8 50%, #20f4e8 60%, #20f4e8 70%, #20f4e8 80%, #20f4e8 90%, #20f4e8);
    color: transparent; /*文字填充色为透明*/
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text; /*背景剪裁为文字，只将文字显示为背景*/
    background-size: 200% 100%; /*背景图片向水平方向扩大一倍，这样background-position才有移动与变化的空间*/
    /* 动画 */
    animation: masked-animation 4s infinite linear;
}

.xuancai_8 {
    display: inline;
    width: 200px;
    height: 22px;
    /*渐变背景*/
    background-image: -webkit-linear-gradient(left, #b70505, #f56d78 10%, #f56d96 20%, #f56dc0 30%,
    #f56dc0 40%, #e80674 50%, #b70505 60%, #f56dc0 70%, #f56d96 80%, #f56d78 90%, #f56d78);
    color: transparent; /*文字填充色为透明*/
    -webkit-text-fill-color: transparent;
    -webkit-background-clip: text; /*背景剪裁为文字，只将文字显示为背景*/
    background-size: 200% 100%; /*背景图片向水平方向扩大一倍，这样background-position才有移动与变化的空间*/
    /* 动画 */
    animation: masked-animation 4s infinite linear;
}

@keyframes masked-animation {
    0% {
        background-position: 0 0; /*background-position 属性设置背景图像的起始位置。*/
    }
    100% {
        background-position: -100% 0;
    }
}

.sqclass {
    position: relative;
    display: inline-block;
    color:#F56DC0;
}