.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: 16px;
	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: 2px 1px 3px deeppink;
	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;
}
}


/* 新增添 */
/* 改 */
.sqm6 {
	color: #FFAB00;
	    font-family: monospace;
	-webkit-background-clip:text;
	-webkit-animation: mol1 3s linear infinite;
}
@-webkit-keyframes mol1 {
    0%{
        color: #FFAB00;
    }
    20% {
        color: #FFAB00;
    }
    40%{
        color: #BE8000;
    }
	60%{
	    color: #050401 ;
	}
	80%{
	    color: #4D3500 ;
	}
	100%{
	    color: #996800;
	}
}
.sqm7 {
	color: #f9b193;
	-webkit-background-clip:text;
	-webkit-animation: mol2 3s linear infinite;
}
@-webkit-keyframes mol2 {
    0%{
        color: #f9b193;
    }
    20% {
        color: #f9b193;
    }
    40%{
        color: #f1727f;
    }
	60%{
	    color: #c06b85;
	}
	80%{
	    color: #6d5d7e;
	}
	100%{
	    color: #335b80;
	}
}
/* 改 */
.sqm8 {
	background-image: -webkit-linear-gradient(left,#0A0218,#11064C 10%,#FD250F 20%,#FE5803 30%, #c48ade 40%, #AA1B61 50%,#544CA4 60%,#AA1B61 70%,#FD250F 80%,#11064C 90%,#0A0218 100%);
	-webkit-text-fill-color: transparent;
	-webkit-background-clip: text;
	-webkit-background-size: 200% 100%;
	-webkit-animation: mol3 3s linear infinite;
}

@keyframes mol3 {
	0% {
	background-position: 0 0;
}
100% {
	background-position: -100% 0;
}
}
.sqm9 {
	background-image: -webkit-linear-gradient(left,#a6d676,#feb500 10%,#147ebc 20%,#34adae 30%, #c8d4d2 40%, #ed9c6b 50%,#c8d4d2 60%,#34adae 70%,#147ebc 80%,#feb500 90%,#a6d676 100%);
	-webkit-text-fill-color: transparent;
	-webkit-background-clip: text;
	-webkit-background-size: 200% 100%;
	-webkit-animation: mol4 3s linear infinite;
}

@keyframes mol4 {
	0% {
	background-position: 0 0;
}
100% {
	background-position: -100% 0;
}
}
/* 改 */
.sqm10 {
	background-image: -webkit-linear-gradient(left,#BB0708,#DA3B44 10%,#DE575D 20%,#580705 30%, #E2A1A3 40%, #F4ECE4 50%,#E2A1A3 60%,#580705 70%,#DE575D 80%,#DA3B44 90%,#BB0708 100%);
	-webkit-text-fill-color: transparent;
	-webkit-background-clip: text;
	-webkit-background-size: 200% 100%;
	-webkit-animation: mol5 4s linear infinite;
}

@keyframes mol5 {
	0% {
	background-position: 0 0;
}
100% {
	background-position: -100% 0;
}
}
.sqm11 {
	color: #ccabd8;
	-webkit-background-clip:text;
	-webkit-animation: mol6 4s linear infinite;
}
@-webkit-keyframes mol6 {
    0%{
        color: #ccabd8;
    }
    20% {
        color: #ccabd8;
    }
    40%{
        color: #e25b45;
    }
	60%{
	    color: #f7f5df;
	}
	80%{
	    color: #fc0d00;
	}
	100%{
	    color: #751102;
	}
}
/* 改 */
.sqm12 {
	background-image: -webkit-linear-gradient(left, #047C51, #58FEDB 10%, #0C344E 20%, #0640A7 30%, #98AD06 40%, #FFD498 50%, #98AD06 60%, #0C344E 70%, #0640A7 80%, #58FEDB 90%, #047C51);
	color: transparent;
	-webkit-text-fill-color: transparent;
	-webkit-background-clip: text;
	background-size: 60% 30%;
	animation: mol7 4s linear infinite;
}
@keyframes mol7 {
	0% {
	background-position: 0 0;
}
50% {
	background-position: -50% 0;
}
}
.sqm13 {
	background-image: -webkit-linear-gradient(left, #da6085, #d7ede1 10%, #014872 20%, #131c85 30%, #60f3ab 40%, #f3df7a 50%, #131c85 60%, #a0eacf 70%, #d7ede1 80%, #014872 90%, #da6085);
	color: transparent;
	-webkit-text-fill-color: transparent;
	-webkit-background-clip: text;
	background-size: 60% 30%;
	animation: mol8 4s linear infinite;
}
@keyframes mol8 {
	0% {
	background-position: 0 0;
}
50% {
	background-position: -50% 0;
}
}
.sqm14{
    color: #f35626;
    background: coral;
    background-image: -webkit-linear-gradient(30deg,#c9d7b2,#60f3ab);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    -webkit-animation: mol9 3s linear infinite;
}
@-webkit-keyframes mol9 {
    from {
        -webkit-filter: hue-rotate(0deg);
    }
    to {
        -webkit-filter: hue-rotate(-360deg);
    }
}
/* 改 */
.sqm15 {
	font-size: 16px;
	font-family: "黑体";	background:-webkit-linear-gradient(left,#FEA888,#6756EF 25%,#4D135A 50%,#2B5DC6 75%,#224B26);
	color:transparent;
	-webkit-text-fill-color: transparent;
	-webkit-background-clip:text;
	background-size:200% 100%;
	animation:mol10 5s linear infinite;
}
@-webkit-keyframes mol10 {
	0% {
		background-position:0 0;
	}
	100% {
		background-position:-100% 0;
	}
}
/* 改 */
.sqm16 {
	background-image: -webkit-linear-gradient(left, #321DEE, #664EEF 10%, #4DA8D5 20%, #B4AEE8 30%, #4440B3 40%, #F0EEFA 50%, #4440B3 60%, #B4AEE8 70%, #4DA8D5 80%, #664EEF 90%, #321DEE);
	color: transparent;
	-webkit-text-fill-color: transparent;
	-webkit-background-clip: text;
	background-size: 60% 30%;
	animation: mol11 4s linear infinite;
}
@keyframes mol11 {
	0% {
	background-position: 0 0;
}
50% {
	background-position: -50% 0;
}
}
/* 改 */
.sqm17 {
	font-size: 16px;
	font-family: "黑体";font-weight: bold;	background:-webkit-linear-gradient(left,#996369,#1A0645 25%,#F22500 50%,#D131A2 75%,#0B1083);
	color:transparent;
	-webkit-text-fill-color: transparent;
	-webkit-background-clip:text;
	background-size:200% 100%;
	animation:mol12 5s linear infinite;
}
@-webkit-keyframes mol12 {
	0% {
		background-position:0 0;
	}
	100% {
		background-position:-100% 0;
	}
}
.sqm18 {
	background:-webkit-linear-gradient(left,rgb(204,153,153),rgb(51,153,204) 25%,rgb(235,235,255) 50%,rgb(153,0,51) 75%,rgb(102,153,153));
	color:transparent;
	-webkit-text-fill-color: transparent;
	-webkit-background-clip:text;
	background-size:200% 100%;
	animation:mol13 5s linear infinite;
}
@-webkit-keyframes mol13 {
	0% {
		background-position:0 0;
	}
	100% {
		background-position:-100% 0;
	}
}
.sqm19 {
	background-image: -webkit-linear-gradient(left, #009966, #0099cc 10%, #003366 20%, #cc99ff 30%, #f66666 40%, #ccffff 50%, #fccccc 60%, #cc99ff 70%, #003366 80%, #0099cc 90%, #009966);
	color: transparent;
	-webkit-text-fill-color: transparent;
	-webkit-background-clip: text;
	background-size: 60% 30%;
	animation: mol14 4s linear infinite;
}
@keyframes mol14 {
	0% {
	background-position: 0 0;
}
50% {
	background-position: -50% 0;
}
}
/* 改 */
.sqm20 {
	font-size: 16px;
	font-family: "Times New Roman";	background:-webkit-linear-gradient(left,#541AE5,#00D87C 25%,#FFA0BD 50%,#FE3405 75%,#00B4FF);
	color:transparent;
	-webkit-text-fill-color: transparent;
	-webkit-background-clip:text;
	background-size:200% 100%;
	animation:mol15 5s linear infinite;
}
@-webkit-keyframes mol15 {
	0% {
		background-position:0 0;
	}
	100% {
		background-position:-100% 0;
	}
}
/* 改 */
.sqm21 {
	background-image: -webkit-linear-gradient(left, #996369, #F26F8C 10%, #CFA81D 20%, #CF133D 30%, #DA5C5D 40%, #E7DFCA 50%, #DA5C5D 60%, #CF133D 70%, #CFA81D 80%, #F26F8C 90%, #996369);
	color: transparent;
	-webkit-text-fill-color: transparent;
	-webkit-background-clip: text;
	background-size: 60% 30%;
	animation: mol16 4s linear infinite;
}
@keyframes mol16 {
	0% {
	background-position: 0 0;
}
50% {
	background-position: -50% 0;
}
}
/* 新增添结束 */

.sqm22 {
	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;
}
}

.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;
}
 .side-barhb{
width: 45px;
height:50px;
z-index: 9999;
	position: fixed;
	right: 20px;

}
.picturehbimg{
	display: block;
	width: 45px;
height:50px;

margin-top: -1px;
	margin-left: -5.7px;
}
.badgehb{
	width: 45px;
height:50px;
	font-size: 0.8875rem;
	text-align: center;
	font-weight:;
	position: relative;
	bottom: 0px;
}

.javahb{
width: 45px;
height:50px;
	border-radius: 8px;
	border: none;
	}

.myaxa{  z-index: 9999;position: fixed; background-color: rgba(0,0,0,0.7); color: #fff; height: 60px; left: 50%; top: 50%; font-size: 100%; line-height: 25px; border-radius: 15px; text-align: center;  padding:18px 18px 15px 18px;  }   

.showB { z-index: 9999;position: fixed; background-color: rgba(0,0,0,0.7); color: #fff; height: 30px; left: 50%; top: 50%; font-size: 100%; line-height: 30px; border: 2px solid #888; border-radius: 5px; text-align: center; padding: 10px; }