body {
    /* 自定义博客园背景图片链接 无效  */
    background:url("https://images.cnblogs.com/cnblogs_com/jxxclj/1245877/o_266.jpg");
    background-position:center left;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment:fixed;
    background-color:whitesmoke;


    /* 其他可选的背景图片,自行替换修改即可：
    https://images.cnblogs.com/cnblogs_com/Lxxv5/1907760/o_201228063819%E8%A5%BF%E5%B7%B4%E4%B8%B9%E5%B2%9B.jpeg?id=1527765712574744
    https://images.cnblogs.com/cnblogs_com/hyacinthLJP/1531892/o_210129051848v2-795f68ea7d1692dc91546ace95208bb4.jpg
    https://images.cnblogs.com/cnblogs_com/nthforsth/1636966/o_2001210816401565149939605.png
    https://img2018.cnblogs.com/blog/1213778/201810/1213778-20181014164723120-210403228.bmp
    https://images.cnblogs.com/cnblogs_com/cainiao-chuanqi/1538321/t_191109115413foreground.png
    https://img2018.cnblogs.com/blog/1378575/201906/1378575-20190621150153405-633289623.jpg
    https://img2020.cnblogs.com/blog/2095304/202007/2095304-20200725171946809-1669002727.jpg"
    https://images.cnblogs.com/cnblogs_com/nthforsth/1636966/o_2001210816401565149939605.png
    https://images.cnblogs.com/cnblogs_com/ctf99525/1932586/o_210218052305202103.jpg
    https://www.cnblogs.com/images/cnblogs_com/mylovertomylove/1540121/t_ppikaiqu.jpg
    https://images.cnblogs.com/cnblogs_com/jxxclj/1245877/o_266.jpg
    https://files-cdn.cnblogs.com/files/zengcongcong/1.bmp */
   

    /* 修改鼠标图案 笑脸表情鼠标光标、彩虹鼠标光标 */
    /* cursor: url(https://files.cnblogs.com/files/wkfvawl/cursor.ico),auto; */
    /* 彩虹鼠标光标 */
    cursor: url(https://files.cnblogs.com/files/yyyzyyyz/%E6%8C%87%E9%92%88.ico),auto;
    /* 鼠标阴影单调 */
    /* cursor: url(https://blog-static.cnblogs.com/files/blogs/769727/bailanzhizhen.ico),auto; */

    
}


/* 制作一个从左到右(to left 无效)移动的线条渐变跑马效果，线条高度可自定义默认为 5px ，线性动画速度为 5s 无限循环   不好看暂注释  */
/* .marquee {
  width: 100%;
  height: 1px;
  background: linear-gradient(to right, red, orange, yellow, green, blue, indigo, violet);
  animation: marquee 3s linear infinite;
}
@keyframes marquee {
  0% {
    transform: translateX(100%);
  }
  100% {
    transform: translateX(-100%);
  }
} */


/** 文章随机古诗词   古诗词 begin **/
.poem-wrap {
    position: relative;
    width: 1000px;
    max-width: 80%;
    border: 1px solid #32dd48;  /** 左底右线条框颜色 */
    border-top: none;
    text-align: center;
    margin: 40px auto;
}
.poem-left {
    left: 0;
}
.poem-right {
    right: 0;
}
/* “念两句诗”标题两边水平线条设置 */
.poem-border {
    position: absolute;
    height: 2px;
    width: 27%;
    background-color: #5fcae1;
}
.poem-wrap p {
    width: 70%;
    margin: auto;
    line-height: 30px;
    color: #797979;
}
/* “念两句诗”标题文本设置 */
.poem-wrap h1 {
    position: relative;
    margin-top: -20px;
    display: inline-block;
    letter-spacing: 4px;
    color: #797979;
    font-size: 2em;
    font-weight: bold;
    margin-bottom: 20px;
}
#poem_sentence {
    /* font-size: 25px; */
    /* font-weight: normal; */
    font-size: 18px; 
    color: #a024da; 
    /* font-weight: bold; */
    margin: 15px auto;
    /* 古诗文内容 实现动态渐变彩色文字效果 可自行设置渐变分段颜色和动画自右向左(暂未找设置自左向右无效的原因)的移动速度 6s 可自行调整 */
    background-image: linear-gradient(to right, rgba(255,0,0,0.5), rgba(0,0,255,0.5));
    /* background-image: linear-gradient(to right, red, orange, yellow, green, blue, indigo, violet); */
    /*chrome 私有样式，加前缀，显示背景图片*/
    -webkit-background-clip: text;      
    animation: move 6s infinite;      
    /*颜色设为透明*/
    color: transparent;      
    /*宽度固定*/
    width: 300px;
}
/* 底部诗句的作者 + 名字 字体大小设置 */
#poem_info {
    font-size: 14px;
    margin: 15px auto;
}
/** 古诗词 end **/


/* 博客园去除侧边栏公告下面的园龄，粉丝，关注等字段 全部不显示；暂未找到只单独隐藏粉丝数的方法 */
#profile_block {
    margin-top: 5px;
    line-height: 1.5;
    text-align: left;
    display: none;
}



/* Header1_HeaderTitle 设置头标题名的动画效果，颠簸快速抖动及旋转特效  旋转动画待定后续调试
    -webkit-animation-duration: 5s; 若想要头标题 “故屿γ” 不要颠簸抖动，只需改为 0s。  
    已改0s，因为VIP图标“V”和头标题 “故屿γ” 在浏览器页面上不会同步颠簸抖动不协调有点卡，体验不好
 **/
