html,body{
    background:#f5f5f5;
    color:#666666;
    height:100%;
    overflow: hidden;
}
.has-navbar{
position: relative;
    background: url(https://images.cnblogs.com/cnblogs_com/hdm-ai/1868919/o_201023070754底图.png)no-repeat 
    center center/ 1920px 1080px;
    height:100%;
       
}

.no-navbar{
    position: relative;
    background: url(https://images.cnblogs.com/cnblogs_com/hdm-ai/1868919/o_201023070754底图.png)no-repeat center center/ 
    1920px 1080px;
    height:100%;
}

#main{
height:700px;
padding:20px;
margin-top:10px;
background:rgba(255,250,230,0.5);
border-radius: 15px;
overflow-y: auto;
z-index: 99;
}

#main::-webkit-scrollbar {/*滚动条整体样式*/
        width: 0px;     /*高宽分别对应横竖滚动条的尺寸*/
        height: 0px;
    }

#rightmenu{
background:rgba(255,250,230,0.5);
border-radius: 10px;
}

.navbar-right,.navbar-left{
z-index: 9;
}

#page_end_html{
    z-index: -10;
}

.postTitle a:link, .postTitle a:active, .postTitle a:visited {
    color:#f07c82;
    font-size: 28px;
    font-weight: 600;
    text-decoration:none;
}

h1 a:visited, h1 a:active, h1 a:link ,a:visited, a:active, a:link{
    color:#f07c82;
}

#top_nav,#nav_main{
height:150px;
}

.navbar-custom{
    display: block;
    background:rgba(255,250,230,0.5);
}
.navbar{
    margin-bottom: 15px; 
}

.navbar #user_icon{
    width: 50px;
    height: 50px;
}

.navbar-branding{
width: 120px !important;
height: 120px;
position: relative;
left:20px;
border-radius: 50%;
background:url(https://images.cnblogs.com/cnblogs_com/hdm-ai/1868919/o_201023083104logo.jpg)no-repeat 0 
       0/ 100% 100%;
}

.navbar-branding>a{
    display: none;
}

.cnblogs_code{
background:rgba(255,250,230,1);
}

.cnblogs_code div{
background:rgba(255,250,230,1);
}

#cnblogs_c1,#cnblogs_c2,#under_post_kb{
    display: none;
}

.headermaintitle{
    animation: shiny-color 5s linear 0s infinite;
}

.navbar-branding{
    position: relative; 
}

.navbar-branding::after{
    content: '';
    display: block;
    width: 120px;
    height: 120px;
    border: 2px solid #00BCD4;
    border-radius: 50%;
    position: absolute;  
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    animation: shiny-border 1.5s ease-in 0s infinite;
    transform-origin: center; /* 设置动画的中心点为元素的中心 */  
}

@keyframes shiny-color{
    0%{
        color: red;
    }
    15%{
        color: orange;
    }
    30%{
        color: yellow;
    }
    45%{
        color: green;
    }
    60%{
        color: cyan;
    }
    75%{
        color: blue;
    }
    90%{
        color: purple;
    }
    100%{
        color: red;
    }
}

@keyframes shiny-border{
    0% {  
    border-width: 2px;  
    width: 120px;
    height: 120px;
    border-color: #00BCD4; /* 水蓝色 */  
  }  
  100% {  
    width: 130px;
    height: 130px;
    border-width: 10px;  
    border-color: #4DD0E1; /* 逐渐变浅的水蓝色 */  
    box-shadow: 0 0 20px 10px rgba(0, 188, 212, 0.5); /* 添加水波纹效果 */  
  }  

}

//其他
.star  {
   margin: 50px 0;
   position: relative;
   width: 0;
   border-right: 100px solid transparent;
   border-bottom: 70px  solid yellowgreen;
   border-left: 100px solid transparent;
   transform: rotate(35deg) scale(.6);
}
.star :before {
    content: '';
    position: absolute;
    border-bottom: 80px solid yellowgreen;
    border-left: 30px solid transparent;
    border-right: 30px solid transparent;
    top: -45px;
    left: -65px;
    transform: rotate(-35deg);
}
.star :after {
    content: '';
    position: absolute;
    top: 3px;
    left: -105px;
    border-right: 100px solid transparent;
    border-bottom: 70px solid yellowgreen;
    border-left: 100px solid transparent;
    transform: rotate(-70deg);
}

//水泡样式
#snowCanvas {  
position: absolute;  
top: 0;  
left: 0;  
pointer-events: none; /* 使雪花不可选择 */
z-index: -1;  
}

//鼠标移动样式
#circlesContainer {  
    position: absolute;  
    top: 0;  
    left: 0;  
    pointer-events: none;  
}  
  
.circle {  
    position: absolute;  
    border-radius: 50%;  
    /* background: rgba(0, 188, 212, 0.3); */
    border:2px solid rgba(240,124,130,0.6); 
    transform-origin: center;  
    animation: scaleOut 1s ease-out forwards;  
}  
  
@keyframes scaleOut {  
    0% { transform: scale(0); opacity: 1; }  
    100% { transform: scale(1.5); opacity: 0; }  
}  
/* https://images.cnblogs.com/cnblogs_com/hdm-ai/1868919/o_240509074341_fish8.png */