.kj { display: inline-block; width: 30px; height: 30px; line-height: 30px; text-align: center; color: #fff; font-weight: bolder; }
.dibao{
    background-color: #F60;
        display: inline-block;
    padding: 0 2px;
    text-align: center;
    vertical-align: middle;
    font-style: normal;
    color: #fff;
    overflow: hidden;
    line-height: 16px;
    height: 16px;
    font-size: 12px;
    border-radius: 4px;
    font-weight: 200;
}
#qiu{
    background-color: #191818;
        display: inline-block;
    padding: 0 2px;
    text-align: center;
    vertical-align: middle;
    font-style: normal;
    color: #fff;
    overflow: hidden;
    line-height: 15px;
    height: 15px;
    font-size: 10px;
    border-radius: 4px;
    font-weight: 200;
}

.qs {
	overflow:hidden;
	line-height:28px;
	padding:5px;
	background:#d9cfb5;
	border:1px solid #333;
}
.qs span {
	z-index:2;
	width:75px;
	top:-1px;
	left:-80px;
	padding:1px;
	position:absolute;
	background:#777;
	border:1px solid #000;
}
.qs span p {
	height:38px;
	line-height:38px;
	font-weight:bold;
	text-align:center;
	overflow:hidden;
	background:#d9cfb5;
	border:1px solid #333;
}
#bb table tr{
	background:#fdf9ee;
}
#bb table tr:hover{
	background-color:#e2d9c3;
}
#bk td {
	color:#008800;
	height:35px;
	line-height:35px;
	border:1px solid #9a8f73;
	text-align:center;
}
#bk a {
	color:#008800;
}
#be {
	width:100%;
	border:1px solid #9a8f73;
	border-top:2px solid #9a8f73;
	border-right:none;
}
#be thead th {
	height:10px;
	line-height:18px;
	text-align:center;
	padding:5px 2px;
	background:#e2d9c3;
	border:1px solid #9a8f73;
	border-top:1px solid #fff;
	border-bottom:2px solid #9a8f73;
	border-left:none;
}
#be tbody td {
	height:10px;
	line-height:18px;
	padding:5px 2px;
	border:1px solid #9a8f73;
	border-top:none;
	border-left:none;
}

.text{line-height:1.3;padding:3px 5px;word-wrap:break-word;}
.text img{max-width:100%;margin-right:2px;vertical-align:middle;}

.分割样式 { margin: 10px 0 5px; padding: 0 5px; height: 22px; border-bottom: 2px solid #9FC6EC; padding-bottom: 2px; }
.分割样式 img { padding-right: 3px; }
.分割样式 a { color: #0051A4; }
.分割样式 span a { color: #0051A4; }

.LinkCard{position: relative; display: block; width: 290px; -webkit-box-sizing: border-box; box-sizing: border-box; border-radius: 4px; max-width: 100%; overflow: hidden;}
.LinkCard .LinkCard:hover{text-decoration: none; border: none!important; color: inherit!important;}
.LinkCard .LinkCard-backdrop{position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-repeat: no-repeat; -webkit-filter: blur(20px); filter: blur(20px); background-size: cover; background-position: 50%;}
.LinkCard .LinkCard-content{position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 12px; border-radius: inherit; background-color: rgba(246, 246, 246, 0.38);}
.LinkCard .LinkCard-content .LinkCard-text{overflow: hidden;}
.LinkCard .LinkCard-content .LinkCard-text .LinkCard-title{display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; max-height: 40px; font-size: 16px; font-weight: 500; line-height: 1.25; color: #1a1a1a;}
.LinkCard .LinkCard-content .LinkCard-text .LinkCard-meta{display: -webkit-box; display: -ms-flexbox; display: flex; margin-top: 4px; margin-bottom: -4px; font-size: 14px; line-height: 20px; color: #174c1d; white-space: nowrap;}
.LinkCard .LinkCard-content .LinkCard-imageCell{margin-left: 8px; border-radius: 4px;}
.LinkCard .LinkCard-content .LinkCard-imageCell .LinkCard-image{display: block; width: 60px; height: 60px; -o-object-fit: cover; object-fit: cover; border-radius: inherit;max-width: revert;}
.LinkCard .LinkCard-content .LinkCard-imageCell .LinkCard-image.LinkCard-image-default{display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; background-color: #ebebeb; color: #d3d3d3;}
.LinkCard .LinkCard-noImage .LinkCard-content{background-color: #f6f6f6;}


#linkA {
        display: inline-block;
    }
#linkA .not-selecteda {
        pointer-events: auto;
    }

#linkB {
        display: inline-block;
    }
#linkB .not-selecteda {
        pointer-events: auto;
    }

#linkC {
        display: inline-block;
    }
#linkC .not-selecteda {
        pointer-events: auto;
    }

#uu {
        display: inline-block;
    }
#uu .not-selecteda {
        pointer-events: auto;
    }

.not-selecteda {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background-color: white;
  border: 2px solid #ccc;
  display: flex;
  justify-content: center;
  align-items: center;
  color: black;
  font-size: 24px;
  pointer-events: none;
}

.selecteda {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background-color: green;
  border: 2px solid #ccc;
  display: flex;
  justify-content: center;
  align-items: center;
  color: white;
  font-size: 24px;
  pointer-events: none;
}
.not-selectedb {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background-color: white;
  border: 2px solid #ccc;
  display: flex;
  justify-content: center;
  align-items: center;
  color: black;
  font-size: 24px;
  pointer-events: none;
}

.selectedb {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background-color: green;
  border: 2px solid #ccc;
  display: flex;
  justify-content: center;
  align-items: center;
  color: white;
  font-size: 24px;
  pointer-events: none;
}

.not-selectedc {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background-color: white;
  border: 2px solid #ccc;
  display: flex;
  justify-content: center;
  align-items: center;
  color: black;
  font-size: 24px;
  pointer-events: none;
}

.selectedc {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background-color: green;
  border: 2px solid #ccc;
  display: flex;
  justify-content: center;
  align-items: center;
  color: white;
  font-size: 24px;
  pointer-events: none;
}