#Header1_HeaderTitle {
    display: inline-block;
    /* -webkit-transform-origin: center center; */
    -ms-transform-origin: center center;
    /* transform-origin: center center; */
    /* -webkit-animation-name: shake-slow; */
    -ms-animation-name: shake-slow;
    animation-name: shake-slow;
    -webkit-animation-duration: 0s;
    -ms-animation-duration: 5s;
    /* animation-duration: 5s; */
    /* -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 shake-slow {
    0% { -webkit-transform: translate(0px, 0px) rotate(0deg); }
    2% { -webkit-transform: translate(-1px, 3px) rotate(-1.5deg); }
    4% { -webkit-transform: translate(-4px, 5px) rotate(-1.5deg); }
    6% { -webkit-transform: translate(-1px, 6px) rotate(-0.5deg); }
    8% { -webkit-transform: translate(5px, -4px) rotate(-3.5deg); }
    10% { -webkit-transform: translate(-7px, -3px) rotate(-3.5deg); }
    12% { -webkit-transform: translate(-1px, 8px) rotate(2.5deg); }
    14% { -webkit-transform: translate(3px, -5px) rotate(-1.5deg); }
    16% { -webkit-transform: translate(1px, 0px) rotate(2.5deg); }
    18% { -webkit-transform: translate(-6px, -10px) rotate(-0.5deg); }
    20% { -webkit-transform: translate(3px, -2px) rotate(1.5deg); }
    22% { -webkit-transform: translate(0px, 0px) rotate(-2.5deg); }
    24% { -webkit-transform: translate(-5px, -4px) rotate(1.5deg); }
    26% { -webkit-transform: translate(-1px, 3px) rotate(-3.5deg); }
    28% { -webkit-transform: translate(1px, 1px) rotate(-3.5deg); }
    30% { -webkit-transform: translate(-4px, 8px) rotate(1.5deg); }
    32% { -webkit-transform: translate(-9px, 7px) rotate(-3.5deg); }
    34% { -webkit-transform: translate(4px, -9px) rotate(-2.5deg); }
    36% { -webkit-transform: translate(1px, -6px) rotate(-2.5deg); }
    38% { -webkit-transform: translate(-4px, 0px) rotate(-2.5deg); }
    40% { -webkit-transform: translate(3px, -7px) rotate(0.5deg); }
    42% { -webkit-transform: translate(4px, 4px) rotate(-0.5deg); }
    44% { -webkit-transform: translate(8px, -4px) rotate(-2.5deg); }
    46% { -webkit-transform: translate(9px, 9px) rotate(-3.5deg); }
    48% { -webkit-transform: translate(6px, -8px) rotate(-0.5deg); }
    50% { -webkit-transform: translate(-1px, 4px) rotate(-3.5deg); }
    52% { -webkit-transform: translate(4px, 6px) rotate(-1.5deg); }
    54% { -webkit-transform: translate(9px, -3px) rotate(2.5deg); }
    56% { -webkit-transform: translate(8px, -2px) rotate(-3.5deg); }
    58% { -webkit-transform: translate(-2px, -9px) rotate(-0.5deg); }
    60% { -webkit-transform: translate(-1px, -5px) rotate(2.5deg); }
    62% { -webkit-transform: translate(-8px, 3px) rotate(2.5deg); }
    64% { -webkit-transform: translate(6px, -2px) rotate(-3.5deg); }
    66% { -webkit-transform: translate(-5px, 9px) rotate(-1.5deg); }
    68% { -webkit-transform: translate(3px, 1px) rotate(-0.5deg); }
    70% { -webkit-transform: translate(6px, 4px) rotate(-1.5deg); }
    72% { -webkit-transform: translate(-6px, -5px) rotate(1.5deg); }
    74% { -webkit-transform: translate(-8px, 0px) rotate(-0.5deg); }
    76% { -webkit-transform: translate(-5px, -8px) rotate(1.5deg); }
    78% { -webkit-transform: translate(5px, -3px) rotate(-1.5deg); }
    80% { -webkit-transform: translate(-6px, -3px) rotate(-1.5deg); }
    82% { -webkit-transform: translate(7px, 8px) rotate(-1.5deg); }
    84% { -webkit-transform: translate(-6px, 9px) rotate(0.5deg); }
    86% { -webkit-transform: translate(1px, 8px) rotate(-3.5deg); }
    88% { -webkit-transform: translate(-9px, -2px) rotate(1.5deg); }
    90% { -webkit-transform: translate(4px, -6px) rotate(-1.5deg); }
    92% { -webkit-transform: translate(0px, -1px) rotate(0.5deg); }
    94% { -webkit-transform: translate(2px, -9px) rotate(2.5deg); }
    96% { -webkit-transform: translate(-9px, 1px) rotate(-2.5deg); }
    98% { -webkit-transform: translate(-9px, -5px) rotate(-3.5deg); } }

@-ms-keyframes shake-slow { 
    0% { -ms-transform: translate(0px, 0px) rotate(0deg); }
    2% { -ms-transform: translate(-10px, 5px) rotate(-2.5deg); }
    4% { -ms-transform: translate(7px, 7px) rotate(-3.5deg); }
    6% { -ms-transform: translate(8px, -7px) rotate(-2.5deg); }
    8% { -ms-transform: translate(-8px, 3px) rotate(-0.5deg); }
    10% { -ms-transform: translate(3px, -10px) rotate(-1.5deg); }
    12% { -ms-transform: translate(-9px, -6px) rotate(2.5deg); }
    14% { -ms-transform: translate(-2px, -6px) rotate(-0.5deg); }
    16% { -ms-transform: translate(6px, -1px) rotate(0.5deg); }
    18% { -ms-transform: translate(5px, -1px) rotate(0.5deg); }
    20% { -ms-transform: translate(7px, -5px) rotate(-0.5deg); }
    22% { -ms-transform: translate(-8px, 5px) rotate(2.5deg); }
    24% { -ms-transform: translate(0px, 4px) rotate(2.5deg); }
    26% { -ms-transform: translate(-1px, 2px) rotate(-1.5deg); }
    28% { -ms-transform: translate(-1px, -1px) rotate(1.5deg); }
    30% { -ms-transform: translate(-5px, -5px) rotate(2.5deg); }
    32% { -ms-transform: translate(0px, 7px) rotate(-0.5deg); }
    34% { -ms-transform: translate(-9px, 3px) rotate(-0.5deg); }
    36% { -ms-transform: translate(3px, -5px) rotate(-2.5deg); }
    38% { -ms-transform: translate(5px, 2px) rotate(-0.5deg); }
    40% { -ms-transform: translate(6px, -3px) rotate(0.5deg); }
    42% { -ms-transform: translate(-4px, -6px) rotate(-0.5deg); }
    44% { -ms-transform: translate(9px, 2px) rotate(-3.5deg); }
    46% { -ms-transform: translate(6px, -4px) rotate(1.5deg); }
    48% { -ms-transform: translate(6px, 5px) rotate(2.5deg); }
    50% { -ms-transform: translate(-9px, -2px) rotate(-2.5deg); }
    52% { -ms-transform: translate(-7px, 9px) rotate(-0.5deg); }
    54% { -ms-transform: translate(-5px, -5px) rotate(-3.5deg); }
    56% { -ms-transform: translate(-6px, -10px) rotate(1.5deg); }
    58% { -ms-transform: translate(-3px, 1px) rotate(-3.5deg); }
    60% { -ms-transform: translate(3px, 5px) rotate(2.5deg); }
    62% { -ms-transform: translate(-1px, -8px) rotate(2.5deg); }
    64% { -ms-transform: translate(6px, -7px) rotate(-0.5deg); }
    66% { -ms-transform: translate(-7px, -1px) rotate(0.5deg); }
    68% { -ms-transform: translate(-3px, -4px) rotate(-1.5deg); }
    70% { -ms-transform: translate(-10px, 9px) rotate(2.5deg); }
    72% { -ms-transform: translate(9px, 9px) rotate(2.5deg); }
    74% { -ms-transform: translate(-6px, 8px) rotate(-0.5deg); }
    76% { -ms-transform: translate(-5px, -10px) rotate(-2.5deg); }
    78% { -ms-transform: translate(-7px, -9px) rotate(-0.5deg); }
    80% { -ms-transform: translate(8px, -4px) rotate(2.5deg); }
    82% { -ms-transform: translate(9px, 4px) rotate(-0.5deg); }
    84% { -ms-transform: translate(-1px, -1px) rotate(2.5deg); }
    86% { -ms-transform: translate(-6px, -3px) rotate(0.5deg); }
    88% { -ms-transform: translate(-2px, -4px) rotate(0.5deg); }
    90% { -ms-transform: translate(5px, 1px) rotate(0.5deg); }
    92% { -ms-transform: translate(1px, 2px) rotate(-3.5deg); }
    94% { -ms-transform: translate(-5px, -10px) rotate(1.5deg); }
    96% { -ms-transform: translate(-6px, 3px) rotate(-3.5deg); }
    98% { -ms-transform: translate(-1px, -7px) rotate(-2.5deg); } }

@keyframes shake-slow { 
    0% { transform: translate(0px, 0px) rotate(0deg); }
    2% { transform: translate(6px, -7px) rotate(2.5deg); }
    4% { transform: translate(8px, -8px) rotate(2.5deg); }
    6% { transform: translate(1px, -8px) rotate(-3.5deg); }
    8% { transform: translate(-3px, 4px) rotate(-0.5deg); }
    10% { transform: translate(0px, -3px) rotate(1.5deg); }
    12% { transform: translate(-1px, 2px) rotate(0.5deg); }
    14% { transform: translate(6px, 6px) rotate(-1.5deg); }
    16% { transform: translate(-7px, 4px) rotate(-0.5deg); }
    18% { transform: translate(7px, 8px) rotate(-3.5deg); }
    20% { transform: translate(-6px, 2px) rotate(1.5deg); }
    22% { transform: translate(9px, 5px) rotate(-1.5deg); }
    24% { transform: translate(7px, -2px) rotate(0.5deg); }
    26% { transform: translate(-7px, -10px) rotate(-0.5deg); }
    28% { transform: translate(-10px, -8px) rotate(-1.5deg); }
    30% { transform: translate(8px, 4px) rotate(0.5deg); }
    32% { transform: translate(0px, 4px) rotate(1.5deg); }
    34% { transform: translate(-8px, 6px) rotate(-0.5deg); }
    36% { transform: translate(-5px, 7px) rotate(1.5deg); }
    38% { transform: translate(-4px, -4px) rotate(-1.5deg); }
    40% { transform: translate(9px, 4px) rotate(-1.5deg); }
    42% { transform: translate(9px, -5px) rotate(2.5deg); }
    44% { transform: translate(-5px, -4px) rotate(-2.5deg); }
    46% { transform: translate(7px, -7px) rotate(1.5deg); }
    48% { transform: translate(-5px, 8px) rotate(0.5deg); }
    50% { transform: translate(9px, 1px) rotate(-1.5deg); }
    52% { transform: translate(-9px, -5px) rotate(-3.5deg); }
    54% { transform: translate(-2px, 9px) rotate(1.5deg); }
    56% { transform: translate(6px, -1px) rotate(1.5deg); }
    58% { transform: translate(-6px, 0px) rotate(-0.5deg); }
    60% { transform: translate(3px, 1px) rotate(1.5deg); }
    62% { transform: translate(5px, -7px) rotate(-0.5deg); }
    64% { transform: translate(9px, 2px) rotate(2.5deg); }
    66% { transform: translate(6px, 0px) rotate(-2.5deg); }
    68% { transform: translate(5px, -4px) rotate(-2.5deg); }
    70% { transform: translate(-8px, 5px) rotate(-2.5deg); }
    72% { transform: translate(-6px, -2px) rotate(0.5deg); }
    74% { transform: translate(-3px, 7px) rotate(-3.5deg); }
    76% { transform: translate(-7px, -8px) rotate(-3.5deg); }
    78% { transform: translate(-1px, -2px) rotate(2.5deg); }
    80% { transform: translate(8px, 6px) rotate(-2.5deg); }
    82% { transform: translate(-2px, -9px) rotate(2.5deg); }
    84% { transform: translate(8px, -10px) rotate(-0.5deg); }
    86% { transform: translate(-6px, 0px) rotate(2.5deg); }
    88% { transform: translate(-1px, 9px) rotate(-3.5deg); }
    90% { transform: translate(-7px, 8px) rotate(1.5deg); }
    92% { transform: translate(-10px, -8px) rotate(0.5deg); }
    94% { transform: translate(-8px, 6px) rotate(1.5deg); }
    96% { transform: translate(4px, -9px) rotate(2.5deg); }
    98% { transform: translate(-4px, 9px) rotate(0.5deg); } }


/* 设置头标题名的动画效果，颠簸快速抖动及旋转特效 定制添加博客园VIP会员图标 也跟随一起同步 
    -webkit-animation-duration: 5s; 若想要头标题后VIP会员图标 “ V” 不要颠簸抖动，只需改为 0s
 */
