:root{
    --bgColor:white;
    --fontColor:#111;
}
*{
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}
a {
    text-decoration: none;
    outline: none;
    /* color: var(--fontColor); */
}
#top_nav,#footer{
    display: none;
}
#home{
    display: grid;
    overflow: hidden;
}
#header{
    display: grid;
    grid-template-rows: 1fr min(1fr,200px);
}
#header #blogLogo{
    display: none;
}
#header #blogTitle{
    text-align: center;
    display: flex;
    flex-flow: column nowrap;
    justify-content: end;
}
#header #blogTitle h1{
    font-size: 25vw;
    color: var(--fontColor);
    animation: animate 3s steps(256) infinite;
    position: relative;
}
#header #blogTitle h1::after{
    content: "三十男";
    font-size: 25vw;
    color: var(--fontColor);
    position: absolute;
    left: 0;
    top: 0;
    transform: rotate3d(1, 1, 0, 22deg);
    text-align: center;
    width: 100%;
    transform-origin: initial;
}
#header #blogTitle h1 a{
    /* cursor: none; */
}
#blogTitle > h2{
    position: relative;
    width: max-content;
    margin: 0 auto;
    font-family: fangsong;
}
#blogTitle > h2::before{
    content: '';
    position: absolute;
    width: 100%;
    left: 0;
    top: 0;
    height: 100%;
    background: white;
    animation: fontAnimation 10s steps(31) 3s  infinite;
}
#blogTitle > h2::after{
    content: '';
    position: absolute;
    width: 2px;
    left: 0;
    top: 0;
    height: 100%;
    background: black;
    animation:  
        fontAnimation2 .4s steps(4)  infinite,
        fontAnimation 10s steps(31) 3s  infinite;
}
#navigator > div{
    display: none;
}
#navList{
    list-style: none;
    display: flex;
    justify-content: space-around;
}
#navigator{
    width: max-content;
    justify-self: center;
}
#navList > li{
    padding: 0 20px;
    font-family: fangsong;
    margin-top: 25px;
    position: relative;
    background: white;
    transition: all 1s;
}
#navList > li:hover{
    background-color: black;
    color: white;
}
#navList > li::after{
    content: '';
    position: absolute;
    height: 2px;
    width: 0%;
    bottom: -5px;
    left: 0;
    right: 0;
    margin: auto;
    transition: width .5s;
}
#navList > li:hover:after{
    background-color: black;
    width: 100%;
}
#navigator a{
    color: inherit;
}
#sideBar,#homepage_top_pager{
    display: none;
}
#mainContent{
    margin-top:min(100px,20vh)
}
.forFlow{
    margin: auto;
    width: 80vw;
    margin: auto;
    text-align: center;
    font-family: fangsong;
}
.forFlow > div{
width: 40%;
  min-height: 20vh;
  border: 1px solid black;
  margin: 20px;
  padding: 20px;
  display: inline-block;
  vertical-align: text-top;
}

/* .forFlow > div:nth-child(even){
    transform: rotate3d(1, 1, 1, -10deg);
} */

.forFlow > div:hover{
    transform: rotate3d(0, 0, 0, -80deg);
}
.forFlow > div .postTitle{
    font-size: 2vw;
    font-weight: bold;
}
.forFlow > div .postTitle::first-line{
    font-size: 4vh;
    vertical-align: top;
}
.forFlow > div .postCon a{
    display: block;
    font-size: 2rem;
    background: var(--fontColor);
    color: var(--bgColor);
    width: max-content;
    margin: 1.5vh auto;
}
.forFlow > div .postCon a:hover{
    right: 0;
}
.forFlow > div .postCon img{
    display: none;
}
.forFlow > div > .postSeparator + .postTitle{
    display: none;
}
.forFlow > div > .postSeparator + .postTitle+ .postCon{
    display: none;
}
.forFlow > div a{
    color: inherit;
}
.pager a{
    border: 1px solid var(--fontColor);
    color: var(--fontColor);
}
.forFlow > div .postTitle{
    grid-row: 1;
}
.forFlow > div .postCon,.clear,.postDesc{
    display: none;
}
.forFlow > div .postCon{
    display: block;
}
.forFlow > div .dayTitle{
    padding: 1vw 2vw;
}
@keyframes animate{
    0%{
        filter: hue-rotate(0deg);
    }
    100%{
        filter: hue-rotate(360deg);
    }
}
@keyframes fontAnimation {
    0%{
        left: 0;
    }
    50%{
        left: 100%;
    }
    100%{
        left: 100%;
    }
}
@keyframes fontAnimation2 {
    from{
        opacity: 0;
    }
    to{
        opacity: 1;
    }
}
@keyframes godown {
    from{
    }
    to{
        align-content: end;
        background-color: var(--fontColor);
        color: var(--bgColor);
    }
}


/* 文章内容 */
#cnblogs_post_body{
    text-align: left;
    font-variant-east-asian: traditional;
}
/* 一级目录 */
#cnblogs_post_body ul li {
    list-style: none;
}
/* 二级目录 */
#cnblogs_post_body ul ul li{
    list-style: none;
}


///


.forFlow .day {
  width: 40%;
  min-height: 20vh;
  border: 1px solid black;
  margin: 20px;
  padding: 20px;
  display: inline-block;
  vertical-align: text-top;
}
.topicListFooter {
  width: 100% !important;
  text-align: center !important;
  font-weight: bolder;
  background: black;
  color: white;
  padding: 10px 0 !important;
  height: fit-content;
  min-height: fit-content !important;
}
.postCon div a {
  display: none !important;
}
