.sqm{
            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: 60% 30%;            /*background-position*/
            /*  */
            animation: masked-animation 3s infinite linear;
        }
        @keyframes masked-animation {
            0% {
                background-position: 0 0;   /*background-position */
            }
            50% {
                background-position: -50% 0;
            }
        }

      .sqm1 {
                background-image: 
        -webkit-gradient( linear, left top, right top, color-stop(0, #f22), 
        color-stop(0.15, #f2f), 
        color-stop(0.3, #22f), 
        color-stop(0.45, #2ff), 
        color-stop(0.6, #2f2),
        color-stop(0.75, #2f2), 
        color-stop(0.9, #ff2), 
        color-stop(1, #f22) );
    color: transparent;
    -webkit-background-clip: text;-moz-background-clip: text;-ms-background-clip: text
        }

          .sqm2 {
                font-size: 15px;
                font-family: "黑体";
                color: #ff00000;
                background: -webkit-linear-gradient(45deg, #ff0000, #fbd7c6, #fdefac, #bfb5dd, #bed5f5);
                -moz-linear-gradient(45deg, #ff0000, #fbd7c6, #fdefac, #bfb5dd, #bed5f5);
                -ms-linear-gradient(45deg, #ff0000, #fbd7c6, #fdefac, #bfb5dd, #bed5f5);
                color: transparent;
                /*设置字体颜色透明*/
                -webkit-background-clip: text;
                /*背景裁剪为文本形式*/
                animation: ran 70s linear infinite;
                /*动态10s展示*/
            }

            @keyframes ran {
                from {
                    backgroud-position: 0 0;
                }
                to {
                    background-position: 2000px 0;
                }
            }

.sqm3{
color: gold;
letter-spacing: 0;
text-shadow: 0px 1px 0px #999, 0px 2px 0px #888, 0px 3px 0px #777, 0px 4px 0px #666, 0px 5px 0px #555, 0px 6px 0px #444, 0px 7px 0px #333, 0px 8px 7px #001135 }
.sqm4{
    font-family:cursive;text-shadow:6px 2px 2px #333;color:deeppink
}
.text-reflect-base{
    color: palegreen;
    -webkit-box-reflect:below 10px;
}
.sqm5{
    background-image: -webkit-linear-gradient(left,blue,#66ffff 10%,#cc00ff 20%,#CC00CC 30%, #CCCCFF 40%, #00FFFF 50%,#CCCCFF 60%,#CC00CC 70%,#CC00FF 80%,#66FFFF 90%,blue 100%);
    -webkit-text-fill-color: transparent;/* 将字体设置成透明色 */
    -webkit-background-clip: text;/* 裁剪背景图，使文字作为裁剪区域向外裁剪 */
    -webkit-background-size: 200% 100%; 
    -webkit-animation: masked-animation 4s linear infinite;
}
@keyframes masked-animation {
    0% {
        background-position: 0  0;
    }
    100% {
        background-position: -100%  0;
    }
}

.x-sign {
  --interval: 1s;
  text-shadow: 
    0 0 10px var(--color1),
    0 0 20px var(--color2),
    0 0 40px var(--color3),
    0 0 80px var(--color4);
  will-change: filter, color;
  filter: saturate(60%);
  animation: flicker steps(100) var(--interval) 1s infinite;
}
.x-sign:nth-of-type(1) {
  color: yellow;
  --color1: goldenrod;
  --color2: orangered;
  --color3: mediumblue;
  --color4: purple;
  font-family: Gruppo;
}

.x-sign:nth-of-type(2) {
  color: lightpink;
  --color1: pink;
  --color2: orangered;
  --color3: red;
  --color4: magenta;
  font-family: Bad Script;
}

.x-sign:nth-of-type(3) {
  color: lightyellow;
  --color1: yellow;
  --color2: lime;
  --color3: green;
  --color4: mediumblue;
  font-family: Kumar One Outline;
}

.x-sign:nth-of-type(4) {
  color: lightyellow;
  --color1: gold;
  --color2: firebrick;
  --color3: pink;
  --color4: red;
  font-family: Londrina Outline;
}


.x-sign:nth-of-type(5) {
  color: azure;
  --color1: azure;
  --color2: aqua;
  --color3: dodgerblue;
  --color4: blue;
  font-family: Sriracha;
}

.x-sign:nth-of-type(6) {
  color: tomato;
  --color1: orangered;
  --color2: firebrick;
  --color3: maroon;
  --color4: darkred;
  font-family: Yellowtail;
}

.x-sign:nth-of-type(7) {
  color: lightyellow;
  --color1: yellow;
  --color2: orange;
  --color3: brown;
  --color4: purple;
  font-family: Bad Script;
}

.x-sign:nth-of-type(8) {
  color: yellow;
  --color1: yellow;
  --color2: lime;
  --color3: green;
  --color4: darkgreen;
  font-family: Monoton;
}

.x-sign:nth-of-type(9) {
  color: lightyellow;
  --color1: yellow;
  --color2: gold;
  --color3: orange;
  --color4: darkred;
  font-family: Sriracha;
}
@keyframes flicker {
  50% {
    color: white;
    filter: saturate(200%) hue-rotate(20deg);
  }
}
.side-bar {z-index: 9999;width: 20px;position: fixed;bottom: 15px;right: 25px;display: inline-block;}
#picture {
    margin-top: -20px;
    margin-left: -20px;
    width: 45px;height: 45px;border-radius: 50%;
}
#badge {
    padding: 2px 6px;
    text-align: center;
    background-color: red;
    color: white;
    font-size: 12px;
    font-weight:;
    border-radius: 50%;
    position: relative;
    bottom: 59px;
    left: 9px;
}