.wrap2 {
    display: inline-block;
    /* -webkit-transform-origin: center center; */
    -ms-transform-origin: center center;
    /* transform-origin: center center; */
    /* -webkit-animation-name: shake-slow; */
    -ms-animation-name: shake-slow;
    animation-name: shake-slow;
    -webkit-animation-duration: 0s;
    -ms-animation-duration: 5s;
    /* animation-duration: 5s; */
    /* -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 shake-slow {
    0% { -webkit-transform: translate(0px, 0px) rotate(0deg); }
    2% { -webkit-transform: translate(-1px, 3px) rotate(-1.5deg); }
    4% { -webkit-transform: translate(-4px, 5px) rotate(-1.5deg); }
    6% { -webkit-transform: translate(-1px, 6px) rotate(-0.5deg); }
    8% { -webkit-transform: translate(5px, -4px) rotate(-3.5deg); }
    10% { -webkit-transform: translate(-7px, -3px) rotate(-3.5deg); }
    12% { -webkit-transform: translate(-1px, 8px) rotate(2.5deg); }
    14% { -webkit-transform: translate(3px, -5px) rotate(-1.5deg); }
    16% { -webkit-transform: translate(1px, 0px) rotate(2.5deg); }
    18% { -webkit-transform: translate(-6px, -10px) rotate(-0.5deg); }
    20% { -webkit-transform: translate(3px, -2px) rotate(1.5deg); }
    22% { -webkit-transform: translate(0px, 0px) rotate(-2.5deg); }
    24% { -webkit-transform: translate(-5px, -4px) rotate(1.5deg); }
    26% { -webkit-transform: translate(-1px, 3px) rotate(-3.5deg); }
    28% { -webkit-transform: translate(1px, 1px) rotate(-3.5deg); }
    30% { -webkit-transform: translate(-4px, 8px) rotate(1.5deg); }
    32% { -webkit-transform: translate(-9px, 7px) rotate(-3.5deg); }
    34% { -webkit-transform: translate(4px, -9px) rotate(-2.5deg); }
    36% { -webkit-transform: translate(1px, -6px) rotate(-2.5deg); }
    38% { -webkit-transform: translate(-4px, 0px) rotate(-2.5deg); }
    40% { -webkit-transform: translate(3px, -7px) rotate(0.5deg); }
    42% { -webkit-transform: translate(4px, 4px) rotate(-0.5deg); }
    44% { -webkit-transform: translate(8px, -4px) rotate(-2.5deg); }
    46% { -webkit-transform: translate(9px, 9px) rotate(-3.5deg); }
    48% { -webkit-transform: translate(6px, -8px) rotate(-0.5deg); }
    50% { -webkit-transform: translate(-1px, 4px) rotate(-3.5deg); }
    52% { -webkit-transform: translate(4px, 6px) rotate(-1.5deg); }
    54% { -webkit-transform: translate(9px, -3px) rotate(2.5deg); }
    56% { -webkit-transform: translate(8px, -2px) rotate(-3.5deg); }
    58% { -webkit-transform: translate(-2px, -9px) rotate(-0.5deg); }
    60% { -webkit-transform: translate(-1px, -5px) rotate(2.5deg); }
    62% { -webkit-transform: translate(-8px, 3px) rotate(2.5deg); }
    64% { -webkit-transform: translate(6px, -2px) rotate(-3.5deg); }
    66% { -webkit-transform: translate(-5px, 9px) rotate(-1.5deg); }
    68% { -webkit-transform: translate(3px, 1px) rotate(-0.5deg); }
    70% { -webkit-transform: translate(6px, 4px) rotate(-1.5deg); }
    72% { -webkit-transform: translate(-6px, -5px) rotate(1.5deg); }
    74% { -webkit-transform: translate(-8px, 0px) rotate(-0.5deg); }
    76% { -webkit-transform: translate(-5px, -8px) rotate(1.5deg); }
    78% { -webkit-transform: translate(5px, -3px) rotate(-1.5deg); }
    80% { -webkit-transform: translate(-6px, -3px) rotate(-1.5deg); }
    82% { -webkit-transform: translate(7px, 8px) rotate(-1.5deg); }
    84% { -webkit-transform: translate(-6px, 9px) rotate(0.5deg); }
    86% { -webkit-transform: translate(1px, 8px) rotate(-3.5deg); }
    88% { -webkit-transform: translate(-9px, -2px) rotate(1.5deg); }
    90% { -webkit-transform: translate(4px, -6px) rotate(-1.5deg); }
    92% { -webkit-transform: translate(0px, -1px) rotate(0.5deg); }
    94% { -webkit-transform: translate(2px, -9px) rotate(2.5deg); }
    96% { -webkit-transform: translate(-9px, 1px) rotate(-2.5deg); }
    98% { -webkit-transform: translate(-9px, -5px) rotate(-3.5deg); } }

@-ms-keyframes shake-slow { 
    0% { -ms-transform: translate(0px, 0px) rotate(0deg); }
    2% { -ms-transform: translate(-10px, 5px) rotate(-2.5deg); }
    4% { -ms-transform: translate(7px, 7px) rotate(-3.5deg); }
    6% { -ms-transform: translate(8px, -7px) rotate(-2.5deg); }
    8% { -ms-transform: translate(-8px, 3px) rotate(-0.5deg); }
    10% { -ms-transform: translate(3px, -10px) rotate(-1.5deg); }
    12% { -ms-transform: translate(-9px, -6px) rotate(2.5deg); }
    14% { -ms-transform: translate(-2px, -6px) rotate(-0.5deg); }
    16% { -ms-transform: translate(6px, -1px) rotate(0.5deg); }
    18% { -ms-transform: translate(5px, -1px) rotate(0.5deg); }
    20% { -ms-transform: translate(7px, -5px) rotate(-0.5deg); }
    22% { -ms-transform: translate(-8px, 5px) rotate(2.5deg); }
    24% { -ms-transform: translate(0px, 4px) rotate(2.5deg); }
    26% { -ms-transform: translate(-1px, 2px) rotate(-1.5deg); }
    28% { -ms-transform: translate(-1px, -1px) rotate(1.5deg); }
    30% { -ms-transform: translate(-5px, -5px) rotate(2.5deg); }
    32% { -ms-transform: translate(0px, 7px) rotate(-0.5deg); }
    34% { -ms-transform: translate(-9px, 3px) rotate(-0.5deg); }
    36% { -ms-transform: translate(3px, -5px) rotate(-2.5deg); }
    38% { -ms-transform: translate(5px, 2px) rotate(-0.5deg); }
    40% { -ms-transform: translate(6px, -3px) rotate(0.5deg); }
    42% { -ms-transform: translate(-4px, -6px) rotate(-0.5deg); }
    44% { -ms-transform: translate(9px, 2px) rotate(-3.5deg); }
    46% { -ms-transform: translate(6px, -4px) rotate(1.5deg); }
    48% { -ms-transform: translate(6px, 5px) rotate(2.5deg); }
    50% { -ms-transform: translate(-9px, -2px) rotate(-2.5deg); }
    52% { -ms-transform: translate(-7px, 9px) rotate(-0.5deg); }
    54% { -ms-transform: translate(-5px, -5px) rotate(-3.5deg); }
    56% { -ms-transform: translate(-6px, -10px) rotate(1.5deg); }
    58% { -ms-transform: translate(-3px, 1px) rotate(-3.5deg); }
    60% { -ms-transform: translate(3px, 5px) rotate(2.5deg); }
    62% { -ms-transform: translate(-1px, -8px) rotate(2.5deg); }
    64% { -ms-transform: translate(6px, -7px) rotate(-0.5deg); }
    66% { -ms-transform: translate(-7px, -1px) rotate(0.5deg); }
    68% { -ms-transform: translate(-3px, -4px) rotate(-1.5deg); }
    70% { -ms-transform: translate(-10px, 9px) rotate(2.5deg); }
    72% { -ms-transform: translate(9px, 9px) rotate(2.5deg); }
    74% { -ms-transform: translate(-6px, 8px) rotate(-0.5deg); }
    76% { -ms-transform: translate(-5px, -10px) rotate(-2.5deg); }
    78% { -ms-transform: translate(-7px, -9px) rotate(-0.5deg); }
    80% { -ms-transform: translate(8px, -4px) rotate(2.5deg); }
    82% { -ms-transform: translate(9px, 4px) rotate(-0.5deg); }
    84% { -ms-transform: translate(-1px, -1px) rotate(2.5deg); }
    86% { -ms-transform: translate(-6px, -3px) rotate(0.5deg); }
    88% { -ms-transform: translate(-2px, -4px) rotate(0.5deg); }
    90% { -ms-transform: translate(5px, 1px) rotate(0.5deg); }
    92% { -ms-transform: translate(1px, 2px) rotate(-3.5deg); }
    94% { -ms-transform: translate(-5px, -10px) rotate(1.5deg); }
    96% { -ms-transform: translate(-6px, 3px) rotate(-3.5deg); }
    98% { -ms-transform: translate(-1px, -7px) rotate(-2.5deg); } }

@keyframes shake-slow { 
    0% { transform: translate(0px, 0px) rotate(0deg); }
    2% { transform: translate(6px, -7px) rotate(2.5deg); }
    4% { transform: translate(8px, -8px) rotate(2.5deg); }
    6% { transform: translate(1px, -8px) rotate(-3.5deg); }
    8% { transform: translate(-3px, 4px) rotate(-0.5deg); }
    10% { transform: translate(0px, -3px) rotate(1.5deg); }
    12% { transform: translate(-1px, 2px) rotate(0.5deg); }
    14% { transform: translate(6px, 6px) rotate(-1.5deg); }
    16% { transform: translate(-7px, 4px) rotate(-0.5deg); }
    18% { transform: translate(7px, 8px) rotate(-3.5deg); }
    20% { transform: translate(-6px, 2px) rotate(1.5deg); }
    22% { transform: translate(9px, 5px) rotate(-1.5deg); }
    24% { transform: translate(7px, -2px) rotate(0.5deg); }
    26% { transform: translate(-7px, -10px) rotate(-0.5deg); }
    28% { transform: translate(-10px, -8px) rotate(-1.5deg); }
    30% { transform: translate(8px, 4px) rotate(0.5deg); }
    32% { transform: translate(0px, 4px) rotate(1.5deg); }
    34% { transform: translate(-8px, 6px) rotate(-0.5deg); }
    36% { transform: translate(-5px, 7px) rotate(1.5deg); }
    38% { transform: translate(-4px, -4px) rotate(-1.5deg); }
    40% { transform: translate(9px, 4px) rotate(-1.5deg); }
    42% { transform: translate(9px, -5px) rotate(2.5deg); }
    44% { transform: translate(-5px, -4px) rotate(-2.5deg); }
    46% { transform: translate(7px, -7px) rotate(1.5deg); }
    48% { transform: translate(-5px, 8px) rotate(0.5deg); }
    50% { transform: translate(9px, 1px) rotate(-1.5deg); }
    52% { transform: translate(-9px, -5px) rotate(-3.5deg); }
    54% { transform: translate(-2px, 9px) rotate(1.5deg); }
    56% { transform: translate(6px, -1px) rotate(1.5deg); }
    58% { transform: translate(-6px, 0px) rotate(-0.5deg); }
    60% { transform: translate(3px, 1px) rotate(1.5deg); }
    62% { transform: translate(5px, -7px) rotate(-0.5deg); }
    64% { transform: translate(9px, 2px) rotate(2.5deg); }
    66% { transform: translate(6px, 0px) rotate(-2.5deg); }
    68% { transform: translate(5px, -4px) rotate(-2.5deg); }
    70% { transform: translate(-8px, 5px) rotate(-2.5deg); }
    72% { transform: translate(-6px, -2px) rotate(0.5deg); }
    74% { transform: translate(-3px, 7px) rotate(-3.5deg); }
    76% { transform: translate(-7px, -8px) rotate(-3.5deg); }
    78% { transform: translate(-1px, -2px) rotate(2.5deg); }
    80% { transform: translate(8px, 6px) rotate(-2.5deg); }
    82% { transform: translate(-2px, -9px) rotate(2.5deg); }
    84% { transform: translate(8px, -10px) rotate(-0.5deg); }
    86% { transform: translate(-6px, 0px) rotate(2.5deg); }
    88% { transform: translate(-1px, 9px) rotate(-3.5deg); }
    90% { transform: translate(-7px, 8px) rotate(1.5deg); }
    92% { transform: translate(-10px, -8px) rotate(0.5deg); }
    94% { transform: translate(-8px, 6px) rotate(1.5deg); }
    96% { transform: translate(4px, -9px) rotate(2.5deg); }
    98% { transform: translate(-4px, 9px) rotate(0.5deg); } }





/* 博客园--个人昵称阴影特效展示 */
#Header1_HeaderTitle {
    text-align: center;
    font-family: "League-Gothic", Courier;
    /* font-size: 118px; */
    /* 大小写，找了很久昵称故屿γ 的 “ γ ” ，使用如下 uppercase 大写字母 会导致该符号“ γ ” 读伽玛页面显示其大写，未注释，感觉大写也挺好看 */
    text-transform: uppercase;
    color: #000;
    /* css字体“故屿γ”阴影立体效果 如下单一注释可体验多种效果，默认阴影颜色：#998a8a (其中：32px为左右平移， 15px为上下平移， 5px为阴影模糊度，数值越大越模糊)，在线调试阴影效果工具参考：https://tool.ip138.com/csstextshadow  */
    text-shadow: 32px 15px 5px #998a8a;
    /* text-shadow: 0 0 3px #FF0000; */
    /* text-shadow: 18px 20px 16px red; */
    /* text-shadow: 0 0 20px #fefcc9, 10px -10px 30px #feec85, -20px -20px 40px #ffae34, 20px -40px 50px #ec760c, -20px -60px 60px #cd4606, 0 -80px 70px #973716, 10px -90px 80px #451b0e; */
}