.module-content{ line-height:2}
.module-content a{ color:#0051A4;}
.关闭按钮 {
    position: absolute;
    top: 5px;
    right: 5px;
    width: 20px;
    height: 20px;
    background-color: red;
    color: white;
    text-align: center;
    line-height: 20px;
    border-radius: 50%;
}
.关闭按钮:before {
    content: 'X';
}

#寄语 {
    display: none;
}

#发帖龙王 {
    display: none;
}

#回帖龙王 {
    display: none;
}

.弹出窗口 .类选择器 h3 { margin: 0; padding: 0; width: 250px; height: 30px; line-height: 26px; display: block; font-size: 16px; text-align: center; }
.弹出窗口 .类选择器 h3 span { float: left; }
.弹出窗口 .类选择器 h3 .关闭按钮 { display: inline-block; width: 17px; height: 16px; float: right; cursor: pointer; }
.弹出窗口{
position: fixed;
background-color: rgba(0,0,0,0.7);
color: #fff;
text-align: center;
left: 50%;
top: 50%;
transform: translate(-50%, -50%);
line-height: 30px;
border: 2px solid #888;
border-radius: 5px;
}
.类选择器{
text-align:center;
}

html{font-size:10px;}
.dialog{top:40%;left:40%;padding:0.5rem 0.8rem;text-align:center;position:fixed;border-radius:0.5rem;font-size:1.6rem;color:#fff;background:rgba(0, 0, 0, 0.7);box-shadow:0 0.2rem 0.3rem #9b9b9b;z-index:9999;}

/***
:root {
    scroll-behavior: smooth;
}
@keyframes body {
   0% {
opacity:0;
}
50% {
opacity: 0.8;
}
100% {
opacity: 1;
}
}
/**微信音乐播放CSS**/
.db {
	display: block;
}

.weixinAudio {
	line-height: 1.5;
}

.audio_area {
/**	display: inline-block; **/
	width: 100%; 
	vertical-align: top;
	margin: 0px 1px 0px 0;
	font-size: 0;
	position: relative;
	font-weight: 400;
	text-decoration: none;
	-ms-text-size-adjust: none;
	-webkit-text-size-adjust: none;
	text-size-adjust: none;
}

.audio_wrp {
	border: 1px solid #ebebeb;
	background-color: #fcfcfc;
	overflow: hidden;
	padding: 12px 20px 12px 12px;
}

.audio_play_area {
	float: left;
	margin: 9px 22px 10px 5px;
	font-size: 0;
	width: 18px;
	height: 25px;
}

.playing .audio_play_area .icon_audio_default {
	display: block;
}

.audio_play_area .icon_audio_default {
	background: transparent url(https://up.pcno.cn/m/css/iconloop.png) no-repeat 0 0;
	width: 18px;
	height: 25px;
	vertical-align: middle;
	display: inline-block;
	-webkit-background-size: 54px 25px;
	background-size: 54px 25px;
	background-position: -36px center;
}

.audio_play_area .icon_audio_playing {
	background: transparent url(https://up.pcno.cn/m/css/iconloop.png) no-repeat 0 0;
	width: 18px;
	height: 25px;
	vertical-align: middle;
	display: inline-block;
	-webkit-background-size: 54px 25px;
	background-size: 54px 25px;
	-webkit-animation: audio_playing 1s infinite;
	background-position: 0px center;
	display: none;
}

.audio_area .pic_audio_default {
	display: none;
	width: 18px;
}

.tips_global {
	color: #8c8c8c;
}

.audio_area .audio_length {
	float: right;
	font-size: 16px;
	margin-top: 3px;
	margin-left: 1em;
}

.audio_info_area {
	overflow: hidden;
}

.audio_area .audio_title {
	font-weight: 400;
	font-size: 17px;
	margin-top: -2px;
	margin-bottom: -3px;
	width: auto;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	word-wrap: normal;
}

.audio_area .audio_source {
	font-size: 16px;
}

.audio_area .progress_bar {
	position: absolute;
	left: 0;
	bottom: 0;
	background-color: #0cbb08;
	height: 2px;
}

.playing .audio_play_area .icon_audio_default {
	display: none;
}

.playing .audio_play_area .icon_audio_playing {
	display: inline-block;
}

@-webkit-keyframes audio_playing {
	30% {
		background-position: 0px center;
	}
	31% {
		background-position: -18px center;
	}
	61% {
		background-position: -18px center;
	}
	61.5% {
		background-position: -36px center;
	}
	100% {
		background-position: -36px center;
	}
}


渐入动画***/



body,div,p,a,table,textarea,form,input,img,ul,li{margin:0;padding:0;}
/**body{font-size:15px;margin:4px;line-height:1.5;font-family: "web-font","Arial","Microsoft YaHei","黑体","宋体",sans-serif;} **/
body{font-family: 'web-font';font-weight: 500;font-size:15px;margin:4px;line-height:1.5;}
li{list-style:none;text-indent:0;}
img,a img{border:0;}
a{text-decoration:none;color:#004299;}
a:hover{
    color: #f60;
}
a:visited {color:#800080;}
em{color: #9B9B9B;font-size:12px;padding: 5px 10px;font-style: unset;}
textarea{font-size:13px;width:98%;margin:0 0 5px 0;border:1px solid #9FC6EC;}

/*图标*/
.logo{padding:5px 0 0 10px;background:#fff;}

/*页头*/
.header{background:url("../images/header.gif") repeat-x;height:22px;line-height:22px;}

/*页脚*/
/*页脚*/
.footer{padding:5px;background:#9fc6ec61;border-top:1px solid #9FC6EC;}
.footer p{line-height:22px;color:#515151;}
.footer p a{color:#0051A4;}
.footer .version a{color:#004299;}
#footer{ 
height: 100px;
width: 100%;
background-color: #9fc6ecc4;
bottom: 0;
border-top:1px solid #C5E6DF;
}
	#footer a{ color:#0051A4;}

.login-tips{background: #fff9b794;
    border-bottom: 1px solid #9FC6EC;}
    .login-tips a{ color: #db7c22;padding-left: 5px;}
    
.login-tips2{background: #e7b1bc87;
    padding: 4px 8px;
    border-radius: 0 var(--radius-inner) var(--radius-inner) 0;}
    .login-tips2 a{ color: #e95656;padding-left: 5px;}    
    
    
.login-tips3{background: #e7b1bc87;
    border-left: 5px solid #50bfff;
 
    background-color: #fff9eb;
    padding: 4px 8px;
    border-radius: 0 var(--radius-inner) var(--radius-inner) 0;}
    .login-tips3 a{ color: #f1b306;padding-left: 5px;}      
    
	.login-tips img{ margin-right:2px; vertical-align:middle;}
	.login-tips span{ margin-left:14px;}
	
/*自己添加的*/
.shanghengxian{border-top:3px solid #9FC6EC}
.hengxian{border-bottom:1px solid #eee}
.qianlan{background:#e4eff9;padding-left:5px; padding-right:5px;border-top:1px solid #9FC6EC;border-bottom:1px solid #9FC6EC;}
.youfudong{float:right;}
.huixian{border-bottom:3px solid #f7f9f8}
.banzhuhuifu{border: solid 1px red;width: 64px;height: 20px;margin: 0 0 0 -1px;}.xinwenhx{border-bottom:3px solid #9FC6EC}
	
/*改颜色*/
.module-title{ margin:8px 0 6px; padding:0 5px; height:20px; line-height:20px; border-bottom:4px solid #9FC6EC; color:#000; font-weight:bold;padding-bottom: 2px;}

.kk{text-shadow: 5px 5px 5px gray;line-height:30px;padding: 4px 4px;font-size: 16px;box-shadow: 0 0 14px 1px #9FC6EC;background: url(/image/bg2.gif) repeat-x;}

.module-title a{ color:#0051A4;}
.module-title img{padding-right:0px;}
	.module-title span{ font-weight:normal; font-size:12px; margin:0 0 0 10px;}
	.module-title span a{ color:#0051A4;}	
/*列表*/
.list{line-height:1.6;}
.list a{color:#0051A4;}
.list img{margin-right:2px;vertical-align:middle;}
.list .row{padding:3px;border-bottom:1px solid #E3E6EB;}
.list .row form{margin:0px;display: inline}

/*导航改图？*/
.bar{ height:22px; padding:0 3px; background:#71afe3 url(/template/default/images/5_navbar.gif) repeat-x; line-height:22px; color:#fff;}
.bai{background:#71afe3 url(/template/default/images/5_navbar.gif) repeat-x; color:#fff;line-height:30px;padding: 4px 4px;border-radius:50px;font-size: 16px;}
.bar a{color:#fff;}

/*广告*/
.ad{padding-left:5px;line-height:20px;font-size:12px;}
.ad a{color:#ff0000;}

/*广播*/
.note{background:#FFF9B7;border-bottom:1px solid #9FC6EC;}
.radio{padding-left:5px;background:#FFF9B7;border-bottom:1px solid #9FC6EC;}

/*文本*/
.text{line-height:1.3;padding:3px 5px;word-wrap:break-word;}
.text img{max-width:100%;margin-right:2px;vertical-align:middle;}

/*项目*/
.item{line-height:1.3;padding-left:2px;}
.item a{color:#0051A4;}

/*名称*/
.name{padding-left:3px;line-height:20px;border-bottom:2px solid #9FC6EC;color:#000;font-weight:bold;}
.name a{color:#0051A4;}

/*标题*/
.title{padding-left:2px;line-height:20px;border-bottom:1px solid #9FC6EC;}
.title a{color:#0051A4;}

/*常见*/
.line{margin:2px 0 1px;padding:0 5px;border:1px solid #9FC6EC;}
.width{white-space:nowrap;text-overflow:ellipsis;-o-text-overflow:ellipsis;overflow:hidden;}
.deep{background:#E3EEF8;border:1px solid #9FC6EC;border-left:none;border-right:none;}

.write-mood{padding:5px;background:#e4eff9;line-height:1.5;border-top:1px solid #9FC6EC;border-bottom:1px solid #9FC6EC;}
.touxiang{
    display: inline-block;
   
}

.touxiang img{
  /**  box-shadow: 0 0 14px 1px #ff0099;  **/
    border-radius: 50%;
}

.touxiang2{
  display: inline-block;  
}

.touxiang2 img{
 /**   box-shadow: 0 0 14px 1px #0300a4;  **/
    border-radius: 50%;
}
.shaky { color: #FF5809;display: inline-block; padding: 1px; font-size: 12px; -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-animation-name: shaky-slow; -ms-animation-name: shaky-slow; animation-name: shaky-slow; -webkit-animation-duration: 4s; -ms-animation-duration: 4s; animation-duration: 4s; -webkit-animation-iteration-count: infinite; -ms-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-timing-function: ease-in-out; -ms-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-delay: 0s; -ms-animation-delay: 0s; animation-delay: 0s; -webkit-animation-play-state: running; -ms-animation-play-state: running; animation-play-state: running; } @-webkit-keyframes shaky-slow { 0% { -webkit-transform: translate(0px, 0px) rotate(0deg) } 2% { -webkit-transform: translate(-1px, 1.5px) rotate(1.5deg) } 4% { -webkit-transform: translate(1.3px, 0px) rotate(-0.5deg) } 6% { -webkit-transform: translate(1.4px, 1.4px) rotate(-2deg) } 8% { -webkit-transform: translate(-1.3px, -1px) rotate(-1.5deg) } 10% { -webkit-transform: translate(1.4px, 0px) rotate(-2deg) } 12% { -webkit-transform: translate(-1.3px, -1px) rotate(-2deg) } 14% { -webkit-transform: translate(1.5px, 1.3px) rotate(1.5deg) } 16% { -webkit-transform: translate(1.5px, -1.5px) rotate(-1.5deg) } 18% { -webkit-transform: translate(1.3px, -1.3px) rotate(-2deg) } 20% { -webkit-transform: translate(1px, 1px) rotate(-0.5deg) } 22% { -webkit-transform: translate(1.3px, 1.5px) rotate(-2deg) } 24% { -webkit-transform: translate(-1.4px, -1px) rotate(2deg) } 26% { -webkit-transform: translate(1.3px, -1.3px) rotate(0.5deg) } 28% { -webkit-transform: translate(1.6px, -1.6px) rotate(-2deg) } 30% { -webkit-transform: translate(-1.3px, -1.3px) rotate(-1.5deg) } 32% { -webkit-transform: translate(-1px, 0px) rotate(2deg) } 34% { -webkit-transform: translate(1.3px, 1.3px) rotate(-0.5deg) } 36% { -webkit-transform: translate(1.3px, 1.6px) rotate(1.5deg) } 38% { -webkit-transform: translate(1.3px, -1.6px) rotate(1.5deg) } 40% { -webkit-transform: translate(-1.4px, -1px) rotate(-0.5deg) } 42% { -webkit-transform: translate(-1.4px, 1.3px) rotate(-0.5deg) } 44% { -webkit-transform: translate(-1.6px, 1.4px) rotate(0.5deg) } 46% { -webkit-transform: translate(-2.1px, -1.3px) rotate(-0.5deg) } 48% { -webkit-transform: translate(1px, 1.6px) rotate(1.5deg) } 50% { -webkit-transform: translate(1.6px, 1.6px) rotate(1.5deg) } 52% { -webkit-transform: translate(-1.4px, 1.6px) rotate(0.5deg) } 54% { -webkit-transform: translate(1.6px, -1px) rotate(-2deg) } 56% { -webkit-transform: translate(1.3px, -1.6px) rotate(-2deg) } 58% { -webkit-transform: translate(-1.3px, -1.6px) rotate(0.5deg) } 60% { -webkit-transform: translate(1.3px, 1.6px) rotate(-0.5deg) } 62% { -webkit-transform: translate(0px, 0px) rotate(-1.5deg) } 64% { -webkit-transform: translate(-1.6px, -1.6px) rotate(-2deg) } 66% { -webkit-transform: translate(1.6px, -1.6px) rotate(0.5deg) } 68% { -webkit-transform: translate(0px, -1.6px) rotate(-2deg) } 70% { -webkit-transform: translate(-1.6px, 1px) rotate(1.5deg) } 72% { -webkit-transform: translate(-1.6px, 1.6px) rotate(2deg) } 74% { -webkit-transform: translate(1.3px, -1.6px) rotate(-0.5deg) } 76% { -webkit-transform: translate(1.4px, 1px) rotate(-0.5deg) } 78% { -webkit-transform: translate(-1px, 1.4px) rotate(2deg) } 80% { -webkit-transform: translate(1.4px, 1.6px) rotate(2deg) } 82% { -webkit-transform: translate(-1.6px, -1.6px) rotate(-0.5deg) } 84% { -webkit-transform: translate(-1.4px, 1.4px) rotate(-2deg) } 86% { -webkit-transform: translate(1px, 1.4px) rotate(-2deg) } 88% { -webkit-transform: translate(-1.4px, 1.4px) rotate(-1.5deg) } 90% { -webkit-transform: translate(-1.6px, -1.6px) rotate(-2deg) } 92% { -webkit-transform: translate(-1.6px, 1.6px) rotate(2deg) } 94% { -webkit-transform: translate(-1.6px, -1.6px) rotate(-2deg) } 96% { -webkit-transform: translate(-1.4px, 1.3px) rotate(-2deg) } 98% { -webkit-transform: translate(1.3px, 1px) rotate(-0.5deg) } } @keyframes shaky-slow { 0% { transform: translate(0px, 0px) rotate(0deg) } 2% { transform: translate(-1px, 1.5px) rotate(1.5deg) } 4% { transform: translate(1.3px, 0px) rotate(-0.5deg) } 6% { transform: translate(1.4px, 1.4px) rotate(-2deg) } 8% { transform: translate(-1.3px, -1px) rotate(-1.5deg) } 10% { transform: translate(1.4px, 0px) rotate(-2deg) } 12% { transform: translate(-1.3px, -1px) rotate(-2deg) } 14% { transform: translate(1.5px, 1.3px) rotate(1.5deg) } 16% { transform: translate(1.5px, -1.5px) rotate(-1.5deg) } 18% { transform: translate(1.3px, -1.3px) rotate(-2deg) } 20% { transform: translate(1px, 1px) rotate(-0.5deg) } 22% { transform: translate(1.3px, 1.5px) rotate(-2deg) } 24% { transform: translate(-1.4px, -1px) rotate(2deg) } 26% { transform: translate(1.3px, -1.3px) rotate(0.5deg) } 28% { transform: translate(1.6px, -1.6px) rotate(-1.5deg) } 30% { transform: translate(-1.3px, -1.3px) rotate(-1.5deg) } 32% { transform: translate(-1px, 0px) rotate(2deg) } 34% { transform: translate(1.3px, 1.3px) rotate(-0.5deg) } 36% { transform: translate(1.3px, 1.6px) rotate(1.5deg) } 38% { transform: translate(1.3px, -1.6px) rotate(1.5deg) } 40% { transform: translate(-1.4px, -1px) rotate(-0.5deg) } 42% { transform: translate(-1.4px, 1.3px) rotate(-0.5deg) } 44% { transform: translate(-1.6px, 1.4px) rotate(0.5deg) } 46% { transform: translate(-2.1px, -1.3px) rotate(-0.5deg) } 48% { transform: translate(1px, 1.6px) rotate(1.5deg) } 50% { transform: translate(1.6px, 1.6px) rotate(1.5deg) } 52% { transform: translate(-1.4px, 1.6px) rotate(0.5deg) } 54% { transform: translate(1.6px, -1px) rotate(-2deg) } 56% { transform: translate(1.3px, -1.6px) rotate(-2deg) } 58% { transform: translate(-1.3px, -1.6px) rotate(0.5deg) } 60% { transform: translate(1.3px, 1.6px) rotate(-0.5deg) } 62% { transform: translate(0px, 0px) rotate(-1.5deg) } 64% { transform: translate(-1.6px, -1.6px) rotate(-2deg) } 66% { transform: translate(1.6px, -1.6px) rotate(0.5deg) } 68% { transform: translate(0px, -1.6px) rotate(-2deg) } 70% { transform: translate(-1.6px, 1px) rotate(1.5deg) } 72% { transform: translate(-1.6px, 1.6px) rotate(2deg) } 74% { transform: translate(1.3px, -1.6px) rotate(-0.5deg) } 76% { transform: translate(1.4px, 1px) rotate(-0.5deg) } 78% { transform: translate(-1px, 1.4px) rotate(2deg) } 80% { transform: translate(1.4px, 1.6px) rotate(2deg) } 82% { transform: translate(-1.6px, -1.6px) rotate(-0.5deg) } 84% { transform: translate(-1.4px, 1.4px) rotate(-2deg) } 86% { transform: translate(1px, 1.4px) rotate(-2deg) } 88% { transform: translate(-1.4px, 1.4px) rotate(-1.5deg) } 90% { transform: translate(-1.6px, -1.6px) rotate(-2deg) } 92% { transform: translate(-1.4px, 1.6px) rotate(2deg) } 94% { transform: translate(-1.6px, -1.6px) rotate(-2deg) } 96% { transform: translate(-1.4px, 1.3px) rotate(-2deg) } 98% { transform: translate(1.3px, 1px) rotate(-0.5deg) } }
.shaky2 { color: blue;text-shadow: #FF0099 0px 1px 6px, #FF0099 1px 0px 6px, #FF0099 0px -1px 6px, #FF0099 -1px 0px 6px;display: inline-block; padding: 1px; font-size: 12px; -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-animation-name: shaky2-slow; -ms-animation-name: shaky2-slow; animation-name: shaky2-slow; -webkit-animation-duration: 4s; -ms-animation-duration: 4s; animation-duration: 4s; -webkit-animation-iteration-count: infinite; -ms-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-timing-function: ease-in-out; -ms-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-delay: 0s; -ms-animation-delay: 0s; animation-delay: 0s; -webkit-animation-play-state: running; -ms-animation-play-state: running; animation-play-state: running; } @-webkit-keyframes shaky2-slow { 0% { -webkit-transform: translate(0px, 0px) rotate(0deg) } 2% { -webkit-transform: translate(-1px, 1.5px) rotate(1.5deg) } 4% { -webkit-transform: translate(1.3px, 0px) rotate(-0.5deg) } 6% { -webkit-transform: translate(1.4px, 1.4px) rotate(-2deg) } 8% { -webkit-transform: translate(-1.3px, -1px) rotate(-1.5deg) } 10% { -webkit-transform: translate(1.4px, 0px) rotate(-2deg) } 12% { -webkit-transform: translate(-1.3px, -1px) rotate(-2deg) } 14% { -webkit-transform: translate(1.5px, 1.3px) rotate(1.5deg) } 16% { -webkit-transform: translate(1.5px, -1.5px) rotate(-1.5deg) } 18% { -webkit-transform: translate(1.3px, -1.3px) rotate(-2deg) } 20% { -webkit-transform: translate(1px, 1px) rotate(-0.5deg) } 22% { -webkit-transform: translate(1.3px, 1.5px) rotate(-2deg) } 24% { -webkit-transform: translate(-1.4px, -1px) rotate(2deg) } 26% { -webkit-transform: translate(1.3px, -1.3px) rotate(0.5deg) } 28% { -webkit-transform: translate(1.6px, -1.6px) rotate(-2deg) } 30% { -webkit-transform: translate(-1.3px, -1.3px) rotate(-1.5deg) } 32% { -webkit-transform: translate(-1px, 0px) rotate(2deg) } 34% { -webkit-transform: translate(1.3px, 1.3px) rotate(-0.5deg) } 36% { -webkit-transform: translate(1.3px, 1.6px) rotate(1.5deg) } 38% { -webkit-transform: translate(1.3px, -1.6px) rotate(1.5deg) } 40% { -webkit-transform: translate(-1.4px, -1px) rotate(-0.5deg) } 42% { -webkit-transform: translate(-1.4px, 1.3px) rotate(-0.5deg) } 44% { -webkit-transform: translate(-1.6px, 1.4px) rotate(0.5deg) } 46% { -webkit-transform: translate(-2.1px, -1.3px) rotate(-0.5deg) } 48% { -webkit-transform: translate(1px, 1.6px) rotate(1.5deg) } 50% { -webkit-transform: translate(1.6px, 1.6px) rotate(1.5deg) } 52% { -webkit-transform: translate(-1.4px, 1.6px) rotate(0.5deg) } 54% { -webkit-transform: translate(1.6px, -1px) rotate(-2deg) } 56% { -webkit-transform: translate(1.3px, -1.6px) rotate(-2deg) } 58% { -webkit-transform: translate(-1.3px, -1.6px) rotate(0.5deg) } 60% { -webkit-transform: translate(1.3px, 1.6px) rotate(-0.5deg) } 62% { -webkit-transform: translate(0px, 0px) rotate(-1.5deg) } 64% { -webkit-transform: translate(-1.6px, -1.6px) rotate(-2deg) } 66% { -webkit-transform: translate(1.6px, -1.6px) rotate(0.5deg) } 68% { -webkit-transform: translate(0px, -1.6px) rotate(-2deg) } 70% { -webkit-transform: translate(-1.6px, 1px) rotate(1.5deg) } 72% { -webkit-transform: translate(-1.6px, 1.6px) rotate(2deg) } 74% { -webkit-transform: translate(1.3px, -1.6px) rotate(-0.5deg) } 76% { -webkit-transform: translate(1.4px, 1px) rotate(-0.5deg) } 78% { -webkit-transform: translate(-1px, 1.4px) rotate(2deg) } 80% { -webkit-transform: translate(1.4px, 1.6px) rotate(2deg) } 82% { -webkit-transform: translate(-1.6px, -1.6px) rotate(-0.5deg) } 84% { -webkit-transform: translate(-1.4px, 1.4px) rotate(-2deg) } 86% { -webkit-transform: translate(1px, 1.4px) rotate(-2deg) } 88% { -webkit-transform: translate(-1.4px, 1.4px) rotate(-1.5deg) } 90% { -webkit-transform: translate(-1.6px, -1.6px) rotate(-2deg) } 92% { -webkit-transform: translate(-1.6px, 1.6px) rotate(2deg) } 94% { -webkit-transform: translate(-1.6px, -1.6px) rotate(-2deg) } 96% { -webkit-transform: translate(-1.4px, 1.3px) rotate(-2deg) } 98% { -webkit-transform: translate(1.3px, 1px) rotate(-0.5deg) } } @keyframes shaky2-slow { 0% { transform: translate(0px, 0px) rotate(0deg) } 2% { transform: translate(-1px, 1.5px) rotate(1.5deg) } 4% { transform: translate(1.3px, 0px) rotate(-0.5deg) } 6% { transform: translate(1.4px, 1.4px) rotate(-2deg) } 8% { transform: translate(-1.3px, -1px) rotate(-1.5deg) } 10% { transform: translate(1.4px, 0px) rotate(-2deg) } 12% { transform: translate(-1.3px, -1px) rotate(-2deg) } 14% { transform: translate(1.5px, 1.3px) rotate(1.5deg) } 16% { transform: translate(1.5px, -1.5px) rotate(-1.5deg) } 18% { transform: translate(1.3px, -1.3px) rotate(-2deg) } 20% { transform: translate(1px, 1px) rotate(-0.5deg) } 22% { transform: translate(1.3px, 1.5px) rotate(-2deg) } 24% { transform: translate(-1.4px, -1px) rotate(2deg) } 26% { transform: translate(1.3px, -1.3px) rotate(0.5deg) } 28% { transform: translate(1.6px, -1.6px) rotate(-1.5deg) } 30% { transform: translate(-1.3px, -1.3px) rotate(-1.5deg) } 32% { transform: translate(-1px, 0px) rotate(2deg) } 34% { transform: translate(1.3px, 1.3px) rotate(-0.5deg) } 36% { transform: translate(1.3px, 1.6px) rotate(1.5deg) } 38% { transform: translate(1.3px, -1.6px) rotate(1.5deg) } 40% { transform: translate(-1.4px, -1px) rotate(-0.5deg) } 42% { transform: translate(-1.4px, 1.3px) rotate(-0.5deg) } 44% { transform: translate(-1.6px, 1.4px) rotate(0.5deg) } 46% { transform: translate(-2.1px, -1.3px) rotate(-0.5deg) } 48% { transform: translate(1px, 1.6px) rotate(1.5deg) } 50% { transform: translate(1.6px, 1.6px) rotate(1.5deg) } 52% { transform: translate(-1.4px, 1.6px) rotate(0.5deg) } 54% { transform: translate(1.6px, -1px) rotate(-2deg) } 56% { transform: translate(1.3px, -1.6px) rotate(-2deg) } 58% { transform: translate(-1.3px, -1.6px) rotate(0.5deg) } 60% { transform: translate(1.3px, 1.6px) rotate(-0.5deg) } 62% { transform: translate(0px, 0px) rotate(-1.5deg) } 64% { transform: translate(-1.6px, -1.6px) rotate(-2deg) } 66% { transform: translate(1.6px, -1.6px) rotate(0.5deg) } 68% { transform: translate(0px, -1.6px) rotate(-2deg) } 70% { transform: translate(-1.6px, 1px) rotate(1.5deg) } 72% { transform: translate(-1.6px, 1.6px) rotate(2deg) } 74% { transform: translate(1.3px, -1.6px) rotate(-0.5deg) } 76% { transform: translate(1.4px, 1px) rotate(-0.5deg) } 78% { transform: translate(-1px, 1.4px) rotate(2deg) } 80% { transform: translate(1.4px, 1.6px) rotate(2deg) } 82% { transform: translate(-1.6px, -1.6px) rotate(-0.5deg) } 84% { transform: translate(-1.4px, 1.4px) rotate(-2deg) } 86% { transform: translate(1px, 1.4px) rotate(-2deg) } 88% { transform: translate(-1.4px, 1.4px) rotate(-1.5deg) } 90% { transform: translate(-1.6px, -1.6px) rotate(-2deg) } 92% { transform: translate(-1.4px, 1.6px) rotate(2deg) } 94% { transform: translate(-1.6px, -1.6px) rotate(-2deg) } 96% { transform: translate(-1.4px, 1.3px) rotate(-2deg) } 98% { transform: translate(1.3px, 1px) rotate(-0.5deg) } }
.lyc{margin-left: 4px;
    height: 18px;
    opacity: .87;
    background-image: -webkit-gradient(linear, right top, left top, color-stop(2%, #fb3d3d), to(#f67939));
    background-image: -webkit-linear-gradient(right, #fb3d3d 2%, #f67939 100%);
    background-image: -moz-linear-gradient(right, #fb3d3d 2%, #f67939 100%);
    background-image: -o-linear-gradient(right, #fb3d3d 2%, #f67939 100%);
    background-image: linear-gradient(270deg, #fb3d3d 2%, #f67939 100%);
    -moz-border-radius: 8px 1px 8px 1px;
    border-radius: 8px 1px 8px 1px;
    line-height: 18px;
    padding: 0 4px;
    color: #fff;
}
.pcno{
    font-size: 10px;
    color: #ecb6b6;
    text-shadow: 0px -1px 4px white, 0px -2px 10px yellow, 0px -10px 20px #ff8000, 0px -18px 40px red;
    position: relative;
}
.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;
    }
}

.sqm6 {
            text-align: center;
            width: 200px;
            height: 50px;
         
            border-radius: 30px;
            background-image: linear-gradient(90deg ,#ff44aa, red, yellow,#ff44aa);
            background-size: 400% 100%;
            position: relative;
            color: white;
        }
        .sqm6 a {
            display: inline-block;
            vertical-align: middle;
        }
        .sqm6 a::before {
            content: "";
            filter: blur(10px);
            position: absolute;
            border: #631818 solid 1px;
            top: -5px;
            bottom: -5px;
            left: -5px;
            right: -5px;
            background-image: linear-gradient(90deg ,#ff44aa, red, yellow,#ff44aa);
            display: inline-block;
            z-index: -1;
            border-radius: 30px;
            background-size: 300% 100%;
        }
        .sqm6:hover {
            cursor: pointer;
            animation: mymove 5s infinite;
        }
        @keyframes mymove {
            100% {
                background-position: -200% 0;
            }
        }

.\0073\0071\006d\0033\0035 {
    \0077\0069\0064\0074\0068: 200px;
    \0062\0061\0063\006b\0067\0072\006f\0075\006e\0064-\0069\006d\0061\0067\0065: -webkit-linear-gradient(right, #da6085, #ff00eb 20%, #ff0076 30%, #f3df7a 50%, #f3df7a 60%, #ff00e0 90%, #da6085);
    \0063\006f\006c\006f\0072: transparent;
    -\0077\0065\0062\006b\0069\0074-\0074\0065\0078\0074-\0066\0069\006c\006c-\0063\006f\006c\006f\0072: transparent;
    -\0077\0065\0062\006b\0069\0074-\0062\0061\0063\006b\0067\0072\006f\0075\006e\0064-\0063\006c\0069\0070: text;
    \006f\0070\0061\0063\0069\0074\0079: 0.5;
    \0074\0072\0061\006e\0073\0066\006f\0072\006d: translate(-10px, 0) scale(.5);
    \0061\006e\0069\006d\0061\0074\0069\006f\006e: ani35 6s forwards infinite;
}

@keyframes \0061\006e\0069\0033\0035 {
    10% {
        \006f\0070\0061\0063\0069\0074\0079: 1;
        \0062\0061\0063\006b\0067\0072\006f\0075\006e\0064-\0070\006f\0073\0069\0074\0069\006f\006e: 0 0;
    }

    40% {
        \006f\0070\0061\0063\0069\0074\0079: 1;
        \0062\0061\0063\006b\0067\0072\006f\0075\006e\0064-\0070\006f\0073\0069\0074\0069\006f\006e: 100% 0;
    }

    60% {
        \006f\0070\0061\0063\0069\0074\0079: 0.5;
        \0062\0061\0063\006b\0067\0072\006f\0075\006e\0064-\0070\006f\0073\0069\0074\0069\006f\006e: 0 0;
    }

    80% {
        \0074\0072\0061\006e\0073\0066\006f\0072\006d: translate(0) scale(1.1);
        \006f\0070\0061\0063\0069\0074\0079: 0;
    }

    100% {
        \0074\0072\0061\006e\0073\0066\006f\0072\006d: translate(0) scale(1);
        \006f\0070\0061\0063\0069\0074\0079: 1;
        \0062\0061\0063\006b\0067\0072\006f\0075\006e\0064-\0070\006f\0073\0069\0074\0069\006f\006e: -100% 0;
    }
}


.sqm7 { display: inline-block; padding: 1px; font-size: 12px; -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; -webkit-animation-name: shaky-slow; -ms-animation-name: shaky-slow; animation-name: shaky-slow; -webkit-animation-duration: 4s; -ms-animation-duration: 4s; animation-duration: 4s; -webkit-animation-iteration-count: infinite; -ms-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-timing-function: ease-in-out; -ms-animation-timing-function: ease-in-out; animation-timing-function: ease-in-out; -webkit-animation-delay: 0s; -ms-animation-delay: 0s; animation-delay: 0s; -webkit-animation-play-state: running; -ms-animation-play-state: running; animation-play-state: running; } @-webkit-keyframes shaky-slow { 0% { -webkit-transform: translate(0px, 0px) rotate(0deg) } 2% { -webkit-transform: translate(-1px, 1.5px) rotate(1.5deg) } 4% { -webkit-transform: translate(1.3px, 0px) rotate(-0.5deg) } 6% { -webkit-transform: translate(1.4px, 1.4px) rotate(-2deg) } 8% { -webkit-transform: translate(-1.3px, -1px) rotate(-1.5deg) } 10% { -webkit-transform: translate(1.4px, 0px) rotate(-2deg) } 12% { -webkit-transform: translate(-1.3px, -1px) rotate(-2deg) } 14% { -webkit-transform: translate(1.5px, 1.3px) rotate(1.5deg) } 16% { -webkit-transform: translate(1.5px, -1.5px) rotate(-1.5deg) } 18% { -webkit-transform: translate(1.3px, -1.3px) rotate(-2deg) } 20% { -webkit-transform: translate(1px, 1px) rotate(-0.5deg) } 22% { -webkit-transform: translate(1.3px, 1.5px) rotate(-2deg) } 24% { -webkit-transform: translate(-1.4px, -1px) rotate(2deg) } 26% { -webkit-transform: translate(1.3px, -1.3px) rotate(0.5deg) } 28% { -webkit-transform: translate(1.6px, -1.6px) rotate(-2deg) } 30% { -webkit-transform: translate(-1.3px, -1.3px) rotate(-1.5deg) } 32% { -webkit-transform: translate(-1px, 0px) rotate(2deg) } 34% { -webkit-transform: translate(1.3px, 1.3px) rotate(-0.5deg) } 36% { -webkit-transform: translate(1.3px, 1.6px) rotate(1.5deg) } 38% { -webkit-transform: translate(1.3px, -1.6px) rotate(1.5deg) } 40% { -webkit-transform: translate(-1.4px, -1px) rotate(-0.5deg) } 42% { -webkit-transform: translate(-1.4px, 1.3px) rotate(-0.5deg) } 44% { -webkit-transform: translate(-1.6px, 1.4px) rotate(0.5deg) } 46% { -webkit-transform: translate(-2.1px, -1.3px) rotate(-0.5deg) } 48% { -webkit-transform: translate(1px, 1.6px) rotate(1.5deg) } 50% { -webkit-transform: translate(1.6px, 1.6px) rotate(1.5deg) } 52% { -webkit-transform: translate(-1.4px, 1.6px) rotate(0.5deg) } 54% { -webkit-transform: translate(1.6px, -1px) rotate(-2deg) } 56% { -webkit-transform: translate(1.3px, -1.6px) rotate(-2deg) } 58% { -webkit-transform: translate(-1.3px, -1.6px) rotate(0.5deg) } 60% { -webkit-transform: translate(1.3px, 1.6px) rotate(-0.5deg) } 62% { -webkit-transform: translate(0px, 0px) rotate(-1.5deg) } 64% { -webkit-transform: translate(-1.6px, -1.6px) rotate(-2deg) } 66% { -webkit-transform: translate(1.6px, -1.6px) rotate(0.5deg) } 68% { -webkit-transform: translate(0px, -1.6px) rotate(-2deg) } 70% { -webkit-transform: translate(-1.6px, 1px) rotate(1.5deg) } 72% { -webkit-transform: translate(-1.6px, 1.6px) rotate(2deg) } 74% { -webkit-transform: translate(1.3px, -1.6px) rotate(-0.5deg) } 76% { -webkit-transform: translate(1.4px, 1px) rotate(-0.5deg) } 78% { -webkit-transform: translate(-1px, 1.4px) rotate(2deg) } 80% { -webkit-transform: translate(1.4px, 1.6px) rotate(2deg) } 82% { -webkit-transform: translate(-1.6px, -1.6px) rotate(-0.5deg) } 84% { -webkit-transform: translate(-1.4px, 1.4px) rotate(-2deg) } 86% { -webkit-transform: translate(1px, 1.4px) rotate(-2deg) } 88% { -webkit-transform: translate(-1.4px, 1.4px) rotate(-1.5deg) } 90% { -webkit-transform: translate(-1.6px, -1.6px) rotate(-2deg) } 92% { -webkit-transform: translate(-1.6px, 1.6px) rotate(2deg) } 94% { -webkit-transform: translate(-1.6px, -1.6px) rotate(-2deg) } 96% { -webkit-transform: translate(-1.4px, 1.3px) rotate(-2deg) } 98% { -webkit-transform: translate(1.3px, 1px) rotate(-0.5deg) } } @keyframes shaky-slow { 0% { transform: translate(0px, 0px) rotate(0deg) } 2% { transform: translate(-1px, 1.5px) rotate(1.5deg) } 4% { transform: translate(1.3px, 0px) rotate(-0.5deg) } 6% { transform: translate(1.4px, 1.4px) rotate(-2deg) } 8% { transform: translate(-1.3px, -1px) rotate(-1.5deg) } 10% { transform: translate(1.4px, 0px) rotate(-2deg) } 12% { transform: translate(-1.3px, -1px) rotate(-2deg) } 14% { transform: translate(1.5px, 1.3px) rotate(1.5deg) } 16% { transform: translate(1.5px, -1.5px) rotate(-1.5deg) } 18% { transform: translate(1.3px, -1.3px) rotate(-2deg) } 20% { transform: translate(1px, 1px) rotate(-0.5deg) } 22% { transform: translate(1.3px, 1.5px) rotate(-2deg) } 24% { transform: translate(-1.4px, -1px) rotate(2deg) } 26% { transform: translate(1.3px, -1.3px) rotate(0.5deg) } 28% { transform: translate(1.6px, -1.6px) rotate(-1.5deg) } 30% { transform: translate(-1.3px, -1.3px) rotate(-1.5deg) } 32% { transform: translate(-1px, 0px) rotate(2deg) } 34% { transform: translate(1.3px, 1.3px) rotate(-0.5deg) } 36% { transform: translate(1.3px, 1.6px) rotate(1.5deg) } 38% { transform: translate(1.3px, -1.6px) rotate(1.5deg) } 40% { transform: translate(-1.4px, -1px) rotate(-0.5deg) } 42% { transform: translate(-1.4px, 1.3px) rotate(-0.5deg) } 44% { transform: translate(-1.6px, 1.4px) rotate(0.5deg) } 46% { transform: translate(-2.1px, -1.3px) rotate(-0.5deg) } 48% { transform: translate(1px, 1.6px) rotate(1.5deg) } 50% { transform: translate(1.6px, 1.6px) rotate(1.5deg) } 52% { transform: translate(-1.4px, 1.6px) rotate(0.5deg) } 54% { transform: translate(1.6px, -1px) rotate(-2deg) } 56% { transform: translate(1.3px, -1.6px) rotate(-2deg) } 58% { transform: translate(-1.3px, -1.6px) rotate(0.5deg) } 60% { transform: translate(1.3px, 1.6px) rotate(-0.5deg) } 62% { transform: translate(0px, 0px) rotate(-1.5deg) } 64% { transform: translate(-1.6px, -1.6px) rotate(-2deg) } 66% { transform: translate(1.6px, -1.6px) rotate(0.5deg) } 68% { transform: translate(0px, -1.6px) rotate(-2deg) } 70% { transform: translate(-1.6px, 1px) rotate(1.5deg) } 72% { transform: translate(-1.6px, 1.6px) rotate(2deg) } 74% { transform: translate(1.3px, -1.6px) rotate(-0.5deg) } 76% { transform: translate(1.4px, 1px) rotate(-0.5deg) } 78% { transform: translate(-1px, 1.4px) rotate(2deg) } 80% { transform: translate(1.4px, 1.6px) rotate(2deg) } 82% { transform: translate(-1.6px, -1.6px) rotate(-0.5deg) } 84% { transform: translate(-1.4px, 1.4px) rotate(-2deg) } 86% { transform: translate(1px, 1.4px) rotate(-2deg) } 88% { transform: translate(-1.4px, 1.4px) rotate(-1.5deg) } 90% { transform: translate(-1.6px, -1.6px) rotate(-2deg) } 92% { transform: translate(-1.4px, 1.6px) rotate(2deg) } 94% { transform: translate(-1.6px, -1.6px) rotate(-2deg) } 96% { transform: translate(-1.4px, 1.3px) rotate(-2deg) } 98% { transform: translate(1.3px, 1px) rotate(-0.5deg) } }



.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;
  
    border-radius: 50%;
    position: relative;
    bottom: 59px;
    left: 9px;
}

/**/
.but{
                border: 2px solid #f35626;
                padding: 1.5rem;
                color: #f35626;
                -webkit-animation: hue 30s infinite linear;
                background-color: transparent;
                -webkit-appearance:none;
                border-radius: 10px;
            }
            @-webkit-keyframes hue {
              from {
                -webkit-filter: hue-rotate(0deg);
              }

              to {
                -webkit-filter: hue-rotate(-360deg);
              }
            }

            .liuguang{
                color: #f35626;
                /*font-size: 6rem;*/
                background-image:-webkit-linear-gradient(92deg,#f35626,#feab3a);
                -webkit-animation: hue 20s infinite linear;
                -webkit-text-fill-color: transparent;
                -webkit-background-clip:text;
            }