#page{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    height:30px;
}
#page a{
    display:block;
    float:left;
    margin-right:10px;
    padding: 0 12px;
    height: 32px;
    border:1px #cccccc solid;
    background:#fff;
    text-decoration:none;
    color:#808080;
    font-size: 14px;
    line-height: 32px;
    margin-bottom: 5px;
}
#page a:hover{
    color:#1772B4;
    border:1px #1772B4 solid;
}
#page a.cur{
    border:none;
    background:#1772B4;
    color:#fff;
}
#page p{
    float:left;
    padding: 0 12px;
    font-size:15px;
    height: 30px;
    line-height: 30px;
    color:#bbb;
    border:1px #ccc solid;
    background:#fcfcfc;
    margin-right:8px;

}
#page p.pageRemark{
    border-style:none;
    background:none;
    margin-right:0px;
    color:#666;
}
#page p.pageRemark b{
    margin: 0 6px;
    color: #1772B4;
}
#page p.pageEllipsis{
    border-style:none;
    background:none;
    padding:4px 0px;
    color:#808080;
}
.dates li {font-size: 14px;margin:20px 0}
.dates li span{float:right}


@media screen and (max-width: 1200px) {
    #page{
        height: auto;
    }
    #page p{
        display: none;
    }
}