.headermaintitle_HeaderMainTitle {
    background-image: linear-gradient(to right, red, orange, yellow, green, yellow, orange, red, orange, yellow, green, yellow, orange, red);      
  /*chrome 私有样式，加前缀，显示背景图片*/
  -webkit-background-clip: text;      
  animation: move 5s infinite;      
  /*颜色设为透明*/
  color: transparent;      
  /*宽度固定*/
  width: 300px;

}


/* 实现动态渐变彩色文字效果 定制css和侧边栏公告div引用一起配置 div文字可自定义 公告栏div自定义内容VIP已注释 先暂不用 */
@keyframes move {
    /* 0%{}100% 为自右向左移动动态渐变效果；反之自左向右为 100%{}0%  */
    0% {background-position: 0 0;}
    100% {
    /*宽度固定，如果为百分比背景不会滚动*/
    background-position: -300px 0;
    }
}    
.wrap {
/*设置背景渐变色*/
  background-image: linear-gradient(to right, red, orange, yellow, green, yellow, orange, red, orange, yellow, green, yellow, orange, red);      
  /*chrome 私有样式，加前缀，显示背景图片*/
  -webkit-background-clip: text;      
  animation: move 5s infinite;      
  /*颜色设为透明*/
  color: transparent;      
  /*宽度固定*/
  /* width: 300px; */
  /* font-size: 26px; */
}


