#navbar-main-container {
    max-width: 800px;
    margin: 0 auto;
    padding: 37.5px 0;
}

.navbar-box {
    /* 导航栏内部结构 */
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
}

.navbar-box div {
    display: flex;
    align-items: center;
}

.navbar-title {
    /* 导航栏左侧博客标题 */
    font-size: 19px;
    font-weight: 800;
    padding: 10px;
    border-radius: 10px;
    transition: var(--transition);
}

.navbar-title:hover {
    /* 导航栏左侧博客标题选中 */
    color: var(--navbarNameFontColour);
    background: var(--primaryColour);
}

.navbar-nav ul {
    /* 导航栏右侧导航部分 */
    display: flex;
}

.navbar-nav li {
    /* 导航栏右侧导航部分 */
    padding: 0 0 0 20px;
}

.navbar-nav-button {
    /* 导航栏右侧导航按钮 */
    font-size: 17px;
    font-weight: 500;
    padding: 10px;
    border-radius: 10px;
}

.navbar-nav-button:hover {
    /* 导航栏右侧导航按钮选中 */
    background: var(--cardBackgroundColour);
    transition: var(--transition);
}

.svg-button {
    /* 使用 svg 图标的按钮样式 */
    padding: 5px;
    border-radius: 10px;
}

.svg-button:hover {
    /* 使用 svg 图标的按钮样式 */
    background: var(--cardBackgroundColour);
    transition: var(--transition);
}

.svg-button path {
    /* svg 图标的颜色适应 */
    fill: var(--accentColour);
}

.navbar a:link {
    color: var(--fontColour);
}

.navbar a:active {
    color: var(--fontColour);
}

#menu-button {
    /* 导航栏“菜单”按钮 */
    display: none;
}

.nav-list.unfold {
    /* 展开状态下的导航栏菜单 */
    background: var(--backgroundColour);
    padding: 11px;
    border-radius: 10px;
    display: list-item;
    position: absolute;
    top: 100px;
    right: 50px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.6);
    border: 2px solid var(--cardBackgroundColour);
    z-index: 1;
}

.nav-list.unfold .nav-button {
    /* 展开状态下的导航栏标签 */
    display: revert;
    padding: 20px;
}
@media (max-width: 1030px) {
    #navbar-main-container {
        /* 导航栏内部结构 */    
        max-width: 690px;
    }
}
@media (max-width: 700px) {
    #navbar-main-container {
        /* 导航栏内部结构 */    
        max-width: 85%;
    }
    .nav-button {
        /* 导航栏按钮 */
        display: none;
    }
    #menu-button {
        /* 导航栏“菜单”按钮 */
        display: revert;
    }
}