.navbarfont {
    font-size: 40px;
    font-family: STXingkai;
    font-style: normal;
    transition: font-size 0.4s;
    -webkit-transition: font-size 0.4s;
}

.navbar {
    background-color: white;
    height: 16vh;
}

a>div:hover {
    color: #515152;
    font-style: italic;
    text-decoration: underline;
    transition: color 0.5s;
}

a>div {
    color: #011619;
}

.image:hover {
    transition: all 0.2s;
    transform: scale(1.03);
}

button {
    background-color: rgb(217, 217, 207);
    color: white;
    border: white 1px;
}

.picshow {
    object-fit: contain;
    max-height: 440px;
}

.picdiv {
    height: 440px;
}

.labtitle {
    display: flex;
    align-items: center;
    font-size: 40px;
    font-family: STXingkai;
}

ul {
    list-style-type: circle;
}

.subtitle {
    font-size: 1.5rem;
    font-family: STSong;
    font-weight: bold;
    padding: 0%;
}

.licontent {
    font-size: 1.0rem;
    font-family: STSong;
    font-weight: bold;
}

.group-title {
    font-size: xx-large;
    font-family: KaiTi;
    font-weight: bolder;
}

.group {
    display: flex;
    flex-wrap: wrap;
    width: 100vw;
}

.group-item {
    display: flex;
    flex-direction: column;
    padding: 1vw;
    width: 25vw;
    border: 3px;
    border-style: groove;
}

body.has-navbar-fixed-top,
html.has-navbar-fixed-top {
    padding-top: 3.25rem
}

.navbar {
    background: 0 0
}

.container {
    flex-grow: 1;
    flex-shrink: 1
}

.intro {
    font-family: KaiTi;
    font-size: larger;
    font-weight: bolder;
}

#preload {
    background-image: url("/img/honor/0.jpg");
    background-image: url("/img/honor/1.jpg");
    background-image: url("/img/honor/2.jpg");
    background-image: url("/img/honor/3.jpg");
    background-image: url("/img/honor/4.jpg");
    background-image: url("/img/honor/5.jpg");
    background-image: url("/img/honor/6.jpg");
    background-image: url("/img/honor/7.jpg");
}

.honor {
    font-family: KaiTi;
    text-align: center;
}

.leftright {
    margin-left: 2px;
    margin-right: 2px;
}

.kaiti {
    font-family: KaiTi;
}

.news {
    text-align: center;
    color: red;
    font-size: 48px;
    font-family: "KaiTi";
    
}

.news:hover {
    font-size: 50px;
    color:rgb(0, 170, 255);

    font-family: "KaiTi";
}
.cssouter{
     background-color: white;
}
.csscontent {
    /* 让这个小块块出现 */
    /* 宽高都为cover-10px */
    height: 55px;
    width: 97vw;
    /* 内容居中 */
    text-align: center;
    line-height: 55px;
    /* 与背景区分开 */
    background-color: white;
    color: white;
    /* 这个圆角要比cover小一点点，这样比较好看 */
    border-radius: 10px;
}

/* cover为边框部分 */

.csscover {
    /* 内容居中 */
    display: flex;
    align-items: center;
    font-size: 40px;
    justify-content: center;
    /* 定义宽高 */
    height: 60px;
    /* 再来一点阴影 */
    box-shadow: 0 0 10px 0 #000;
    /* 再加一点点圆角 */
    border-radius: 15px;

    /* 是时候放出一点颜色了！ */
    /* 第一个属性为渐变的角度，后三个为渐变的颜色，如图所示，我这样设置可以避免渐变的时候出现深绿色，
                    大部分的人喜欢第三个属性为（255, 0, 242），但是这样渐变的时候就会出现很丑的深绿！ */
    background: linear-gradient(135deg, rgb(255, 1, 35), rgb(255, 14, 22), rgb(255, 0, 179));

    /* 添加动画，让颜色动起来 */
    /*animation: color 3s linear infinite;

    /* 加一点点鼠标移入的效果 */
    transition: all 0.5s;
}

.csscover:hover {
    box-shadow: 0 0 20px 0 #000;
}