/* 添加每日一言 日语标题渐变色 .wrap1 感觉不好看未引用  */




/* 在博客园个人昵称后面定制添加博客园VIP会员图标 .wrap2 显示立体阴影效果， 默认影子阴影颜色：#998a8a ，  这里显示的是图标阴影使用 box-shadow ，颜色使用图标色值，不好看 暂已注释 */
.wrap2 {
  box-shadow: 44px 10px 28px #5fcae1;
}


#home {
    /* 设置文章字体的透明度 0.0到1随便设置，越低越透明*/
    opacity: 0.92;
    background-color: rgba(245, 245, 245, 0.9);
}


#home,#sideBarMain>div,#blog-sidecolumn>div>div,.catListView{
background-color:rgba(255,255,255,0);
}  // 修改其他边框的颜色


/* 定制公告栏时钟位置 */
#clockdiv {
    /* left, center, right */
    text-align: center;
}


<!--去除屏蔽个人博客底部页面所有推荐及广告-->
#ad_t2,#cnblogs_c1,#under_post_news,#cnblogs_c2,#cnblogs_ch,#under_post_kb,.under-post-card, #under_post_card1, #under_post_card2 {
    display:none;!important
}



/* 正文图片鼠标悬停自动放大特效 */
.post img {
    cursor: pointer;
    transition: all 0.5s;
}
.post img:hover {
    transform: scale(1.3);
}



