body{
 font-family: Consolas, "楷体" !important;
background-image: url("https://w.wallhaven.cc/full/9m/wallhaven-9m8mv8.jpg");
background-position: center, center;
    /*图片不平埔*/
    background-repeat: no-repeat;
    /*图片位置固定在窗口中*/
    background-attachment: fixed;
    /*图片填充*/
    background-size:cover;
}

#bannerbar{
position:absolute;
top:-500px;
left:-500px;
}
#top_nav{
padding:0px;
margin:0px;
padding-top:10px;
width:100%;
background:rgba(46,111,97,0.3);
}
.navbar>nav,#navigator,#main{
margin-left:18%;
}
#top_nav a{
color:#fff;
}
.navbar-custom {
    display:block;
}

#header{
padding:0px;
margin:0px;
width:100%;
background:rgba(46,111,97,0.3);
}
#navList li a{
background:rgba(46,111,97,0);
}
#navigator span{
font-size:14px;
color:#fff;
}
.dropdown>.dropdown-menu{
background:rgba(46,111,97,0.5);
}
#main{
background:rgba(46,111,97,0.3);
 background-repeat: no-repeat;
background-position: 550px 0px;
opacity:0.99;
height:880px;
}
#sideBar{
color:#fff;
height:880px;
padding:0px;
margin:0px 0px 0px 20px;
overflow:auto;
}
#sideBar::-webkit-scrollbar{
	display: none;
}
#sideBar a{
color:#08b3f5;
}
a:link, a:visited {
font-size:14px;
color:red;
}
.input_my_zzk{
border-radius:10px;
}
input.btn_my_zzk{
font-size:14px;
font-family: Consolas, "楷体" !important;
background:rgba(126,167,171,0.9);
}
#mainContent{
height:800px;
background:rgba(46,111,97,0.5);
overflow:auto;
}
#mainContent::-webkit-scrollbar{
	display: none;
}

#cnblogs_post_body{
color:#fff;
}
canvs{

}
.day{
background:#cfd1d4f0;
}
.vertical-middle>* {
color:red;
}
.postTitle a:link, .post-title a:visited, .postTitl2 a:link, .postTitl2 a:visited, .entrylistPosttitle a:link, .entrylistPosttitle a:visited {
    color: red;
}
.postBody, .postCon, .entrylistPostSummary {
    font-size: 14px;
    color: #000;
    line-height: 1.8;
}
#sideBarMain h3 {
font-size:14px;
color:red;
}
#footer{
font-size:18px;
color:#010717;
}
#MySignature{
font-size:18px;
color:#0b023afa;
}