/* 参考链接：https://www.cnblogs.com/nthforsth/p/12229299.html ，整个博客园定制主界面个人感觉挺好看，如下可全部复制，一些标题界面颜色宽度都可自定义设置 */
#home {
    margin: 0 auto;
    width: 84%;/*原始65*/
    min-width: 980px;/*页面顶部的宽度*/
    background-color: rgba(245, 245, 245, 0.7);
    padding: 30px;
    margin-top: 20px;
    margin-bottom: 50px;
    box-shadow: 0 2px 6px rgba(100, 100, 100, 0.3);
    border-radius: 12px;  /*调节边框圆度*/
}
/*boby调节背景图片 自定义博客园背景图片链接  有效 */
body {
    background:url("https://img2018.cnblogs.com/blog/1378575/201906/1378575-20190621150153405-633289623.jpg"); 
    background-position:center left;
    background-size: cover;
    background-repeat: no-repeat;
    background-attachment:fixed;
}
#blogTitle {
    height: 100px;  /*高度*/
    border-radius: 13px;
    clear: both;
    background-color: #cccccc69;   /*博客园标题名字的背景*/
}
#blogTitle h1 {
    font-size: 36px;
    color:#808080; /*个人博客园名字的颜色 故屿γ  设置了也没效果，不知道为啥 可能是系统禁用修改名字颜色的原因吧*/
    font-weight: bold;
    line-height: 1.8em;/*原始 1.6em*/
    margin-top: 10px;/*原始 15px */   
}
#blogTitle h2 {
    font-weight: normal;
    font-size: 17px; /*原始 16px ；font-size: 1.0rem;*/
    line-height: 8.8;
    color: #a024da; /*博客个性签名的字体颜色 默认 #43b190*/
    font-weight: bold;
    text-align: right;
    float: right;
    
    /* 博客个性签名实现动态渐变彩色文字效果 可自行设置渐变分段颜色和动画自右向左的移动速度 默认5s 可自行调整 */
    /* background-image: linear-gradient(to right, red, orange, yellow, green, yellow, orange, red, orange, yellow, green, yellow, orange, red); */
    /* background-image: linear-gradient(to right, violet, blue, green, yellow, orange, red); */
    background: -webkit-linear-gradient(left, orange , yellow, green, cyan, blue, violet, black, orange, yellow, green, yellow, orange, red, cyan);
    /*chrome 私有样式，加前缀，显示背景图片*/
    -webkit-background-clip: text;      
    animation: move 8s infinite;      
    /*颜色设为透明*/
    color: transparent;      
    /*宽度固定*/
    width: 300px;
    /* css“个性签名”背景阴影效果  另外推荐: 18px 20px 16px rgb(0, 255, 149)颜色挺好看  */
   text-shadow: 0 0 20px #fefcc9, 10px -10px 30px #feec85, -20px -20px 40px #ffae34, 20px -40px 50px #ec760c, -20px -60px 60px #cd4606, 0 -80px 70px #973716, 10px -90px 80px #451b0e;
}
#navigator {
border-radius: 7px;
    background-color:rgba(135,206,205, 0.5);          /*标题栏下的框内颜色*/
}
#navList a:link, #navList a:visited, #navList a:active {
    color: #FFFFFF;
    font-size: 18px;
    font-weight: bold;
}
.blogStats {
    color: #eee;
}
.postTitle {
    border-left: 8px solid rgba(132,112,255, 0);
    margin-left: 10px;
    margin-bottom: 10px;
    font-size: 20px;
    float: right;
    width: 100%;
    clear: both;
}
.postTitle a:link, .postTitle a:visited, .postTitle a:active {
    color:     #FF6A6A;
    transition: all 0.4s linear 0s;
}
.postTitle a:hover {
    margin-left: 30px;
    color: #EE6363;
    text-decoration: none;
}
.postCon {
    float: right;
    line-height: 1.5em;
    width: 100%;
    clear: both;
    padding: 10px 0;
}
.day .postTitle a {
    padding-left: 10px;
}
.day {
    background: rgba(255, 255, 255, 0.5);
}
/*文章附加信息*/
.postDesc {
    background: url(images/posted_time.png) no-repeat 0 1px;
    color: #757575;
    float: left;
    width: 100%;
    clear: both;
    text-align: left;
    font-family: "微软雅黑" , "宋体" , "黑体" ,Arial;
    font-size: 13px;
    padding-right: 20px;/*5px  padding-left: 90px;posted 发表时间左边距离*/
    margin-top: 20px;
    line-height: 1.8;
    padding-bottom: 35px;
}
.newsItem, .catListEssay, .catListLink, .catListNoteBook, .catListTag, .catListPostCategory,
.catListPostArchive, .catListImageCategory, .catListArticleArchive, .catListView,
.catListFeedback, .mySearch, .catListComment, .catListBlogRank, .catList, .catListArticleCategory ,#blog-calendar
{
    background: rgba(255, 255, 255, 0.5);
    margin-bottom: 35px;
    word-wrap: break-word;
}
.CalTitle{
    background: rgba(255, 255, 255, 0);
}
.catListTitle{
    background-color: rgba(110, 250, 255, 0.6);   //栏目的条纹颜色  默认粉色 255,110,180,0.6  
}
#topics{
    background: rgba(255, 255, 255, 0.473);   //文章内阅读时的背景颜色
}
.c_ad_block{
    display: none;
}
#tbCommentBody{
    width: 100%;
    height: 200px;
    background: rgba(255, 255, 255, 0.5);
}
#q{background: rgba(255, 255, 255, 0);}

.CalNextPrev{background: rgba(255, 255, 255, 0);}

.cnblogs_code{
    background: rgba(255, 255, 255, 0);
}
.cnblogs_code div{
    background: rgba(255, 255, 255, 0);
}
.cnblogs_code_toolbar{
    background: rgba(255, 255, 255, 0);
}
#main{min-width: 640px;}
.entrylist{
    background: rgba(255, 255, 255, 0.5);
}


/* 天上飘白色圆形雪花，css和页脚都要配置 谷歌浏览器网页不显示白色圆形雪花 不知啥原因； 参考：https://www.cnblogs.com/liyhbk/archive/2020/08/25/13559850.html*/
#Snow{
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 99999;
    // 博客背景色，不是雪花颜色
    background: rgba(125, 137, 95, 0);
    pointer-events: none;
}


//加载进度条  点赞吸铁石效果 CSS设置
#loadingProcess{
  position: absolute;
  position: fixed;
  top:0;
  left: 0;
  height: 3px;
  box-sizing: border-box;
  width: 0%;
  background-color: @AccentColor;
  background-image: linear-gradient(to right,transparent 0%,transparent 80%,#fff 100% );
  border-bottom-right-radius: 1px;
  border-top-right-radius: 1px;
}
// 回复中代码片段会遮挡精灵球
.syntaxhighlighter{
  z-index: -1
}
/*
 * 动画声明
 */
 // Y轴移动