.container {
            position: relative;
            top:50%;
            left:-15%;
            width: 100%;
            height: 100%;
            -webkit-transform: rotate(45deg);
            transform: rotateZ(45deg);
            
            z-index:10000;
        }
        
        .meteor {
            position: absolute;
            left: 50%;
            top: 50%;
            height: 2px;
            background: linear-gradient(-45deg, #5f91ff, rgba(0, 0, 255, 0));
            border-radius: 999px;
            -webkit-filter: drop-shadow(0 0 6px #699bff);
            filter: drop-shadow(0 0 6px #699bff);
            -webkit-animation: tail 3000ms ease-in-out infinite, shooting 3000ms ease-in-out infinite;
            animation: tail 3000ms ease-in-out infinite, shooting 3000ms ease-in-out infinite;
        }
        
        .meteor::before,
        .meteor::after {
            content: '';
            position: absolute;
            top: calc(50% - 1px);
            right: 0;
            height: 2px;
            background: linear-gradient(-45deg, rgba(0, 0, 255, 0), #5f91ff, rgba(0, 0, 255, 0));
            -webkit-transform: translateX(50%) rotateZ(45deg);
            transform: translateX(50%) rotateZ(45deg);
            border-radius: 100%;
            -webkit-animation: shining 3000ms ease-in-out infinite;
            animation: shining 3000ms ease-in-out infinite;
        }
        
        .meteor::after {
            -webkit-transform: translateX(50%) rotateZ(-45deg);
            transform: translateX(50%) rotateZ(-45deg);
        }
        /* 1 */
        
        .meteor:nth-child(1) {
            top: calc(50% - 185px);
            left: calc(50% - 150px);
            -webkit-animation-delay: 8888ms;
            animation-delay: 8888ms;
        }
        
        .meteor:nth-child(1)::before,
        .meteor:nth-child(1)::after,
        .meteor:nth-child(1)::after {
            -webkit-animation-delay: 8888ms;
            animation-delay: 8888ms;
        }
        /* 2 */
        
        .meteor:nth-child(2) {
            top: calc(50% - 50px);
            left: calc(50% - 180px);
            -webkit-animation-delay: 9288ms;
            animation-delay: 9288ms;
        }
        
        .meteor:nth-child(2)::before,
        .meteor:nth-child(2)::after,
        .meteor:nth-child(2)::after {
            -webkit-animation-delay: 9288ms;
            animation-delay: 9288ms;
        }
        
        .meteor:nth-child(3) {
            top: calc(50% - 145px);
            left: calc(50% - 135px);
            -webkit-animation-delay: 8600ms;
            animation-delay: 8600ms;
        }
        
        .meteor:nth-child(3)::before,
        .meteor:nth-child(3)::after,
        .meteor:nth-child(3)::after {
            -webkit-animation-delay: 8600ms;
            animation-delay: 8600ms;
        }
        
        .meteor:nth-child(4) {
            top: calc(50% - 78px);
            left: calc(50% - 155px);
            -webkit-animation-delay: 3288ms;
            animation-delay: 3288ms;
        }
        
        .meteor:nth-child(4)::before,
        .meteor:nth-child(4)::after,
        .meteor:nth-child(4)::after {
            -webkit-animation-delay: 3288ms;
            animation-delay: 3288ms;
        }
        
        .meteor:nth-child(5) {
            top: calc(50% - 183px);
            left: calc(50% - 8px);
            -webkit-animation-delay: 5588ms;
            animation-delay: 5588ms;
        }
        
        .meteor:nth-child(5)::before,
        .meteor:nth-child(5)::after,
        .meteor:nth-child(5)::after {
            -webkit-animation-delay: 5588ms;
            animation-delay: 5588ms;
        }
        
        .meteor:nth-child(6) {
            top: calc(50% - 30px);
            left: calc(50% - 195px);
            -webkit-animation-delay: 9388ms;
            animation-delay: 9388ms;
        }
        
        .meteor:nth-child(6)::before,
        .meteor:nth-child(6)::after,
        .meteor:nth-child(6)::after {
            -webkit-animation-delay: 9388ms;
            animation-delay: 9388ms;
        }
        
        .meteor:nth-child(7) {
            top: calc(50% - 95px);
            left: calc(50% - 70px);
            -webkit-animation-delay: 2588ms;
            animation-delay: 2588ms;
        }
        
        .meteor:nth-child(7)::before,
        .meteor:nth-child(7)::after,
        .meteor:nth-child(7)::after {
            -webkit-animation-delay: 2588ms;
            animation-delay: 2588ms;
        }
        
        .meteor:nth-child(8) {
            top: calc(50% - 60px);
            left: calc(50% - 70px);
            -webkit-animation-delay: 5288ms;
            animation-delay: 5288ms;
        }
        
        .meteor:nth-child(8)::before,
        .meteor:nth-child(8)::after,
        .meteor:nth-child(8)::after {
            -webkit-animation-delay: 5288ms;
            animation-delay: 5288ms;
        }
        
        .meteor:nth-child(9) {
            top: calc(50% - 75px);
            left: calc(50% - 250px);
            -webkit-animation-delay: 888ms;
            animation-delay: 888ms;
        }
        
        .meteor:nth-child(9)::before,
        .meteor:nth-child(9)::after,
        .meteor:nth-child(9)::after {
            -webkit-animation-delay: 888ms;
            animation-delay: 888ms;
        }
        
        .meteor:nth-child(9) {
            top: calc(50% - 76px);
            left: calc(50% - 240px);
            -webkit-animation-delay: 2388ms;
            animation-delay: 2388ms;
        }
        
        .meteor:nth-child(9)::before,
        .meteor:nth-child(9)::after,
        .meteor:nth-child(9)::after {
            -webkit-animation-delay: 2388ms;
            animation-delay: 2388ms;
        }
        
        .meteor:nth-child(10) {
            top: calc(50% - 85px);
            left: calc(50% - 6px);
            -webkit-animation-delay: 3588ms;
            animation-delay: 3588ms;
        }
        
        .meteor:nth-child(10)::before,
        .meteor:nth-child(10)::after,
        .meteor:nth-child(10)::after {
            -webkit-animation-delay: 3588ms;
            animation-delay: 3588ms;
        }
        
        .meteor:nth-child(11) {
            top: calc(50% - 135px);
            left: calc(50% - 260px);
            -webkit-animation-delay: 2888ms;
            animation-delay: 2888ms;
        }
        
        .meteor:nth-child(11)::before,
        .meteor:nth-child(11)::after,
        .meteor:nth-child(11)::after {
            -webkit-animation-delay: 2888ms;
            animation-delay: 2888ms;
        }
        
        .meteor:nth-child(12) {
            top: calc(50% - 15px);
            left: calc(50% - 8px);
            -webkit-animation-delay: 388ms;
            animation-delay: 388ms;
        }
        
        .meteor:nth-child(12)::before,
        .meteor:nth-child(12)::after,
        .meteor:nth-child(12)::after {
            -webkit-animation-delay: 388ms;
            animation-delay: 388ms;
        }
        
        .meteor:nth-child(13) {
            top: calc(50% - 155px);
            left: calc(50% - 50px);
            -webkit-animation-delay: 7288ms;
            animation-delay: 7288ms;
        }
        
        .meteor:nth-child(13)::before,
        .meteor:nth-child(13)::after,
        .meteor:nth-child(13)::after {
            -webkit-animation-delay: 7288ms;
            animation-delay: 7288ms;
        }
        
        .meteor:nth-child(14) {
            top: calc(50% - 28px);
            left: calc(50% - 80px);
            -webkit-animation-delay: 8888ms;
            animation-delay: 8888ms;
        }
        
        .meteor:nth-child(14)::before,
        .meteor:nth-child(14)::after,
        .meteor:nth-child(14)::after {
            -webkit-animation-delay: 8888ms;
            animation-delay: 8888ms;
        }
        
        .meteor:nth-child(15) {
            top: calc(50% - 35px);
            left: calc(50% - 200px);
            -webkit-animation-delay: 7588ms;
            animation-delay: 7588ms;
        }
        
        .meteor:nth-child(15)::before,
        .meteor:nth-child(15)::after,
        .meteor:nth-child(15)::after {
            -webkit-animation-delay: 7588ms;
            animation-delay: 7588ms;
        }
        
        .meteor:nth-child(16) {
            top: calc(50% - 40px);
            left: calc(50% - 250px);
            -webkit-animation-delay: 1888ms;
            animation-delay: 1888ms;
        }
        
        .meteor:nth-child(16)::before,
        .meteor:nth-child(16)::after,
        .meteor:nth-child(16)::after {
            -webkit-animation-delay: 1888ms;
            animation-delay: 1888ms;
        }
        
        @-webkit-keyframes tail {
            0% {
                width: 0;
            }
            30% {
                width: 100px;
            }
            100% {
                width: 0;
            }
        }
        
        @keyframes tail {
            0% {
                width: 0;
            }
            30% {
                width: 100px;
            }
            100% {
                width: 0;
            }
        }
        
        @-webkit-keyframes shining {
            0% {
                width: 0;
            }
            50% {
                width: 30px;
            }
            1000% {
                width: 0;
            }
        }
        
        @keyframes shining {
            0% {
                width: 0;
            }
            50% {
                width: 30px;
            }
            1000% {
                width: 0;
            }
        }
        
        @-webkit-keyframes shooting {
            0% {
                -webkit-transform: translateX(0);
                transform: translateX(0);
            }
            100% {
                -webkit-transform: translateX(300px);
                transform: translateX(300px);
            }
        }
        
        @keyframes shooting {
            0% {
                -webkit-transform: translateX(0);
                transform: translateX(0);
            }
            100% {
                -webkit-transform: translateX(300px);
                transform: translateX(300px);
            }
        }
        
        @-webkit-keyframes sky {
            0% {
                -webkit-transform: rotate(45deg);
                transform: rotate(45deg);
            }
            100% {
                -webkit-transform: rotate(405deg);
                transform: rotate(405deg);
            }
        }
        
        @keyframes sky {
            0% {
                -webkit-transform: rotate(45deg);
                transform: rotate(45deg);
            }
            100% {
                -webkit-transform: rotate(405deg);
                transform: rotate(405deg);
            }
        }
   #boxcan{
position:fixed;
top:150px;
left:-30px;
}
#cnblogs_post_body {
    color: #00fbef;
}

    </style>