@keyframes jumping {
  0% {
    transform: translateY(0px);
  }
  50% {
    transform: translateY(-400px);
  }
  100% {
    transform: translateY(0px);
  }
}

// 小磁怪的眼神动画
@keyframes eyemove {
  0% {
    transform: translate(0px,0px);
  }
  20% {
    transform: translate(0px,0px);
  }
  25% {
    transform: translate(0px,-10px);
  }
  45% {
    transform: translate(0px,-10px);
  }
  50% {
    transform: translate(0px,0px);
  }
  60% {
    transform: translate(0px,0px);
  }
  65% {
    transform: translate(-8px,0px);
  }
  85% {
    transform: translate(-8px,0px);
  }
  90% {
    transform: translate(0px,0px);
  }
  100% {
    transform: translate(0px,0px);
  }
}

/*    点赞样式Begin, -250px 为上下垂直移动距离, 默认为 -400px   */
@keyframes jumping {
  0% {
      transform: translateY(0px);
  }
  50% {
      transform: translateY(-250px);
  }
  100% {
      transform: translateY(0px);
  }
}
/* 自定义小磁怪的位置，bottom: 125px  为点赞球底部与小磁怪顶部的间距， right: 1396px  为图标右边的距离，从右往左，数值越大越往左平移，  5s 为点赞球上下自动垂直来回移动的速度  */
#div_digg {
  bottom: 0px;
  bottom: 125px;
  margin: 0px;
  position: fixed;
  right: 0.5rem;
  right: 1396px;
  animation: jumping 5s ease-in-out;
  animation-iteration-count: infinite;
}

.buryit {
  display: none;
}

/* 可自定义图标 默认为：https://images.cnblogs.com/cnblogs_com/vvjiang/996881/o_ball2.png 暂未找到调整该图标变小的方式，修改width、height宽高值会变形，后期再试试，已找到原因，需添加 background-size: cover;   */
.diggit {
  background: url(https://images.cnblogs.com/cnblogs_com/vvjiang/996881/o_ball2.png) no-repeat;
  border-radius: 50%;
  background-size: cover;
  box-shadow: 0px 0px 15px 5px #fff inset;
  cursor: pointer;
  height: 55px;
  margin-left: 15px;
  padding: 0px;
  width: 55px;
  text-align: center;

  &::before{
    content: "\8FD9\91CC\662F\70B9\8D5E\54E6";
    content: "点我，快点我~";   // 可自定义显示内容: 点我支持一下吧~ ，默认为:这里是点赞哦 ，默认颜色 color: @ThemeColor;
    position: absolute;
    top: -25px;
    margin-left: 15px;
    font-size: 14px;
    font-weight: bold;
    left: 0px;
    font-size: 13px;
    color: #@ThemeColor;
  }
}
/* 点赞球中心点赞计数器数值，可自定义设置位置、大小、颜色 */
#div_digg .diggnum {
  color: rgb(114, 233, 233);
  font-family: Verdana;
  font-size: 25px;
  line-height: 2em!important;
}
/* 点赞球中心点赞计数器数值被改变后下方提示语 默认提示字体颜色为: #fa5 ，因此这里设置透明颜色不可见 color: #ff00  ，可防止用户看见提示语 */
#digg_tips{
  color: #ff00 !important;
  width: 100px;
  text-align: center;
  margin-left: -50px;
  margin-top: 10px;
}
/* 被点赞后 下方提示语最右边 默认有 link链接显示可点击"取消"撤回点赞，默认提示字体颜色为 color: #808080 ， 因此这里"取消"设置透明颜色不可见 color: #ff00 ，可防止用户看见取消点赞哈哈哈 */
a.digg_gray:link {
    color: #ff00;
}
a.digg_gray{
  font-size: 1px;
}

/* 修改小磁怪(吸铁石)的位置，大小 */
#xiaociguai{
  position: fixed;
  bottom: 0;
  left: 20;
  top: 580px;
  width: 88px;
  cursor: pointer;
}
/* #xiaociguai>img{
  width: 155px;
} */
#xiaociguai::after{
  content: '';
  width: 2px;
  height: 2px;
  background-color: #666;
  position: absolute;
  left: 69px;
  top: 43px;
  animation: eyemove 10s ease-in-out;
  animation-iteration-count: infinite;
}
#xiaociguai:hover,#xiaociguai.enable-electric{
  -webkit-filter: saturate(7);
  filter: saturate(7);
}
/*  点赞样式End  */

